mobileclient/redPackets.html

197 lines
7.8 KiB
HTML
Raw Normal View History

2023-06-02 10:31:24 +08:00
<!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,viewport-fit=cover" />
<title>现金红包领取</title>
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/vue.min.js?v=1367936144322" 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>
2023-06-02 10:31:24 +08:00
<link rel="stylesheet" href="./redPackets.css" />
2023-06-20 11:08:36 +08:00
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/modelPop.js"></script>
2023-06-02 10:31:24 +08:00
<style>
* {
margin: 0 auto;
padding: 0;
font-family: HYQiHei;
}
html {
font-size: 26.66666667vw;
}
body {
-webkit-text-size-adjust: 100% !important;
text-size-adjust: 100% !important;
-moz-text-size-adjust: 100% !important;
2023-06-20 11:08:36 +08:00
font-size: .14rem;
2023-06-02 10:31:24 +08:00
}
</style>
</head>
<body>
<div id='redPacketsViews'>
2023-06-20 11:08:36 +08:00
<img @click="backGoodsFn" v-if="backAble" class="backIcon"
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
<div class="prompt" :class="promptShow?'proactive':''">
复制成功,请到浏览器打开
</div>
<!-- 弹出提示 -->
<model-pop :show.sync="popShow" :title="popTitle" :status="popStatus" :text="popText" :bottom_text="popBt"
@backFunction="copyFn"></model-pop>
<!-- 单条弹出框 -->
2023-06-02 10:31:24 +08:00
<div class="box">
<div class='top'>
2023-06-20 11:08:36 +08:00
<p class="title">{{goodsInfo.entity.batch_goods_name}}</p>
2023-06-02 10:31:24 +08:00
<p class='effect_date'>
2023-06-20 11:08:36 +08:00
<span>红包有限期截止 {{goodsInfo.entity.end_time}}</span>
2023-06-02 10:31:24 +08:00
</p>
<p class='money'>
<span class='tag'></span>
2023-06-20 11:08:36 +08:00
<span>{{goodsInfo.entity.cash_amount_type==='1'?parseFloat(goodsInfo.entity.denomination)
:`${parseFloat(goodsInfo.entity.min_denomination)}~${parseFloat(goodsInfo.entity.max_denomination)}`}}</span>
2023-06-02 10:31:24 +08:00
</p>
<p class='type'>
2023-06-20 11:08:36 +08:00
<span>{{goodsInfo.entity.cash_amount_type==='1'?'固额红包':'随机红包'}}</span>
2023-06-02 10:31:24 +08:00
</p>
2023-06-20 11:08:36 +08:00
<p class="bt" @click="receive">
2023-06-02 10:31:24 +08:00
<img src='https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_btn_receive.png'
alt='' />
</p>
</div>
<div class='instruction'>
<div class='instruction-1'>
<p class='center'>
<img class='notice'
src='https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_title_notice.png'
alt='' />
</p>
2023-06-20 11:08:36 +08:00
<p class='scroll' v-html="goodsInfo.entity.instruction"></p>
2023-06-02 10:31:24 +08:00
</div>
</div>
</div>
</div>
</body>
<script>
2023-06-20 11:08:36 +08:00
new Vue({
el: "#redPacketsViews",
data () {
return {
promptShow: false,
popShow: false,
popTitle: '温馨提示',
popText: '请点击下方[复制]按钮,复制链接到浏览器打开!',
popStatus: 1, /*1 成功 2提示 3失败 */
popBt: '点击复制',
copyLink: '',
goodsInfo: JSON.parse(sessionStorage.getItem('goodsInfo')),
backAble: sessionStorage.getItem('goodsCount') > 0,
};
},
components: {
modelPop
},
methods: {
/* 立即领取 */
receive () {
let data = {
key: localStorage.getItem("key"),
goods_id: this.goodsInfo.entity.goods_id,
code_batch_id: this.goodsInfo.code_batch_id,
token: localStorage.getItem("token"),
};
req.axiosPost("/key/usage", data)
.then(({ code, data, message }) => {
if (code == 200) {
this.judgeEnvironment(data.order_number);
} else {
if (code == 403) {
if (this.backAble) {
this.tip(message, 2, '关闭');
2023-06-20 11:08:36 +08:00
setTimeout(() => {
window.location.href = localStorage.getItem('entryLink');
}, 3000);
} else {
this.tip(message, 2, '关闭');
}
} else {
this.tip(message, 2, '关闭');
2023-06-20 11:08:36 +08:00
}
}
})
.catch((err) => { });
},
/* 根据环境进行下一步操作 1 支付宝 2 微信 */
judgeEnvironment (order_number, weiXinUrl) {
if (this.goodsInfo.entity.channel === 1) {
const aliPaysUrl = `alipays://platformapi/startapp?appId=2021004100663111&page=pages/index/index?order_number=${encodeURIComponent(window.btoa(order_number))}`;
2023-06-21 17:30:17 +08:00
var ua = window.navigator.userAgent.toLowerCase();
/* 判断如果是微信/安卓百度浏览器 则复制链接 */
2023-06-27 16:30:41 +08:00
if (isWx() || (ua.indexOf("android") > -1 && ua.indexOf("baiduboxapp") > -1) || ua.indexOf("windows") > -1) {
2023-06-20 11:08:36 +08:00
this.tip('请点击下方[复制]按钮,复制链接到浏览器打开!', 1, '点击复制');
this.copyLink = aliPaysUrl;
} else {
window.location.href = aliPaysUrl;
}
}
if (this.goodsInfo.entity.channel === 2) {
2023-06-27 16:30:41 +08:00
if (isAli() || ua.indexOf("windows") > -1) {
2023-06-20 11:08:36 +08:00
this.tip('请点击下方[复制]按钮,复制链接到浏览器打开!', 1, '点击复制');
this.copyLink = weiXinUrl;
} else {
window.location.href = weiXinUrl;
}
}
},
/* 复制文本 */
copyFn () {
if (this.popBt === '关闭') {
return this.popShow = false;
}
var textArea = document.createElement("textarea");
textArea.value = this.copyLink;
document.body.appendChild(textArea);
textArea.select();
document.execCommand("copy");
this.promptShow = true;
this.popShow = false;
setTimeout(() => {
this.promptShow = false;
}, 3000);
document.body.removeChild(textArea);
clearTimeout;
},
/* 触发提示 */
tip (text, status, bt) {
this.popText = text;
this.popStatus = status; /*1 成功 2提示 3失败 */
this.popBt = bt;
this.popShow = true;
},
/* 返回 */
backGoodsFn () {
if (this.backAble) {
window.location.replace('./homepage.html');
} else {
history.go(-2);
}
},
},
})
2023-06-02 10:31:24 +08:00
</script>
</html>