Browse Source

调整活动相关问题

heyang 3 years ago
parent
commit
7a9a0cedb6

+ 20 - 7
microserviceUserH5/static/css/anniversaryCelebrate.css

@@ -407,7 +407,7 @@ ul, li {
   padding-bottom: 0.3rem;
   padding-bottom: 0.3rem;
 }
 }
 
 
-.page-number{
+.page-number,.page-numbers{
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   font-size: 0.24rem;
   font-size: 0.24rem;
@@ -416,7 +416,7 @@ ul, li {
   z-index: 99;
   z-index: 99;
 }
 }
 
 
-.page-number-text{
+.page-number-text,.page-number-texts{
   margin: 0 0.2rem;
   margin: 0 0.2rem;
 }
 }
 
 
@@ -434,18 +434,19 @@ ul, li {
 }
 }
 
 
 .page-row-record-wrap{
 .page-row-record-wrap{
+  position: fixed;
+  left: 50%;
+  bottom: 0.1rem;
+  transform: translateX(-50%);
   margin-top: 0.1rem;
   margin-top: 0.1rem;
 }
 }
 
 
-.left-head,.right-head{
+.left-head,.right-head,.left-heads,.right-heads{
   width: 0.12rem;
   width: 0.12rem;
   height: 0.15rem;
   height: 0.15rem;
-}
-
-.left-head,.right-head{
   opacity: 0.2;
   opacity: 0.2;
 }
 }
-.left-head-show,.right-head-show{
+.left-head-show,.right-head-show,.left-head-shows,.right-head-shows{
   opacity: 1;
   opacity: 1;
 }
 }
 
 
@@ -811,6 +812,18 @@ ul, li {
   color: #B3B3B3;
   color: #B3B3B3;
 }
 }
 
 
+.share-wrap{
+  position: fixed;
+  top: 6.8rem;
+  right: 0;
+  z-index: 9999;
+}
+
+.share-img{
+  width: 0.7rem;
+  height: 0.8rem;
+}
+
 #toast-container>.toast-error {
 #toast-container>.toast-error {
   background-image: none !important;
   background-image: none !important;
 }
 }

BIN
microserviceUserH5/static/img/anniversaryCelebrate/left-heads.png


BIN
microserviceUserH5/static/img/anniversaryCelebrate/right-heads.png


BIN
microserviceUserH5/static/img/anniversaryCelebrate/share-bg.png


BIN
microserviceUserH5/static/img/anniversaryCelebrate/share.png


+ 150 - 22
microserviceUserH5/vcloud/anniversaryCelebrate.html

@@ -148,13 +148,7 @@
 					<div class="btn-wrap">
 					<div class="btn-wrap">
 						<div class="page-row-wrap">
 						<div class="page-row-wrap">
 							<img class="left-head" src="../static/img/anniversaryCelebrate/left-head.png" />
 							<img class="left-head" src="../static/img/anniversaryCelebrate/left-head.png" />
-							<div class="page-number">
-								<!-- <div class="page-number-text select-page-number" data-index="0" data-num="1">1</div>
-								<div class="page-number-text" data-index="1" data-num="2">2</div>
-								<div class="page-number-text" data-index="2" data-num="3">3</div>
-								<div class="page-number-text" data-index="3" data-num="4">4</div>
-								<div class="page-number-text" data-index="4" data-num="5">5</div> -->
-							</div>
+							<div class="page-number"></div>
 							<img class="right-head right-head-show" src="../static/img/anniversaryCelebrate/right-head.png" />
 							<img class="right-head right-head-show" src="../static/img/anniversaryCelebrate/right-head.png" />
 						</div>
 						</div>
 						<div class="distribution-reward-btn">
 						<div class="distribution-reward-btn">
@@ -286,19 +280,17 @@
 					</div>
 					</div>
 					<div class="distribution-list"></div>
 					<div class="distribution-list"></div>
 					<div class="page-row-wrap page-row-record-wrap">
 					<div class="page-row-wrap page-row-record-wrap">
-						<img class="left-head" src="../static/img/anniversaryCelebrate/left-head.png" />
-						<div class="page-number">
-							<div class="page-number-text">1</div>
-							<div class="page-number-text">2</div>
-							<div class="page-number-text">3</div>
-							<div class="page-number-text">4</div>
-						</div>
-						<img class="right-head" src="../static/img/anniversaryCelebrate/right-head.png" />
+						<img class="left-heads" src="../static/img/anniversaryCelebrate/left-heads.png" />
+						<div class="page-numbers"></div>
+						<img class="right-heads" src="../static/img/anniversaryCelebrate/right-heads.png" />
 					</div>
 					</div>
 				</div>
 				</div>
 				<img class="distribution-close" src="../static/img/anniversaryCelebrate/close.png" />
 				<img class="distribution-close" src="../static/img/anniversaryCelebrate/close.png" />
 			</div>
 			</div>
 		</div>
 		</div>
+		<div class="share-wrap">
+			<img class="share-img" src="../static/img/anniversaryCelebrate/share.png" />
+		</div>
 	</div>
 	</div>
 	<script>
 	<script>
 		toastr.options.positionClass = 'toast-center-center';
 		toastr.options.positionClass = 'toast-center-center';
@@ -339,6 +331,8 @@
 		    distributionFlag = true,
 		    distributionFlag = true,
 		    distributionPageNum = 1,
 		    distributionPageNum = 1,
 		    distributionPages = 0,
 		    distributionPages = 0,
+			pageIndexs = 0,
+			code = '',
 		    sliderNumber = 0,//滑块是数量,控制溢出不能滑动
 		    sliderNumber = 0,//滑块是数量,控制溢出不能滑动
 			isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
 			isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
 		if (ua.match(/MicroMessenger/i) == "micromessenger") {
 		if (ua.match(/MicroMessenger/i) == "micromessenger") {
@@ -479,6 +473,10 @@
 			handleAward(awardTimes,'report')
 			handleAward(awardTimes,'report')
 		},false);
 		},false);
 		function handleAward(times,type) {
 		function handleAward(times,type) {
+			if(!id){
+				download();
+				return
+			}
 			awardTimes = times;
 			awardTimes = times;
 			animationFlag = false;
 			animationFlag = false;
 			$.ajax({
 			$.ajax({
@@ -735,6 +733,10 @@
 		//点击获取次数
 		//点击获取次数
 		$('.get-times')[0].addEventListener('click',getTimeHandle,false);
 		$('.get-times')[0].addEventListener('click',getTimeHandle,false);
 		function getTimeHandle() {
 		function getTimeHandle() {
+			if(!id){
+				download();
+				return
+			}
 		    operate('znq_2022_h5_获取次数按钮');
 		    operate('znq_2022_h5_获取次数按钮');
 			stopManyClick(() =>{
 			stopManyClick(() =>{
 				if (isMiniprogram) { // 小程序
 				if (isMiniprogram) { // 小程序
@@ -825,14 +827,14 @@
 									resultTime = closeTime - currTime,
 									resultTime = closeTime - currTime,
 									day = parseInt(resultTime / 1000 / 60 / 60 / 24),
 									day = parseInt(resultTime / 1000 / 60 / 60 / 24),
 									hour = parseInt(resultTime / 1000 / 60 / 60 % 24),
 									hour = parseInt(resultTime / 1000 / 60 / 60 % 24),
-									time = day + "天" + hour + "时",
+									time = "剩" + day + "天" + hour + "时",
 								    recordsId = records[i].id;
 								    recordsId = records[i].id;
 									if(day == 0 && hour <= 0){
 									if(day == 0 && hour <= 0){
 										time = '已过期';
 										time = '已过期';
 									}
 									}
 									if(sliderItemText){
 									if(sliderItemText){
-										$('.reward-diskName').eq(pageNums*4 + i).text(diskName);
-										$('.reward-time-content').eq(pageNums*4 + i).text(time);
+										$('.reward-diskName').eq(i).text(diskName);
+										$('.reward-time-content').eq(i).text(time);
 									}
 									}
 								str += `<div class="reward-row">
 								str += `<div class="reward-row">
 										<div class="reward-row-content">
 										<div class="reward-row-content">
@@ -1081,6 +1083,70 @@
 			}
 			}
 			getLists();
 			getLists();
 		});
 		});
+		//点击页码
+		$('.page-numbers')[0].addEventListener('click',(e) => {
+			if(e.target.className == 'page-number-texts'){
+				$('.page-number-texts')[pageIndexs].className = 'page-number-texts';
+				pageIndexs = parseInt(e.target.dataset.index);
+				$('.page-number-texts')[pageIndexs].className = 'page-number-texts select-page-numbers';
+				distributionPageNum = parseInt(e.target.dataset.num);
+				getTimeRecord();
+			}
+		});
+		//点击左边
+		$('.left-heads')[0].addEventListener('click',(e) => {
+			if(distributionPageNum <= 5) {
+				return
+			}
+			$('.right-heads')[0].className = 'right-heads right-head-shows';
+			if(distributionPageNum <= 1) {
+				$('.left-heads')[0].className = 'left-heads';
+				return
+			} else {
+				$('.left-heads')[0].className = 'left-heads left-head-shows';
+			}
+			$('.page-numbers').eq(0).empty();
+			distributionPageNum -= 5;
+			pageIndexs = 0;
+			let str = '';
+			distributionPageNum = Math.floor(distributionPageNum/6) * 5 + 1;
+			for (var i = 0; i < 5; i++) {
+				str += `<div class="page-number-texts" data-index="${i}" data-num="${distributionPageNum + i}">${distributionPageNum + i}</div>`
+			}
+			$('.page-numbers').eq(0).append(str);
+			$('.page-number-texts')[0].className = 'page-number-texts select-page-numbers';
+			if(distributionPageNum <= 1) {
+				$('.left-heads')[0].className = 'left-heads';
+			}
+			getTimeRecord();
+		});
+		//点击右边
+		$('.right-heads')[0].addEventListener('click',(e) => {
+			if(distributionPageNum <= 5) {
+				return
+			}
+			$('.left-heads')[0].className = 'left-heads left-head-shows';
+			if(distributionPageNum + 5 >= sliderNumber) {
+				$('.right-heads')[0].className = 'right-heads';
+				return
+			} else {
+				$('.right-heads')[0].className = 'right-heads right-head-shows';
+			}
+			$('.page-numbers').eq(0).empty();
+			distributionPageNum += 5;
+			pageIndexs = 0;
+			let str = '';
+			distributionPageNum = Math.floor(distributionPageNum/6) * 5 + 1;
+			for (var i = 0; i < 5; i++) {
+				str += `<div class="page-number-texts" data-index="${i}" data-num="${distributionPageNum + i}">${distributionPageNum + i}</div>`
+			}
+			$('.page-numbers').eq(0).append(str);
+			$('.page-number-texts')[0].className = 'page-number-texts select-page-numbers';
+			if(distributionPageNum + 5 >= sliderNumber) {
+				$('.right-heads')[0].className = 'right-heads';
+			}
+			getTimeRecord();
+		});
 		//点击分配时长按钮
 		//点击分配时长按钮
 		$('.distribution-reward-btn')[0].addEventListener('click', (e) => {
 		$('.distribution-reward-btn')[0].addEventListener('click', (e) => {
 			if(e.target.className != 'reward-btn-img'){
 			if(e.target.className != 'reward-btn-img'){
@@ -1149,6 +1215,10 @@
 			$('.distribution-time-mask').show();
 			$('.distribution-time-mask').show();
 			document.documentElement.style.overflow='hidden';
 			document.documentElement.style.overflow='hidden';
 			$('.distribution-list').eq(0).empty();
 			$('.distribution-list').eq(0).empty();
+			getTimeRecord();
+		});
+		//分配时长记录
+		function getTimeRecord(){
 			$.ajax({
 			$.ajax({
 				url: baseUrl + '/api/activity/v1/anniversary/receiveData',
 				url: baseUrl + '/api/activity/v1/anniversary/receiveData',
 				type: 'get',
 				type: 'get',
@@ -1166,6 +1236,10 @@
 				success: function (res) {
 				success: function (res) {
 					if(res.status === 0){
 					if(res.status === 0){
 						let records = res.data.records, str = '', strs = '';
 						let records = res.data.records, str = '', strs = '';
+						let pages = res.data.pages;
+						let currPages = pages >= 5 ? 5 : pages;
+						$('.distribution-list').eq(0).empty();
+						$('.page-numbers').eq(0).empty();
 						for (var i = 0; i < records.length; i++) {
 						for (var i = 0; i < records.length; i++) {
 							str += `<div class="distribution-content-wrap">
 							str += `<div class="distribution-content-wrap">
 										<div class="distribution-content-name">${records[i].diskName}</div>
 										<div class="distribution-content-name">${records[i].diskName}</div>
@@ -1174,10 +1248,15 @@
 									</div>`
 									</div>`
 						}
 						}
 						$('.distribution-list').eq(0).append(str)
 						$('.distribution-list').eq(0).append(str)
-						for (var i = 0; i < 4; i++) {
-							strs += `<div class="page-number-text">${i}</div>`
+						for (var i = 0; i < currPages; i++) {
+							strs += `<div class="page-number-texts" data-index="${i}" data-num="${distributionPageNum + i}">${distributionPageNum + i}</div>`
+						}
+						$('.page-numbers').eq(0).append(strs)
+						$('.page-number-texts')[0].className = 'page-number-texts select-page-numbers';
+						if(pageNums <= 5) {
+							$('.left-heads')[0].className = 'left-heads';
+							$('.right-heads')[0].className = 'right-heads';
 						}
 						}
-						$('.page-number').eq(1).append(strs)
 					}else{
 					}else{
 						stopManyClick(() =>{
 						stopManyClick(() =>{
 							toastr.error(res.msg)
 							toastr.error(res.msg)
@@ -1186,7 +1265,56 @@
 					
 					
 				},
 				},
 			})
 			})
-		});
+		}
+		$('.share-wrap')[0].addEventListener('click',() => {
+			if (isAndroid) {
+				window.native.share('双子星云手机闪曜周年庆!大礼回馈,最高免费赠送188天!', '双子星云手机闪曜周年庆!大礼回馈,最高免费赠送188天!', `${baseUrl}/h5/microserviceUserH5/vcloud/anniversaryCelebrate.html`, '../static/img/anniversaryCelebrate/share-bg.png')
+			} else if (isIOS) {
+				window.webkit.messageHandlers.share.postMessage({
+					title: '双子星云手机闪曜周年庆!大礼回馈,最高免费赠送188天!',
+					content: '双子星云手机闪曜周年庆!大礼回馈,最高免费赠送188天!',
+					gotoUrl: `${baseUrl}/h5/microserviceUserH5/vcloud/anniversaryCelebrate.html`,
+					shareImg: '../static/img/anniversaryCelebrate/share-bg.png'
+				});
+			} else {
+				code = window.Location.href;
+				copyUrl();
+			}
+		},false);
+		function download() {
+            if(window.__wxjs_environment === 'miniprogram'){
+				wx.miniProgram.navigateTo({
+					url: '/pages/home/home'
+				})
+			} else if (isAndroid) {
+                if (baseUrl.includes('prese.phone.androidscloud.com')) {
+                    window.location.href = 'http://14.18.190.144:18888/suanchou'
+                } else {
+                    window.location.href = 'http://www.androidscloud.com/suanchou?timestamp=' + Math.random();
+                }
+            } else if (isIOS) {
+                document.location.href = 'https://www.pgyer.com/gemini6?timestamp=' + Math.random();
+            } else {
+                document.location.href = 'https://www.androidscloud.com?timestamp=' + Math.random();
+            }
+        }
+		function copyUrl() {
+            var oInput = document.createElement('input'); //创建一个input
+            oInput.setAttribute("readonly", "readonly"); //设置只读,否则移动端使用复制功能时可能会造成软件盘弹出
+            setTimeout(() => {
+                oInput.value = code;
+                document.body.appendChild(oInput)
+                selectText(oInput, 0, oInput.value.length);
+                document.execCommand("Copy"); // 执行浏览器复制命令
+                toastr.error(`复制成功`);
+                $('.dialog').animate({top: '-6.96rem'},"fast");
+                $('.mask').hide();
+                document.documentElement.style.overflow='auto';
+                oInput.style.display = 'none'; // 将input隐藏
+                oInput.blur();
+                oInput.remove(); // 将input销毁
+            }, 400)
+        };
 		//点击分配时长关闭按钮
 		//点击分配时长关闭按钮
 		$('.distribution-close')[0].addEventListener('click',() => {
 		$('.distribution-close')[0].addEventListener('click',() => {
 			$('.distribution-time-dialog').animate({top: '-10.96rem'},"fast");
 			$('.distribution-time-dialog').animate({top: '-10.96rem'},"fast");