mirror of
https://github.com/crmeb/CRMEB.git
synced 2026-10-28 13:31:04 +00:00
fix(发票列表): 修复发票备注无法输入与订单信息不展示
- 发票备注输入框残留 Vue2 时代的 value="备注" 静态属性,Vue 每次 patch 会把该属性值回写到原生 textarea,键入内容被覆盖(实测输入 被改写为"备注");移除该属性 - 订单信息弹窗沿用旧版订单详情组件 orderDetall,其模板依赖旧订单 结构(orderInfo._status/cartInfo 等),而接口已改返回订单中台 getDetail 结构,字段缺失导致渲染报错、弹窗空白;改用订单中台 统一详情组件 OrderCenterDetail(720px 抽屉,与订单中台一致), 并删除废弃的 orderDetall.vue
This commit is contained in:
parent
f8b18c0577
commit
fb70fa2d41
@ -252,7 +252,6 @@
|
||||
<el-form-item label="发票备注:" v-if="formInline.is_invoice === 1">
|
||||
<el-input
|
||||
v-model="formInline.remark"
|
||||
value="备注"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 2, maxRows: 5 }"
|
||||
placeholder="请输入发票备注"
|
||||
@ -263,9 +262,9 @@
|
||||
</div>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="orderShow" title="订单详情" class="order_box" width="720px">
|
||||
<orderDetall :orderId="orderId" @detall="detall" v-if="orderShow"></orderDetall>
|
||||
</el-dialog>
|
||||
<el-drawer v-model="orderShow" title="订单详情" size="720px" class="order-detail-drawer">
|
||||
<OrderCenterDetail v-if="orderShow" :id="orderId" />
|
||||
</el-drawer>
|
||||
<el-dialog
|
||||
v-model="invoiceModalShow"
|
||||
title="发票信息"
|
||||
@ -283,7 +282,7 @@ import { computed, ref } from 'vue';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useMediaStore } from '@/store/module/media';
|
||||
import orderDetall from './orderDetall';
|
||||
import OrderCenterDetail from '@/pages/order/orderCenter/detail.vue';
|
||||
import {
|
||||
orderInvoiceChart,
|
||||
orderInvoiceList,
|
||||
@ -388,10 +387,6 @@ function handleMessage(event) {
|
||||
}
|
||||
}
|
||||
|
||||
function detall(e) {
|
||||
orderShow.value = e;
|
||||
}
|
||||
|
||||
function orderInfo(id) {
|
||||
orderId.value = id;
|
||||
orderShow.value = true;
|
||||
@ -543,4 +538,7 @@ function onClickTab() {
|
||||
color: var(--prev-color-primary);
|
||||
cursor: pointer;
|
||||
}
|
||||
:deep(.order-detail-drawer .el-drawer__body) {
|
||||
padding: 20px 0 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,179 +0,0 @@
|
||||
<template>
|
||||
<div class="order_detail" v-loading="spinShow" v-if="orderDetail.userInfo">
|
||||
<div class="msg-box">
|
||||
<div class="box-title">收货信息</div>
|
||||
<div class="msg-wrapper">
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>用户昵称:</span>{{ orderDetail.userInfo.nickname }}</div>
|
||||
<div class="item"><span>收货人:</span>{{ orderDetail.orderInfo.real_name }}</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>联系电话:</span>{{ orderDetail.orderInfo.user_phone }}</div>
|
||||
<div class="item"><span>收货地址:</span>{{ orderDetail.orderInfo.user_address }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg-box" style="border: none">
|
||||
<div class="box-title">订单信息</div>
|
||||
<div class="msg-wrapper">
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>订单ID:</span>{{ orderDetail.orderInfo.order_id }}</div>
|
||||
<div class="item" style="color: red">
|
||||
<span style="color: red">订单状态:</span>{{ orderDetail.orderInfo._status._title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>商品总数:</span>{{ orderDetail.orderInfo.total_num }}</div>
|
||||
<div class="item">
|
||||
<span>商品总价:</span
|
||||
>{{ parseFloat(orderDetail.orderInfo.total_price) + parseFloat(orderDetail.orderInfo.vip_true_price || 0) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>交付邮费:</span>{{ orderDetail.orderInfo.pay_postage }}</div>
|
||||
<div class="item"><span>优惠券金额:</span>{{ orderDetail.orderInfo.coupon_price }}</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>会员商品优惠:</span>{{ orderDetail.orderInfo.vip_true_price || 0.0 }}</div>
|
||||
<div class="item"><span>积分抵扣:</span>{{ orderDetail.orderInfo.deduction_price || 0.0 }}</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>实际支付:</span>{{ orderDetail.orderInfo.pay_price }}</div>
|
||||
<div class="item"><span>创建时间:</span>{{ orderDetail.orderInfo.add_time }}</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>支付方式:</span>{{ orderDetail.orderInfo._status._payType }}</div>
|
||||
<div class="item"><span>推广人:</span>{{ orderDetail.userInfo.spread_name }}</div>
|
||||
</div>
|
||||
<div class="msg-item">
|
||||
<div class="item"><span>商家备注:</span>{{ orderDetail.orderInfo.mark }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="goods-box">
|
||||
<el-table :data="orderList">
|
||||
<el-table-column label="商品ID" width="80">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.productInfo.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品名称" min-width="160">
|
||||
<template #default="scope">
|
||||
<div class="product_info">
|
||||
<img :src="scope.row.productInfo.image" alt="" />
|
||||
<p>{{ scope.row.productInfo.store_name }}</p>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品分类" min-width="160">
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.class_name }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品售价" min-width="160">
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.productInfo.price }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品数量" min-width="160">
|
||||
<template #default="scope">
|
||||
<div>{{ scope.row.cart_num }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { orderInvoiceInfo } from '@/api/order';
|
||||
|
||||
defineOptions({ name: 'order_detail' });
|
||||
|
||||
const props = defineProps({
|
||||
orderId: {
|
||||
type: [String, Number],
|
||||
default: '',
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['detall']);
|
||||
|
||||
const orderDetail = ref({});
|
||||
const orderList = ref([]);
|
||||
const spinShow = ref(false);
|
||||
|
||||
function getOrderInfo() {
|
||||
spinShow.value = true;
|
||||
orderInvoiceInfo(props.orderId)
|
||||
.then((res) => {
|
||||
spinShow.value = false;
|
||||
orderDetail.value = res.data;
|
||||
orderList.value = res.data.orderInfo.cartInfo;
|
||||
})
|
||||
.catch((err) => {
|
||||
spinShow.value = false;
|
||||
ElMessage.error(err.msg);
|
||||
emit('detall', false);
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getOrderInfo();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.order_detail {
|
||||
.msg-box {
|
||||
border-bottom: 1px solid #e8eaed;
|
||||
|
||||
.box-title {
|
||||
padding-top: 20px;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
color: var(--prev-color-text-regular);
|
||||
line-height: 15px;
|
||||
}
|
||||
|
||||
.msg-wrapper {
|
||||
margin-top: 15px;
|
||||
padding-bottom: 10px;
|
||||
|
||||
.msg-item {
|
||||
display: flex;
|
||||
|
||||
.item {
|
||||
flex: 1;
|
||||
margin-bottom: 15px;
|
||||
color: var(--prev-color-text-primary);
|
||||
font-size: 13px;
|
||||
span {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: var(--prev-color-text-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child .box-title {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.product_info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 4px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user