本次提交对全项目的国际化调用进行了规范化重构:
1. 为中文/英文语言包新增了avatar和gender的别名映射,兼容旧有headImg/sex写法
2. 修正了lang.js中的注释路径错误
3. 将所有页面和组件内的$lang调用从短路径改为带业务模块前缀的完整命名空间路径,例如将$lang('title')改为$lang('article.list.title')
4. 优化了i18n-lazy.js的注释说明,补充了正确的key命名格式示例
5. 统一了分销、订单、会员等模块的国际化key层级,确保所有语言调用路径一致
302 lines
9.2 KiB
Vue
302 lines
9.2 KiB
Vue
<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="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')" />
|
|
<view class="status-name">
|
|
<view class="status-name">
|
|
{{ orderData.order_status == 0 ? $lang('order.detail_point.status.pendingPayment') : orderData.order_status == 1 ? $lang('order.detail_point.status.completed') :
|
|
orderData.order_status == -1 ? $lang('order.detail_point.status.closed') : '' }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 店铺 -->
|
|
<view class="site-wrap" style="margin-top: -69rpx">
|
|
<view class="site-body">
|
|
<view class="goods-item">
|
|
<view class="goods-wrap">
|
|
<view @click="goDetail(orderData.exchange_goods_id)" class="goods-img">
|
|
<image :src="exchangeImage(orderData)" @error="imageError()" mode="aspectFill" show-menu-by-longpress></image>
|
|
</view>
|
|
<view class="goods-info" @click="goDetail(orderData.exchange_goods_id)">
|
|
<view class="goods-name">{{ orderData.exchange_name }}</view>
|
|
<view class="goods-sub-section">
|
|
<view>
|
|
<text class="goods-price color-base-text">
|
|
<text>
|
|
<text>{{ orderData.point }}{{ $lang('order.detail_point.goods.points') }}</text>
|
|
<text v-if="orderData.price > 0" class="price-color">
|
|
+
|
|
<text class="unit">{{ $lang('common.currencySymbol') }}</text>
|
|
{{ orderData.price }}
|
|
</text>
|
|
</text>
|
|
</text>
|
|
</view>
|
|
<view>
|
|
<text>
|
|
<text class="iconfont icon-close"></text>
|
|
{{ orderData.num }}
|
|
</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="goods-action"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 订单概况 -->
|
|
<view class="order-summary">
|
|
<view class="order-cell">
|
|
<text class="tit">{{ $lang('order.detail_point.orderInfo.orderNo') }}</text>
|
|
<view class="box">
|
|
<text class="color-title">{{ orderData.order_no }}</text>
|
|
<view class="copy" @click="$util.copy(orderData.order_no)">{{ $lang('order.detail_point.orderInfo.copy') }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="order-cell">
|
|
<text class="tit">{{ $lang('order.detail_point.orderInfo.outTradeNo') }}</text>
|
|
<view class="box">
|
|
<text class="color-title">{{ orderData.out_trade_no }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="order-cell">
|
|
<text class="tit">{{ $lang('order.detail_point.orderInfo.createTime') }}</text>
|
|
<view class="box">
|
|
<text class="color-title">{{ $util.timeStampTurnTime(orderData.create_time) }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="order-cell" v-if="orderData.close_time > 0">
|
|
<text class="tit">{{ $lang('order.detail_point.orderInfo.closeTime') }}</text>
|
|
<view class="box">
|
|
<text class="color-title">{{ $util.timeStampTurnTime(orderData.close_time) }}</text>
|
|
</view>
|
|
</view>
|
|
<!-- 联系客服 -->
|
|
<!-- <ns-contact :niushop="{ order_id: orderData.order_id }">
|
|
<view class="kefu">
|
|
<view>
|
|
<text class="iconfont icon-ziyuan"></text>
|
|
<text>联系客服</text>
|
|
</view>
|
|
</view>
|
|
</ns-contact> -->
|
|
</view>
|
|
|
|
<!-- 订单金额 -->
|
|
<view class="order-money">
|
|
<view class="order-cell" v-if="orderData.point > 0">
|
|
<text class="tit">{{ $lang('order.detail_point.amount.pointsUsed') }}</text>
|
|
<view class="box align-right">
|
|
<text class="color-base-text price-font">
|
|
<text>{{ orderData.point }}</text>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<view class="order-cell" v-if="orderData.delivery_price > 0">
|
|
<text class="tit">{{ $lang('order.detail_point.amount.deliveryFee') }}</text>
|
|
<view class="box align-right">
|
|
<text class="color-base-text price-font">
|
|
<text class="unit font-size-tag">{{ $lang('common.currencySymbol') }}</text>
|
|
<text>{{ orderData.delivery_price }}</text>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<view class="order-cell" v-if="orderData.order_money > 0">
|
|
<view class="box align-right">
|
|
<text>{{ $lang('order.detail_point.amount.totalPayable') }}</text>
|
|
<text class="color-base-text price-font">
|
|
<text class="font-size-goods-tag">{{ $lang('common.currencySymbol') }}</text>
|
|
<text class="font-size-base">{{ orderData.order_money }}</text>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="order-action" v-if="orderData.order_status == 0 && orderData.type == 1">
|
|
<view class="order-box-btn" @click="orderClose()">{{ $lang('order.detail_point.button.close') }}</view>
|
|
<view class="order-box-btn color-base-bg color-base-border color-text-white"
|
|
@click="openChoosePayment()">{{ $lang('order.detail_point.button.pay') }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<ns-goods-recommend ref="goodrecommend" route="order_detail"></ns-goods-recommend>
|
|
<!-- 选择支付方式弹窗 -->
|
|
<ns-payment ref="choosePaymentPopup" :payMoney="orderData.order_money"
|
|
@confirm="orderPay(orderData)"></ns-payment>
|
|
<loading-cover ref="loadingCover"></loading-cover>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
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(this.$util.LOGIN_PAGE_URL, {
|
|
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: this.$lang('order.detail_point.toast.orderInfoNotFound')
|
|
});
|
|
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: this.$lang('order.detail_point.modal.tip'),
|
|
content: this.$lang('order.detail_point.modal.confirmClose'),
|
|
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.$lang('order.detail_point.toast.closeSuccess')
|
|
});
|
|
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';
|
|
</style>
|
|
<style scoped>
|
|
::v-deep .sku-layer .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
|
|
max-height: unset !important;
|
|
}
|
|
</style> |