调整

microserviceUserH5/static/css/doubleChristmasActivity.css

@@ -229,7 +229,6 @@ ul, li {
   margin: 0 auto;
   margin-top: 0.2rem;
   padding: 0.2rem;
-  display: none;
 }
 .reward-time{
   width: 6.5rem;
@@ -422,6 +421,7 @@ input:focus{
   margin: 0 auto;
   margin-top: 0.2rem;
   padding: 0.2rem;
+  display: none;
 }
 .distribution-time{
   width: 5.48rem;
@@ -573,6 +573,12 @@ input:focus{
 .slider-list{
   transition:all .6s;
 }
+.item{
+  height: 218px;
+  text-align: center;
+  flex:none;
+  width: 6.5rem;
+}
 .schedule-child-line{
   transition:all .6s;
 }

microserviceUserH5/static/js/vender/move.js

@@ -2,6 +2,7 @@ var sliderData = (function(cb){
   document.getElementById('slider').addEventListener('touchstart',touchstart, false);
   document.getElementById('slider').addEventListener('touchmove',touchmove, false);
   document.getElementById('slider').addEventListener('touchend',touchend, false);
+  var pageDom = document.getElementsByClassName('page')[0];
   var rightEarDom = document.getElementsByClassName('right-ear')[0];
   var leftEarDom = document.getElementsByClassName('left-ear')[0];
   var scheduleChildLine = document.getElementsByClassName('schedule-child-line')[0];
@@ -12,6 +13,7 @@ var sliderData = (function(cb){
   var translateX = 0;
   var startTime;
   var newTranslateX;
+  var distance = 0;
   var startTranslate;
   var isSlide = false;
   var sliderNumber = 4;//滑块是数量，控制溢出不能滑动
@@ -34,7 +36,6 @@ var sliderData = (function(cb){
     if (currentX < startX) {
   
     }
-  
     distance = currentX - startX;
     translateX = currentX - startX + startTranslate;
   
@@ -59,7 +60,7 @@ var sliderData = (function(cb){
       } else {
         newTranslateX = startTranslate
       }
-      console.log(cb)
+      cb();
     }
   
     translateX = newTranslateX;
@@ -87,14 +88,15 @@ var sliderData = (function(cb){
     translateX = newTranslateX;
     document.getElementById("slider-list").style.transform = "translateX("+translateX+"px)";
     lineMove();
+    cb();
   })
   //下方进度条移动
   function lineMove(){
-    console.log(index)
     index = Math.abs(newTranslateX / width);
     let oneSlider = 36/sliderNumber,
         transformSlider = oneSlider*index;
     scheduleChildLine.style.width = `${oneSlider}px`;
     scheduleChildLine.style.transform = `translateX(${transformSlider}px)`;
+    pageDom.innerText = `${index + 1}/${sliderNumber}页`
   }
-})(stopManyClick)
+})(getLists)

microserviceUserH5/vcloud/doubleChristmasActivity.html

@@ -109,274 +109,13 @@
 					<img class="left-ear" src="../static/img/doubleChristmasActivity/left-ear.png" />
 					<img class="right-ear" src="../static/img/doubleChristmasActivity/right-ear.png" />
 					<div class="slider" id="slider">
-						<div class="slider-list flex" id="slider-list">
-							<div class="slider-item">
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-							</div>
-							<div class="slider-item">
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-							</div>
-							<div class="slider-item">
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-							</div>
-							<div class="slider-item">
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-								<div class="reward-row">
-									<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
-									<div class="reward-row-content">
-										<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
-										<div class="reward-day-text">
-											<div class="reward-day">Y2-12567</div>
-											<div class="total-day time-row">
-												<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
-												<span>剩99999天24小时</span>
-											</div>
-										</div>
-										<div class="compute-block">
-											<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
-											<input class="ipt" value="0" maxlength="5" />
-											<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
-										</div>
-									</div>
-								</div>
-							</div>
-						</div>
+						<div class="slider-list flex" id="slider-list"></div>
 					  </div>
 					<div class="page-row">
 						<div class="schedule-line">
 							<div class="schedule-child-line"></div>
 						</div>
-						<div class="page">1/5页</div>
+						<div class="page">1/4页</div>
 					</div>
 					<div class="distribution-reward-btn">
 					    <img class="reward-btn-img" src="../static/img/doubleChristmasActivity/distribution-reward-btn.png" />
@@ -462,12 +201,13 @@
 			let key = arr[0];
 			obj[key] = arr[1];
 		})
+		getLists();
 		//点击立即参与按钮
 		$('.join-activity-btn')[0].addEventListener('click',() => {
 			if(isAndroid){ // 安卓
 				window.native.startPurchase(1,365);
 			}else{
-				window.webkit.messageHandlers.getPackageName.postMessage('noToken');
+				window.webkit.messageHandlers.startPurchase.postMessage(1,365);
 			}
 		})
 		//点击去完成
@@ -475,7 +215,7 @@
 			if(isAndroid){ // 安卓
 				window.native.startPurchase(1,365);
 			}else{
-				window.webkit.messageHandlers.getPackageName.postMessage('noToken');
+				window.webkit.messageHandlers.startPurchase.postMessage(1,365);
 			}
 		})
 		//点击tab选项卡
@@ -621,6 +361,74 @@
 				}
 			})
 		}
+		//获取分配列表数据
+		function getLists(){
+			const sliderLen = Array.from($('.slider-item')).length;
+			if(sliderLen > 4){
+				return
+			}
+			// $.ajax({
+			// 	url: baseUrl + '/api/user/v1/activity/orderRedEnvelopeSharing',
+			// 	type: 'post',
+			// 	headers: {
+			// 		'Authorization': obj.token //id
+			// 	},
+			// 	contentType: "application/json",
+			// 	dataType: 'json',
+			// 	cache: false,
+			// 	success: function (res) {
+			// 		if(res.status === 0){
+			// 			if(res.data && res.data.length > 0){
+							let res = {
+								data:[{
+									shareCount: 0,
+									totalMoney: 0
+								},{
+									shareCount: 0,
+									totalMoney: 0
+								},{
+									shareCount: 0,
+									totalMoney: 0
+								},{
+									shareCount: 0,
+									totalMoney: 0
+								}]
+							}
+							var str = '',
+							    len = res.data.length;
+							for (var i = 0; i < len; i++) {
+								var totalMoney = res.data[i].totalMoney,
+								    shareCount = res.data[i].shareCount;
+								    str += `<div class="reward-row">
+											<img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
+											<div class="reward-row-content">
+												<img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
+												<div class="reward-day-text">
+													<div class="reward-day">Y2-12567</div>
+													<div class="total-day time-row">
+														<img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
+														<span>剩99999天24小时</span>
+													</div>
+												</div>
+												<div class="compute-block">
+													<img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
+													<input class="ipt" type="number" onkeyup="this.value=this.value.replace(/[^0-9]/g,'')" value="0" maxlength="5" />
+													<img class="compute-icon add" src="../static/img/doubleChristmasActivity/add.png" />
+												</div>
+											</div>
+										</div>`
+							}
+							let sliderItemDom = `<div class="slider-item">${str}</div>`;
+							$('#slider-list').append(sliderItemDom);
+			// 			}
+			// 		}else{
+			// 			stopManyClick(() => {
+			// 				toastr.error(res.msg);
+			// 			})
+			// 		}
+			// 	}
+			// })
+		}
 		//埋点
 		operate('dt_双11_h5_活动页面');
 		function operate(pointName,type){