zouling
/
qianshanxm_ui


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
							<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="utf-8" />
		<meta http-equv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<meta name="format-detection" content="telephone=no" />
		<title>潜山市党建引领信用村(社区)建设</title>
		<meta name="keywords" content="潜山市党建引领信用村(社区)建设">
		<meta name="description" content="潜山市党建引领信用村(社区)建设">
		<script src="static/js/vue.js"></script>
		<script type="text/javascript" src="static/js/vue-router.js"></script>
		<script src="static/js/index.js" type="text/javascript"></script>
		<script type="text/javascript" src="./static/js/jquery.min.js"></script>
		<script src="static/js/common.js"></script>
		<link href="static/css/common.css" rel="stylesheet" />
		<link href="static/css/style.css" rel="stylesheet" />
		<link rel="stylesheet" href="static/css/theme-chalk/index.css">

		<style></style>
	</head>
	<body class="qdcate qduse">
		<div id="appse">
			<header>
				<div class="quset">
					<div class="qusetimg"><img src="static/images/back.png" class="backimg" /></div>
					选择类别
				</div>
			</header>
		</div>
		<div id="app">
			<main>
				<div class="qcate" v-if='catelist.length'>
					<div class="qcateli" v-for="(item,index) in catelist" :key='index' @click="getUse(item)">
						<div class="qcatelit">
							<div class="flexc mb16">
								<div class="f26 c0 fw flex1">{{item.oneTitle}}
								</div>
								<div class="f26 ca flexc flex0">去使用<img  src="static/images/ring.png" class="qcatelitr" /></div>
							</div>
							<div class="f26 c0">{{item.twoTitle}}</div>
						</div>
						<div class="qcatelif flex">
							<div class="flex0">
								<div class="mb14 f24 c6">可用次数</div>
								<div class="f9 c0"><span class="f26 fw">{{item.total}}</span></div>
							</div>
							<div class="flex0">
								<div class="mb14 f24 c6">剩余次数</div>
								<div class="f9 c0"><span class="f26 fw">{{item.remaining}}</span></div>
							</div>
							<div class="flex1">
								<div class="mb14 f24 c6">有效期限</div>
								<div class="f9 c0">有效期至<span class="f26 fw">{{item.validTerm}}</span></div>
							</div>
						</div>
					</div>
					
					
				</div>
				<!-- 暂无记录 -->
				<div v-else class="nobox">
					<img src="static/images/nico.png" class="noimg"/>
				</div>
				<!-- 密码弹窗 -->
				<div class="bgbox" v-if="pawflag"></div>
				<div class="pawfixed" v-if="pawflag">
					<div class="f3 c2 tc fw">输入密码</div>
					<div class="pawfixedin ">
						<input maxlength="1" @keyup="nextFocus($event,0)" v-model="reportinput[0]"/>
						<input maxlength="1" @keyup="nextFocus($event,1)" v-model="reportinput[1]"/>
						<input maxlength="1" @keyup="nextFocus($event,2)" v-model="reportinput[2]"/>
						<input maxlength="1" @keyup="nextFocus($event,3)"  v-model="reportinput[3]"/>
						<input maxlength="1" @keyup="nextFocus($event,4)"  v-model="reportinput[4]"/>
						<input maxlength="1" @keyup="nextFocus($event,5)"  v-model="reportinput[5]"/>
					</div>
					<div class="pawfixedtit"><span>*</span>密码默认为身份证后六位</div>
					<div class="pawfixedbtns">
						<div class="pawfixedbtn btn1" @click="getClose">取消</div>
						<div class="pawfixedbtn btn2" @click="getSure">确认</div>
					</div>
				</div>
			</main>
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					catelist: [],
					base_url: 'http://118.31.23.65:5007/prod-api',
					reportinput:['','','','','','',],//密码展示
					pawflag:false,
					idCard:'',
					pawnum:'',
					msg:'',
					phone:'',
					recordType:'',
					recordName:'',
				},
				created() {
					// 获取信息
					if(window.localStorage.getItem('userinfo')){
						var userinfo=JSON.parse(window.localStorage.getItem('userinfo'))
						this.idCard = userinfo.idCard||'';
						this.phone = userinfo.phone||'';
						// 获取身份证后六位
						this.pawnum=this.idCard.substring(this.idCard.length-6)
						this.getDataFn()
					}
					
					
					
				},
				mounted() {
				},
				methods: {
					//使input框获得焦点
					      focus(){
					        this.$refs.pwd.focus(); 
					      },
					
					
					nextFocus(el,index){
						var dom = $(".pawfixedin input"),
						    currInput = dom[index],
						    nextInput = dom[index + 1],
						    lastInput = dom[index - 1];            
						if (el.keyCode != 8&& el.keyCode != 46) {
							if (index < (this.reportinput.length - 1)){
							        nextInput.focus();
							    } else {
							        currInput.blur();
									this.getSure()
							    }
						}else{
							if (index !=0) {
							    lastInput.focus();
							}
						}
					},
					getClose(){
						this.pawflag=false;
					},
					getSure(){
						var that=this;
						var newinput=this.reportinput;
						for(var i=0;i<newinput.length;i++){
							if(!newinput[i]){
								that.$message({
									message: "请输入完整的密码",
									type: 'error',
									center: true,
								});
								return
							}
						}
						that.$nextTick(function(){
							var newStr=newinput.join('')
							if(newStr==that.pawnum){
								that.pawflag=false;
								window.location.href="scancode.html?menuId=" + that.menuId
							}else{
								that.$message({
									message: "请输入正确的密码",
									type: 'error',
									center: true,
								});
							}
						})
					},
					getUse(e){
						// item.menuId,item.remaining
						var d=e.remaining;
						if(typeof(d)=='number'&&d==0){
							this.$message({
								message: '暂无使用次数',
								type: 'error',
								center: true,
							});
						}else{
							window.location.href="scancode.html?menuId=" + e.menuId
						}
						
					},
					
					getQueryString(name) {
						try {
							var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
							var r = window.location.href.split('?')[1].match(reg);
							// console.log(reg,r)
							if (r != null) {
								return r[2];
							}
							return ""; //如果此处只写return;则返回的是undefined
						} catch (e) {
							return ""; //如果此处只写return;则返回的是undefined
						}
					},
					getDataFn() {
						var that = this;
						let params = {
							"idCard": that.idCard
						}
						$.ajax({
							url: this.base_url + '/system/policy/listPolicyMenuApp',
							type: 'GET',
							data: params,
							dataType: 'json',
							success: function(res) {
								
								if (res.code == 200) {
									that.catelist = res.data || {};
								} else {
									that.$message({
										message: res.msg,
										type: 'error',
										center: true,
									});
								}
							}
						})
					}
				}
			})
		</script>
		<script type="text/javascript">
			$(document).ready(function() {
				$('.backimg').click(function() {
					window.history.go(-1)
				})
			})
		</script>
	</body>
</html>