<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<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">
		<meta name="format-detection" content="telphone=no, email=no" />
		<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css" />
		<link rel="stylesheet" type="text/css" href="css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<style>
			.year-dalog { background: url(images/year-dalog.png) center center no-repeat rgba(0, 0, 0, .7); background-size: 80% auto; position: fixed; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 99; display: none; -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: .5s; transition: .5s; }
			.year-dalog.active { -webkit-transform: translateY(0%); transform: translateY(0%); } 
			.year-dalog img { width: 100%; } 
			.header { padding: 10px 0 7px 0; height: 65px; box-shadow: 0 0 0 #fff; background: #fff; } 
			.header h6 { text-indent: 12px; color: #999; letter-spacing: 2px; } 
			.go-index { width: 30%; margin-right: 1%; float: none; } 
			.go-index img { width: 80%; padding-top: 5px; margin-left: 12px; max-width: 100px; } 
			.swiper-container-horizontal>.swiper-pagination-bullets { bottom: 0; } 
			.swiper-pagination-bullet-active { background: #63ccde; } 
			.index-title { padding: 7px 12px 7px 12px; display: block; position: relative; } 
			.index-title strong { font-size: 17px; } 
			.index-title .mui-pull-right { color: #333; } 
			.index-title font { display: inline-block; -webkit-transform: translateY(-1px); transform: translateY(-1px); }
 			.pro-list .mui-media-object { background: #f2f2f2; border-radius: 5px; display: block; }
			.pro-list:before,.pro-list:after {display: none;} 
			.pro-list.mui-table-view.mui-grid-view>li:nth-child(odd) {padding: 10px 8px 0 14px;}
			.pro-list.mui-table-view.mui-grid-view>li:nth-child(even) {padding: 10px 0 0 22px;}
			.pro-list h6 {margin: 7px 0;color: #bbb;}
			.pro-list .pro-price {font-size: 14px;margin-top: 8px;}
			.pro-list .pro-price span {color: #db3f53;}
			.pro-list .pro-price s {color: #bbb;margin-left: 15px;}
 			.pro-list2 .mui-media-object { background: #f2f2f2; border-radius: 5px; display: block; }
			.pro-list2:before,.pro-list2:after {display: none;} 
			.pro-list2.mui-table-view.mui-grid-view>li:nth-child(odd) {padding: 10px 8px 0 14px;}
			.pro-list2.mui-table-view.mui-grid-view>li:nth-child(even) {padding: 10px 0 0 22px;}
			.pro-list2 h6 {margin: 7px 0;color: #bbb;}
			.pro-list2 .pro-price {font-size: 14px;margin-top: 8px;}
			.pro-list2 .pro-price span {color: #db3f53;}
			.pro-list2 .pro-price s {color: #bbb;margin-left: 15px;}
		</style>
	</head>
	<script>
		var d = new Date().getTime(); //当前时间戳
		if (d > 1558627200000 && d <= 1560873599000) {
			location.href = "20190618.html";
		}
	</script>
	<body>
		<div class="loading-bg">
			<div class="mui-loading">
				<div class="mui-spinner">
				</div>
				&nbsp;&nbsp;加载中...
			</div>
		</div>
		<nav class="mui-bar mui-bar-tab" id="footer-bar">
			<a class="mui-tab-item mui-active">
				<div class="iconfont icon-shouye"></div>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item go_gwc">
				<div class="iconfont icon-gouwuche"><span class="mui-badge">0</span></div>
				<span class="mui-tab-label">购物车</span>
			</a>
			<a class="mui-tab-item">
				<div class="iconfont icon-dingdan"></div>
				<span class="mui-tab-label">订单</span>
			</a>
			<a class="mui-tab-item">
				<div class="iconfont icon-wode"></div>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
		<!--header 开始-->
		<header class="mui-bar mui-bar-nav header">
			<div class="go-index go_index">
				<img src="images/logo.png">
			</div>
			<h6>Ta 是一种生活方式</h6>
		</header>
		<!--header 结束-->
		<div class="mui-content" style="background: #fff;">
			<!--商城首页begin-->
			<div class="mui-content-padded">
				<!--banner 开始-->
				<div class="swiper-container" style="padding:10px 0 20px 0;">
					<div class="swiper-wrapper">
						<div class="swiper-slide"><img width="100%" src="images/banner-20190101.png" /></div>
					</div>
					<!-- 如果需要分页器 -->
					<div class="swiper-pagination mui-text-center"></div>
				</div>
				<!--banner 结束-->
			</div>
			
			
			<!-- <div id="" style="display: block;margin-top: 25px;;">
				<img style="width: 100%;" src="https://s.iamberry.com/common/image/product/xpsd.png"/>
			</div>
			
			<div class="chanpin-box">
				<ul class="mui-table-view mui-grid-view pro-list2" >
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="80" colorid="64" class="go_chanpin_details2"><img class="mui-media-object" src="https://s.iamberry.com/common/image/product/kdsj.png">
							<div class="mui-text-left">
								<div class="mui-media-body">Aiberle口袋热水机</div>
								<h6>小巧便携,3秒即饮</h6>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="81" colorid="65" class="go_chanpin_details2"><img class="mui-media-object" src="https://s.iamberry.com/common/image/product/new_hs.png">
							<div class="mui-text-left">
								<div class="mui-media-body">Aiberle净水花洒升级款</div>
								<h6>高效除氯、净水养肤</h6>
							</div>
						</a>
					</li>
				</ul>
			</div> -->
			
			<!--<ul class="mui-table-view mui-grid-view my-view-no" id="index-pro-list2" style="padding-bottom: 0;">
				<li class="mui-table-view-cell mui-media mui-col-xs-6"><a name="54">
					<img class="mui-media-object" style="background-color: #f9f7f8;border-radius: 5px;" src="https://s.iamberry.com/common/image/product/kdsj.png">
					<div class="index-pro-tit" style="margin-top: 10px;">Aiberle口袋热水机</div>
					<p class="mui-text-left">小巧便携,3秒即饮</p>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-6"><a name="52">
					<img class="mui-media-object" style="background-color: #f9f7f8;border-radius: 5px;" src="https://s.iamberry.com/common/image/product/new_hs.png">
					<div class="index-pro-tit" style="margin-top: 10px;">Aiberle净水花洒升级款</div>
					<p class="mui-text-left">高效除氯、净水养肤</p>
				</li>
			</ul>-->
			
			

			<div class="index-title go_web_shop">
				<strong>经典款净水机</strong><span class="mui-pull-right"><font>更多</font><span class="mui-icon mui-icon-arrowright"></span></span>
			</div>
			<!--list开始-->
			<div class="chanpin-box">
				<ul class="mui-table-view mui-grid-view pro-list">
					<!--<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="34" colorid="1" class="go_chanpin_details"><img class="mui-media-object" src="http://s.iamberry.com/watero/images/shop/cp-blue.png">
							<div class="mui-text-left">
								<div class="mui-media-body">WA-1桌面净水机</div>
								<h6>即净即饮、5档控温</h6>
								<div class="pro-price"><span>¥2999</span><s>¥5680</s></div>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="34" colorid="2" class="go_chanpin_details"><img class="mui-media-object" src="http://s.iamberry.com/watero/images/shop/cp-black.png">
							<div class="mui-text-left">
								<div class="mui-media-body">WA-1桌面净水机</div>
								<h6>即净即饮、5档控温</h6>
								<div class="pro-price"><span>¥2999</span><s>¥5680</s></div>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="34" colorid="4" class="go_chanpin_details"><img class="mui-media-object" src="http://s.iamberry.com/watero/images/shop/cp-red.png">
							<div class="mui-text-left">
								<div class="mui-media-body">WA-1桌面净水机</div>
								<h6>即净即饮、5档控温</h6>
								<div class="pro-price"><span>¥2999</span><s>¥5680</s></div>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media mui-col-xs-6">
						<a proid="58" colorid="40" class="go_chanpin_details"><img class="mui-media-object" src="http://s.iamberry.com/watero/images/shop/pro-white.png">
							<div class="mui-text-left">
								<div class="mui-media-body">WB-1 桌面净水机</div>
								<h6>4级RO净化、3秒即热</h6>
								<div class="pro-price"><span>¥1999</span><s>¥3999</s></div>
							</div>
						</a>
					</li>-->
				</ul>
			</div>
			<!--list结束-->
			<div class="index-title go_web_shop2" style="margin-top: 20px;">
				<strong>制氢款净水机</strong><span class="mui-pull-right go_pro_list"><font>更多</font><span class="mui-icon mui-icon-arrowright"></span></span>
			</div>
			<div class="mui-content-padded my-content-padded" id="advs_banner" style="display: block;">
				<!--<a><img src="images/fuqing-1.png"></a>-->
			</div>
			<!--商城首页end-->
		</div>
		<!--春节放假通知-->
		<div class="year-dalog"></div>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-2.1.1.min.js"></script>
		<script src="js/swiper.min.js"></script>
		<script src="js/main.js"></script>
		<script src="js/page/wechat-utils-1.0.js"></script>
	</body>
	<script>
		var clickdate = JSON.parse(localStorage.getItem('clickdate'));
		mui.ready(function() {
			//springFestivalPop();
			marquee_Show();
			getCartNum();
			$.ajax(base_path + '/indexData?dates=' + new Date().getTime(), {
				dataType: 'json',
				type: 'post',
				timeout: 15000,
				xhrFields: {
					withCredentials: true
				},
				crossDomain: true,
				success: function(dt) {
					if(dt.isRedirect) {
						location.href = dt.redirectURL;
					} else {
						var bannerstr = "",
							prostr = "",
							dian = "",
							advsstr = "";
						if(dt.status) {
							var banner_data = dt.data.banners,autoplay=false;
							mui(banner_data).each(function(index) {
								bannerstr += '<div class="swiper-slide" name="' + this.bannerImageCheckOutUrl + '"><img width="100%" src="' + (this.bannerImageUrl) + '" /></div>';
							});
							if(banner_data.length>1){
								autoplay=true;
							}
							$(".swiper-wrapper").html(bannerstr);
							/*dc('mui-slider-loop').innerHTML = bannerstr;
							dc('my-slider-indicator').innerHTML = dian;
							$("<div id='banner-slide.swiper-wrapperr' class='mui-slider'><div class='mui-slider-group mui-slider-loop' id='mui-slider-loop'>" + bannerstr + "</div><div id='my-slider-indicator' class='mui-slider-indicator my-slider-indicator'>" + dian + "</div></div>").insertBefore(".chanpin-box");*/
							// var advs_data = dt.data.advs;
							//mui(advs_data).each(function(index) {
							//   advsstr += '<a href="' + this.bannerImageCheckOutUrl + '"><img src="' + this.bannerImageUrl + '" /></a>'
							//});
							//dc('advs_banner').innerHTML = advsstr;
							dc('advs_banner').style.display = 'block';

							mui.each(document.querySelectorAll('.swiper-wrapper .swiper-slide'), function(index, el) {
								el.addEventListener('tap', function() {
									//document.querySelector('.loading-bg').style.display = 'block';
									var str = this.getAttribute('name');
									console.log(this.getAttribute('name'));
									if(str != "#" && str != '') {
										location.href = str
									}
								}, false)
							});
//							mui.each(document.querySelectorAll('#advs_banner a'), function(index, el) {
//								el.addEventListener('tap', function() {
//									location.href = 'chanpin_list.html?proType=2';
//								}, false)
//							});
							//banner 初始化
							var swiper = new Swiper('.swiper-container', {
								autoplay: {
									delay: 5000, //5秒切换一次
								},
								effect: 'slide',
								loop: autoplay,
								grabCursor: true,
								pagination: {
									el: '.swiper-pagination',
								},
							});
							var shareOpenid = dt.data.memberOpenid;
							var link = domanUrl + "/wateroWechat/index.html?shareOpenid=" + shareOpenid;
							window.repleFlag = false;
							window.wxFriend = {
								"appId": "",
								"imgUrl": domanUrl + '/wateroWechat/images/index.jpg',
								"link": link,
								"desc": "WaterO水时代商城,开启优雅生活",
								"title": "WaterO水时代商城,好水,好茶,生活不将就!",
								"netError": "您的网络异常,请刷新重试!如多次刷新无效,请向我们反应 ~",
								"shareTimeSuccess": "分享成功",
								"shareTimeCancel": "已取消分享",
								"shareAppSuccess": "分享成功!",
								"shareAppCancel": "已取消分享"
							};
							getConfig();
							document.querySelector('.loading-bg').style.display = 'none'
						} else {
							mui.alert(dt.message, ' ', '我知道了', function() {
								mui.openWindow({
									url: "index.html?dates=" + new Date().getTime()
								})
							})
						}
					}
				},
				error: function(xhr, type, errorThrown) {
					console.log(xhr)
				}
			});
			if(marquee != '') {
				$('body').append('<div class="marquee-show"><div></div></div>')
			}
			$.ajax(base_path + '/product/productIndexSellWell?dates=' + new Date().getTime(), {
				data: {},
				dataType: 'json',
				type: 'post',
				timeout: 15000,
				xhrFields: {
					withCredentials: true
				},
				crossDomain: true,
				success: function(dt) {
					if(dt.isRedirect) {
						location.href = dt.redirectURL;
					} else {
						if(dt.status) {
							var chanpin_data = [],chanpin_data1 = [];
							chanpin_data = dt.data.firColuProductList;
							chanpin_data1 = dt.data.SecColuProductList;
							var table = document.body.querySelector('.pro-list');
							var table1 = document.body.querySelector('#advs_banner');
							mui(chanpin_data).each(function(index) {
								var pro_color = this.colorName;
								var li = document.createElement('li');
								li.className = 'mui-table-view-cell mui-media mui-col-xs-6';
								var yuanjia = '<s>¥' + accDiv(this.colorPrice, 100) + '</s>';
								if(marquee != '' && this.colorDiscount == '328000') {
									yuanjia = '<span class="mui-h6">购买即赠3年滤芯</span>'
								}
								li.innerHTML = '<a proid="' + this.productId + '" colorid="' + this.colorId + '" class="go_chanpin_details"><img class="mui-media-object" src="' + this.indeProdImg + '"><div class="mui-text-left"><div class="mui-media-body">' + this.productName + '</div><h6>' + this.productColorDes + '</h6><div class="pro-price"><span>¥' + accDiv(this.colorDiscount, 100) + '</span><s>' + yuanjia + '</s></div></div></a>';
								table.appendChild(li)
							});
							mui(chanpin_data1).each(function(index) {
								var li = document.createElement('a');
								li.setAttribute("proid",this.productId);
								li.setAttribute("colorid",this.colorId);
								li.className='go_chanpin_details';
								li.innerHTML='<img src="' + this.indeProdImg + '">';
								table1.appendChild(li);
							});
						} else {

						}
					}
				},
				error: function(xhr, type, errorThrown) {
					console.log(xhr)
				}
			});
		});
		$(document).on('tap', '.go_web_shop2', function() {
			location.href = 'chanpin_list.html?proType=16';
		});
		//春节放假通知弹窗点击事件
		$(document).on('tap', '.year-dalog', function() {
			if(!window.localStorage) {
				mui.alert("您的浏览器不支持localStorage");
			} else {
				//自定义json数据
				var obj = {};
				obj = {
					text: new Date().getTime()
				};
				//json格式化插入    点击时间
				localStorage.setItem('clickdate', JSON.stringify(obj));
			}
			$(".year-dalog").removeClass("active");
			setTimeout(function() {
				$(".year-dalog").hide();
			}, 500);
		});
		$(document).ready(function() {
			var d = new Date().getTime(); //当前时间戳
			//弹窗提示时间为1月18日-2月13日
			if(d > 1547740800000 && d < 1550073599000) {
				if(!window.localStorage) {
					mui.alert("您的浏览器不支持localStorage");
				} else {
					if(clickdate != null) {
						var oldDate = new Date(clickdate.text).getDay();
						//如果本地存储的getDay比当前时间的getDay大则显示弹窗
						if(new Date().getDay() > oldDate) {
							$(".year-dalog").addClass("active").show();
						}
					} else {
						//本地没有存储时间也显示弹窗
						$(".year-dalog").addClass("active").show();
					}
				}
			}
		});
	</script>

</html>