sailun
/
sailun-shop


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
							<!DOCTYPE html>
<html class="">
	<!--STATUS OK-->
	<head>
		<meta name="referrer" content="always" />
		<meta charset='utf-8' />
		<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<meta http-equiv="x-dns-prefetch-control" content="on">
		<meta name="description" content="">
		<meta name="format-detection" content="telephone=no" />
		<link rel="stylesheet" type="text/css" href="css/vant-ui.css" />
		<link rel="stylesheet" type="text/css" href="css/iconfont.css">
		<link rel="stylesheet" type="text/css" href="css/main.css" />
		<script src="js/vue.js"></script>
		<script src="js/vant-ui.js"></script>
		<script src="js/main.js"></script>
		<link rel="stylesheet" href="./mescroll/mescroll.min.css">
		<script type="text/javascript" src="./mescroll/mescroll.min.js"></script>
		<title></title>
	</head>
	<style>
	   .pageView.bdjl .search {
	       top : 0rem;
	   }
		 .pageView.bdjl {
		 	    background-color: #fff !important;
		 }
		 .pageView.bdjl .jiluItems {
			 background-color: #00a0ea;
			 color: #fff;
		 }
		 .mescroll{
			 position: relative;
			 height: 100%;/*如设置bottom:50px,则需height:auto才能生效*/
		 }
	</style>
	<body>
		<div id="app" v-cloak>
			<div class="pageView bdjl mescroll-touch-y mescrol" style="padding-top: 0rem" id="mescroll" style="margin-top:1.5rem">
				<!-- <div class="search flex a-center" style="display:none">
					<div class="searchbox">
						<svg t="1589079341958" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5394" width="22" height="22">
							<path d="M883.626667 823.04l-145.066667-144.64A337.92 337.92 0 0 0 810.666667 469.333333a341.333333 341.333333 0 1 0-341.333334 341.333334 337.92 337.92 0 0 0 209.066667-72.106667l144.64 145.066667a42.666667 42.666667 0 0 0 60.586667 0 42.666667 42.666667 0 0 0 0-60.586667zM213.333333 469.333333a256 256 0 1 1 256 256 256 256 0 0 1-256-256z" p-id="5395" fill="#bfbfbf"></path>
						</svg>
						<input type="search" placeholder="请输入车牌号或联系人" v-model="keyword">
					</div>
				</div> -->
				<van-popup position="bottom" v-model="show">
					<mycalendar @comfirm="comfirm" @close="show = false"></mycalendar>
				</van-popup>
				<div class="zhuceTimer flex a-center jlr" style="margin-top: 0.3rem;background-color:#00a0ea;color:#fff">
					<div class="flex a-center" v-on:click="getTimes">
						<h4>注册时间：</h4>
						<p v-on:click="getTimes(0)">{{ startTime }}</p>  ~  <p v-on:click="getTimes(1)">{{ endTime }}</p>
					</div>
				</div>
				<div class="jiluItems" v-for="(v,i) in list" :key="i" v-show="list.length > 0" v-on:click="lookSetTlement(v.orderno)">
					<div class="title flex a-center jlr">
						<div class="flex a-center">
							<b></b>
							<span>参保单号：{{ v.orderno }}</span>
						</div>
						<i class="iconfont icon-right"></i>
					</div>
					<div class="content flex wrap">
						<div class="item">
							参保单状态：{{ v.status | statusToStr }}
						</div>
						<div class="item">
							车牌号：{{ v.plateNumber }}
						</div>
						<div class="item">
							联系人：{{ v.telname }}
						</div>
						<div class="item" style="width : 100%">
							车辆性质：{{ v.operatingType | getOrderType }}
						</div>
						<div class="item" style="width : 100%">
							参保时间：{{ v.policyStart }} - {{ v.policyEnd }}
						</div>
					</div>
				</div>
				<div v-show="list.length == 0" style="text-align:center">
					<img src="./image/noData.png" style="margin:2rem auto" />
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../script/api.js"></script>
	<script type="text/javascript" src="../script/httpRequest.js"></script>
	<script type="text/javascript" src="../script/vue_plugins.js"></script>
	<script type="text/javascript">
		apiready = function() {
			new Vue({
				el : '#app',
				data : {
					show : false,
					list : [],
					userid : '',
					keyword : '', // 关键字
					startTime : '开始时间',
					endTime : '结束时间',
					current : 1,
					size : 10,
					totalPages : 1,
					frist : 1,
				},
				filters: {
					statusToStr: function(val) {
						return ["在保", "生成保障码", "已提交", "已过期","已通过","已拒绝"][val]
					},
					getOrderType : function(val){
						return ['营运','非营运'][val]
					}
				},
				methods : {
					comfirm : function(v) {
						this.show = false
					},
					init : function() {
					    this.userid = $api.getStorage('userid');
					    this.getInsurance();
					},
					configs : function(){
						var _this = this;
						this.frist = 2;
						this.configDownAndPull("mescroll",function(mescroll){
								 _this.current = 1;
								 _this.getInsurance(mescroll);
						},function(mescroll){
								 if(_this.current < _this.totalPages){
									 _this.current = _this.current + 1;
									 _this.getInsurance(mescroll,1);
								 }else{
									 mescroll.endSuccess(_this.size,false);
								 }
						})
					},
					/**
					 * 获取 保单记录
					 */
					getInsurance : function(mescroll) {
						var url = "getLipeiList", _this = this;
						var data = {
							"param" : this.keyword,
							"storeId" : this.userid,
							"startDate" : this.startTime == '开始时间' ? '' : this.startTime,
							"endDate" : this.endTime == '结束时间' ? '' : this.endTime,
							"type" : "body",
							"url" : "json"
						}
						this.$post(url,data,function(ret){
						    if(ret.code == 0 || ret.code == '0'){
									_this.list =ret.data ? (_this.current == 1 ? ret.data.list : _this.list.concat(ret.data.list)) : [];
									if(_this.frist == 1){
										_this.$nextTick(function(){
											_this.configs();
										})
									}
									if(mescroll){
										mescroll.endSuccess(_this.size,true);
									}
									_this.totalPages = ret.data ? ret.data.totalPage : 1;
						    }
						})
					},
					/**
					 * 选择时间
					 */
					getTimes : function(type){
					    var _this = this;
					    this.getTime(function(time){
					         if(type == 0){
					            _this.startTime = time;
					         }else{
					            _this.endTime = time;
					         }
									 _this.getInsurance();
					    })
					},
					//  查看赔付详情
					lookSetTlement: function(orderNo) {
						this.goWin('settlementDisInfo0', 'settlementDisInfo0_win.html', {
							orderNo: orderNo
						});
					}
				},
				mounted : function() {
					this.init();
				}
			})
		}
	</script>
</html>