🐛 fix: 修复
This commit is contained in:
wangsongsole
parent
3e86fc8c24
commit
4a6dd6c901
253
order.html
253
order.html
|
|
@ -8,8 +8,8 @@
|
|||
<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 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>
|
||||
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/modelPop.js"></script>
|
||||
<link rel="stylesheet"
|
||||
|
|
@ -21,29 +21,28 @@
|
|||
<div id="app">
|
||||
<!-- 弹出提示 -->
|
||||
<img class="backPresTy" @click="location.href = './homepage.html'" v-if="goodsCount<2"
|
||||
src=" https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
|
||||
src=" https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="" />
|
||||
<p class="nav-title">订单</p>
|
||||
<div id="refresh" @touchstart="touchStart($event)" @touchmove="touchMove($event)"
|
||||
@touchcancel="touchEnd($event)" @touchend="touchEnd($event)">
|
||||
<img v-show='!!loadShowHeight' class='img-lodging'
|
||||
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/img-logding.png" alt="">
|
||||
<img v-show="!!loadShowHeight" class="img-lodging"
|
||||
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/img-logding.png" alt="" />
|
||||
<div class="content" slot="content" @scroll="scrollBottom($event)">
|
||||
<div class="content-item" v-for="item in orderList" :key="item.order_number">
|
||||
<div class="top">
|
||||
<p class="time">{{item.create_time}}</p>
|
||||
<p class="status" :style="{color:statusColor(item.status)}">{{item.status_text}}
|
||||
<p class="status" :style="{color:statusColor(item.status)}">
|
||||
{{item.status_text}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="middle">
|
||||
<img :src="item.src" alt="">
|
||||
<img :src="item.src" alt="" />
|
||||
<div class="right">
|
||||
<div class="title_originalPrice">
|
||||
<p class="title">{{item.product_name}}</p>
|
||||
|
||||
</div>
|
||||
<p class="id">订单编号：{{item.order_number}}</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="footer">
|
||||
<p class="button-card b-l" @click="lookCard(item)"
|
||||
|
|
@ -51,14 +50,16 @@
|
|||
查看卡密
|
||||
</p>
|
||||
<p class="button-card b-c-r b-l" @click="receiveFn(item)"
|
||||
v-if="(item.status!==2&&item.goods.entity.send_num<2)&&[2,3].includes(item.type)&&[1,2].includes(item.channel)">
|
||||
去领取</p>
|
||||
v-if="(item.status!==2&&item.goods.entity.send_num<2||item.status===0&&item.goods.entity.send_num>1)&&[2,3].includes(item.type)&&[1,2].includes(item.channel)">
|
||||
去领取
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="noMore" v-if="total<limit&&orderList.length">没有更多了</p>
|
||||
<!-- 空状态 -->
|
||||
<div class="empty" v-if="!orderList.length&&!loadShowHeight">
|
||||
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/order-empty.png" alt="">
|
||||
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/order-empty.png"
|
||||
alt="" />
|
||||
<p>暂无订单</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -75,7 +76,7 @@
|
|||
<tab-static-component :current="2" v-if="goodsCount>1"></tab-static-component>
|
||||
</div>
|
||||
<script>
|
||||
const token = localStorage.getItem('token');
|
||||
const token = localStorage.getItem("token");
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data () {
|
||||
|
|
@ -87,35 +88,35 @@
|
|||
|
||||
/* 提示框状态 */
|
||||
popShow: false,
|
||||
popTitle: '',
|
||||
popText: '',
|
||||
popTitle: "",
|
||||
popText: "",
|
||||
popStatus: 1 /*1 成功 2提示 3失败 */,
|
||||
bottomText: '' /*1 成功 2提示 3失败 */,
|
||||
goodsCount: 0,/* 商品数量 */
|
||||
href: '',/* 支付链接 */
|
||||
bottomText: "" /*1 成功 2提示 3失败 */,
|
||||
goodsCount: 0 /* 商品数量 */,
|
||||
href: "" /* 支付链接 */,
|
||||
isCancel: false,
|
||||
|
||||
/* toast */
|
||||
toastShow: '',
|
||||
toastTip: '',
|
||||
toastShow: "",
|
||||
toastTip: "",
|
||||
redirect: false,
|
||||
|
||||
/* 加载 */
|
||||
scrollTop: 0,
|
||||
startY: 0,
|
||||
loadShowHeight: 0,
|
||||
loadFlag: false,
|
||||
loadFlag: false
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
tabStaticComponent,
|
||||
modelPop,
|
||||
modelPop
|
||||
},
|
||||
|
||||
created () {
|
||||
this.getOrderList();
|
||||
this.goodsCount = Number(sessionStorage.getItem('goodsCount'));
|
||||
this.goodsCount = Number(sessionStorage.getItem("goodsCount"));
|
||||
this.scrollTop =
|
||||
document.documentElement.scrollTop || document.body.scrollTop;
|
||||
},
|
||||
|
|
@ -125,18 +126,32 @@
|
|||
cancelOrder ({ order_number }) {
|
||||
this.order_number = order_number;
|
||||
this.isCancel = true;
|
||||
this.popFunction({ title: '温馨提示', text: '是否确认取消订单', status: 2, b_text: '我知道了', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: "是否确认取消订单",
|
||||
status: 2,
|
||||
b_text: "我知道了",
|
||||
show: true
|
||||
});
|
||||
},
|
||||
|
||||
/* 根据不同状态展示 订单样式和表现 */
|
||||
statusColor (status) {
|
||||
const colorArray = ['#f28542', '#f28542', '#44D27D', '#fd553d', '#fd553d', '#aaaaaa', '#fd553d'];
|
||||
const colorArray = [
|
||||
"#f28542",
|
||||
"#f28542",
|
||||
"#44D27D",
|
||||
"#fd553d",
|
||||
"#fd553d",
|
||||
"#aaaaaa",
|
||||
"#fd553d"
|
||||
];
|
||||
return colorArray[status];
|
||||
},
|
||||
|
||||
/*跳转起始页面*/
|
||||
toPage () {
|
||||
let entryLink = localStorage.getItem('entryLink');
|
||||
let entryLink = localStorage.getItem("entryLink");
|
||||
setTimeout(() => {
|
||||
window.location.replace(entryLink);
|
||||
}, 3 * 1000);
|
||||
|
|
@ -144,7 +159,12 @@
|
|||
|
||||
/* 领取红包和立减金 */
|
||||
receiveFn (item) {
|
||||
req.axiosGet(`/key/order/getLink`, { order_number: item.order_number, token }).then(({ data, code, message }) => {
|
||||
req
|
||||
.axiosGet(`/key/order/getLink`, {
|
||||
order_number: item.order_number,
|
||||
token
|
||||
})
|
||||
.then(({ data, code, message }) => {
|
||||
if (code === 200) {
|
||||
this.toApp(item, data);
|
||||
} else {
|
||||
|
|
@ -159,23 +179,45 @@
|
|||
//领取立减金
|
||||
if (item.type === 2) {
|
||||
if (item.status == 5) {
|
||||
return this.popFunction({ title: '温馨提示', text: '立减金领取过期', status: 2, b_text: '我知道了', show: true });
|
||||
return this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: "立减金领取过期",
|
||||
status: 2,
|
||||
b_text: "我知道了",
|
||||
show: true
|
||||
});
|
||||
}
|
||||
if (item.channel == 1) {
|
||||
if (item.goods.entity.receive_mode === 2) { /* H5 领取 */
|
||||
sessionStorage.setItem('goodsInfo', JSON.stringify(item.goods));
|
||||
location.href = './zfb-reduce.html';
|
||||
if (item.goods.entity.receive_mode === 2) {
|
||||
/* H5 领取 */
|
||||
sessionStorage.setItem(
|
||||
"goodsInfo",
|
||||
JSON.stringify(item.goods)
|
||||
);
|
||||
location.href = "./zfb-reduce.html";
|
||||
} else {
|
||||
let bankLink = encodeURIComponent(
|
||||
window.location.origin +
|
||||
"/alipay.html?orderNumber=" + data.order_number
|
||||
"/alipay.html?orderNumber=" +
|
||||
data.order_number
|
||||
);
|
||||
let link = "http://openapi.1688sup.com/alipay/oauth?jump=" + bankLink;
|
||||
let link =
|
||||
"http://openapi.1688sup.com/alipay/oauth?jump=" + bankLink;
|
||||
let ua = navigator.userAgent.toLowerCase(); //判断用户打开链接环境
|
||||
if (ua.indexOf("micromessenger") > -1 || ua.indexOf("baiduboxapp") > -1 || ua.indexOf("firefox") > -1) {
|
||||
if (
|
||||
ua.indexOf("micromessenger") > -1 ||
|
||||
ua.indexOf("baiduboxapp") > -1 ||
|
||||
ua.indexOf("firefox") > -1
|
||||
) {
|
||||
//在微信内置环境、百度app打开，不能唤起支付宝
|
||||
this.href = link;
|
||||
this.popFunction({ title: '温馨提示', text: `请复制链接,在其他浏览器打开`, status: 2, b_text: '点击复制', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: `请复制链接,在其他浏览器打开`,
|
||||
status: 2,
|
||||
b_text: "点击复制",
|
||||
show: true
|
||||
});
|
||||
} else {
|
||||
//唤起支付宝
|
||||
window.location.replace(link);
|
||||
|
|
@ -186,7 +228,13 @@
|
|||
if (item.channel == 2) {
|
||||
if (ua.indexOf("windows") > -1) {
|
||||
this.href = data.redirect_url;
|
||||
this.popFunction({ title: '温馨提示', text: `请复制链接,在其他浏览器打开`, status: 2, b_text: '点击复制', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: `请复制链接,在其他浏览器打开`,
|
||||
status: 2,
|
||||
b_text: "点击复制",
|
||||
show: true
|
||||
});
|
||||
} else {
|
||||
location.replace(data.redirect_url);
|
||||
}
|
||||
|
|
@ -196,14 +244,31 @@
|
|||
/* 红包领取 */
|
||||
if (item.type === 3) {
|
||||
if (item.channel === 1) {
|
||||
if (item.goods.entity.receive_mode === 2) { /* H5 领取 */
|
||||
sessionStorage.setItem('goodsInfo', JSON.stringify(item.goods));
|
||||
location.href = './zfb-redPackets.html';
|
||||
if (item.goods.entity.receive_mode === 2) {
|
||||
/* H5 领取 */
|
||||
sessionStorage.setItem(
|
||||
"goodsInfo",
|
||||
JSON.stringify(item.goods)
|
||||
);
|
||||
location.href = "./zfb-redPackets.html";
|
||||
} else {
|
||||
const aliPaysUrl = `alipays://platformapi/startapp?appId=2021004100663111&page=pages/index/index?order_number=${encodeURIComponent(window.btoa(data.order_number))}`;
|
||||
if (isWx() || (ua.indexOf("android") > -1 && ua.indexOf("baiduboxapp") > -1) || ua.indexOf("windows") > -1) {
|
||||
const aliPaysUrl = `alipays://platformapi/startapp?appId=2021004100663111&page=pages/index/index?order_number=${encodeURIComponent(
|
||||
window.btoa(data.order_number)
|
||||
)}`;
|
||||
if (
|
||||
isWx() ||
|
||||
(ua.indexOf("android") > -1 &&
|
||||
ua.indexOf("baiduboxapp") > -1) ||
|
||||
ua.indexOf("windows") > -1
|
||||
) {
|
||||
this.href = aliPaysUrl;
|
||||
this.popFunction({ title: '温馨提示', text: `请复制链接,在其他浏览器打开`, status: 2, b_text: '点击复制', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: `请复制链接,在其他浏览器打开`,
|
||||
status: 2,
|
||||
b_text: "点击复制",
|
||||
show: true
|
||||
});
|
||||
} else {
|
||||
location.replace(aliPaysUrl);
|
||||
}
|
||||
|
|
@ -213,7 +278,13 @@
|
|||
if (item.channel === 2) {
|
||||
if (ua.indexOf("windows") > -1) {
|
||||
this.href = data.redirect_url;
|
||||
this.popFunction({ title: '温馨提示', text: `请复制链接,在其他浏览器打开`, status: 2, b_text: '点击复制', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: `请复制链接,在其他浏览器打开`,
|
||||
status: 2,
|
||||
b_text: "点击复制",
|
||||
show: true
|
||||
});
|
||||
} else {
|
||||
location.replace(data.redirect_url);
|
||||
}
|
||||
|
|
@ -223,19 +294,23 @@
|
|||
|
||||
/* 弹窗回调 */
|
||||
backFunction (type) {
|
||||
if (this.bottomText === '点击复制' && type) {
|
||||
if (this.bottomText === "点击复制" && type) {
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", this.href);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(aux);
|
||||
this.openDialog('复制成功');
|
||||
this.openDialog("复制成功");
|
||||
}
|
||||
|
||||
/* 取消订单 */
|
||||
if (this.isCancel && type === 2) {
|
||||
req.axiosPut(`/key/order/cancel/${this.order_number}?token=${token}`).then(({ code, message }) => {
|
||||
req
|
||||
.axiosPut(
|
||||
`/key/order/cancel/${this.order_number}?token=${token}`
|
||||
)
|
||||
.then(({ code, message }) => {
|
||||
if (code === 200) {
|
||||
this.getOrderList();
|
||||
} else {
|
||||
|
|
@ -248,7 +323,7 @@
|
|||
/* 查看卡密 */
|
||||
lookCard (item) {
|
||||
localStorage.setItem("cardProductDetail", JSON.stringify(item));
|
||||
window.location.href = './coupon/lookCard.html';
|
||||
window.location.href = "./coupon/lookCard.html";
|
||||
},
|
||||
|
||||
/* 统一控制弹窗 */
|
||||
|
|
@ -266,7 +341,7 @@
|
|||
this.toastTip = tip;
|
||||
setTimeout(() => {
|
||||
this.toastShow = false;
|
||||
this.toastTip = '';
|
||||
this.toastTip = "";
|
||||
}, 3000);
|
||||
},
|
||||
|
||||
|
|
@ -275,7 +350,11 @@
|
|||
let Scroll = e.target;
|
||||
let scrollHeight = Scroll.scrollHeight - Scroll.clientHeight;
|
||||
this.scrollTop = Scroll.scrollTop;
|
||||
if (scrollHeight - Scroll.scrollTop < 100 && !this.loadFlag && this.total === this.limit) {
|
||||
if (
|
||||
scrollHeight - Scroll.scrollTop < 100 &&
|
||||
!this.loadFlag &&
|
||||
this.total === this.limit
|
||||
) {
|
||||
this.loadFlag = true;
|
||||
this.page++;
|
||||
this.getOrderList(true);
|
||||
|
|
@ -287,7 +366,6 @@
|
|||
this.startY = e.targetTouches[0].pageY;
|
||||
},
|
||||
|
||||
|
||||
touchMove (e) {
|
||||
if (this.scrollTop == 0) {
|
||||
let moveDistance = e.targetTouches[0].pageY - this.startY;
|
||||
|
|
@ -314,7 +392,13 @@
|
|||
this.loadShowHeight = true;
|
||||
}
|
||||
|
||||
req.axiosGet(`/key/order/queryList`, { token, page: this.page, limit: this.limit }).then(({ data, code, message }) => {
|
||||
req
|
||||
.axiosGet(`/key/order/queryList`, {
|
||||
token,
|
||||
page: this.page,
|
||||
limit: this.limit
|
||||
})
|
||||
.then(({ data, code, message }) => {
|
||||
if (code === 200) {
|
||||
this.total = data.length;
|
||||
data = data.map((item) => {
|
||||
|
|
@ -339,7 +423,13 @@
|
|||
|
||||
/* 处理错误 */
|
||||
apiError (code, message) {
|
||||
this.popFunction({ title: '温馨提示', text: message, status: 3, b_text: '我知道了', show: true });
|
||||
this.popFunction({
|
||||
title: "温馨提示",
|
||||
text: message,
|
||||
status: 3,
|
||||
b_text: "我知道了",
|
||||
show: true
|
||||
});
|
||||
if (code === 403) {
|
||||
this.toPage();
|
||||
}
|
||||
|
|
@ -349,53 +439,68 @@
|
|||
refactorData (item) {
|
||||
/* type: 1兑换码 2立减金 3红包 */
|
||||
/* channel: 1支付宝 2微信 3云闪付 */
|
||||
const { order_number, create_time, status_text, status, type, product, card_number, card_password } = item;
|
||||
const newItem = {
|
||||
const {
|
||||
order_number,
|
||||
create_time,
|
||||
status_text,
|
||||
status,
|
||||
type,
|
||||
product,
|
||||
card_number,
|
||||
card_password
|
||||
} = item;
|
||||
const newItem = {
|
||||
order_number,
|
||||
create_time,
|
||||
status_text,
|
||||
status,
|
||||
type
|
||||
};
|
||||
switch (type) {
|
||||
case 1:
|
||||
newItem['product_name'] = product.product_name;
|
||||
newItem['src'] = product.show_url;
|
||||
newItem['show_url'] = product.show_url;
|
||||
newItem['product_type'] = product.product_type;
|
||||
newItem['goods'] = product;
|
||||
newItem['card_number'] = card_number;
|
||||
newItem['card_password'] = card_password;
|
||||
newItem['card_show'] = product.card_show;
|
||||
newItem["product_name"] = product.product_name;
|
||||
newItem["src"] = product.show_url;
|
||||
newItem["show_url"] = product.show_url;
|
||||
newItem["product_type"] = product.product_type;
|
||||
newItem["goods"] = product;
|
||||
newItem["card_number"] = card_number;
|
||||
newItem["card_password"] = card_password;
|
||||
newItem["card_show"] = product.card_show;
|
||||
break;
|
||||
case 2:
|
||||
const channel = product.entity.channel;
|
||||
newItem['product_name'] = product.entity.batch_goods_name;
|
||||
newItem['channel'] = channel;
|
||||
newItem['goods'] = product;
|
||||
newItem["product_name"] = product.entity.batch_goods_name;
|
||||
newItem["channel"] = channel;
|
||||
newItem["goods"] = product;
|
||||
if (channel === 1) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/zfbreduce.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/zfbreduce.png";
|
||||
}
|
||||
if (channel === 2) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/wxreduce.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/wxreduce.png";
|
||||
}
|
||||
if (channel === 3) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logo_ysf.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logo_ysf.png";
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
const channels = product.entity.channel;
|
||||
newItem['product_name'] = product.entity.batch_goods_name;
|
||||
newItem['channel'] = channels;
|
||||
newItem['goods'] = product;
|
||||
newItem["product_name"] = product.entity.batch_goods_name;
|
||||
newItem["channel"] = channels;
|
||||
newItem["goods"] = product;
|
||||
if (channels === 1) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/alipay_icon.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/alipay_icon.png";
|
||||
}
|
||||
if (channels === 2) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/wechat_icon.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/wechat_icon.png";
|
||||
}
|
||||
if (channels === 3) {
|
||||
newItem['src'] = 'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logo_ysf.png';
|
||||
newItem["src"] =
|
||||
"https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logo_ysf.png";
|
||||
}
|
||||
break;
|
||||
default:
|
||||
|
|
|
|||
Loading…
Reference in New Issue