liujiankang
/
iamberry-common-parent
forkattu lähteestä hexiugang/iamberry-common-parent


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>质保卡</title>
		<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" type="text/css" href="//s.iamberry.com/wateroPF/css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="//s.iamberry.com/wateroPF/new/css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="//s.iamberry.com/wateroPF/css/style.css" />
		<style type="text/css">
			.warranty-box{margin: 10px;position: relative;}
			.warranty-box>img{width: 100%;}
			.warranty-name{position: absolute;color: #fff;top: 22px;left: 85px;font-size: 18px;}
			.warranty-tips{color: #fff;position: absolute;top: 48px;left: 85px;}
			.icon-chanpintiyan{color: #fff;font-size: 50px;}
			.jiqi{position: absolute;left: 20px;top: 20px;line-height: 1;border-radius: 50%;
			box-shadow:-3px 0 3px #73c7e0, /*左边阴影*/  
			3px 0 3px #73c7e0, /*右边阴影*/  
			 0 -4px 3px #73c7e0, /*顶部阴影*/  
			 0 1px 3px #73c7e0; /*底边阴影*/ }
			 .date-list{display: table;width: 100%;position: absolute;top: 50%;text-align: center;}
			 .date-list>div{display: table-cell;color: #fff;position: relative;}
			 .date-list>div:after{content: '';width: 1px;top: 25%;height: 50%;background-color: #fff;-webkit-transform: scaleX(.5);position: absolute;right: 0;}
			 .warranty-number{position: absolute;left: 20px;bottom: 15px;color: #fff;}
		</style>
	</head>
	<body style="background: #fff;">
	<div class="loading-bg">
			<div class="mui-loading">
				<div class="mui-spinner">
				</div>
				&nbsp;&nbsp;加载中...
			</div>
		</div>
	<div class="data-cards" id="data-cards">
		<!--<div class="mui-content" style="background: #fff;">
			<div class="warranty-box">
				<img src="//s.iamberry.com/wateroPF/new/images/shop/warranty_card.png"/>
				<span class="jiqi" style=""><span class="iconfont icon-chanpintiyan"></span></span>
				<span class="warranty-name">美国watero净饮水一体机</span>
				<span class="warranty-tips">一年换新、十年质保</span>
				<div class="date-list">
					<div>购买日期<br/>2017-01-02</div>
					<div>换新截止<br/>2017-01-02</div>
					<div>质保截止<br/>2017-01-02</div>
				</div>
				<div class="warranty-number">NO.  1599  9999  999</div>
			</div>
		</div>-->
	</div>
	<script src="//s.iamberry.com/wateroPF/js/mui.min.js?v=2016101701"></script>
	<script src="//s.iamberry.com/wateroPF/js/jquery-2.1.1.min.js"></script>
	<script src="//s.iamberry.com/wateroPF/new/js/page/main.js?v=2016101701"></script>
	<script type="text/javascript">
	mui.ready(function(){

        mui.ajax(base_path + '/qrcode/select_warranty_card_list?dates=' + new Date().getTime(), {
            dataType: 'json',
            type: 'post',
            timeout: 15000,
            success: function(dt) {
                if(dt.isRedirect) {
                    location.href = dt.redirectURL;
                } else {
                    if(dt.status) {
                        var data_cards = dt.data;
                        var table = $('#data-cards');
                        var li = '';
                        mui(data_cards).each(function(index) {
                            li += '<div class="mui-content" style="background: #fff;">'
                                +'<div class="warranty-box">'
                                +'<img src="//s.iamberry.com/wateroPF/new/images/shop/warranty_card.png"/>'
                                +'<span class="jiqi" style=""><span class="iconfont icon-chanpintiyan"></span></span>'
                                +'<span class="warranty-name">美国WaterO可移动智能净水机</span>'
                                +'<span class="warranty-tips">一年只换不修、三年包修、十年保修</span>'
								+'<div class="date-list">'
                                +'<div>购买日期<br/>' + dateFormat(this.cardSaleTime) + '</div>'
                                +'<div>换新截止<br/>' + dateFormat(this.cardRenewTime) + '</div>'
                                +'<div>质保截止<br/>' + dateFormat(this.cardEndTime) + '</div>'
                                +'</div>'
                                +'<div class="warranty-number">NO.&nbsp;&nbsp;'+ datePhone(this.cardBarcode) +'</div>'
                            	+'</div>'
                            	+'</div>'
                        });
                        table.html(li);
                    } else {
                        mui.alert(dt.message);
                    }
                }
            },
            error: function(xhr, type, errorThrown) {
                //异常处理；
                console.log(xhr);
            }
        });
        document.querySelector('.loading-bg').style.display='none';
	});

	function datePhone(phone) {
	    if (phone != null && phone.length >= 12) {
			var phone1 = phone.substring(0,4);
            var phone2 = phone.substring(4,8);
            var phone3 = phone.substring(8,12);
            var phone4 = phone.substring(12,phone.length);
            return phone1 + "&nbsp;&nbsp;" + phone2 + "&nbsp;&nbsp;" + phone3 + "&nbsp;&nbsp;" + phone4;
		}
	}

    function dateFormat(now) {
        if (now == null || now == '') {
            return '暂无';
        } else {
            now = new Date(now);
            var year = now.getFullYear();
            var month = now.getMonth() + 1;
            var date = now.getDate();
            if (month < 10) {
                month = "0" + month;
			}
			if (date < 10) {
                date = "0" + date;
			}
            return year + "-" + month + "-" + date
        }
    };
	</script>
	</body>
</html>