init
This commit is contained in:
211
pages/order/detail.vue
Normal file
211
pages/order/detail.vue
Normal file
@@ -0,0 +1,211 @@
|
||||
<template>
|
||||
<view class="page-content">
|
||||
<nut-steps :current="detail.progress">
|
||||
<nut-step title="待付款">1</nut-step>
|
||||
<nut-step title="待发货">2</nut-step>
|
||||
<nut-step title="待收货">3</nut-step>
|
||||
<nut-step title="已完成">4</nut-step>
|
||||
</nut-steps>
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="address-inner" v-if="detail.address_info">
|
||||
<text>{{detail.address_info.user_name}} - {{detail.address_info.tel_number}}</text>
|
||||
<text>{{detail.address_info.province_name + detail.address_info.city_name + detail.address_info.county_name + detail.address_info.street_name + detail.address_info.detail_info_new}}</text>
|
||||
</view>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<nut-cell-group>
|
||||
<!-- <nut-cell is-link v-for="(goods,idx) in detail.goods" :key="idx"
|
||||
@click="navigateTo('/pages/mall/item/index?id=' + goods.goods_id)">
|
||||
<template #title>
|
||||
<view class="detail">
|
||||
<view class="name">
|
||||
<nut-tag custom-color="#1a1a1a">{{goods.snapshot_info.degree.degree_name}}</nut-tag>
|
||||
<text>{{goods.goods_name}}</text>
|
||||
</view>
|
||||
<view class="sku">{{goods.content}}</view>
|
||||
</view>
|
||||
</template>
|
||||
</nut-cell> -->
|
||||
|
||||
<nut-cell v-for="(goods,index) in detail.goods" :key="index" center
|
||||
@click="navigateTo('/pages/mall/detail?id=' + goods.goods_id)">
|
||||
<template #title>
|
||||
<view class="goods-info-row">
|
||||
<view class="left-text">
|
||||
<view class="goods-name">
|
||||
<nut-tag custom-color="#1a1a1a">{{goods.snapshot_info.degree.degree_name}}</nut-tag>
|
||||
<text style="margin-left: 10rpx;">{{goods.goods_name}}</text>
|
||||
</view>
|
||||
<text class="goods-no">串号：{{goods.goods_no}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template #link>
|
||||
<nut-price :price="goods.goods_price" size="small" :need-symbol="true" />
|
||||
</template>
|
||||
</nut-cell>
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell>
|
||||
<view class="total-price-inner">
|
||||
<text>商品总额</text>
|
||||
<nut-price :price="detail.pay_price" size="normal" :need-symbol="true" />
|
||||
</view>
|
||||
</nut-cell>
|
||||
<!-- <nut-cell>
|
||||
<view class="total-price-inner">
|
||||
<view>
|
||||
<text>邮费</text>
|
||||
</view>
|
||||
<view>
|
||||
<nut-price :price="0" size="normal" :need-symbol="true" />
|
||||
</view>
|
||||
</view>
|
||||
</nut-cell> -->
|
||||
</nut-cell-group>
|
||||
|
||||
<nut-cell-group>
|
||||
<nut-cell title="订单编号" :desc="detail.order_no" />
|
||||
<nut-cell title="下单时间" :desc="detail.create_time" />
|
||||
</nut-cell-group>
|
||||
|
||||
<nut-cell-group v-if="detail.progress >= 3">
|
||||
<nut-cell title="物流公司" :desc="detail.express_company" />
|
||||
<nut-cell title="物流单号" :desc="detail.express_no" />
|
||||
</nut-cell-group>
|
||||
|
||||
|
||||
<view v-if="detail.progress === 1 && !audit" class="wechat-img-inner">
|
||||
<nut-button type="primary" block @click="showPayImgs()">
|
||||
点我付款
|
||||
</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
fetchOrderDetail
|
||||
} from '@/api/order';
|
||||
import {
|
||||
navigateTo,
|
||||
} from '@/utils/helper';
|
||||
|
||||
|
||||
import {
|
||||
fetchGetConfig
|
||||
} from '@/api/config';
|
||||
|
||||
// 审核模式 默认开启 true
|
||||
const audit = ref(true);
|
||||
|
||||
// 订单ID
|
||||
const id = ref(0)
|
||||
// 订单详情
|
||||
const detail = reactive({})
|
||||
// 支付码
|
||||
const images = ref([]);
|
||||
|
||||
onLoad((options) => {
|
||||
id.value = options.id
|
||||
})
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 页面显示生命周期钩子
|
||||
* 每次页面显示时都会执行
|
||||
*/
|
||||
onShow(() => {
|
||||
// 获取配置
|
||||
getConfig()
|
||||
// 获取订单详情
|
||||
fetchOrderDetail(id.value).then(res => {
|
||||
Object.assign(detail, res)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// 获取配置
|
||||
const getConfig = () => {
|
||||
fetchGetConfig().then(res => {
|
||||
console.log('getConfig=====>', res)
|
||||
audit.value = res.appConfig.is_audit == 1
|
||||
console.log(res.appConfig.pay_imgs);
|
||||
let pay_imgs = JSON.parse(res.appConfig.pay_imgs) || [];
|
||||
let wechat_imgs = JSON.parse(res.appConfig.wechat_imgs) || [];
|
||||
let pay_imgs_arr = pay_imgs.map(item => item.file_path) || [];
|
||||
let wechat_imgs_arr = wechat_imgs.map(item => item.file_path) || [];
|
||||
const merged_imgs_arr = pay_imgs_arr.concat(wechat_imgs_arr);
|
||||
images.value = merged_imgs_arr;
|
||||
})
|
||||
}
|
||||
|
||||
// 显示支付码
|
||||
const showPayImgs = () => {
|
||||
if (images.value.length === 0) {
|
||||
uni.showToast({
|
||||
title: '暂无图片',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log('preview images:', images);
|
||||
uni.previewImage({
|
||||
urls: images.value
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.address-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.total-price-inner {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
// flex-direction: row;
|
||||
view:nth-child(2) {
|
||||
color: #fa2c19;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat-img-inner {
|
||||
margin-top: 60rpx;
|
||||
padding: 0rpx 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
// gap: 5px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user