2022-10-11 09:43:31 +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/siteqiexchange/js/swiper.min.js"></script>
|
|
|
|
|
<link href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/siteqiexchange/css/swiper.min.css" rel="stylesheet">
|
2022-11-03 15:19:00 +08:00
|
|
|
<link rel="stylesheet" href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/css/details.css?v=12">
|
2022-10-11 09:43:31 +08:00
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/js/api2_0.js"></script>
|
2022-11-02 15:07:29 +08:00
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/modelPop.js"></script>
|
2022-10-11 09:43:31 +08:00
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div id="exchangePage">
|
|
|
|
|
<!-- 时提框 -->
|
2022-10-11 17:19:55 +08:00
|
|
|
<model-pop :show.sync="popShow" :title="popTitle" :status="popStatus" :text="popText" :bottom_text="bottomText"
|
2022-10-11 09:43:31 +08:00
|
|
|
@backFunction="backFunctionPop"></model-pop>
|
|
|
|
|
|
|
|
|
|
<div v-if="!suspension" class="content">
|
|
|
|
|
<!-- 返回模块-->
|
|
|
|
|
<img @click="backHandler" class="back" v-if="backAble"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
|
|
|
|
|
|
|
|
|
|
<!-- 优惠券权益商品 -->
|
|
|
|
|
<div v-if="goodsDetail.type===1">
|
|
|
|
|
<div class="about-good">
|
|
|
|
|
<img :src="goodsShow[0]" alt="" v-if="goodsShow.length<=1">
|
|
|
|
|
<div class="swiper-container" v-else>
|
|
|
|
|
<div class="swiper-wrapper">
|
|
|
|
|
<div class="swiper-slide" v-for="(item,i) in goodsShow" :key="i">
|
|
|
|
|
<img :src="item" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-pagination"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="ipt-acc" style="position: relative;z-index: 999;" @click="bindAvailable">
|
|
|
|
|
<div class="title">
|
|
|
|
|
<p>
|
|
|
|
|
<span class="sign">￥</span>{{goodsDetail.origin_price}}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="text">{{goodInfo.product_name}}</p>
|
|
|
|
|
</div>
|
2023-08-18 09:08:13 +08:00
|
|
|
<template v-if="goodInfo.product_type===1||(goodInfo.product_type===2&&goodInfo.card_show==1)">
|
2024-02-21 17:47:53 +08:00
|
|
|
<!-- 京东E卡 -->
|
2024-02-23 10:51:47 +08:00
|
|
|
<template v-if="goodInfo.is_e_card">
|
2024-02-21 17:47:53 +08:00
|
|
|
<p>
|
|
|
|
|
<span>账号:</span>
|
|
|
|
|
<input :type="acctype" onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|
|
|
|
:disabled="goodsDetail.available!=1"
|
|
|
|
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))" :maxlength="11"
|
2024-02-23 11:37:59 +08:00
|
|
|
v-model="account" placeholder="请输入手机号" @focus="(e)=>focusFn(e)">
|
2024-02-21 17:47:53 +08:00
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
<span>验证码:</span>
|
|
|
|
|
<input class="queryCode" :type="acctype"
|
|
|
|
|
onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|
|
|
|
:disabled="goodsDetail.available!=1"
|
|
|
|
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))" :maxlength="6"
|
|
|
|
|
v-model="jd_code" placeholder="请输入验证码" @focus="(e)=>focusFn(e)">
|
|
|
|
|
<button :disabled="!computedAccount" class="query-code" @click="sendJDSms">
|
|
|
|
|
{{cunt!==60?cunt+'s':'获取验证码'}}
|
|
|
|
|
</button>
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<p v-if="acctype=='tel'"><span>账号:</span><input :type="acctype"
|
|
|
|
|
onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|
|
|
|
:disabled="goodsDetail.available!=1"
|
|
|
|
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))"
|
|
|
|
|
:maxlength="maxlen" v-model="account" :placeholder="placeholder"
|
|
|
|
|
@focus="(e)=>focusFn(e)"></p>
|
|
|
|
|
<p v-if="acctype=='tel'"><span>再次输入:</span> <input :type="acctype"
|
|
|
|
|
onkeyup="this.value=this.value.replace(/\D/g,'')"
|
|
|
|
|
:disabled="goodsDetail.available!=1"
|
|
|
|
|
onKeypress="return(/[\d]/.test(String.fromCharCode(event.keyCode)))"
|
|
|
|
|
:maxlength="maxlen" v-model="reAccount" placeholder="请再次输入"
|
|
|
|
|
@focus="(e)=>focusFn(e)"></p>
|
|
|
|
|
<p v-if="acctype!='tel'"><span>账号:</span> <input :type="acctype" :maxlength="maxlen"
|
|
|
|
|
v-model="account" :disabled="goodsDetail.available!=1" :placeholder="placeholder"
|
|
|
|
|
@focus="(e)=>focusFn(e)"></p>
|
|
|
|
|
<p v-if="acctype!='tel'"><span>再次输入:</span><input :type="acctype" :maxlength="maxlen"
|
|
|
|
|
v-model="reAccount" :disabled="goodsDetail.available!=1" placeholder="请再次输入"
|
|
|
|
|
@focus="(e)=>focusFn(e)"></p>
|
|
|
|
|
</template>
|
2022-10-28 11:28:30 +08:00
|
|
|
</template>
|
2022-10-11 09:43:31 +08:00
|
|
|
</div>
|
|
|
|
|
<div class="bottom" id="bottom" :style="{borderWidth:(describe.type||detailUrl)?'0.05rem':'0'}"
|
|
|
|
|
v-show="describe.type||detailUrl">
|
|
|
|
|
<img :src="detailUrl" v-show="detailUrl">
|
|
|
|
|
<img :src="describe.bg_image" v-show="describe.type==1&&describe.bg_image">
|
|
|
|
|
<div v-html="describe.content" class="goodsTip" v-show="describe.type==3&&describe.content"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 优惠券立减金 -->
|
|
|
|
|
<div class="reduce" v-if="goodsDetail.type===2">
|
|
|
|
|
<div class="couponShow">
|
|
|
|
|
<div class="coupon-left">
|
|
|
|
|
<p class="coupon_money">
|
|
|
|
|
<span>￥</span>{{goodInfo.reduce_amount}}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="full_money">满{{goodInfo.denomination}}可用</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="coupon-right">
|
2023-12-20 15:16:04 +08:00
|
|
|
<p class="title">
|
|
|
|
|
{{goodInfo.batch_goods_name}}
|
|
|
|
|
<span class="send_num" v-if="goodInfo.send_num>1">x{{goodInfo.send_num}}</span>
|
|
|
|
|
</p>
|
2022-10-11 09:43:31 +08:00
|
|
|
<p style="font-size: 0.11rem">
|
|
|
|
|
{{goodInfo.card_type|cardType}}可用
|
|
|
|
|
</p>
|
|
|
|
|
<p class="validity">
|
|
|
|
|
有效期:{{receive_time.effect_time.start_time}}至{{receive_time.effect_time.end_time}}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="validity" v-if="receive_time.use_time.type=='received'">
|
|
|
|
|
领取后{{receive_time.use_time.effect_date_type==0?'立即':'次日凌晨'}}生效，有效期
|
|
|
|
|
{{receive_time.use_time.effect_day}}天
|
|
|
|
|
</p>
|
|
|
|
|
<p class="validity" v-if="receive_time.use_time.type=='fiexd'">
|
|
|
|
|
可用时间:{{receive_time.use_time.fiexd_time.start_time}}-{{receive_time.use_time.fiexd_time.end_time}}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="coupon_explain">
|
|
|
|
|
<h1>- 兑换说明 -</h1>
|
|
|
|
|
<div class="content">
|
|
|
|
|
<h3 v-if="receive_time.use_time.type=='week'||receive_time.use_time.type=='irregular'">可用时间</h3>
|
|
|
|
|
<ul v-if="receive_time.use_time.type=='week'" class="weekTime">
|
|
|
|
|
<li v-for="(item,index) in receive_time.use_time.week" :key="index">
|
|
|
|
|
<p>{{item}}</p>
|
|
|
|
|
<div>
|
|
|
|
|
<p v-for="(item2,index2) in receive_time.use_time.time" :key="index2">
|
|
|
|
|
{{item2[0]}}~{{item2[1]}}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<ul v-if="receive_time.use_time.type=='irregular'">
|
|
|
|
|
<li v-for="(item,index) in receive_time.use_time.day" :key="index">
|
|
|
|
|
<p>{{item[0]}}至{{item[1]}}</p>
|
|
|
|
|
<div>
|
|
|
|
|
<p v-for="(item2,index2) in receive_time.use_time.time" :key="index2">
|
|
|
|
|
{{item2[0]}}~{{item2[1]}}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content">
|
|
|
|
|
<h3>使用须知</h3>
|
|
|
|
|
<p>
|
|
|
|
|
1、在{{goodInfo.channel==1?'支付宝H5':'微信APP内打开链接'}}，点击【一键领取】完成领取{{goodInfo.channel==1?'支付宝':'微信'}}立减金<br />
|
|
|
|
|
2、{{goodInfo.channel==1?'支付宝':'微信'}}立减金一旦领取不可撤销、不可转让。注意不要将兑换券泄露给他人
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content">
|
|
|
|
|
<h3>使用规则</h3>
|
2022-10-24 10:09:09 +08:00
|
|
|
<p v-html="goodsDetail.instruction"></p>
|
2022-10-11 09:43:31 +08:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 支付模块-->
|
|
|
|
|
<div class="exchange-btn-fr">
|
|
|
|
|
<div class="pay_left">
|
2022-10-11 09:49:35 +08:00
|
|
|
<div class="order" v-if="!backAble">
|
|
|
|
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/toOrder.png" alt=""
|
|
|
|
|
@click="toOrder">
|
2022-10-11 09:43:31 +08:00
|
|
|
<p>订单</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="title">
|
|
|
|
|
<p>
|
|
|
|
|
<span class="sign">￥</span>{{goodsDetail.coupon_price}}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="text" v-if="goodsDetail.origin_price-goodsDetail.coupon_price!==0">共省 ¥
|
|
|
|
|
{{(goodsDetail.origin_price-goodsDetail.coupon_price).toFixed(2)}}</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2024-02-21 17:47:53 +08:00
|
|
|
<button class="exchange-btn"
|
|
|
|
|
:style="{'background': computedExChange?bgcolor:'#D7D7D7','color':computedExChange?ftColor:'#333'}"
|
2022-10-11 09:43:31 +08:00
|
|
|
@click="exchangeGoodsFn">立即支付</button>
|
2024-02-21 17:47:53 +08:00
|
|
|
|
2022-10-11 09:43:31 +08:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 单条弹出框 -->
|
|
|
|
|
<div class="prompt" :class="promtshow?'proactive':''">
|
|
|
|
|
{{this.promttip}}
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 悬浮提示 -->
|
|
|
|
|
<div v-if="suspension" class="suspensionDom">
|
|
|
|
|
<img @click="suspension = false"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
|
|
|
|
|
<h4>活动规则</h4>
|
|
|
|
|
<div v-html="describe.content">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<img class="susTip" @click="suspension = true"
|
|
|
|
|
v-if="describe.type==='2'&&describe.content&&!suspension&&goodsDetail.type===1"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/acticeTextTip.png" alt="">
|
|
|
|
|
<!-- 弹出框 -->
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
<script>
|
|
|
|
|
let goodsCount = null, goodsDetail = null;
|
|
|
|
|
new Vue({
|
|
|
|
|
el: '#exchangePage',
|
|
|
|
|
data () {
|
|
|
|
|
return {
|
|
|
|
|
account: '',
|
|
|
|
|
reAccount: '',
|
|
|
|
|
maxlen: 11,
|
|
|
|
|
acctype: 'tel',
|
|
|
|
|
promttip: '',
|
|
|
|
|
promtshow: false,
|
|
|
|
|
productType: 0,
|
|
|
|
|
placeholder: '',
|
|
|
|
|
exchangeOpen: false,
|
|
|
|
|
suspension: false,
|
2024-02-21 17:47:53 +08:00
|
|
|
cunt: 60,
|
|
|
|
|
jd_code: '',
|
2022-10-11 09:43:31 +08:00
|
|
|
describe: {},
|
|
|
|
|
detailUrl: '',
|
|
|
|
|
goodInfo: '',
|
|
|
|
|
bgcolor: '',
|
|
|
|
|
ftColor: '',
|
|
|
|
|
goodsDetail: {},//商品详情
|
|
|
|
|
backAble: true,
|
|
|
|
|
goodsShow: [
|
|
|
|
|
'https://lsxd-yunshanfu.oss-cn-hangzhou.aliyuncs.com/common_image/20220120/9bedd7af6a8a570be8f2858564f9ec6d.png'
|
|
|
|
|
],
|
|
|
|
|
/* 提示框状态 */
|
|
|
|
|
popShow: false,
|
|
|
|
|
popTitle: '',
|
|
|
|
|
popText: '',
|
|
|
|
|
popStatus: 1, /*1 成功 2提示 3失败 */
|
2022-10-11 17:19:55 +08:00
|
|
|
bottomText: '', /* 复制按钮 */
|
2022-10-17 11:37:12 +08:00
|
|
|
receive_time: {},
|
2022-11-03 17:03:30 +08:00
|
|
|
orderNumber: '',
|
2022-10-17 11:37:12 +08:00
|
|
|
isLogin: false,/* 是否跳登录页 */
|
2022-11-18 18:05:01 +08:00
|
|
|
};
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
filters: {
|
|
|
|
|
cardType (val) {
|
|
|
|
|
return val.map((item) => {
|
|
|
|
|
return item == 1 ? "借记卡" : "信用卡" + " ";
|
|
|
|
|
}).join(" ");
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
watch: {
|
|
|
|
|
account (va) {
|
2022-11-18 18:05:01 +08:00
|
|
|
va && this.watchAccount();
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
reAccount (va) {
|
2022-11-18 18:05:01 +08:00
|
|
|
va && this.watchAccount();
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
productType: {
|
|
|
|
|
immediate: true,
|
|
|
|
|
handler (newVal) {
|
|
|
|
|
this.maxlen = 50;
|
|
|
|
|
this.acctype = "text";
|
2022-10-18 15:02:16 +08:00
|
|
|
switch (Number(newVal)) {
|
|
|
|
|
case 0:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入昵称";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 1:
|
|
|
|
|
this.acctype = "tel";
|
|
|
|
|
this.placeholder = "请输入手机号";
|
|
|
|
|
this.maxlen = 11;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 2:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入邮箱";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 3:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入手机号或邮箱";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 4:
|
|
|
|
|
this.placeholder = "请输入QQ号";
|
|
|
|
|
this.acctype = "tel";
|
|
|
|
|
this.maxlen = 10;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 5:
|
|
|
|
|
this.placeholder = "请输入手机号或QQ号";
|
|
|
|
|
this.maxlen = 11;
|
|
|
|
|
this.acctype = "tel";
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 6:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入邮箱或QQ号";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 7:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入手机号/邮箱/QQ号";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 8:
|
|
|
|
|
this.placeholder = "请输入微信号";
|
|
|
|
|
this.maxlen = 20;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 9:
|
|
|
|
|
this.placeholder = "请输入手机号或微信";
|
|
|
|
|
this.maxlen = 20;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 10:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入邮箱或微信号";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 11:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入手机号/邮箱/微信号";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 12:
|
|
|
|
|
this.placeholder = "请输入QQ号或微信号";
|
|
|
|
|
this.maxlen = 20;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 13:
|
|
|
|
|
this.placeholder = "请输入手机号/QQ号/微信号";
|
|
|
|
|
this.maxlen = 20;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 14:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入邮箱/QQ号/微信号";
|
|
|
|
|
break;
|
2023-11-23 18:07:49 +08:00
|
|
|
case 99:
|
|
|
|
|
this.placeholder = "请输入昵称";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
default:
|
2022-10-18 15:12:49 +08:00
|
|
|
this.placeholder = "请输入手机号/邮箱/QQ号/微信号";
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
components: {
|
2022-11-10 14:29:51 +08:00
|
|
|
modelPop
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
created () {
|
2022-10-25 10:42:57 +08:00
|
|
|
/* 配置信息 */
|
2022-10-11 09:43:31 +08:00
|
|
|
document.title = localStorage.getItem('title');
|
|
|
|
|
let detailsConfig = JSON.parse(localStorage.getItem('product_detail'));
|
|
|
|
|
goodsCount = localStorage.getItem('goodsCount');
|
|
|
|
|
this.backAble = goodsCount > 1;//多个商品才有返回
|
|
|
|
|
this.bgcolor = detailsConfig.button_color;
|
|
|
|
|
this.ftColor = detailsConfig.font_color;
|
|
|
|
|
this.describe = detailsConfig.describe;
|
2022-10-25 10:42:57 +08:00
|
|
|
|
|
|
|
|
//商品详情
|
2022-11-18 18:05:01 +08:00
|
|
|
goodsDetail = JSON.parse(localStorage.getItem('goodsInfo'));
|
2022-11-07 17:34:11 +08:00
|
|
|
let goodsId = goodsDetail.id;
|
2022-11-18 18:05:01 +08:00
|
|
|
let code_batch_id = goodsDetail.coupon && goodsDetail.coupon.code_batch_id || goodsDetail.code_batch_id;
|
|
|
|
|
this.getDetails(goodsId, code_batch_id);
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
2024-02-21 17:47:53 +08:00
|
|
|
computed: {
|
|
|
|
|
/* 手机号验证 */
|
|
|
|
|
computedAccount () {
|
|
|
|
|
return /^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(this.account);
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/* 兑换按钮验证 */
|
|
|
|
|
computedExChange () {
|
2024-02-22 09:51:02 +08:00
|
|
|
return this.exchangeOpen || (this.goodInfo.product_type === 2 && this.goodInfo.card_show == 2) || this.goodInfo.is_e_card && this.computedAccount && this.jd_code.length === 6;
|
2024-02-21 17:47:53 +08:00
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
2022-10-11 09:43:31 +08:00
|
|
|
methods: {
|
|
|
|
|
bindAvailable () {
|
2022-11-10 14:29:51 +08:00
|
|
|
if (goodsDetail.wait_pay_order == 1) {
|
|
|
|
|
this.openErrorDialog('您有未支付的订单');
|
2022-11-18 18:05:01 +08:00
|
|
|
return;
|
2022-11-10 14:29:51 +08:00
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
if (goodsDetail.available != 1) {
|
|
|
|
|
this.openErrorDialog(product_status(goodsDetail.available, goodsDetail));
|
2022-11-18 18:05:01 +08:00
|
|
|
return;
|
2022-10-11 09:43:31 +08:00
|
|
|
}
|
|
|
|
|
},
|
2022-10-25 10:42:57 +08:00
|
|
|
|
2024-02-21 17:47:53 +08:00
|
|
|
/* 获取京东E卡短信 */
|
|
|
|
|
sendJDSms () {
|
|
|
|
|
if (this.cunt === 60) {
|
|
|
|
|
req.axiosPost('/key/order/jdSendSms', { code_batch_id: this.goodsDetail.code_batch_id, mobile: this.account })
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
this.openDialog('短信下发成功！');
|
|
|
|
|
const clr = setInterval(() => {
|
|
|
|
|
if (this.cunt <= 1) {
|
|
|
|
|
this.cunt = 60;
|
|
|
|
|
return clearInterval(clr);
|
|
|
|
|
}
|
|
|
|
|
this.cunt--;
|
|
|
|
|
}, 1000);
|
|
|
|
|
} else {
|
|
|
|
|
this.openErrorDialog(res.message);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
2022-10-25 10:42:57 +08:00
|
|
|
/* 请求详情 */
|
2022-11-18 18:05:01 +08:00
|
|
|
getDetails (goods_id, code_batch_id) {
|
|
|
|
|
const token = localStorage.getItem('token');
|
2022-10-25 10:42:57 +08:00
|
|
|
return new Promise((resolve, reject) => {
|
2022-11-18 18:05:01 +08:00
|
|
|
req.axiosPost(`/key/product_detail/${goods_id}`, { token, code_batch_id }).then(({ code, data, message }) => {
|
2022-10-25 10:42:57 +08:00
|
|
|
if (code == 200) {
|
2022-11-18 18:05:01 +08:00
|
|
|
this.goodsDetail = data;
|
|
|
|
|
goodsDetail = data;
|
2022-10-25 10:42:57 +08:00
|
|
|
this.goodInfo = data.entity;
|
|
|
|
|
let goods_desc = data.entity.describe_url;
|
|
|
|
|
this.goodsShow = goods_desc && goods_desc.length > 0 ? goods_desc : [data.show_url];
|
|
|
|
|
this.detailUrl = data.entity.detail_url ? data.entity.detail_url : '';
|
2023-08-18 09:08:13 +08:00
|
|
|
/* 区分卡密短信 */
|
|
|
|
|
if (this.goodInfo.product_type === 2 && this.goodInfo.card_show == 1) {
|
|
|
|
|
this.productType = 1;
|
|
|
|
|
} else {
|
|
|
|
|
this.productType = data.entity.account_type;
|
|
|
|
|
}
|
2023-11-23 18:07:49 +08:00
|
|
|
|
|
|
|
|
/* 微博 */
|
|
|
|
|
if (goodsDetail.entity.account_type == 0 && this.goodInfo.product_name.indexOf('微博') !== -1) {
|
|
|
|
|
this.productType = 99;
|
|
|
|
|
}
|
|
|
|
|
|
2022-10-25 10:42:57 +08:00
|
|
|
this.receive_time = data.entity.time_limit;
|
|
|
|
|
this.$nextTick(function () {
|
|
|
|
|
var swiper = new Swiper('.swiper-container', {
|
|
|
|
|
loop: true, // 循环模式选项
|
|
|
|
|
autoplay: 3000, //可选选项，自动滑动
|
|
|
|
|
pagination: '.swiper-pagination',
|
2022-11-18 18:05:01 +08:00
|
|
|
});
|
|
|
|
|
});
|
2022-10-25 10:42:57 +08:00
|
|
|
} else {
|
|
|
|
|
this.openErrorDialog(message);
|
|
|
|
|
if (code == 403) {
|
2022-11-18 18:05:01 +08:00
|
|
|
this.delayedOut(3);
|
|
|
|
|
this.isLogin = true;
|
2022-10-25 10:42:57 +08:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
|
2022-10-11 09:43:31 +08:00
|
|
|
/* 跳转订单 */
|
|
|
|
|
toOrder () {
|
|
|
|
|
window.location.replace('./myOrder.html');
|
|
|
|
|
},
|
|
|
|
|
|
2022-10-11 17:19:55 +08:00
|
|
|
openErrorDialog (tip, bottomText) {
|
2022-11-18 18:05:01 +08:00
|
|
|
this.popTitle = '温馨提示';
|
|
|
|
|
this.popText = tip;
|
|
|
|
|
this.popStatus = 2;
|
|
|
|
|
this.popShow = true;
|
|
|
|
|
this.bottomText = bottomText;
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
backHandler () {
|
|
|
|
|
if (goodsCount > 1) {
|
|
|
|
|
window.location.replace('./couponCollection.html');
|
|
|
|
|
} else {
|
|
|
|
|
history.go(-2);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 单条弹框
|
|
|
|
|
openDialog (tip) {
|
|
|
|
|
this.promtshow = true;
|
2022-11-18 18:05:01 +08:00
|
|
|
this.promttip = tip;
|
2022-10-11 09:43:31 +08:00
|
|
|
setTimeout(() => {
|
|
|
|
|
this.promtshow = false;
|
|
|
|
|
this.promttip = '';
|
2022-11-18 18:05:01 +08:00
|
|
|
}, 3000);
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/* 弹窗回调 */
|
2022-10-17 11:37:12 +08:00
|
|
|
backFunctionPop (type) {
|
|
|
|
|
if (this.isLogin) {
|
2022-11-18 18:05:01 +08:00
|
|
|
this.delayedOut();
|
2022-10-17 11:32:07 +08:00
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
|
|
|
|
|
2022-10-17 16:59:52 +08:00
|
|
|
/* 延时自动退出 */
|
|
|
|
|
delayedOut (time = 1) {
|
|
|
|
|
let entryLink = localStorage.getItem('entryLink');
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
window.location.replace(entryLink);
|
|
|
|
|
}, time * 1000);
|
|
|
|
|
},
|
|
|
|
|
|
2022-10-11 09:43:31 +08:00
|
|
|
//兑换商品
|
|
|
|
|
exchangeGoodsFn () {
|
2022-11-10 14:27:54 +08:00
|
|
|
//wait_pay_order 1有订单 5无订单
|
|
|
|
|
if (goodsDetail.wait_pay_order == 1) {
|
|
|
|
|
this.openErrorDialog('您有未支付的订单');
|
2022-11-18 18:05:01 +08:00
|
|
|
return;
|
2022-11-10 14:27:54 +08:00
|
|
|
}
|
2024-02-21 17:47:53 +08:00
|
|
|
|
2022-11-10 14:27:54 +08:00
|
|
|
if (goodsDetail.available != 1) {
|
|
|
|
|
this.openErrorDialog(product_status(goodsDetail.available, goodsDetail));
|
2022-11-18 18:05:01 +08:00
|
|
|
return;
|
2022-11-10 14:27:54 +08:00
|
|
|
}
|
2024-02-21 17:47:53 +08:00
|
|
|
|
|
|
|
|
/* 京东E卡 */
|
2024-02-22 09:51:02 +08:00
|
|
|
if (this.goodInfo.is_e_card && this.goodInfo.product_type === 1) {
|
2024-02-21 17:47:53 +08:00
|
|
|
if (this.computedExChange) {
|
|
|
|
|
localStorage.setItem('account', this.account);
|
2024-02-23 11:37:59 +08:00
|
|
|
localStorage.setItem('jd_code', this.jd_code);
|
2024-02-21 17:47:53 +08:00
|
|
|
window.location.href = './settlement.html';
|
|
|
|
|
}
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
2023-08-18 09:08:13 +08:00
|
|
|
if ((this.goodsDetail.type === 1 && this.goodInfo.product_type === 1) || (this.goodInfo.product_type === 2 && this.goodInfo.card_show == 1)) { /* 兑换码 */
|
2022-10-11 09:43:31 +08:00
|
|
|
if (!this.account) {
|
|
|
|
|
this.openDialog('请输入兑换账号！');
|
|
|
|
|
return false;
|
|
|
|
|
} else {
|
|
|
|
|
let nameReg = /\w{4}/.test(this.account);
|
|
|
|
|
let phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(this.account);
|
|
|
|
|
let qqReg = /^[1-9][0-9]{4,9}$/.test(this.account);
|
|
|
|
|
let emailsReg = /^[A-Za-z0-9\u4e00-\u9fa5\.]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(this.account);
|
|
|
|
|
let weiXinReg = /^[a-zA-Z][a-zA-Z\d_-]{5,19}$/.test(this.account);
|
|
|
|
|
let regFlag = true;
|
2022-10-18 15:02:16 +08:00
|
|
|
switch (Number(this.productType)) {
|
2023-11-24 09:37:39 +08:00
|
|
|
case 0:
|
|
|
|
|
/* 不做校验 */
|
|
|
|
|
break;
|
|
|
|
|
case 99:
|
|
|
|
|
/* 不做校验 */
|
|
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 1:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 2:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = emailsReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 3:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || emailsReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 4:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = qqReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 5:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || qqReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 6:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = emailsReg || qqReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 7:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || emailsReg || qqReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 8:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 9:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 10:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = emailsReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 11:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || emailsReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 12:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = qqReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 13:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || qqReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
case 14:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = emailsReg || qqReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
default:
|
2022-11-18 18:05:01 +08:00
|
|
|
regFlag = phoneReg || emailsReg || qqReg || weiXinReg;
|
2022-10-18 15:12:49 +08:00
|
|
|
break;
|
2022-10-18 15:02:16 +08:00
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
if (!regFlag) {
|
|
|
|
|
this.openDialog("充值账号格式不正确！");
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (this.reAccount == "") {
|
|
|
|
|
this.openDialog("请再次输入账号！");
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
if (this.account != this.reAccount) {
|
2022-11-18 18:05:01 +08:00
|
|
|
this.reAccount == "";
|
2022-10-11 09:43:31 +08:00
|
|
|
this.openDialog("两次输入的账号必须一致！");
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
}
|
2022-11-03 17:03:30 +08:00
|
|
|
localStorage.setItem('account', this.reAccount);
|
|
|
|
|
window.location.href = './settlement.html';
|
2022-10-11 09:43:31 +08:00
|
|
|
},
|
2022-10-25 10:42:57 +08:00
|
|
|
|
2022-10-11 09:43:31 +08:00
|
|
|
focusFn (a) {
|
|
|
|
|
let ele = document.querySelector('.ipt-acc');
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
ele.scrollIntoView(false);
|
|
|
|
|
document.body.scrollTop = ele.scrollHeight;
|
|
|
|
|
document.documentElement.scrollTop = ele.scrollHeight;
|
|
|
|
|
}, 400);
|
|
|
|
|
},
|
|
|
|
|
/* 监听账号 */
|
|
|
|
|
watchAccount () {
|
2023-08-18 09:08:13 +08:00
|
|
|
if ((this.account === this.reAccount) && this.account) {
|
2022-10-11 09:43:31 +08:00
|
|
|
this.exchangeOpen = true;
|
|
|
|
|
} else {
|
|
|
|
|
this.exchangeOpen = false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
</html>
|
