216 lines
9.1 KiB
HTML
216 lines
9.1 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
<html lang="en">
|
|||
|
|
|||
|
<head>
|
|||
|
<meta charset="UTF-8">
|
|||
|
<meta name="viewport"
|
|||
|
content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
|||
|
<title>组合立减金</title>
|
|||
|
<link rel="stylesheet" href="./combining.css">
|
|||
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/vue.min.js?v=20210302151401"
|
|||
|
type="text/javascript" charset="utf-8"></script>
|
|||
|
<script type="text/javascript" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/axios.js?v=1367936144322">
|
|||
|
</script>
|
|||
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/js/api2_0.js"></script>
|
|||
|
</head>
|
|||
|
|
|||
|
<body>
|
|||
|
<div id="app">
|
|||
|
<img @click="backGoodsFn" class="backIcon"
|
|||
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
|
|||
|
|
|||
|
<div class="prompt" :class="promptShow?'proactive':''">
|
|||
|
{{prompt_text}}
|
|||
|
</div>
|
|||
|
|
|||
|
<div class="mask" @touchmove.prevent @mousewheel.prevent v-show="message">
|
|||
|
<div class="model">
|
|||
|
<p class="m-title">温馨提示</p>
|
|||
|
<p class="m-msg">{{message}}</p>
|
|||
|
<button class="m-but" @click="message = ''">知道了</button>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
|
|||
|
<div class="content">
|
|||
|
<div class="logo">
|
|||
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/combining.png" alt="">
|
|||
|
</div>
|
|||
|
<div class="box">
|
|||
|
<div class="box-top">
|
|||
|
<p class="b-t-t">组合立减金</p>
|
|||
|
<p class="time">生效时间:2024-01-01 00:00:00 ~ 2024-01-01 00:00:00</p>
|
|||
|
<p class="time">领取时间:00:00:00 ~ 23:59:59</p>
|
|||
|
</div>
|
|||
|
<div class="box-cotent">
|
|||
|
<p class="b-c-t">
|
|||
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/common_title_sm.png"
|
|||
|
alt="">
|
|||
|
云闪付账号
|
|||
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/common_title_sm.png"
|
|||
|
alt="">
|
|||
|
</p>
|
|||
|
<input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|||
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))" maxlength="11"
|
|||
|
placeholder="请输入账号" v-model="form.confirm">
|
|||
|
<input type="text" onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|||
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))" maxlength="11"
|
|||
|
placeholder="请再次输入账号" v-model="form.receive_account">
|
|||
|
<p class="tips">*温馨提示:单笔交易大于100.1元可减99.99元</p>
|
|||
|
<button class="but" @click="submit">立即领取</button>
|
|||
|
</div>
|
|||
|
<div class="box-footer">
|
|||
|
<p class="b-f-t"> <img
|
|||
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/common_title_sm.png"
|
|||
|
alt="">使用须知 <img
|
|||
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/common_title_sm.png"
|
|||
|
alt=""></p>
|
|||
|
<div class="b-f-i">
|
|||
|
1、会员充值请输入兑换码和手机号码,兑换完成后可用充值的账号登录官方APP进行查询。
|
|||
|
<br />2、会员充值,除本身权益外,不享受其他任何权益,也不赠送其他任何会员。
|
|||
|
<br />3、每个兑换码只能兑换一次且兑换过程中不可更换充值账号,请确认充值账号无误后进行兑换。
|
|||
|
<br />4、兑换前请仔细核对充值的账号,会员充值属虚拟商品,无论是否使用,一旦充值成功,本服务不支持撤销、退货、退款!
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<!-- <div class="flex-but">
|
|||
|
<button class="but">立即领取</button>
|
|||
|
</div> -->
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</body>
|
|||
|
|
|||
|
<script>
|
|||
|
const phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
|
|||
|
const emailReg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
|
|||
|
new Vue({
|
|||
|
el: "#app",
|
|||
|
data () {
|
|||
|
return {
|
|||
|
goods: JSON.parse(sessionStorage.getItem('goodsInfo')),
|
|||
|
backAble: (~~sessionStorage.getItem('goodsCount')) > 1,
|
|||
|
promptShow: false,
|
|||
|
popShow: false,
|
|||
|
is: false,
|
|||
|
cls: null,
|
|||
|
prompt_text: '',
|
|||
|
receive_time: '',
|
|||
|
message: '',
|
|||
|
loading: false,
|
|||
|
form: {
|
|||
|
confirm: null,
|
|||
|
receive_account: null
|
|||
|
}
|
|||
|
};
|
|||
|
},
|
|||
|
|
|||
|
mounted () {
|
|||
|
document.title = localStorage.getItem('title');
|
|||
|
|
|||
|
// /* 初始弹窗 */
|
|||
|
// if (this.goods.available == 8) {
|
|||
|
// this.is = true;
|
|||
|
// this.message=(product_status(this.goods.available, this.goods), 2);
|
|||
|
// }
|
|||
|
},
|
|||
|
|
|||
|
methods: {
|
|||
|
/* 立即领取 */
|
|||
|
submit () {
|
|||
|
const { confirm, receive_account } = this.form;
|
|||
|
if (this.loading) return;
|
|||
|
if (confirm !== receive_account) return this.tips('两次输入账号不一致');
|
|||
|
if ((phoneReg.test(receive_account) || emailReg.test(receive_account))) {
|
|||
|
this.finalSubmit();
|
|||
|
} else {
|
|||
|
this.tips('请输入正确的账号');
|
|||
|
}
|
|||
|
},
|
|||
|
|
|||
|
/* 验证后 最终提交 */
|
|||
|
finalSubmit () {
|
|||
|
this.loading = true;
|
|||
|
const self = this;
|
|||
|
let data = {
|
|||
|
key: localStorage.getItem("key"),
|
|||
|
goods_id: this.goods.entity.goods_id,
|
|||
|
code_batch_id: this.goods.code_batch_id,
|
|||
|
token: localStorage.getItem("token"),
|
|||
|
account: this.form.receive_account
|
|||
|
};
|
|||
|
|
|||
|
/* 创建订单 */
|
|||
|
req.axiosPost("/key/usage", data)
|
|||
|
.then(({ code, data, message }) => {
|
|||
|
if (code == 200) {
|
|||
|
this.verificationYsf(data);
|
|||
|
} else {
|
|||
|
this.axiosErrorFun(code, message, 2);
|
|||
|
}
|
|||
|
})
|
|||
|
.catch((err) => { this.loading = false; });
|
|||
|
},
|
|||
|
|
|||
|
/* 核销支付宝立减金 */
|
|||
|
verificationYsf ({ order_number }) {
|
|||
|
let params = {
|
|||
|
order_number,
|
|||
|
channel: "3", //立减金发放渠道,1:支付宝;2:微信 3:云闪付
|
|||
|
receive_mode: 2, /* 领取方式 1:支付宝 2:H5 */
|
|||
|
channel_user_id: this.form.receive_account,
|
|||
|
};
|
|||
|
req.axiosPost("/voucher/grant", params)
|
|||
|
.then(({ code, message }) => {
|
|||
|
if (code === 200) {
|
|||
|
this.loading = false;
|
|||
|
this.goods.available = 9;
|
|||
|
sessionStorage.setItem('goodsInfo', JSON.stringify(this.goods));
|
|||
|
this.message = '领取成功,请前往【支付宝】-【卡包】中查看';
|
|||
|
} else {
|
|||
|
this.axiosErrorFun(code, message, 2);
|
|||
|
}
|
|||
|
})
|
|||
|
.catch((err) => {
|
|||
|
this.loading = false;
|
|||
|
});
|
|||
|
},
|
|||
|
|
|||
|
/* 返回 */
|
|||
|
backGoodsFn () {
|
|||
|
if (this.backAble) {
|
|||
|
window.location.replace('./homepage.html');
|
|||
|
} else {
|
|||
|
history.go(-2);
|
|||
|
}
|
|||
|
},
|
|||
|
|
|||
|
/* 接口异常处理 */
|
|||
|
axiosErrorFun (code, message, status) {
|
|||
|
this.loading = false;
|
|||
|
if (code == 403) {
|
|||
|
if (this.backAble) {
|
|||
|
this.message = message;
|
|||
|
setTimeout(() => {
|
|||
|
window.location.href = localStorage.getItem('entryLink');
|
|||
|
}, 3000);
|
|||
|
} else {
|
|||
|
this.message = message;
|
|||
|
}
|
|||
|
} else {
|
|||
|
this.message = message;
|
|||
|
}
|
|||
|
},
|
|||
|
|
|||
|
/* 触发提示 */
|
|||
|
tips (text) {
|
|||
|
this.cls && clearTimeout(this.cls);
|
|||
|
this.prompt_text = text;
|
|||
|
this.promptShow = true;
|
|||
|
this.cls = setTimeout(() => {
|
|||
|
this.promptShow = false;
|
|||
|
}, 3000);
|
|||
|
},
|
|||
|
}
|
|||
|
})
|
|||
|
</script>
|
|||
|
|
|||
|
</html>
|