duhongyu
/
AnYang_UI


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
							<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">

		<meta name="apple-mobile-web-app-capable" content="yes">

		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="../layui/css/layui.mobile.css" />

		<link href="../css/mui.min.css" rel="stylesheet" />

		<link rel="stylesheet" href="../css/iconfont.css" />

		<link rel="stylesheet" href="../css/inits.css" />

		<title></title>

		<style>

			body {

				width: 100vx;

				height: 100vh;

				background-color: #fff !important;

				
			}

			
			.mui-content {

				background-color: #fff !important;

				margin-top: 70px;

			}

			
			.logo {

				width: 150px;

				height: 150px;

				display: block;

				margin: 0 auto 0;

				margin-bottom: 10px;

			}

			
			.btn {

				width: 75%;

				margin: 50px auto 0px;

				background-color: #1ba3c9;

				outline: none;

				border: none;

				padding: 13px 12px;

				display: block;

				border-radius: 20px;

				font-size: 18px;

				color: #fff;

			}

			
			.topBtn {

				background-color: #fb9703;

			}

			
			.topBtn:active {

				background-color: #fb9703;

			}

			
			.title p{

				text-align: center;

				color: #000000;

				width: 100%;

				font-size: 24px;

				margin: 0 auto;

				line-height: 35px;

				font-weight: 600;

			}

			
			#div {

				width: 0px;

				height: 0px;

				background: red;

				position: fixed;

				top: 50%;

				left: 50%;

			}

			/*移除底部或顶部三角,需要在删除此代码*/

			
			.mui-popover .mui-popover-arrow:after {

				width: 0px;

			}

			
			.yhxz {

				padding: 10px 13px;

				height: 100%;

				width: 100%;

				/*overflow-y: auto;*/


			}

			
			.yhxztitle {

				text-align: center;

				font-weight: bold;

				color: #000000;

				font-size: 15px;

			}

			
			.yhxzmsg {

				height: 100px;

				overflow-y: scroll;

			}

			
			.yhxzmsg p {

				margin-bottom: 5px;

				color: #333333;

				font-family: simsun;

			}

			
			.xzbtn {

				text-align: center;

				background: #0062CC;

				padding: 5px;

				width: 80%;

				margin: 0 auto;

				border-radius: 3%;

			}

			
			.xzbtn span {

				color: white;

				font-size: 13px;

			}

			
			.qrbtn {

				text-align: center;

				background: #0062CC;

				padding: 5px;

				width: 80%;

				margin: 0 auto;

				border-radius: 3%;

			}

			
			.qrbtn span {

				color: white;

				font-size: 14px;

			}

		</style>

	</head>

	<body>

		<div class="mui-content">

			<img src="../img/logo.png" alt="" class="logo">

			<div class="title"><p>安阳12345政务服务热线</p><p>为您服务</p></div>

			<button type="button" class="btn topBtn">咨询、建议、投诉</button>

			<button type="button" class="btn bottomBtn">问题结果查询</button>

		</div>

		<div id="div"></div>

		<div id="popover" class="mui-popover" style="height: 400px;width: 90%;margin: 0 auto;">

			<div class="mui-popover-arrow"></div>

			<div class="mui-scroll-wrapper">

				
				<div class="mui-scroll">

					<p class="yhxztitle">个人用户须知</p>

					<p>为更好提供及时高效优质“安阳12345政务热线”服务，请您知为更好提供及时高效优质晓以下信息：</p>

					<p>一、您可以对安阳市经济发展、城市建设、社会管理、公共服务、民生需求等方面的事项提出意见建议和诉求，请客观真实提供相关信息和情况;</p>

					<p>二、安阳12345政务热线平台将会获取您的个人信息(包括姓名和联系电话等)，以便必要时工作人员可以直接联系到您。如您点选“个人信息保密”，您的信息将会被严格保密，但承办单位将无法与您联系，以及反馈办理情况和结果。同时提示您，如您已点选“个人信息保密”，请勿在“诉求内容”栏中填写您的个人信息 (包括姓名和联系电话等)，避免因此造成您的个人信息泄漏。</p>

					<p>三、以下诉求和问题，请您通过相应渠道反映并获得帮助:</p>

					<p>(一)涉及生命财产安全等紧急类事项，请您第-时间拨打110、119、120、122等紧急服务热线。</p>

					<p>(二)涉及诉讼、仲裁、纪检监察、行政复议、政府信息公开等法定途径，以及已进入信访渠道办理的事项，请您按照法定途径向有关机关提出。</p>

					<p style="text-align: center;"><input name="checkbox" type="checkbox" id="ischeck" style="margin-right: 10px;"><span style="color: #0077b3;">我已阅读并知晓上述条款</span></p>

					<p class="xzbtn"><span style="font-size: 16px;" class="mui-icon mui-icon mui-icon-help"></span><span class="djs">阅读用户须知倒计时（3）秒</span></p>

					<p class="qrbtn"><span>确认</span></p>

				</div>

			</div>

		</div>

	</body>

</html>

<script src="../js/mui.min.js"></script>

<script src="../layui/layui.js"></script>

		<script src="../js/zepto.js"></script>

		<script src="../js/zepto.js"></script>

		<script src="../Script/Common/huayi.config.js"></script>

		<script src="../Script/Common/huayi.http.js"></script>

<script>

	$(document).ready(function () {

		mui('.mui-scroll-wrapper').scroll({

	deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006

});

	})


$('.topBtn').click(function() {

				mui("#popover").popover('toggle', document.getElementById("div"));

				let count = 3

				$('.xzbtn').css('display', 'block')

				$('.qrbtn').css('display', 'none')

				var djs = setInterval(function() {

					count -= 1

					$('.djs').text('阅读用户须知倒计时（' + count + '）秒')

					if(count == 0) {

						clearInterval(djs)

						$('.xzbtn').css('display', 'none')

						$('.qrbtn').css('display', 'block')

					}

				}, 1000)

			})

			$('.qrbtn').click(function() {

				if($("#ischeck").is(":checked")) {

					window.location.replace("../html/addWorkOrder.html");

				} else {

					mui.alert('请勾选并确认用户须知条款！');

				}

			})

			$('.bottomBtn').click(function() {

				window.location.replace("../html/login.html?v=0.2");

			})

	
</script>