|
|
@@ -4,7 +4,8 @@
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover" />
|
|
|
+ <meta name="viewport"
|
|
|
+ content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover" />
|
|
|
<title>点亮五菱</title>
|
|
|
<!--引入 element-ui 的样式，-->
|
|
|
<link rel="stylesheet"
|
|
|
@@ -114,9 +115,11 @@
|
|
|
margin-right: 10px;
|
|
|
border-radius: 50%;
|
|
|
}
|
|
|
+
|
|
|
.ask_btn img:last-child {
|
|
|
margin-right: 0;
|
|
|
}
|
|
|
+
|
|
|
.activity_box {
|
|
|
width: 100%;
|
|
|
background: #FEE8D0;
|
|
|
@@ -236,11 +239,12 @@
|
|
|
font-size: 14px;
|
|
|
color: #CB4E35;
|
|
|
}
|
|
|
+
|
|
|
.activity_msg p {
|
|
|
margin: 0;
|
|
|
line-height: 24px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.el-dialog {
|
|
|
width: 335px;
|
|
|
border-radius: 20px;
|
|
|
@@ -258,12 +262,17 @@
|
|
|
|
|
|
.prize_form .el-form-item {
|
|
|
padding: 0;
|
|
|
+ margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
.prize_form .el-input__inner {
|
|
|
text-align: left;
|
|
|
}
|
|
|
|
|
|
+ .prize_form .el-form-item__label {
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
.dialog-footer {
|
|
|
text-align: center;
|
|
|
}
|
|
|
@@ -292,7 +301,7 @@
|
|
|
<div class="wl_btn" @click="handleAsk">
|
|
|
<div class="image_wrapper">
|
|
|
<img class="btn_img" src="./img/wl_btn.png" />
|
|
|
- <div class="btn_text">{{lightData.raffle2.leftNum ? '点亮成功，解锁终极大奖' : '邀请好友点亮'}}</div>
|
|
|
+ <div class="btn_text">{{lightData.raffle2.leftNum ? '成功点亮' : '邀请好友点亮'}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -305,38 +314,43 @@
|
|
|
<span>3.完成任务</span>
|
|
|
</div>
|
|
|
<div class="ask_btn">
|
|
|
- <img v-for="item in lightData.wxcpLightenClientList.slice(0, 5)" :key="item.head.id" :src="item.head || require('img/ask_btn.png')" />
|
|
|
+ <img v-for="item in lightData.wxcpLightenClientList.slice(0, 5)" :key="item.head.id"
|
|
|
+ :src="item.head || require('img/ask_btn.png')" />
|
|
|
<div v-if="lightData.wxcpLightenClientList.length < 5">
|
|
|
<img v-for="i in (5-lightData.wxcpLightenClientList.length)" :key="i" src="img/ask_btn.png" />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="activity_box">
|
|
|
- <div class="lottery">
|
|
|
- <div class="award">
|
|
|
- <img class="award_ac" src="img/lottery1.png" />
|
|
|
- <div class="award_tip">
|
|
|
- <div class="award_title">好运抽奖</div>
|
|
|
- <div>每邀{{lightData.wxcpLighten.raffle1ClientNum}}人抽1次奖，最多{{lightData.wxcpLighten.raffle1NumMax}}次</div>
|
|
|
+ <div v-if="lightData.wxcpLighten.raffeSwitch">
|
|
|
+ <div class="lottery">
|
|
|
+ <div class="award">
|
|
|
+ <img class="award_ac" src="img/lottery1.png" />
|
|
|
+ <div class="award_tip">
|
|
|
+ <div class="award_title">好运抽奖</div>
|
|
|
+ <div>每邀{{lightData.wxcpLighten.raffle1ClientNum}}人抽1次奖，最多{{lightData.wxcpLighten.raffle1NumMax}}次</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div v-if="lightData.wxcpLighten.raffle1NumMax === lightData.raffle1.useNum" class="award_btn">已完成</div>
|
|
|
- <div v-else>
|
|
|
- <div v-if="lightData.raffle1.leftNum" class="award_btn_ac" @click="handleLottery(lightData.raffle1BizId)">去抽奖</div>
|
|
|
- <div v-else class="award_btn">未完成</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lottery">
|
|
|
- <div class="award">
|
|
|
- <img class="award_ac" src="img/lottery2.png" />
|
|
|
- <div class="award_tip">
|
|
|
- <div class="award_title">终极大奖</div>
|
|
|
- <div>完全点亮即可抽取终极大奖！</div>
|
|
|
+ <div v-if="lightData.wxcpLighten.raffle1NumMax === lightData.raffle1.useNum" class="award_btn">已完成</div>
|
|
|
+ <div v-else>
|
|
|
+ <div v-if="lightData.raffle1.leftNum" class="award_btn_ac" @click="handleLottery(lightData.raffle1BizId)">
|
|
|
+ 去抽奖</div>
|
|
|
+ <div v-else class="award_btn">未完成</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div v-if="lightData.wxcpLighten.raffle2NumMax === lightData.raffle2.useNum" class="award_btn">已完成</div>
|
|
|
- <div v-else>
|
|
|
- <div v-if="lightData.raffle2.leftNum" class="award_btn_ac" @click="handleLottery(lightData.raffle2BizId)">去抽奖</div>
|
|
|
- <div v-else class="award_btn">未完成</div>
|
|
|
+ <div class="lottery">
|
|
|
+ <div class="award">
|
|
|
+ <img class="award_ac" src="img/lottery2.png" />
|
|
|
+ <div class="award_tip">
|
|
|
+ <div class="award_title">终极大奖</div>
|
|
|
+ <div>完全点亮即可抽取终极大奖！</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="lightData.wxcpLighten.raffle2NumMax === lightData.raffle2.useNum" class="award_btn">已完成</div>
|
|
|
+ <div v-else>
|
|
|
+ <div v-if="lightData.raffle2.leftNum" class="award_btn_ac" @click="handleLottery(lightData.raffle2BizId)">
|
|
|
+ 去抽奖</div>
|
|
|
+ <div v-else class="award_btn">未完成</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="activity_title">活动信息</div>
|
|
|
@@ -350,7 +364,8 @@
|
|
|
<div class="save_btn" @click="showAskDialog = false">长按图片保存</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <el-dialog title="填写信息" :visible.sync="showDialog" :show-close="false" :close-on-click-modal="false" :close-on-press-escape="false">
|
|
|
+ <el-dialog title="填写信息" :visible.sync="showDialog" :show-close="false" :close-on-click-modal="false"
|
|
|
+ :close-on-press-escape="false">
|
|
|
<el-form :model="lightData" class="prize_form" label-position="top">
|
|
|
<el-form-item label="门店">
|
|
|
<el-input v-model="lightData.store"></el-input>
|
|
|
@@ -358,6 +373,10 @@
|
|
|
<el-form-item label="顾问名称" required>
|
|
|
<el-input v-model="lightData.referrer"></el-input>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="领取奖励手机号" required>
|
|
|
+ <el-input type="number" v-model="lightData.referrerPhone"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <div>注意：请您及时前往五菱汽车小程序/App，使用登记的手机号登录/注册，以免影响后续奖励无法发放。</div>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button type="warning" :loading="loading" @click="handleSaveRefer">确 定</el-button>
|
|
|
@@ -368,7 +387,7 @@
|
|
|
<script>
|
|
|
new Vue({
|
|
|
el: '#box',
|
|
|
- data () {
|
|
|
+ data() {
|
|
|
return {
|
|
|
httpUrl: '',
|
|
|
bId: null,
|
|
|
@@ -379,9 +398,11 @@
|
|
|
wxcpLightenClientList: [],
|
|
|
wxcpLighten: {
|
|
|
activityInfo: '',
|
|
|
+ raffeSwitch: 0,
|
|
|
raffle1ClientNum: null,
|
|
|
raffle1NumMax: null, // 抽奖1总次数
|
|
|
raffle2NumMax: null, // 抽奖2总次数
|
|
|
+ type: null,
|
|
|
},
|
|
|
raffle1: {
|
|
|
leftNum: null, // 抽奖1剩余次数
|
|
|
@@ -395,12 +416,13 @@
|
|
|
raffle2BizId: null,
|
|
|
referrer: '', // 顾问名称
|
|
|
store: '', // 门店
|
|
|
+ referrerPhone: '', // 领取奖励手机号
|
|
|
},
|
|
|
showDialog: false, // 填写顾问名称信息弹窗
|
|
|
loading: false, // 提交按钮loading
|
|
|
}
|
|
|
},
|
|
|
- created () {
|
|
|
+ created() {
|
|
|
this.bId = this.getQueryParam('bId')
|
|
|
this.env = this.getQueryParam('env')
|
|
|
if (!this.env || this.env === 'prod') {
|
|
|
@@ -413,7 +435,7 @@
|
|
|
this.ifH5Type()
|
|
|
},
|
|
|
methods: {
|
|
|
- ifH5Type () {
|
|
|
+ ifH5Type() {
|
|
|
if (this.getQueryParam('openId') || localStorage.getItem('openId')) {
|
|
|
if (!this.getQueryParam('externalUserid')) {
|
|
|
this.gerQwAuth(this.bId);
|
|
|
@@ -425,7 +447,7 @@
|
|
|
this.getAuth();
|
|
|
}
|
|
|
},
|
|
|
- getAuth () {
|
|
|
+ getAuth() {
|
|
|
// 获取url上的code
|
|
|
let code = this.getQueryParam('code')
|
|
|
if (code) {
|
|
|
@@ -462,7 +484,7 @@
|
|
|
})
|
|
|
},
|
|
|
// 企微授权
|
|
|
- gerQwAuth (bId) {
|
|
|
+ gerQwAuth(bId) {
|
|
|
let openId = this.getQueryParam('openId') || localStorage.getItem('openId')
|
|
|
fetch(this.httpUrl + `/p/insuite/p/getOAUrl?openId=${openId}&bId=${bId}`)
|
|
|
.then(res => {
|
|
|
@@ -479,7 +501,7 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- lightenShare () {
|
|
|
+ lightenShare() {
|
|
|
let externalUserid = this.getQueryParam('externalUserid')
|
|
|
let openId = this.getQueryParam('openId') || localStorage.getItem('openId')
|
|
|
const headers = new Headers();
|
|
|
@@ -494,7 +516,7 @@
|
|
|
let { data, code, msg } = result
|
|
|
if (code === 1) {
|
|
|
this.lightData = data
|
|
|
- if (!data.referrer) {
|
|
|
+ if (data.wxcpLighten.type === 2 && (!data.referrer || !data.referrerPhone)) {
|
|
|
this.showDialog = true
|
|
|
}
|
|
|
} else {
|
|
|
@@ -504,10 +526,10 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- handleAsk () {
|
|
|
+ handleAsk() {
|
|
|
this.showAskDialog = true
|
|
|
},
|
|
|
- handleLottery (bizId) {
|
|
|
+ handleLottery(bizId) {
|
|
|
let url = ''
|
|
|
if (!this.env || this.env === 'prod') {
|
|
|
url = `https://lottery2.camlook.cn/?bId=${bizId}&h5Type=30`
|
|
|
@@ -516,7 +538,7 @@
|
|
|
}
|
|
|
window.location.replace(url)
|
|
|
},
|
|
|
- handleSaveRefer () {
|
|
|
+ handleSaveRefer() {
|
|
|
if (!this.lightData.referrer) {
|
|
|
this.$message({
|
|
|
message: '请填写顾问名称',
|
|
|
@@ -524,6 +546,13 @@
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
+ if (!this.lightData.referrerPhone) {
|
|
|
+ this.$message({
|
|
|
+ message: '请填写领取奖励手机号',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
this.loading = true
|
|
|
let openId = this.getQueryParam('openId') || localStorage.getItem('openId')
|
|
|
fetch(this.httpUrl + `/scrm/v1/wxcp-lighten-owner/p/updateReferrer?openId=${openId}&bId=${this.bId}`, {
|
|
|
@@ -531,6 +560,7 @@
|
|
|
body: JSON.stringify({
|
|
|
referrer: this.lightData.referrer, // 顾问名称
|
|
|
store: this.lightData.store, // 门店
|
|
|
+ referrerPhone: this.lightData.referrerPhone, // 领取奖励手机号
|
|
|
}),
|
|
|
headers: {
|
|
|
'Content-Type': 'application/json'
|
|
|
@@ -552,7 +582,7 @@
|
|
|
})
|
|
|
},
|
|
|
// 截取url中的数据
|
|
|
- getQueryParam (paramName) {
|
|
|
+ getQueryParam(paramName) {
|
|
|
// 获取当前URL的查询字符串部分
|
|
|
const queryString = window.location.search;
|
|
|
// 创建一个URLSearchParams对象
|
