<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>奇特物联认证授权</title>
		<style type="text/css">
			body{
				min-height: 500px;
			    background: linear-gradient( 270deg, rgb(46 124 255) 0%, rgb(52 3 65) 100% );
			 }
			.bgimg{
				position:absolute;
				width:100%;
				height:100%;
			}
			.bgimg::before {
				content: "";
				position: absolute;
				bottom: 0;
				left: 0;
				width: 60%;
				overflow: hidden;
				height: 80%;
				-webkit-mask-box-image: url("data:image/svg+xml,%3Csvg width='1200' height='770' xmlns='http://www.w3.org/2000/svg' fill='none'%3E%3Cg%3E%3Cpath id='svg_1' d='M58.4 47.77C104.6 59.51 135.26 67.37 162.11 78.04C188.97 88.72 226.33 102.69 265.92 123.55C305.51 144.4 366.96 167.09 441.43 121.52C515.9 75.95 546.48 61.01 577.69 46.27C608.9 31.53 625.86 23.69 680.26 12.28C734.65 0.87 837.29 10.7 867.29 21.8C897.29 32.9 935.51 51.9 962.21 95.45C988.9 139.01 972.91 177.36 951.37 221.39C929.83 265.43 883.49 306 890.44 337.33C897.4 368.66 974.73 412.18 974.73 411.47C974.73 412.18 1066.36 457.62 1106.36 491.06C1146.36 524.5 1178.8 563.36 1184.03 579.63C1189.26 595.9 1200.4 622.49 1181.55 676.88C1162.71 731.26 1127.16 764.32 1115.31 778.64C1103.45 792.96 5.34 783.61 4.32 784.63C3.3 785.65 -172.34 2.38 1.13 35.04L58.4 47.77L58.4 47.77Z' fill='%23409eff'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
				background: #2e72f08f;
				transition: all .3s ease;
			}
			.bgimg::after {
				content: "";
				width: 150px;
				height: 300px;
				position: absolute;
				right: 0;
				top: 0;
				-webkit-mask-box-image: url("data:image/svg+xml,%3Csvg width='150' height='300' xmlns='http://www.w3.org/2000/svg' fill='none'%3E%3Cg%3E%3Cpath id='svg_1' d='M-0.56 -0.28C41.94 36.17 67.73 18.94 93.33 33.96C118.93 48.98 107.58 73.56 101.94 89.76C96.29 105.96 50.09 217.83 47.87 231.18C45.64 244.52 46.02 255.2 64.4 270.05C82.79 284.91 121.99 292.31 111.98 289.81C101.97 287.32 153.96 301.48 151.83 299.9C149.69 298.32 149.98 -1.36 149.71 -1.18C149.98 -1.36 -43.06 -36.74 -0.56 -0.28L-0.56 -0.28Z' fill='%23409eff'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
				background: #330b4e8c;
				transition: all .3s ease;
			}

			*{margin: 0px; padding: 0px;}
			.login-box{
				position: absolute;
				right: 100px;
				width: 400px;
				height: 400px;
				margin: 20vh auto;
				padding: 30px 50px;
				background-color: #fff;
				overflow: inherit;
				border-radius: 10px;
			}
			.login-box .title{color:#333;font-size:22px;text-align:center;margin:20px 20px}
			.login-box button{padding: 5px 15px; cursor: pointer; }

			#loginImg{
				-webkit-animation:bounce 3s 1s infinite linear normal;
				-moz-animation:bounce 3s 1s infinite linear normal;}
				@-webkit-keyframes bounce{
				40%{-webkit-transform:translateY(-20px)}
				60%{-webkit-transform:translateY(-10px)}
				}
			}
		</style>
	</head>
	<body>
		<div class="bgimg">
			<div style="position:absolute;top:40px;left:100px;font-size:30px;color:#FFF">©奇特物联</div>
			<img id="loginImg" src="http://iotkit-img.oss-cn-shenzhen.aliyuncs.com/product/KdJYpTp5ywNhmrmC/cover.png?Expires=1970997977&OSSAccessKeyId=LTAI5t8UFEH5eGrBUS5zSiof&Signature=0YV5y27iIYYL5XQ2qMeBV%2FloYFU%3D" style="position: absolute;left:100px;bottom: -20px;"/>
		</div>
		<div class="login-box">
			<div class="title">授权确认</div> <br>
			<div>
				正在确认授权...
			</div>
			<div id="divFailed"></div>
		</div>
		<script src="https://unpkg.zhimg.com/jquery@3.4.1/dist/jquery.min.js"></script>
		<script>window.jQuery || alert('当前页面CDN服务商已宕机，请将所有js包更换为本地依赖')</script>
		<script type="text/javascript">
			// 同意授权
			function yes() {
				$.ajax({
					url: '/oauth2/doConfirm',
					data: {
						client_id: getParam('client_id'),
						scope: getParam('scope')
					},
					dataType: 'json',
					success: function(res) {
						if(res.code == 200) {
								location.reload(true);
						} else {
							// 重定向至授权失败URL 
							$("#divFailed").text('授权失败！');
						}
					},
					error: function(e) {
						console.log('error');
					}
				});
			}
			
			// 拒绝授权
			function no() {
				var url = joinParam(getParam('redirect_uri'), "handle=refuse&msg=用户拒绝了授权");
				location.href = url;
			}
			
			// 从url中查询到指定名称的参数值 
			function getParam(name, defaultValue){
				var query = window.location.search.substring(1);
				var vars = query.split("&");
				for (var i=0;i<vars.length;i++) {
					var pair = vars[i].split("=");
					if(pair[0] == name){return pair[1];}
				}
				return(defaultValue == undefined ? null : defaultValue);
			}
			
			// 在url上拼接上kv参数并返回 
			function joinParam(url, parameStr) {
				if(parameStr == null || parameStr.length == 0) {
					return url;
				}
				var index = url.indexOf('?');
				// ? 不存在
				if(index == -1) {
					return url + '?' + parameStr;
				}
				// ? 是最后一位
				if(index == url.length - 1) {
					return url + parameStr;
				}
				// ? 是其中一位
				if(index > -1 && index < url.length - 1) {
					// 如果最后一位是 不是&, 且 parameStr 第一位不是 &, 就增送一个 &
					if(url.lastIndexOf('&') != url.length - 1 && parameStrindexOf('&') != 0) {
						return url + '&' + parameStr;
					} else {
						return url + parameStr;
					}
				}
			}

			yes();
						
		</script>
	</body>
</html>
