|
|
@@ -0,0 +1,317 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="zh-CN" style="font-size: 50px;">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <title>投标人专属免费计划</title>
|
|
|
+
|
|
|
+ {{include "/big-member/wx/meta.html"}}
|
|
|
+
|
|
|
+ <!--S-当前页面的css资源-->
|
|
|
+ <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/reset-css/5.0.1/reset.min.css />
|
|
|
+ <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/index.css />
|
|
|
+ <link rel="stylesheet" href=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/icon/local.css />
|
|
|
+ <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/big-member/weixin/css/public.css?v={{Msg "seo" "version"}}'>
|
|
|
+ <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/big-member/weixin/css/j-icons.css?v={{Msg "seo" "version"}}'>
|
|
|
+ <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/common-module/active/2022.7/task-common.css?v={{Msg "seo" "version"}}' />
|
|
|
+ <link rel="stylesheet" href='{{Msg "seo" "cdn"}}/common-module/active/2022.7/task-202207.css?v={{Msg "seo" "version"}}' />
|
|
|
+ <script src='{{Msg "seo" "cdn"}}/big-member/js/rem.js?v={{Msg "seo" "version"}}'></script>
|
|
|
+ <!--E-当前页面的css资源-->
|
|
|
+ <style>
|
|
|
+ .header-banner {
|
|
|
+ margin-top: -0.6rem;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <div class="j-container app">
|
|
|
+ {{include "/big-member/header.html"}}
|
|
|
+ <div class="j-main" id="main-app" v-cloak>
|
|
|
+ <div class="activity-rules-button" id="activity-rules-button" v-show="false" @click="dialogShow('rule', true)">规则</div>
|
|
|
+ <div class="header-banner">
|
|
|
+ <img class="header-banner-img" src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/header-banner.png" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="content-container">
|
|
|
+ <!-- 预热 -->
|
|
|
+ <section class="section no-select section-yure" v-show="yureSectionShow">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="section-header-button">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/title-yure@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-content">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/content-yure@2x.png" alt="">
|
|
|
+ <div class="content-info">
|
|
|
+ <div class="c-info-text" v-html="yureInfo.tipText"></div>
|
|
|
+ <button
|
|
|
+ class="c-info-button section-button button-small"
|
|
|
+ @click="receiveYuReCoupon"
|
|
|
+ :disabled="yureInfo.buttonDisabled"
|
|
|
+ v-show="yureButtonShow"
|
|
|
+ v-text="yureInfo.buttonText"></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ <!-- 更多活动即将开启 -->
|
|
|
+ <div class="section no-select section-more-activities" v-show="yureSectionShow">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="header-text">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/more-fuli-text@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 福利一 -->
|
|
|
+ <div class="section no-select section-fuli1">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="section-header-button">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/title-fuli1@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-content coupon-list">
|
|
|
+ <div
|
|
|
+ v-for="item in couponList"
|
|
|
+ :key="item.id"
|
|
|
+ class="coupon-item">
|
|
|
+ <div class="coupon-title">满<span v-text="item.Full"></span>可用</div>
|
|
|
+ <div class="coupon-value"><span class="num" v-text="item.Reduce">50</span>元</div>
|
|
|
+ <button class="section-button button-small" @click="receiveActiveCoupon([item])" v-text="receiveActiveButtonText(item)"></button>
|
|
|
+ <div class="coupon-text" v-text="item.tipText"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-footer">
|
|
|
+ <button class="section-button button-middle" :disabled="couponList.length === 0" @click="receiveActiveCoupon(couponList)">一键领取</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 福利二 -->
|
|
|
+ <div class="section no-select section-fuli2 progress-section">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="section-header-button">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/title-fuli2@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-content mission-list" ref="missions">
|
|
|
+ <img src="/common-module/active/2022.7/gift-box.png" alt="" class="mission-list-img">
|
|
|
+ <div
|
|
|
+ class="mission-list-item floating"
|
|
|
+ :class="{ complete: item.complete, hide: item.hide, [item.id]: true, [item.className]: true }"
|
|
|
+ v-for="item in missionsList"
|
|
|
+ :id="'bubble-' + item.id"
|
|
|
+ :style="{ left: item.x + 'rem', top: item.y + 'rem' }"
|
|
|
+ @click="onClickReceive('mission', item)"
|
|
|
+ :key="item.id">
|
|
|
+ <div class="m-list-item-bg">
|
|
|
+ <span class="num"><span class="num-add">+</span>${ item.num }</span>
|
|
|
+ <span class="text" v-text="item.unit"></span>
|
|
|
+ <span class="button" :id="'bubble-button--' + item.id">${ item.complete ? '点击领取' : '去完成' }</span>
|
|
|
+ </div>
|
|
|
+ <div class="m-list-item-text" v-text="item.name"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-footer">
|
|
|
+ <div class="progress-bar-container">
|
|
|
+ <div class="progress-bar">
|
|
|
+ <div
|
|
|
+ class="anchor"
|
|
|
+ v-for="a in progressAnchorList"
|
|
|
+ :key="a.rate"
|
|
|
+ :style="{ left: a.rate + '%' }"
|
|
|
+ :class="a.className">
|
|
|
+ <div class="anchor-text">${ a.anchorText }</div>
|
|
|
+ <div class="point-img" v-if="a.pointImg">
|
|
|
+ <img :src="progress.pointImgMap[a.pointImg]" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="anchor-tip-text" v-show="a.tipText && false">
|
|
|
+ <p>免费领</p>
|
|
|
+ <p v-text="a.tipText"></p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="progress-bar-content" :style="{ width: rate + '%' }">
|
|
|
+ <div class="blink-point"></div>
|
|
|
+ <div class="blink-point-text anchor-text" v-show="blinkTextShow">${progress.current}剑鱼币</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="progress-action-list">
|
|
|
+ <button
|
|
|
+ class="progress-action-button"
|
|
|
+ :class="{ pointer: a.className === 'wait' }"
|
|
|
+ :disabled="a.className === 'received'"
|
|
|
+ v-for="(a, index) in progressAnchorList"
|
|
|
+ v-if="a.tipText"
|
|
|
+ :id="'progress-reward--' + a.id"
|
|
|
+ @click="onClickReceive('schedule', a)"
|
|
|
+ :key="index">${a.className === 'received' ? '已' : '免费'}领${a.tipText}</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 福利三 -->
|
|
|
+ <div class="section section-fuli3">
|
|
|
+ <div class="section-header">
|
|
|
+ <div class="section-header-button">
|
|
|
+ <img src="{{Msg "seo" "cdn"}}/common-module/active/2022.7/title-fuli3@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="section-content entniche-card-list">
|
|
|
+ <div class="entniche-card-item shangji"></div>
|
|
|
+ <div class="entniche-card-item zhuanjia"></div>
|
|
|
+ </div>
|
|
|
+ <div class="section-footer">
|
|
|
+ <div class="button-group">
|
|
|
+ <button class="section-button learn-more" @click="toMemberPage">了解更多</button>
|
|
|
+ <button class="section-button button-middle" @click="receiveFuli3">立即体验</button>
|
|
|
+ </div>
|
|
|
+ <div class="text">
|
|
|
+ <p>满足企业多人使用 多场景赋能业务增长</p>
|
|
|
+ <p>详情请致电咨询：400-108-6670</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 顶部悬浮 -->
|
|
|
+ <div class="fixed-top top-timeline" v-show="false">
|
|
|
+ <div class="timeline-list">
|
|
|
+ <div class="timeline-item yure" data-s-class="section-yure" v-show="activeState === 'waiting' || activeState === 'yureing'">
|
|
|
+ <div class="t-left">预热福利</div>
|
|
|
+ <div class="t-right">
|
|
|
+ <div class="t-r-bottom">
|
|
|
+ <div class="t-r-b-l2">7.25-7.31</div>
|
|
|
+ <div class="t-r-b-r2">未开始</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="timeline-item fuli1" data-s-class="section-fuli1">
|
|
|
+ <div class="t-left">福利一</div>
|
|
|
+ <div class="t-right">
|
|
|
+ <div class="t-r-bottom" v-if="activeState === 'waiting' || activeState === 'yureing'">
|
|
|
+ <div class="t-r-b-l">距开始</div>
|
|
|
+ <div class="t-r-b-r" v-text="lastTimeText"></div>
|
|
|
+ </div>
|
|
|
+ <div class="t-r-bottom" v-else>
|
|
|
+ <div class="t-r-b-l2">8.1-8.14</div>
|
|
|
+ <div class="t-r-b-r2" v-text="activeState === 'ended' ? '已结束' : '进行中'"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="timeline-item fuli2" data-s-class="section-fuli2">
|
|
|
+ <div class="t-left">福利二</div>
|
|
|
+ <div class="t-right">
|
|
|
+ <div class="t-r-bottom" v-if="activeState === 'waiting' || activeState === 'yureing'">
|
|
|
+ <div class="t-r-b-l">距开始</div>
|
|
|
+ <div class="t-r-b-r" v-text="lastTimeText"></div>
|
|
|
+ </div>
|
|
|
+ <div class="t-r-bottom" v-else>
|
|
|
+ <div class="t-r-b-l2">8.1-8.14</div>
|
|
|
+ <div class="t-r-b-r2" v-text="activeState === 'ended' ? '已结束' : '进行中'"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="timeline-item fuli3" data-s-class="section-fuli3">
|
|
|
+ <div class="t-left">福利三</div>
|
|
|
+ <div class="t-right">
|
|
|
+ <div class="t-r-bottom" v-if="activeState === 'waiting' || activeState === 'yureing'">
|
|
|
+ <div class="t-r-b-l">距开始</div>
|
|
|
+ <div class="t-r-b-r" v-text="lastTimeText"></div>
|
|
|
+ </div>
|
|
|
+ <div class="t-r-bottom" v-else>
|
|
|
+ <div class="t-r-b-l2">8.1-8.14</div>
|
|
|
+ <div class="t-r-b-r2" v-text="activeState === 'ended' ? '已结束' : '进行中'"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 右侧悬浮 -->
|
|
|
+ <div class="fixed-right">
|
|
|
+ <button class="fixed-action-button" @click="dialogShow('rule', true)">活动<br />规则</button>
|
|
|
+ <button class="fixed-action-button" @click="dialog.myReward = true">我的<br />奖励</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 我的奖励 -->
|
|
|
+ <van-popup
|
|
|
+ v-model="dialog.myReward"
|
|
|
+ closeable
|
|
|
+ position="bottom"
|
|
|
+ class="reward-section"
|
|
|
+ round
|
|
|
+ get-container="body"
|
|
|
+ :style="{ maxHeight: '60%' }">
|
|
|
+ <section class="reward-card-container j-container no-select">
|
|
|
+ <div class="r-header text-gradient-red"><div class="text-gradient-red">我的奖励</div></div>
|
|
|
+ <div class="reward-card j-main section-card">
|
|
|
+ <div class="reward-list" :class="{ empty: rewardList.length === 0 }">
|
|
|
+ <div
|
|
|
+ class="reward-list-item"
|
|
|
+ v-for="item in rewardList"
|
|
|
+ @click="onClickListItem(item)"
|
|
|
+ :key="item.id">
|
|
|
+ <span class="r-l-i-l j-icon-bg" :class="'icon-bg-' + item.icon"></span>
|
|
|
+ <div class="r-l-i-c">
|
|
|
+ <div class="r-l-i-c-t">
|
|
|
+ <span class="reward-text" v-text="item.rewardText"></span>
|
|
|
+ <div class="receive-from" v-text="item.receiveFrom"></div>
|
|
|
+ </div>
|
|
|
+ <div class="receive-time" v-text="item.receiveTime"></div>
|
|
|
+ </div>
|
|
|
+ <div class="r-l-i-action">
|
|
|
+ <van-icon name="arrow"></van-icon>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="reward-empty" v-if="rewardList.length === 0">暂未获得奖励，快去完成任务吧</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ </van-popup>
|
|
|
+ <!--S-弹窗-->
|
|
|
+ <van-popup id="active-tip-modal" v-model="dialog.show" :data-modal-type="dialog.type" :close-on-click-overlay="dialog.type !== 'over'">
|
|
|
+ <div v-show="dialog.type === 'rule'" class="modal-dialog active-tip--rule" :class="{max: getScreenMax}">
|
|
|
+ <h5 class="text-gradient-red">活动规则</h5>
|
|
|
+ <div class="rule-content">
|
|
|
+ <div
|
|
|
+ class="rule-item"
|
|
|
+ v-for="(item, index) in rulesList"
|
|
|
+ :key="index">
|
|
|
+ <div class="rule-index">${ index + 1 }.</div>
|
|
|
+ <div class="rule-text">${ item.text }</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <button @click="dialogShow('rule', false)" id="dialog-button--rule">我知道了</button>
|
|
|
+ <img class="bg-image" src='{{Msg "seo" "cdn"}}/common-module/active/2022.7/dialog-bg-big@2x.png?v={{Msg "seo" "version"}}' alt="扫一扫">
|
|
|
+ </div>
|
|
|
+ <div v-show="dialog.type === 'over'" class="modal-dialog active-tip--over">
|
|
|
+ <div class="close-dialog-icon" @click="dialog.show = false" id="dialog-icon--over" v-if="!forbidClose">
|
|
|
+ <img src='{{Msg "seo" "cdn"}}/common-module/active/2022.5.20/close.png?v={{Msg "seo" "version"}}' alt="x">
|
|
|
+ </div>
|
|
|
+ <h4>活动结束提醒</h4>
|
|
|
+ <img width="148" src='{{Msg "seo" "cdn"}}/common-module/active/2022.5.20/empty.png?v={{Msg "seo" "version"}}' alt="活动已结束">
|
|
|
+ <p>
|
|
|
+ 对不起，该活动已结束
|
|
|
+ <br>
|
|
|
+ 可前往参加“邀请领好礼活动
|
|
|
+ </p>
|
|
|
+ <button @click="onClickReceive('', { id: 'invite' })" id="dialog-button--over">立即前往</button>
|
|
|
+ </div>
|
|
|
+ <div v-show="dialog.type === 'success'" class="modal-dialog active-tip--success">
|
|
|
+ <h5 class="text-gradient-red">领取成功</h5>
|
|
|
+ <p>
|
|
|
+ 恭喜成功领取<i style="font-weight: bold">${dialog.giftMonth}个月</i>超级订阅
|
|
|
+ <br>
|
|
|
+ <span>可在“我的奖励”中查看</span>
|
|
|
+ </p>
|
|
|
+ <button @click="dialogShow('success', false)" id="dialog-button--success">我知道了</button>
|
|
|
+ <img class="bg-image" src='{{Msg "seo" "cdn"}}/common-module/active/2022.7/dialog-bg@2x.png?v={{Msg "seo" "version"}}' alt="领取成功">
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
+ <!--E-弹窗-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <script src=//cdn-common.jianyu360.com/cdn/lib/vue/2.6.11/vue.min.js> </script>
|
|
|
+ <script src=//cdn-common.jianyu360.com/cdn/lib/vant/2.12.24/lib/vant.min.js> </script>
|
|
|
+ <script src=//cdn-common.jianyu360.com/cdn/lib/jquery/3.6.0/jquery.min.js> </script>
|
|
|
+ <script src=//cdn-common.jianyu360.com/cdn/lib/moment/2.29.1/min/moment.min.js></script>
|
|
|
+ {{include "/big-member/commonjs.html"}}
|
|
|
+ <script src='{{Msg "seo" "cdn"}}/common-module/public/js/utils.js?v={{Msg "seo" "version"}}'></script>
|
|
|
+ <script src='{{Msg "seo" "cdn"}}/common-module/active/2022.7/task-202207.js?v={{Msg "seo" "version"}}'></script>
|
|
|
+ {{include "/common/baiducc.html"}}
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|
