myBaodan.html 7.0 KB
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>我的保单</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_537174_a4y4ri5v8z6t7qfr.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_550254_r6pua542e96vquxr.css"/>
		<link rel="stylesheet" type="text/css" media="screen" href="css/base.css" />
		<script src="js/base.js"></script>
	</head>

	<body>
		<div class="container baodan_container">
			<ul class="baodan_items">
				<li class="baodan_item"  data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">待审核</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div>
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
						
					</div>
				</li>
				
				<li class="baodan_item"  data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">已投保</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div>
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
						<div class="ac_btns">
							<div class="single_btn forgive">
								放弃
							</div>
							<div class="single_btn baoxiu">
								报修
							</div>
						</div>
					</div>
				</li>
				
				<li class="baodan_item"  data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">审核不通过</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div>
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
						
					</div>
				</li>
				<li class="baodan_item"  data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">保修审核</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div>
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
						<div class="ac_btns">
							<div class="single_btn forgive">
								放弃
							</div>
							
						</div>
					</div>
				</li>
				
				<li class="baodan_item" data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">保修通过</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div>
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
						<div class="ac_btns">
							<div class="single_btn input_danhao">
								填写单号
							</div>
							<div class="single_btn baoxiu">
								报修
							</div>
							
						</div>
					</div>
				</li>
				
				<li class="baodan_item"  data-num='123123'>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">OPPO OPPO R11</div>
						<div class="bodan_situation">
							状态:
							<span class="situaition">已弃保</span>
						</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">产品序列号:12345678</div>
					</div>
					<div class="baodan_top baodan_list">
						<div class="baodan_name">生效日期:2018-1-13</div>
					</div> 
					<div class="bandan_ac">
						<div class="view_detail">
							<a href="baodanDeatil.html">查看详情 >></a>
						</div>
					</div>
				</li>
				
				
			</ul>
			
		</div>   
		<!--底部-->
		<div class="nav_bottom creat_tricks" >
			创建保单
		</div>
		<div class="nav_bottom">
			<a class="nav_bottom_item" href="brandIntroduce.html">
				<span class="iconfont icon-pinpai"></span>
				<span class="bottom_title">品牌介绍</span> 
			</a>
			<a class="nav_bottom_item " href="help.html">
				<span class="iconfont icon-gaiicon-"></span>
				<span class="bottom_title">帮助中心</span> 
			</a>
			<a class="nav_bottom_item active" href="#">
				<span class="iconfont icon-wode"></span>
				<span class="bottom_title">个人中心</span> 
			</a>
		</div>
		<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
		<script type="text/javascript" src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/swiper.min.js" ></script>
		<script> 
			
			//提交
			mui('body').on('tap','.make_sure',function(){
				mui.toast('绑定成功')
			})
			//放弃操作
			mui('.baodan_items').on('tap','.forgive',function(){
				var btn = ['取消','确定'];
				var data = '您仅可拥有3个有效保单,放弃此保单后不可再恢复,是否放弃?';
				mui.confirm(data,'提示',btn,function(e){
					if(e.index==1){
						mui.toast('你选择了放弃')
					}else{
						mui.toast('您选择了取消')
					}
				}) 
			})
			//
			mui('.baodan_item').on('tap','.baoxiu',function(){
				var num = $(this).parents('.baodan_item').attr('data-num');
				mui.openWindow('baoxiudan.html#'+num);
			})
			
			//填写单号
			mui('.baodan_items').on('tap','.input_danhao',function(){
				var num = $(this).parents('.baodan_item').attr('data-num');
				localStorage.baodanNum = num;
				mui.openWindow('express_num.html')
			})
			//创建保单
			mui('body').on('tap','.creat_tricks',function(){
				mui.openWindow('creatBaodan.html');
			})
		</script>
	</body>

</html>