chore(组件): 组件尽量使用异步导入模式
This commit is contained in:
@@ -1,14 +1,18 @@
|
||||
<template>
|
||||
<view class="detail-container" :class="{ 'safe-area': isIphoneX }" :style="themeColor">
|
||||
<!-- 订单状态 -->
|
||||
<view class="status-wrap color-base-bg" :style="{ backgroundImage: 'url(' + $util.img('public/uniapp/order/status-wrap-bg.png') + ')' }">
|
||||
<view class="status-wrap color-base-bg"
|
||||
:style="{ backgroundImage: 'url(' + $util.img('public/uniapp/order/status-wrap-bg.png') + ')' }">
|
||||
<view class="order-status-left">
|
||||
<image v-if="orderData.order_status == 0" :src="$util.img('public/uniapp/order/order-icon.png')"/>
|
||||
<image v-if="orderData.order_status == 1" :src="$util.img('public/uniapp/order/order-icon-received.png')"/>
|
||||
<image v-if="orderData.order_status == -1" :src="$util.img('public/uniapp/order/order-icon-close.png')"/>
|
||||
<image v-if="orderData.order_status == 0" :src="$util.img('public/uniapp/order/order-icon.png')" />
|
||||
<image v-if="orderData.order_status == 1"
|
||||
:src="$util.img('public/uniapp/order/order-icon-received.png')" />
|
||||
<image v-if="orderData.order_status == -1"
|
||||
:src="$util.img('public/uniapp/order/order-icon-close.png')" />
|
||||
<view class="status-name">
|
||||
<view class="status-name">
|
||||
{{ orderData.order_status == 0 ? '待支付' : orderData.order_status == 1 ? '已完成' : orderData.order_status == -1 ? '已关闭' : '' }}
|
||||
{{ orderData.order_status == 0 ? '待支付' : orderData.order_status == 1 ? '已完成' :
|
||||
orderData.order_status == -1 ? '已关闭' : '' }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -79,7 +83,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 联系客服 -->
|
||||
<!-- <ns-contact :niushop="{ order_id: orderData.order_id }">
|
||||
<!-- <ns-contact :niushop="{ order_id: orderData.order_id }">
|
||||
<view class="kefu">
|
||||
<view>
|
||||
<text class="iconfont icon-ziyuan"></text>
|
||||
@@ -120,7 +124,8 @@
|
||||
|
||||
<view class="order-action" v-if="orderData.order_status == 0 && orderData.type == 1">
|
||||
<view class="order-box-btn" @click="orderClose()">关闭</view>
|
||||
<view class="order-box-btn color-base-bg color-base-border color-text-white" @click="openChoosePayment()">支付</view>
|
||||
<view class="order-box-btn color-base-bg color-base-border color-text-white"
|
||||
@click="openChoosePayment()">支付</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -133,171 +138,173 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import nsGoodsRecommend from '@/components/ns-goods-recommend/ns-goods-recommend.vue';
|
||||
import nsContact from '@/components/ns-contact/ns-contact.vue';
|
||||
export default {
|
||||
components: {
|
||||
nsGoodsRecommend,
|
||||
nsContact
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isIphoneX: false,
|
||||
orderId: 0,
|
||||
orderData: {
|
||||
action: []
|
||||
},
|
||||
action: {
|
||||
icon: ''
|
||||
},
|
||||
storeDetail: {}
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.order_id) this.orderId = option.order_id;
|
||||
},
|
||||
onShow() {
|
||||
this.isIphoneX = this.$util.uniappIsIPhoneX();
|
||||
export default {
|
||||
components: {
|
||||
nsGoodsRecommend: () => import('@/components/ns-goods-recommend/ns-goods-recommend.vue'),
|
||||
nsContact: () => import('@/components/ns-contact/ns-contact.vue'),
|
||||
nsPayment: () => import('@/components/payment/payment.vue'),
|
||||
loadingCover: () => import('@/components/loading-cover/loading-cover.vue'),
|
||||
nsEmpty: () => import('@/components/ns-empty/ns-empty.vue'),
|
||||
nsLogin: () => import('@/components/ns-login/ns-login.vue'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isIphoneX: false,
|
||||
orderId: 0,
|
||||
orderData: {
|
||||
action: []
|
||||
},
|
||||
action: {
|
||||
icon: ''
|
||||
},
|
||||
storeDetail: {}
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.order_id) this.orderId = option.order_id;
|
||||
},
|
||||
onShow() {
|
||||
this.isIphoneX = this.$util.uniappIsIPhoneX();
|
||||
|
||||
if (this.storeToken) {
|
||||
this.getOrderData();
|
||||
} else {
|
||||
this.$util.redirectTo('/pages_tool/login/login', {
|
||||
back: '/pages_order/detail_point?order_id=' + this.orderId
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goRefund(id) {
|
||||
this.$util.redirectTo('/pages_tool/order/refund', {
|
||||
order_goods_id: id
|
||||
});
|
||||
},
|
||||
goRefundDetail(id) {
|
||||
this.$util.redirectTo('/pages_tool/order/refund_detail', {
|
||||
order_goods_id: id
|
||||
});
|
||||
},
|
||||
goDetail(id) {
|
||||
this.$util.redirectTo('/pages_promotion/point/detail', {
|
||||
id: id
|
||||
});
|
||||
},
|
||||
navigateBack() {
|
||||
this.$util.goBack();
|
||||
},
|
||||
getOrderData() {
|
||||
this.$api.sendRequest({
|
||||
url: '/pointexchange/api/order/info',
|
||||
data: {
|
||||
order_id: this.orderId
|
||||
},
|
||||
success: res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.code >= 0) {
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
this.orderData = res.data;
|
||||
if (this.orderData.delivery_store_info != '') this.orderData.delivery_store_info =
|
||||
JSON.parse(this.orderData.delivery_store_info);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: '未获取到订单信息!'
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.$util.redirectTo('/pages_order/list');
|
||||
}, 1500);
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
this.getOrderData();
|
||||
},
|
||||
orderClose() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定关闭此次兑换?',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
this.$api.sendRequest({
|
||||
url: '/pointexchange/api/order/close',
|
||||
data: {
|
||||
order_id: this.orderData.order_id
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
this.$util.showToast({
|
||||
title: '关闭成功'
|
||||
});
|
||||
this.getOrderData();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 显示选择支付方式弹框
|
||||
openChoosePayment() {
|
||||
this.$refs.choosePaymentPopup.open();
|
||||
},
|
||||
orderPay() {
|
||||
uni.setStorageSync('paySource', 'pointexchange');
|
||||
this.$refs.choosePaymentPopup.getPayInfo(this.orderData.out_trade_no);
|
||||
},
|
||||
exchangeImage(data) {
|
||||
let img = '';
|
||||
switch (data.type) {
|
||||
case 1:
|
||||
img = this.$util.img(data.exchange_image, {
|
||||
size: 'mid'
|
||||
});
|
||||
break;
|
||||
case 2:
|
||||
img = data.exchange_image ? this.$util.img(data.exchange_image) : this.$util.img(
|
||||
'public/uniapp/point/coupon.png');
|
||||
break;
|
||||
case 3:
|
||||
img = data.exchange_image ? this.$util.img(data.exchange_image) : this.$util.img(
|
||||
'public/uniapp/point/hongbao.png');
|
||||
break;
|
||||
}
|
||||
return img;
|
||||
},
|
||||
imageError() {
|
||||
switch (this.orderData.type) {
|
||||
case 2:
|
||||
this.orderData.exchange_image = this.$util.img('public/uniapp/point/coupon.png');
|
||||
break;
|
||||
case 3:
|
||||
this.orderData.exchange_image = this.$util.img('public/uniapp/point/hongbao.png');
|
||||
break;
|
||||
default:
|
||||
this.orderData.exchange_image = this.$util.getDefaultImage().goods;
|
||||
}
|
||||
this.$forceUpdate();
|
||||
},
|
||||
},
|
||||
filters: {
|
||||
abs(value) {
|
||||
return Math.abs(parseFloat(value)).toFixed(2);
|
||||
}
|
||||
if (this.storeToken) {
|
||||
this.getOrderData();
|
||||
} else {
|
||||
this.$util.redirectTo('/pages_tool/login/login', {
|
||||
back: '/pages_order/detail_point?order_id=' + this.orderId
|
||||
});
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
goRefund(id) {
|
||||
this.$util.redirectTo('/pages_tool/order/refund', {
|
||||
order_goods_id: id
|
||||
});
|
||||
},
|
||||
goRefundDetail(id) {
|
||||
this.$util.redirectTo('/pages_tool/order/refund_detail', {
|
||||
order_goods_id: id
|
||||
});
|
||||
},
|
||||
goDetail(id) {
|
||||
this.$util.redirectTo('/pages_promotion/point/detail', {
|
||||
id: id
|
||||
});
|
||||
},
|
||||
navigateBack() {
|
||||
this.$util.goBack();
|
||||
},
|
||||
getOrderData() {
|
||||
this.$api.sendRequest({
|
||||
url: '/pointexchange/api/order/info',
|
||||
data: {
|
||||
order_id: this.orderId
|
||||
},
|
||||
success: res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.code >= 0) {
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
this.orderData = res.data;
|
||||
if (this.orderData.delivery_store_info != '') this.orderData.delivery_store_info =
|
||||
JSON.parse(this.orderData.delivery_store_info);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: '未获取到订单信息!'
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.$util.redirectTo('/pages_order/list');
|
||||
}, 1500);
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
this.getOrderData();
|
||||
},
|
||||
orderClose() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定关闭此次兑换?',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
this.$api.sendRequest({
|
||||
url: '/pointexchange/api/order/close',
|
||||
data: {
|
||||
order_id: this.orderData.order_id
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
this.$util.showToast({
|
||||
title: '关闭成功'
|
||||
});
|
||||
this.getOrderData();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 显示选择支付方式弹框
|
||||
openChoosePayment() {
|
||||
this.$refs.choosePaymentPopup.open();
|
||||
},
|
||||
orderPay() {
|
||||
uni.setStorageSync('paySource', 'pointexchange');
|
||||
this.$refs.choosePaymentPopup.getPayInfo(this.orderData.out_trade_no);
|
||||
},
|
||||
exchangeImage(data) {
|
||||
let img = '';
|
||||
switch (data.type) {
|
||||
case 1:
|
||||
img = this.$util.img(data.exchange_image, {
|
||||
size: 'mid'
|
||||
});
|
||||
break;
|
||||
case 2:
|
||||
img = data.exchange_image ? this.$util.img(data.exchange_image) : this.$util.img(
|
||||
'public/uniapp/point/coupon.png');
|
||||
break;
|
||||
case 3:
|
||||
img = data.exchange_image ? this.$util.img(data.exchange_image) : this.$util.img(
|
||||
'public/uniapp/point/hongbao.png');
|
||||
break;
|
||||
}
|
||||
return img;
|
||||
},
|
||||
imageError() {
|
||||
switch (this.orderData.type) {
|
||||
case 2:
|
||||
this.orderData.exchange_image = this.$util.img('public/uniapp/point/coupon.png');
|
||||
break;
|
||||
case 3:
|
||||
this.orderData.exchange_image = this.$util.img('public/uniapp/point/hongbao.png');
|
||||
break;
|
||||
default:
|
||||
this.orderData.exchange_image = this.$util.getDefaultImage().goods;
|
||||
}
|
||||
this.$forceUpdate();
|
||||
},
|
||||
},
|
||||
filters: {
|
||||
abs(value) {
|
||||
return Math.abs(parseFloat(value)).toFixed(2);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './public/css/detail.scss';
|
||||
@import './public/css/detail.scss';
|
||||
</style>
|
||||
<style scoped>
|
||||
/deep/ .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
|
||||
max-height: unset !important;
|
||||
}
|
||||
/deep/ .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
|
||||
max-height: unset !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user