Commit 9cbbcc39 authored by 石建新(贵阳日报)'s avatar 石建新(贵阳日报)
parents ddcabf69 0c5907e5
......@@ -9,10 +9,10 @@ export function getOrderList(data) {
});
}
// 订单列表接口
// 订单详情接口
export function getOrderDetail(data) {
return request({
url: '/sgyrdd/sgyOrder/groupBuy/orderInfo',
url: '/sgyrdd/sgyOrder/orderInfo',
method: 'GET',
data,
});
......
......@@ -9,20 +9,20 @@
name="check-outline"
size="26px"
color="#333"
v-if="orderDetail.status == 5 || orderDetail.status == 7"
v-if="orderDetail.orderStore.status == 5 || orderDetail.orderStore.status == 7"
></wd-icon>
<wd-icon
name="close-outline"
size="26px"
color="#333"
v-if="orderDetail.status == 6"
v-if="orderDetail.orderStore.status == 6"
></wd-icon>
<view class="status-text">{{ statusList[orderDetail.status] }}</view>
<view class="status-text">{{ statusList[orderDetail.orderStore.status] }}</view>
</view>
<view class="detail" v-if="orderDetail.status == 3">
请在{{ orderDetail.receiverTime.slice(0, 4) }}{{
orderDetail.receiverTime.slice(5, 7)
}}{{ orderDetail.receiverTime.slice(8, 10) }}前到店消费
<view class="detail" v-if="orderDetail.orderStore.subStatus == 3">
请在{{ orderDetail.orderStore.receiverTime.slice(0, 4) }}{{
orderDetail.orderStore.receiverTime.slice(5, 7)
}}{{ orderDetail.orderStore.receiverTime.slice(8, 10) }}前到店消费
</view>
</view>
......@@ -52,30 +52,42 @@
<image :src="qrcode" class="qr"></image>
</view>
<view class="info-box">
<view class="between" v-if="orderDetail.status == 2 || orderDetail.status == 3">
<view
class="between"
v-if="orderDetail.orderStore.subStatus == 2 || orderDetail.orderStore.subStatus == 3"
>
<view class="column">
<text class="title">券码信息(1张可用)</text>
<text class="text">{{ orderDetail.receiverTime }} 到期</text>
<text class="text">{{ orderDetail.orderStore.receiverTime }} 到期</text>
</view>
<view class="btn" @tap="handleRefund(orderDetail.orderStore.orderNumber)">
申请退款
</view>
<view class="btn" @tap="handleRefund(orderDetail.orderNumber)">申请退款</view>
</view>
<view class="between">
<view class="column">
<text class="title1" v-if="orderDetail.status != 2 || orderDetail.status != 3">
<text
class="title1"
v-if="
orderDetail.orderStore.subStatus != 2 || orderDetail.orderStore.subStatus != 3
"
>
券码信息
</text>
<text
:class="
orderDetail.status == 5 || orderDetail.status == 6 || orderDetail.status == 7
orderDetail.orderStore.subStatus == 5 ||
orderDetail.orderStore.subStatus == 6 ||
orderDetail.orderStore.subStatus == 7
? 'linethrough'
: 'phone'
"
>
{{ orderDetail.orderNumber.slice(6) }}
{{ orderDetail.orderStore.orderNumber.slice(6) }}
</text>
</view>
<text class="text">{{ orderStatusList[orderDetail.status] }}</text>
<text class="text">{{ orderStatusList[orderDetail.orderStore.subStatus] }}</text>
</view>
</view>
</view>
......@@ -153,14 +165,17 @@
<!-- 订单详情 -->
<view class="info">
<view class="tips padding">
<text class="title">实付金额:¥{{ orderDetail.actualTotal }}</text>
<text class="title">实付金额:¥{{ orderDetail.orderStore.actualTotal }}</text>
<view class="tips-box">
<view class="row">
<text class="name">订单号</text>
<text class="colon"></text>
<view class="copybox">
<text class="text">{{ orderDetail.orderNumber.slice(6) }}</text>
<view class="copy" @tap="copyTextToClipboard(orderDetail.orderNumber.slice(6))">
<text class="text">{{ orderDetail.orderStore.orderNumber.slice(6) }}</text>
<view
class="copy"
@tap="copyTextToClipboard(orderDetail.orderStore.orderNumber.slice(6))"
>
复制
</view>
</view>
......@@ -168,17 +183,17 @@
<view class="row">
<text class="name">手机号</text>
<text class="colon"></text>
<text class="text">{{ maskPhoneNumber(orderDetail.receiverMobile) }}</text>
<text class="text">{{ maskPhoneNumber(orderDetail.orderStore.receiverMobile) }}</text>
</view>
<view class="row" v-if="orderDetail.payTime">
<view class="row" v-if="orderDetail.orderStore.payTime">
<text class="name">付款时间</text>
<text class="colon"></text>
<text class="text">{{ orderDetail.payTime }}</text>
<text class="text">{{ orderDetail.orderStore.payTime }}</text>
</view>
<view class="row">
<text class="name">下单时间</text>
<text class="colon"></text>
<text class="text">{{ orderDetail.createTime }}</text>
<text class="text">{{ orderDetail.orderStore.createTime }}</text>
</view>
<view class="row">
<text class="name">数量</text>
......@@ -188,17 +203,17 @@
<view class="row">
<text class="name">总价</text>
<text class="colon"></text>
<text class="text">{{ orderDetail.total }}</text>
<text class="text">{{ orderDetail.orderStore.total }}</text>
</view>
<view class="row">
<text class="name">优惠明细</text>
<text class="colon"></text>
<text class="text">-¥{{ orderDetail.reduceAmount }}</text>
<text class="text">-¥{{ orderDetail.orderStore.reduceAmount }}</text>
</view>
<view class="row">
<text class="name">实付</text>
<text class="colon"></text>
<text class="text">{{ orderDetail.actualTotal }}</text>
<text class="text">{{ orderDetail.orderStore.actualTotal }}</text>
</view>
</view>
</view>
......@@ -260,11 +275,11 @@ const orderDetail = ref();
const getDetail = async () => {
const res = await getOrderDetail({ orderNumber: orderNumber.value });
orderDetail.value = res.data;
if (orderDetail.value.status === '2' || orderDetail.value.status === '3') {
codeDetail(orderDetail.value.orderNumber);
if (orderDetail.value.orderStore.status === '2' || orderDetail.value.orderStore.status === '3') {
codeDetail(orderDetail.value.orderStore.orderNumber);
}
getProductDetail(orderDetail.value.orderItems[0].prodId);
getShopMailDetail(orderDetail.value.shopId);
getShopMailDetail(orderDetail.value.baseOrder.shopId);
};
/**
......
......@@ -13,12 +13,12 @@
<view class="title">{{ item.shopName }}</view>
</view>
<view class="right">
<span class="status">{{ statusList[item.status] }}</span>
<span class="status">{{ stateList[item.status].label }}</span>
<wd-count-down
:time="item.countDown"
:format="format"
@finish="onFinish(item.orderNumber)"
v-if="item.status == 1"
v-if="item.status === 'not_pay'"
/>
</view>
</view>
......@@ -36,14 +36,14 @@
<view class="btn">
<view
class="btn-info"
v-if="item.status == 5 || item.status == 6"
v-if="item.status === 'complete' || item.status == 'cancel'"
@tap="handleDelete(item.orderNumber)"
>
删除
</view>
<view
class="btn-info"
v-if="item.status == 3 || item.status == 2"
v-if="item.status === 'receive' || item.status == 'not_use'"
@tap="handleQrcode(item)"
>
核销码
......@@ -51,28 +51,40 @@
<view
class="btn-info"
@tap="handleCancel(item.orderNumber)"
v-if="item.status == 1"
v-if="item.status === 'not_pay'"
>
取消订单
</view>
<view class="btn-info" v-if="item.status == 4" @tap="handleRemark(item)">
<view
class="btn-info"
v-if="item.status === 'not_eval'"
@tap="handleRemark(item)"
>
评价
</view>
<view class="btn-info" @tap="callShopPhone(item.shopTel)">联系商家</view>
<view class="btn-error" v-if="item.status == 7">售后详情</view>
<view
class="btn-error"
v-if="item.status == 2 || item.status == 3 || item.status == 4"
v-if="
item.status === 'receive' ||
item.status === 'not_use' ||
item.status === 'not_eval'
"
@click="handleRefund(item)"
>
申请退款
</view>
<view class="btn-error" v-if="item.status == 5" @tap="anotherOrder(item)">
<view
class="btn-error"
v-if="item.status === 'complete'"
@tap="anotherOrder(item)"
>
再来一单
</view>
<view
class="btn-error"
v-if="item.status == 1"
v-if="item.status === 'not_pay'"
@tap="openPayment(item.orderNumber, index)"
>
立即支付
......@@ -101,52 +113,53 @@ import {
repaymentApi,
getOrderDetail,
} from '@/api/order';
import { getOrderDic } from '@/utils/orderDic';
const fileDomain = import.meta.env.VITE_APP_IMG_URL;
const stateList = ref();
onLoad(() => {
const orderDic = getOrderDic();
stateList.value = orderDic.reduce((obj, item) => {
obj[item.baseStatus] = item;
return obj;
}, {});
getList();
});
const tabs = ref([
{
name: '全部',
value: '0',
value: 'all',
},
{
name: '待付款',
value: '1',
value: 'not_pay',
},
{
name: '待使用',
value: '3',
value: 'not_use',
},
{
name: '待评价',
value: '4',
value: 'not_eval',
},
{
name: '已完成',
value: '5',
value: 'complete',
},
{
name: '退款/售后',
value: '7',
value: 'after_sales',
},
]);
const tab = ref('0');
const statusList = ref({
1: '待付款',
3: '待消费',
4: '待评价',
5: '已完成',
6: '已取消',
7: '已退款',
});
onShow(() => {
console.log(pendingPaymentOrder.value);
if (pendingPaymentOrder.value) {
// 查询订单状态决定是否支付
getOrderDetail({ orderNumber: pendingPaymentOrder.value }).then((res) => {
console.log(res.data.status);
switch (res.data.status) {
console.log(res.data.baseOrder.subStatus);
switch (res.data.baseOrder.subStatus) {
case '1':
xma.showToast({
title: '支付失败',
......@@ -193,11 +206,12 @@ const catalog = reactive({
startDate: '',
endDate: '',
keyword: '',
status: '', // 订单状态,1-待付款,2-待接单,3-待取货,4-待评价,5-完成,6-取消,7-退款
status: '', // 待付款-not_pay,待使用-not_use,待评价not_eval,退款-after_sales
orderType: 'store', // 团购到店-store,外卖订单-takeaway,筑农物流logistics
});
const getList = async () => {
catalog.status = tab.value;
if (tab.value === '0') {
if (tab.value === 'all') {
catalog.status = '';
}
catalog.current++;
......@@ -206,7 +220,8 @@ const getList = async () => {
if (res.data.records.length > 0) {
res.data.records.forEach((item) => {
// 待付款倒计时计算
if (item.status === '1') {
if (item.status === 'not_pay') {
console.log(item.status);
item.countDown = calculateCountdown(item.createTime);
}
});
......@@ -215,7 +230,6 @@ const getList = async () => {
}
state.value = 'finished';
};
getList();
const handleChange = (e) => {
tab.value = e.name;
......
......@@ -14,21 +14,122 @@
<text>¥0.01</text>
</view>
</view>
<view class="item-buttom">
<view class="item-buttom" style="padding-top: 60rpx">
<text></text>
<text>1</text>
<text class="num">1</text>
<text>件商品 实付款</text>
<text></text>
<text class="icon"></text>
<text class="price">0.01</text>
</view>
</view>
<view class="content-item">
<view class="item-buttom">
<text>2024-08-02 10:12:16</text>
</view>
</view>
<view class="content-between">
<text>退款金额</text>
<text class="price">¥0.01</text>
</view>
<view class="content-between">
<text>相关图片</text>
<wd-upload
:file-list="fileList"
image-mode="aspectFill"
:action="action"
@change="handleChange"
></wd-upload>
</view>
<view class="content-between" @tap="showPop = true">
<text>退款原因</text>
<view class="rightbox">
<text>选择退款原因</text>
<wd-icon name="arrow-right" size="22px"></wd-icon>
</view>
</view>
</view>
<view class="btn">提交</view>
</view>
</view>
<wd-popup
v-model="showPop"
position="bottom"
:safe-area-inset-bottom="true"
custom-style="border-radius: 16rpx 16rpx 0 0"
@close="showPop = false"
lockScroll
>
<view class="pop-content">
<view class="header">
<view class="title">退款原因</view>
<wd-icon name="close" size="20" color="#999" @tap="showPop = false"></wd-icon>
</view>
<radio-group style="width: 100%" @change="radioChange">
<view class="resaon" v-for="(item, index) in reasonList" :key="index">
<view class="resaon-item">
<text>{{ item.name }}</text>
<radio
class="radio"
color="#f62828"
:value="item.id"
:checked="item.id == selectType"
/>
</view>
</view>
<textarea
v-if="selectType == 4"
v-model="otherReason"
placeholder="请填写原因"
placeholder-style="font-size:28rpx;color: #c0c4cc;"
></textarea>
</radio-group>
<view class="btn">确认</view>
</view>
</wd-popup>
</template>
<script setup>
import Header from '@/pages/order/components/Header/index.vue';
const fileList = ref([]);
const action = ref('');
function handleChange({ fileList: files }) {
console.log(files);
fileList.value = files;
}
const showPop = ref(false);
const selectType = ref(0);
const reasonList = ref([
{
id: '0',
name: '不想要了',
},
{
id: '1',
name: '协商一致退款',
},
{
id: '2',
name: '缺货',
},
{
id: '3',
name: '七天无理由',
},
{
id: '4',
name: '其他',
},
]);
const otherReason = ref('');
function radioChange(evt) {
const { value } = evt.detail;
selectType.value = value;
}
</script>
<style lang="scss" scoped>
......@@ -44,11 +145,11 @@ page {
padding: 108rpx 10rpx 0;
display: flex;
flex-direction: column;
gap: 20rpx;
gap: 60rpx;
.content-box {
background-color: #fff;
border-radius: 16rpx;
border-radius: 8rpx;
padding: 0 20rpx;
display: flex;
flex-direction: column;
......@@ -63,9 +164,156 @@ page {
}
.item-top {
display: flex;
gap: 20rpx;
.item-img {
width: 120rpx;
height: 120rpx;
border-radius: 6rpx;
}
.item-info {
display: flex;
flex-direction: column;
gap: 20rpx;
text {
font-size: 30rpx;
color: #333;
}
}
}
.item-buttom {
display: flex;
justify-content: flex-end;
align-items: baseline;
text {
font-size: 24rpx;
color: #b5b5b5;
}
.num {
color: #606060;
font-weight: bold;
}
.icon {
color: #606060;
}
.price {
font-size: 30rpx;
color: #606060;
}
}
}
.content-between {
border-bottom: 1rpx solid #f3f3f3;
padding: 20rpx 0;
display: flex;
justify-content: space-between;
text {
color: #747474;
font-size: 30rpx;
}
.price {
color: #e0302f;
}
.rightbox {
display: flex;
font-size: 30rpx;
color: #b4b4b4;
}
}
}
}
.btn {
display: flex;
align-items: center;
justify-content: center;
height: 80rpx;
width: 100%;
background-color: #f8446b;
color: #fff;
font-size: 30rpx;
border-radius: 8rpx;
}
}
.pop-content {
display: flex;
flex-direction: column;
padding: 20rpx;
.header {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 30rpx;
.title {
font-size: 28rpx;
color: #333;
font-weight: bold;
text-align: center;
width: 100%;
}
}
textarea {
width: 100%;
height: 200rpx;
border: 1rpx solid #e0e0e0;
padding: 20rpx;
border-radius: 8rpx;
box-sizing: border-box;
margin-top: 20rpx;
font-size: 28rpx;
}
.resaon {
display: flex;
flex-direction: column;
gap: 20rpx;
.resaon-item {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 10rpx 0;
border-bottom: 1rpx solid #f3f3f3;
text {
font-size: 28rpx;
color: #333;
}
radio {
transform: scale(0.8);
}
}
}
.btn {
margin-top: 100rpx;
display: flex;
align-items: center;
justify-content: center;
height: 58rpx;
color: #fff;
font-size: 28rpx;
background-color: #f62828;
border-radius: 36rpx;
width: 100%;
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment