|
|
@@ -0,0 +1,825 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="zh-CN">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
|
|
+ <title>双旦活动</title>
|
|
|
+ <link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
|
|
|
+ <link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
|
|
|
+ <link rel="stylesheet" href="../static/css/doubleChristmasActivity.css">
|
|
|
+ <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
|
|
|
+ <script src="../static/js/vender/toastr/toastr.min.js"></script>
|
|
|
+ <script src="../static/js/vender/config.js"></script>
|
|
|
+ <style>
|
|
|
+
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <div class="container">
|
|
|
+ <div class="header-container">
|
|
|
+ <img class="top-banner" src="../static/img/doubleChristmasActivity/top-banner.png" />
|
|
|
+ <div class="activity-meal">活动参与套餐：星曜套餐</div>
|
|
|
+ <div class="meal-price">云机低至<span class="meal-price-num"></span>元/天</div>
|
|
|
+ <div class="rest-time"></div>
|
|
|
+ <div class="limit">PC端用户不参与本次活动</div>
|
|
|
+ </div>
|
|
|
+ <div class="middle-container">
|
|
|
+ <img class="footer-cloud" src="../static/img/doubleChristmasActivity/footer-cloud.png" />
|
|
|
+ <div class="step-container">
|
|
|
+ <img class="tips" src="../static/img/doubleChristmasActivity/tip.png" />
|
|
|
+ <div class="main-step-content">
|
|
|
+ <div class="top-step">
|
|
|
+ <div class="step-item">
|
|
|
+ <img class="buyphone" src="../static/img/doubleElevenActivity/buyphone.png" />
|
|
|
+ <span class="step-text">购买续费云机</span>
|
|
|
+ </div>
|
|
|
+ <img class="step" src="../static/img/doubleElevenActivity/step.png" />
|
|
|
+ <div class="step-item">
|
|
|
+ <img class="hongbao" src="../static/img/doubleChristmasActivity/hongbao.png" />
|
|
|
+ <span class="step-text">累计云机时长</span>
|
|
|
+ </div>
|
|
|
+ <img class="step" src="../static/img/doubleElevenActivity/step.png" />
|
|
|
+ <div class="step-item">
|
|
|
+ <img class="buyphone" src="../static/img/doubleChristmasActivity/buyphone2.png" />
|
|
|
+ <span class="step-text">获取额外奖励</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="join-activity-btn">
|
|
|
+ <img class="join-activity" src="../static/img/doubleElevenActivity/button-join-activity.png" />
|
|
|
+ <div class="activity-btn-content">
|
|
|
+ <span class="activity-btn-text">立即参与</span>
|
|
|
+ <img class="icon-left" src="../static/img/doubleElevenActivity/icon-left.png" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <img class="middle-cloud" src="../static/img/doubleChristmasActivity/middle-cloud.png" />
|
|
|
+ </div>
|
|
|
+ <div class="rest-tip">使用激活码，优惠券和星币支付不参与活动</div>
|
|
|
+ <div class="tab-row">
|
|
|
+ <div class="tab-item tab-active" data-index="0">充值奖励</div>
|
|
|
+ <div class="tab-item" data-index="1">分配奖励（<span class="time-number">0</span>）</div>
|
|
|
+ <img class="tab-bg" src="../static/img/doubleChristmasActivity/tab-bg.png" />
|
|
|
+ </div>
|
|
|
+ <div class="reward-container">
|
|
|
+ <div class="activity-finish">
|
|
|
+ <div class="finish-text">活动已结束</div>
|
|
|
+ </div>
|
|
|
+ <div class="reward-time">
|
|
|
+ <span class="reward-text">购买套餐累计时长</span>
|
|
|
+ <span class="total-time-num"></span>
|
|
|
+ <span class="reward-text">天</span>
|
|
|
+ <span class="next-reward">
|
|
|
+ <span class="time-line">|</span>
|
|
|
+ <span class="reward-text">距离下一个奖励还差</span>
|
|
|
+ <span class="next-time-num"></span>
|
|
|
+ <span class="reward-text">天</span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div class="reward-tip-row">
|
|
|
+ <img class="reward-tip-img" src="../static/img/doubleChristmasActivity/reward-tip-img.png" />
|
|
|
+ <div class="reward-tip">精彩不停的充值福利专场已经来临充值越多折扣越大</div>
|
|
|
+ </div>
|
|
|
+ <div class="reward-list"></div>
|
|
|
+ </div>
|
|
|
+ <div class="distribution-container">
|
|
|
+ <div class="distribution-time">
|
|
|
+ <div>
|
|
|
+ <span class="distribution-text">奖励总时长</span>
|
|
|
+ <span class="distribution-total-num">0</span>
|
|
|
+ <span class="distribution-text">天</span>
|
|
|
+ </div>
|
|
|
+ <span class="distribution-line">|</span>
|
|
|
+ <div>
|
|
|
+ <span class="distribution-text">未分配时长</span>
|
|
|
+ <span class="no-distribution-num">0</span>
|
|
|
+ <span class="distribution-text">天</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="reward-list">
|
|
|
+ <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>
|
|
|
+ </div>
|
|
|
+ <div class="page-row">
|
|
|
+ <div class="schedule-line">
|
|
|
+ <div class="schedule-child-line"></div>
|
|
|
+ </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" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="distribution-container time-container">
|
|
|
+ <div class="time-title-row">
|
|
|
+ <img class="time-title-bg" src="../static/img/doubleChristmasActivity/time-title-bg.png" />
|
|
|
+ <div class="time-title">分配时长记录（已分配时长<span class="time-title-usedDuration"></span>天）</div>
|
|
|
+ </div>
|
|
|
+ <div class="time-list">
|
|
|
+ <div class="title-row">
|
|
|
+ <div>云机名称</div>
|
|
|
+ <div>时间</div>
|
|
|
+ <div>时长</div>
|
|
|
+ </div>
|
|
|
+ <div class="time-row-data"></div>
|
|
|
+ <div class="no-time-data">暂无分配时长</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="rule-container">
|
|
|
+ <img class="rule-tips" src="../static/img/doubleChristmasActivity/rule.png" />
|
|
|
+ <div class="rule-content">
|
|
|
+ <div class="rule-point">一、活动时间：2021年12月18日-2022年1月3日。</div>
|
|
|
+ <div class="rule-point">二、任务奖励与获取说明</div>
|
|
|
+ <div class="rule-point">1.活动期间购买星曜云机达累计天数，可获得相应奖励，同一个账号同一进度的奖励只能领取一次。</div>
|
|
|
+ <div class="rule-point">任务奖励一览：</div>
|
|
|
+ <div class="rule-point">1.1.累积购买天数小于等于2022天时 ，获得对应任务奖励。</div>
|
|
|
+ <div class="rule-point">1.2.累积购买天数大于2022天时，超过2022天的部分按买一送二发放奖励。</div>
|
|
|
+ <div class="rule-point">2.使用星币支付、激活码兑换、优惠劵购买和购买非星曜套餐不计入任务进度。</div>
|
|
|
+ <div class="rule-point">3.奖励获取的云机时长仅可用于续费账号中现有的星曜云机设备。</div>
|
|
|
+ <div class="rule-point blue">4.奖励领取日期为：2021年12月18日-2022年1月6日，超过领取时间未领取奖励则视为放弃任务奖励。</div>
|
|
|
+ <div class="rule-point">5.从他人获取授权的云手机不能分配累计奖励时长。</div>
|
|
|
+ <div class="rule-point">三、其他说明</div>
|
|
|
+ <div class="rule-point">1.本次活动不与其他活动优惠叠加。</div>
|
|
|
+ <div class="rule-point">2.本次活动期间购买的云手机套餐不支持退款。</div>
|
|
|
+ <div class="rule-point">3.双子星官方对活动具有最终解释权。</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="sure-distribution-wrap">
|
|
|
+ <div class="sure-distribution-box">
|
|
|
+ <div class="sure-distribution-title">确定分配奖励时长</div>
|
|
|
+ <div class="sure-distribution-btn-list">
|
|
|
+ <div class="sure-distribution-btn sure-distribution-cannel">取消</div>
|
|
|
+ <div class="sure-distribution-btn sure-distribution-sure">确定</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <script>
|
|
|
+ toastr.options.positionClass = 'toast-center-center';
|
|
|
+ toastr.options.timeOut = '1500';
|
|
|
+ </script>
|
|
|
+ <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
|
|
|
+ <script type="text/javascript">
|
|
|
+ let timer, flag = true;
|
|
|
+ var url = window.location.href;
|
|
|
+ url = url.split('/');
|
|
|
+ var topVal = -0.5;
|
|
|
+ let obj = {};
|
|
|
+ // var baseUrl = 'http://test.androidscloud.com'
|
|
|
+ var loc = window.location.search,
|
|
|
+ n1 = loc.length,//地址的总长度
|
|
|
+ n2 = loc.indexOf("="),//取得=号的位置
|
|
|
+ id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
|
|
|
+ u = navigator.userAgent,
|
|
|
+ ua = navigator.userAgent.toLowerCase(),
|
|
|
+ isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
|
|
|
+ isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
|
|
|
+ isMiniprogram = false;
|
|
|
+ if (ua.match(/MicroMessenger/i) == "micromessenger") {
|
|
|
+ //ios的ua中无miniProgram，但都有MicroMessenger（表示是微信浏览器）
|
|
|
+ wx.miniProgram.getEnv((res) => {
|
|
|
+ if (res.miniprogram) {
|
|
|
+ isMiniprogram = true;
|
|
|
+ } else {
|
|
|
+ isMiniprogram = false;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ isMiniprogram = false;
|
|
|
+ }
|
|
|
+ let tabIndex = 0,
|
|
|
+ userName = '',
|
|
|
+ totalTime = 0,
|
|
|
+ activityState = 0,
|
|
|
+ christmasDoubleReward = 0,
|
|
|
+ currTotalTime = 0,
|
|
|
+ distributionList = [],
|
|
|
+ totalRecords = [],
|
|
|
+ pageNum = 0,
|
|
|
+ distributionFlag = true,
|
|
|
+ distributionPageNum = 0,
|
|
|
+ distributionPages = 0,
|
|
|
+ sliderNumber = 0;//滑块是数量，控制溢出不能滑动
|
|
|
+ getBaseData();
|
|
|
+ getLists();
|
|
|
+ //点击立即参与按钮
|
|
|
+ $('.join-activity-btn')[0].addEventListener('click', () => {
|
|
|
+ if(activityState == 0){
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('活动未开始');
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }else if(activityState == 1){
|
|
|
+ operate('dt_双旦_h5_立即参与');
|
|
|
+ }else if(activityState == 2){
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('活动已结束');
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (isMiniprogram) { // 小程序
|
|
|
+ wx.miniProgram.navigateTo({
|
|
|
+ url: '/packageA/order/buy/index?type=activity'
|
|
|
+ })
|
|
|
+ } else if (isAndroid) { // 安卓
|
|
|
+ window.native.startPurchase(1, 365);
|
|
|
+ } else if (isiOS) {
|
|
|
+ window.webkit.messageHandlers.startPurchase.postMessage({ type: 1, day: 365 });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ //点击去完成
|
|
|
+ $('.reward-list')[0].addEventListener('click', (e) => {
|
|
|
+ if (e.target.className === 'reward-btn') {
|
|
|
+ let receive = e.target.dataset.receive;
|
|
|
+ if (receive !== 'null') {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (isMiniprogram) { // 小程序
|
|
|
+ wx.miniProgram.navigateTo({
|
|
|
+ url: '/packageA/order/buy/index?type=activity'
|
|
|
+ })
|
|
|
+ } else if (isAndroid) { // 安卓
|
|
|
+ window.native.startPurchase(1, 365);
|
|
|
+ } else if (isiOS) {
|
|
|
+ window.webkit.messageHandlers.startPurchase.postMessage({ type: 1, day: 365 });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //点击tab选项卡
|
|
|
+ $('.tab-row')[0].addEventListener('click', (e) => {
|
|
|
+ const index = e.target.dataset.index;
|
|
|
+ if (!index || tabIndex == index) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ tabIndex = index;
|
|
|
+ if (index == 0) {
|
|
|
+ operate('dt_双旦_h5_tab_充值奖励');
|
|
|
+ $('.tab-item')[1].className = 'tab-item';
|
|
|
+ $('.tab-bg')[0].className = 'tab-bg tab-left';
|
|
|
+ $('.reward-container').eq(0).css('display', 'block');
|
|
|
+ $('.distribution-container').eq(0).css('display', 'none');
|
|
|
+ $('.distribution-container').eq(1).css('display', 'none');
|
|
|
+ } else {
|
|
|
+ operate('dt_双旦_h5_tab_分配奖励');
|
|
|
+ $('.tab-item')[0].className = 'tab-item';
|
|
|
+ $('.tab-bg')[0].className = 'tab-bg tab-right';
|
|
|
+ $('.reward-container').eq(0).css('display', 'none');
|
|
|
+ $('.distribution-container').eq(0).css('display', 'block');
|
|
|
+ $('.distribution-container').eq(1).css('display', 'block');
|
|
|
+ }
|
|
|
+ $('.tab-item')[index].className = 'tab-item tab-active';
|
|
|
+ })
|
|
|
+ //获取倒计时
|
|
|
+ function getBaseData() {
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/user/v1/activity/getChristmasActivityConf',
|
|
|
+ type: 'get',
|
|
|
+ headers: {
|
|
|
+ 'Authorization': id //id
|
|
|
+ },
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ getList();
|
|
|
+ const objData = res.data;
|
|
|
+ userName = objData.userName;
|
|
|
+ activityState = objData.activityState;
|
|
|
+ distributionRecord();
|
|
|
+ christmasDoubleReward = objData.christmasDoubleReward;
|
|
|
+ // 解决ios时间显示为NaN
|
|
|
+ objData.now = objData.now.replace(/T/g, ' ');
|
|
|
+ objData.now = objData.now.replace(/\-/g, '/');
|
|
|
+ objData.endTime = objData.endTime.replace(/T/g, ' ');
|
|
|
+ objData.endTime = objData.endTime.replace(/\-/g, '/');
|
|
|
+ $('.meal-price-num').eq(0).text(objData.price);
|
|
|
+ let currTime = parseInt(Date.parse(objData.now)),
|
|
|
+ closeTime = parseInt(Date.parse(objData.endTime)),
|
|
|
+ result = closeTime - currTime,
|
|
|
+ day = parseInt(result / 1000 / 60 / 60 / 24),
|
|
|
+ hour = parseInt(result / 1000 / 60 / 60 % 24),
|
|
|
+ minute = parseInt(result / 1000 / 60 % 60),
|
|
|
+ seconds = parseInt(result / 1000 % 60),
|
|
|
+ time = day + "天" + hour + "时" + minute + "分" + seconds + "秒";
|
|
|
+ if (day == 0 && hour == 0 && minute == 0 && seconds == 0 || objData.activityState == 2) {
|
|
|
+ astr = '活动已结束';
|
|
|
+ $('.activity-finish').eq(0).css('display', 'block');
|
|
|
+ $('.rest-time').eq(0).text(astr);
|
|
|
+ return
|
|
|
+ }else if(objData.activityState == 0){
|
|
|
+ astr = '活动未开始';
|
|
|
+ $('.rest-time').eq(0).text(astr);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const timeInterval = setInterval(() => {
|
|
|
+ if (seconds > 0) {
|
|
|
+ seconds--;
|
|
|
+ } else if (minute > 0) {
|
|
|
+ seconds = 59;
|
|
|
+ minute--;
|
|
|
+ } else if (hour > 0) {
|
|
|
+ minute = 59;
|
|
|
+ seconds = 59;
|
|
|
+ hour--;
|
|
|
+ } else if (day > 0) {
|
|
|
+ hour = 59;
|
|
|
+ minute = 59;
|
|
|
+ seconds = 59;
|
|
|
+ day--;
|
|
|
+ } else {
|
|
|
+ clearInterval(timeInterval);
|
|
|
+ }
|
|
|
+ time = day + "天" + hour + "时" + minute + "分" + seconds + "秒";
|
|
|
+ let str = `距离活动结束：${time}`
|
|
|
+ if (day == 0 && hour == 0 && minute == 0 && seconds == 0 || objData.activityState == 2) {
|
|
|
+ str = '活动已结束';
|
|
|
+ clearInterval(timeInterval);
|
|
|
+ $('.activity-finish').eq(0).css('display', 'block');
|
|
|
+ }
|
|
|
+ $('.rest-time').eq(0).text(str);
|
|
|
+ }, 1000)
|
|
|
+ let str = `距离活动结束：${time}`
|
|
|
+ $('.rest-time').eq(0).text(str);
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+ //调用获取数据列表接口
|
|
|
+ function getList() {
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/user/v1/activity/getReceivingList',
|
|
|
+ type: 'get',
|
|
|
+ headers: {
|
|
|
+ 'Authorization': id //id
|
|
|
+ },
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if (res.status === 0) {
|
|
|
+ if (res.data.open == 2) {
|
|
|
+ $('.activity-finish').eq(0).css('display', 'block');
|
|
|
+ }
|
|
|
+ if (res.data && res.data.operateActivityGoodsInfos.length > 0) {
|
|
|
+ var str = '',
|
|
|
+ flag = true,
|
|
|
+ nextDuration = 0,
|
|
|
+ usedDuration = res.data.usedDuration,
|
|
|
+ rewardDuration = res.data.rewardDuration,
|
|
|
+ totalDuration = res.data.totalDuration,
|
|
|
+ len = res.data.operateActivityGoodsInfos.length;
|
|
|
+ for (var i = 0; i < len; i++) {
|
|
|
+ let rewardDuration = res.data.operateActivityGoodsInfos[i].rewardDuration,
|
|
|
+ receiveDuration = res.data.operateActivityGoodsInfos[i].receiveDuration,
|
|
|
+ cumulativeDuration = res.data.operateActivityGoodsInfos[i].cumulativeDuration;
|
|
|
+ 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="reward-img" src="../static/img/doubleChristmasActivity/reward.png" />
|
|
|
+ <div class="reward-day-text">
|
|
|
+ <div class="reward-day">奖励天数${rewardDuration}天</div>
|
|
|
+ <div class="total-day">购买套餐累计时长达${cumulativeDuration}天</div>
|
|
|
+ </div>
|
|
|
+ <img class="reward-btn" data-receive=${receiveDuration} src="../static/img/doubleChristmasActivity/${receiveDuration ? 'get-btn' : 'finish-btn'}.png" />
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+ if (totalDuration - cumulativeDuration < 0 && flag) {
|
|
|
+ flag = false;
|
|
|
+ nextDuration = cumulativeDuration - totalDuration;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ 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="reward-img" src="../static/img/doubleChristmasActivity/three-reward.png" />
|
|
|
+ <div class="reward-day-text">
|
|
|
+ <div class="reward-day">星曜套餐买一送二</div>
|
|
|
+ <div class="total-day">购买套餐累计时长达高于${christmasDoubleReward}天</div>
|
|
|
+ </div>
|
|
|
+ <img class="reward-btn" data-receive='null' src="../static/img/doubleChristmasActivity/finish-btn.png" />
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+ str += `<div class="reward-last-tip">已获得奖励请在分配奖励栏中进行时长分配</div>`
|
|
|
+ const noDistributionDuration = rewardDuration - usedDuration;
|
|
|
+ $('.reward-list').eq(0).append(str);
|
|
|
+ $('.time-number').eq(0).text(noDistributionDuration);
|
|
|
+ $('.total-time-num').eq(0).text(totalDuration);
|
|
|
+ $('.next-time-num').eq(0).text(nextDuration);
|
|
|
+ $('.distribution-total-num').eq(0).text(rewardDuration);
|
|
|
+ $('.time-title-usedDuration').eq(0).text(usedDuration);
|
|
|
+ totalTime = noDistributionDuration;
|
|
|
+ $('.no-distribution-num').eq(0).text(noDistributionDuration);
|
|
|
+ if(totalDuration >= 2022){
|
|
|
+ $('.next-reward').eq(0).css('display', 'none');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if(res.status === 4104) {
|
|
|
+ let sliderItemDom = `<div class="slider-item no-slider">暂无活动开启</div>`;
|
|
|
+ $('.reward-container').eq(0).append(sliderItemDom);
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 获取分配列表数据
|
|
|
+ function distributionRecord() {
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/user/v1/activity/queryUserDistribution',
|
|
|
+ type: 'get',
|
|
|
+ data:{
|
|
|
+ pageNum: distributionPageNum + 1,
|
|
|
+ pageSize: 10,
|
|
|
+ userName: userName
|
|
|
+ },
|
|
|
+ headers: {
|
|
|
+ 'Authorization': id //id
|
|
|
+ },
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if(res.status === 0){
|
|
|
+ distributionFlag = true;
|
|
|
+ let records = res.data.records;
|
|
|
+ distributionPages = res.data.pages;
|
|
|
+ if(res.data && records.length > 0){
|
|
|
+ var str = '',
|
|
|
+ len = records.length;
|
|
|
+ for (var i = 0; i < len; i++) {
|
|
|
+ var diskName = records[i].diskName,
|
|
|
+ createTime = records[i].createTime,
|
|
|
+ increaseDuration = records[i].increaseDuration;
|
|
|
+ str += `<div class="time-content-row">
|
|
|
+ <div class="time-content-diskName">${diskName}</div>
|
|
|
+ <div class="time-content-time">${createTime.substring(0,4)}年${createTime.substring(5,7)}月${createTime.substring(8,10)}日 ${createTime.substring(11,19)}</div>
|
|
|
+ <div class="time-content-day">${increaseDuration}天</div>
|
|
|
+ </div>`
|
|
|
+ }
|
|
|
+ $('.time-row-data').eq(0).append(str);
|
|
|
+ if (len !== 0) {
|
|
|
+ $('.no-time-data').eq(0).css('display', 'none');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+ //分配列表数据下拉加载
|
|
|
+ $('.time-container')[0].addEventListener('scroll',function () {
|
|
|
+ let scrollTop = $('.time-container')[0].scrollTop;
|
|
|
+ let clientHeight = $('.time-container')[0].clientHeight;
|
|
|
+ let scrollHeight = $('.time-container')[0].scrollHeight;
|
|
|
+ if(scrollTop + clientHeight + 100 > scrollHeight){
|
|
|
+ if(distributionFlag && distributionPageNum < distributionPages){
|
|
|
+ distributionFlag = false;
|
|
|
+ distributionPageNum++;
|
|
|
+ distributionRecord();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // 活动获取用户云机列表，分页
|
|
|
+ function getLists(){
|
|
|
+ const sliderLen = Array.from($('.slider-item')).length;
|
|
|
+ // if(sliderLen != 0 && sliderLen >= sliderNumber){
|
|
|
+ // return
|
|
|
+ // }
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/user/v1/activity/getUserCardPage',
|
|
|
+ type: 'get',
|
|
|
+ data: {
|
|
|
+ pageNum: pageNum + 1,
|
|
|
+ pageSize: 4,
|
|
|
+ phoneType: 'SVIP'
|
|
|
+ },
|
|
|
+ headers: {
|
|
|
+ 'Authorization': id //id
|
|
|
+ },
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if (res.status === 0) {
|
|
|
+ let records = res.data.userCardPage.records;
|
|
|
+ totalRecords = [...totalRecords, ...records];
|
|
|
+ if(records.length === 0){
|
|
|
+ $('.page-row').eq(0).css('display','none');
|
|
|
+ let sliderItemDom = `<div class="slider-item no-slider">暂无可分配的云手机</div>`;
|
|
|
+ $('#slider-list').append(sliderItemDom);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(res.data && records.length > 0){
|
|
|
+ sliderNumber = res.data.userCardPage.pages;
|
|
|
+ let sliderItemText = $('.slider-item').eq(pageNum).text();
|
|
|
+ var str = '',
|
|
|
+ len = records.length;
|
|
|
+ for (var i = 0; i < len; i++) {
|
|
|
+ // 解决ios时间显示为NaN
|
|
|
+ var now = res.data.now.replace(/T/g, ' ');
|
|
|
+ now = now.replace(/\-/g, '/');
|
|
|
+ var exceptTime = records[i].exceptTime.replace(/T/g, ' ');
|
|
|
+ exceptTime = exceptTime.replace(/\-/g, '/');
|
|
|
+ var diskName = records[i].diskName,
|
|
|
+ currTime = parseInt(Date.parse(now)),
|
|
|
+ closeTime = parseInt(Date.parse(exceptTime)),
|
|
|
+ resultTime = closeTime - currTime,
|
|
|
+ day = parseInt(resultTime / 1000 / 60 / 60 / 24),
|
|
|
+ hour = parseInt(resultTime / 1000 / 60 / 60 % 24),
|
|
|
+ time = day + "天" + hour + "时",
|
|
|
+ recordsId = records[i].id;
|
|
|
+ if(day == 0 && hour <= 0){
|
|
|
+ time = '已过期';
|
|
|
+ }
|
|
|
+ if(sliderItemText){
|
|
|
+ $('.reward-diskName').eq(pageNum*4 + i).text(diskName);
|
|
|
+ $('.reward-time-content').eq(pageNum*4 + i).text(time);
|
|
|
+ }
|
|
|
+ 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 reward-diskName">${diskName}</div>
|
|
|
+ <div class="total-day time-row">
|
|
|
+ <img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
|
|
|
+ <span class="reward-time-content ${time === '已过期'?'time-overdue':''}">${time}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="compute-block">
|
|
|
+ <img class="compute-icon cut" data-id=${recordsId} data-index=${i} src="../static/img/doubleChristmasActivity/cut.png" />
|
|
|
+ <input class="ipt" data-id=${recordsId} data-index=${(pageNum)*4 + i} type="number" onkeyup="this.value=this.value.replace(/-/g,'')" value="0" />
|
|
|
+ <img class="compute-icon add" data-id=${recordsId} data-index=${i} src="../static/img/doubleChristmasActivity/add.png" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+
|
|
|
+ }
|
|
|
+ let sliderItemDom = `<div class="slider-item">${str}</div>`;
|
|
|
+ if(!sliderItemText){
|
|
|
+ $('#slider-list').append(sliderItemDom);
|
|
|
+ }else{
|
|
|
+ return
|
|
|
+ }
|
|
|
+ $('.left-ear').eq(0).css('display','block');
|
|
|
+ $('.right-ear').eq(0).css('display','block');
|
|
|
+ $('.distribution-reward-btn').eq(0).css('display','block');
|
|
|
+ $('.schedule-child-line').eq(0).css('width',`${36/sliderNumber}px`);
|
|
|
+ $('.page').eq(0).text(`${pageNum + 1}/${sliderNumber}页`);
|
|
|
+ if(sliderNumber === 1){
|
|
|
+ $('.left-ear').eq(0).css('display','none');
|
|
|
+ $('.right-ear').eq(0).css('display','none');
|
|
|
+ $('.page-row').eq(0).css('display','none');
|
|
|
+ $('.distribution-reward-btn').eq(0).css('margin-top','20px');
|
|
|
+ }
|
|
|
+ for (var i = 0; i < len; i++) {
|
|
|
+ iptIndex = (pageNum) * 4 + parseInt(i);
|
|
|
+ $('.ipt')[iptIndex].oninput = function (e) {
|
|
|
+ const id = e.target.dataset.id;
|
|
|
+ let oldDuration = 0;
|
|
|
+ let preTotalTime = 0;
|
|
|
+ let index = e.target.dataset.index;
|
|
|
+ let value = $('.ipt').eq(index).val();
|
|
|
+ if(value.length >= 5){
|
|
|
+ value = value.substr(0, 5);
|
|
|
+ }
|
|
|
+ console.log('value',value)
|
|
|
+ var position = String(value).indexOf(".");//获取小数点的位置
|
|
|
+ if(position != -1){
|
|
|
+ value = value.substr(0, position);
|
|
|
+ }
|
|
|
+ distributionList.map(item => { // 上一次的总数据
|
|
|
+ preTotalTime += parseInt(item.duration);
|
|
|
+ })
|
|
|
+ //这一次操作
|
|
|
+ if(value == 0){
|
|
|
+ if(!distributionList.find((item) => item.cardId == id)){
|
|
|
+ distributionList.push({
|
|
|
+ cardId: id,
|
|
|
+ duration: +value
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ distributionList = distributionList.filter(item => item.cardId != id);
|
|
|
+ }
|
|
|
+ distributionList = distributionList.filter(item => item.duration != 0);
|
|
|
+ }else{
|
|
|
+ if(!distributionList.find((item) => item.cardId == id)){
|
|
|
+ distributionList.push({
|
|
|
+ cardId: id,
|
|
|
+ duration: Math.abs(value)
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ distributionList.map(item => {
|
|
|
+ if (item.cardId == id) {
|
|
|
+ oldDuration = item.duration;
|
|
|
+ item.duration = +value;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ currTotalTime = 0;
|
|
|
+ distributionList.map(item => { // 这一次的总数据
|
|
|
+ currTotalTime += parseInt(item.duration);
|
|
|
+ })
|
|
|
+ if(currTotalTime > totalTime){ // 当前已分配大于总分配时长
|
|
|
+ let val = totalTime - preTotalTime + oldDuration;
|
|
|
+ distributionList.map(item => {
|
|
|
+ if (item.cardId == id) {
|
|
|
+ item.duration = val;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ $('.ipt').eq(index).val(val);
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('分配时长不能大于未分配总时长');
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ console.log(distributionList)
|
|
|
+ if(value.length > 5) value=value.slice(0, 5);
|
|
|
+ $('.ipt').eq(index).val(value);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ //点击分配时长按钮
|
|
|
+ $('.distribution-reward-btn')[0].addEventListener('click', (e) => {
|
|
|
+ distributionList = distributionList.filter(item => item.duration != 0);
|
|
|
+ if (distributionList.length === 0) {
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('未选中任何云手机');
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ $('.sure-distribution-wrap').eq(0).css('display', 'block');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //点击分配时长取消按钮
|
|
|
+ $('.sure-distribution-cannel')[0].addEventListener('click', (e) => {
|
|
|
+ operate('dt_双旦_h5_分配奖励_取消');
|
|
|
+ $('.sure-distribution-wrap').eq(0).css('display', 'none');
|
|
|
+ });
|
|
|
+ //点击分配时长确定按钮
|
|
|
+ $('.sure-distribution-sure')[0].addEventListener('click', (e) => {
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/user/v1/activity/distributeRewardDuration',
|
|
|
+ type: 'post',
|
|
|
+ data: JSON.stringify(distributionList),
|
|
|
+ headers: {
|
|
|
+ 'Authorization': id //id
|
|
|
+ },
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if(res.status === 0){
|
|
|
+ operate('dt_双旦_h5_分配奖励_确定');
|
|
|
+ $('.sure-distribution-wrap').eq(0).css('display', 'none');
|
|
|
+ $('.reward-list').eq(0).text('');
|
|
|
+ getList();
|
|
|
+ getLists();
|
|
|
+ distributionPageNum = 0;
|
|
|
+ $('.time-row-data').eq(0).text('');
|
|
|
+ distributionRecord();
|
|
|
+ distributionList.map((val) => {
|
|
|
+ totalRecords.map((item, indexs) => {
|
|
|
+ if(val.cardId == item.id){
|
|
|
+ $('.ipt').eq(indexs).val(0);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ distributionList = [];
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('分配成功，请前往云机列表查看');
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ })
|
|
|
+ });
|
|
|
+ //点击加号
|
|
|
+ $('.slider-list')[0].addEventListener('click',(e) => {
|
|
|
+ if(e.target.className === 'compute-icon add'){
|
|
|
+ const id = e.target.dataset.id;
|
|
|
+ let currTotalTime = 0;
|
|
|
+ let index = e.target.dataset.index;
|
|
|
+ index = (pageNum)*4 + parseInt(index);
|
|
|
+ let number = $('.ipt').eq(index).val();
|
|
|
+ // 这一次操作
|
|
|
+ if(number == 0){
|
|
|
+ if(!distributionList.find((item) => item.cardId == id)){
|
|
|
+ distributionList.push({
|
|
|
+ cardId: id,
|
|
|
+ duration: +number + 1
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ distributionList.map(item => {
|
|
|
+ if(item.cardId == id){
|
|
|
+ item.duration++;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ distributionList.map(item => {
|
|
|
+ if(item.cardId == id){
|
|
|
+ item.duration++;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ distributionList.map(item => { // 这一次的总数据
|
|
|
+ currTotalTime += parseInt(item.duration);
|
|
|
+ })
|
|
|
+ console.log(currTotalTime)
|
|
|
+ console.log(totalTime)
|
|
|
+ if(currTotalTime <= totalTime){
|
|
|
+ number++;
|
|
|
+ $('.ipt').eq(index).val(number);
|
|
|
+ }else{
|
|
|
+ distributionList.map(item => {
|
|
|
+ if(item.cardId == id){
|
|
|
+ item.duration = +number;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('分配时长不能大于未分配总时长');
|
|
|
+ })
|
|
|
+ }
|
|
|
+ console.log(distributionList)
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //点击减号
|
|
|
+ $('.slider-list')[0].addEventListener('click',(e) => {
|
|
|
+ if(e.target.className === 'compute-icon cut'){
|
|
|
+ const id = e.target.dataset.id;
|
|
|
+ let index = e.target.dataset.index;
|
|
|
+ index = (pageNum)*4 + parseInt(index);
|
|
|
+ let number = $('.ipt').eq(index).val();
|
|
|
+ if(number > 0){
|
|
|
+ distributionList.map(item => {
|
|
|
+ if(item.cardId == id){
|
|
|
+ item.duration--;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ number--;
|
|
|
+ if(number == 0){
|
|
|
+ distributionList = distributionList.filter(item => item.cardId != id);
|
|
|
+ }
|
|
|
+ currTotalTime--;
|
|
|
+ $('.ipt').eq(index).val(number);
|
|
|
+ }else{
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error('分配的时长不能小于0');
|
|
|
+ })
|
|
|
+ }
|
|
|
+ console.log(distributionList)
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ //埋点
|
|
|
+ operate('dt_双旦_h5_活动首页');
|
|
|
+ function operate(pointName, type) {
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
|
|
|
+ type: 'post',
|
|
|
+ data: JSON.stringify({
|
|
|
+ pointName: pointName
|
|
|
+ }),
|
|
|
+ contentType: "application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+
|
|
|
+ },
|
|
|
+ })
|
|
|
+ }
|
|
|
+ //防止提示一秒内重复显示
|
|
|
+ function stopManyClick(fn) {
|
|
|
+ if (flag) {
|
|
|
+ fn();
|
|
|
+ }
|
|
|
+ flag = false;
|
|
|
+ if (timer) { clearTimeout(timer); }
|
|
|
+ timer = setTimeout(() => { flag = true }, 1500);
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+ <script src="../static/js/vender/move.js"></script>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|
heyang
