DMJS-IT
/
merchant-web
12
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 订单管理样式

This commit is contained in:
lzhizhao 2025-10-01 11:47:51 +08:00
parent 327e73d30a
commit 270396a95d
1 changed files with 76 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
src/views/modules/operation-management/order/index.vue
View File

@ -118,72 +118,76 @@
<el-table-column type="expand" width="50">
<template slot-scope="props">
<div class="expand-content">
<div class="shop-order" v-for="(shopOrder, shopIndex) in props.row.shopOrderList" :key="shopIndex">
<!-- 二级子列表: 店铺订单信息 -->
<el-table
:data="[shopOrder]"
size="small"
style="width: 100%; margin-bottom: 10px;"
:show-header="true">
<el-table-column label="序号" width="50">
<template slot-scope="shopScope">
{{ shopIndex + 1 }}
</template>
</el-table-column>
<el-table-column prop="shopOrderNo" label="店铺订单号" width="180"></el-table-column>
<el-table-column prop="shopName" label="店铺名称" width="100">
<template slot-scope="shopScope">
{{ shopScope.row.shopName || "暂无" }}
</template>
</el-table-column>
<el-table-column prop="status" label="订单状态" width="120">
<template slot-scope="shopScope">
<el-tag :type="getShopStatusType(shopScope.row.status)" size="small">
{{ getShopStatusText(shopScope.row.status) }}
</el-tag>
</template>
</el-table-column>
</el-table>
<!-- 三级子列表: 商品信息 -->
<el-table
:data="shopOrder.productOrderList"
size="small"
style="width: 100%"
:show-header="true">
<el-table-column label="序号" width="50">
<template slot-scope="productScope">
{{ productScope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="productName" label="商品名称" width="150"></el-table-column>
<el-table-column prop="productCount" label="商品数量" width="80"></el-table-column>
<el-table-column label="商品原价" width="100">
<template slot-scope="productScope">
¥ {{ (productScope.row.originPrice / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column label="商品终价" width="100">
<template slot-scope="productScope">
¥ {{ (productScope.row.finalPrice / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column label="商品订单金额" width="120">
<template slot-scope="productScope">
¥ {{ (productScope.row.productOrderMoney / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column prop="productImg" label="商品图片" width="80">
<template slot-scope="productScope">
<el-image v-if="productScope.row.productImg"
:src="productScope.row.productImg"
style="width: 40px; height: 40px;"
fit="cover"
:preview-src-list="[productScope.row.productImg]"></el-image>
</template>
</el-table-column>
</el-table>
</div>
<!-- 二级子列表: 店铺订单信息 -->
<el-table
:data="props.row.shopOrderList"
size="small"
style="width: 100%;"
row-key="shopOrderNo"
:expand-row-keys="expandedShopRows[props.row.unitOrderNo] || []"
@expand-change="(row, expanded) => handleShopExpandChange(props.row, expanded)"
:show-header="true">
<el-table-column type="expand">
<template slot-scope="shopScope">
<!-- 三级子列表: 商品信息 -->
<el-table
:data="shopScope.row.productOrderList"
size="small"
style="width: 100%"
:show-header="true">
<el-table-column label="序号">
<template slot-scope="productScope">
{{ productScope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="productName" label="商品名称"></el-table-column>
<el-table-column prop="productCount" label="商品数量"></el-table-column>
<el-table-column label="商品原价">
<template slot-scope="productScope">
¥ {{ (productScope.row.originPrice / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column label="商品终价">
<template slot-scope="productScope">
¥ {{ (productScope.row.finalPrice / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column label="商品订单金额">
<template slot-scope="productScope">
¥ {{ (productScope.row.productOrderMoney / 100).toFixed(2) }}
</template>
</el-table-column>
<el-table-column prop="productImg" label="商品图片">
<template slot-scope="productScope">
<el-image v-if="productScope.row.productImg"
:src="productScope.row.productImg"
style="width: 40px; height: 40px;"
fit="cover"
:preview-src-list="[productScope.row.productImg]"></el-image>
</template>
</el-table-column>
</el-table>
</template>
</el-table-column>
<el-table-column label="序号">
<template slot-scope="shopScope">
{{ shopScope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="shopOrderNo" label="店铺订单号"></el-table-column>
<el-table-column prop="shopName" label="店铺名称">
<template slot-scope="shopScope">
{{ shopScope.row.shopName || "暂无" }}
</template>
</el-table-column>
<el-table-column prop="status" label="订单状态">
<template slot-scope="shopScope">
<el-tag :type="getShopStatusType(shopScope.row.status)" size="small">
{{ getShopStatusText(shopScope.row.status) }}
</el-tag>
</template>
</el-table-column>
</el-table>
</div>
</template>
</el-table-column>
@ -293,6 +297,7 @@ export default {
},
loading: false,
expandedRows: [],
expandedShopRows: {},
};
},
created() {
@ -300,6 +305,11 @@ export default {
this.fetchOverview();
},
methods: {
handleShopExpandChange(unitOrder, expandedList) {
const unitOrderNo = unitOrder.unitOrderNo;
const expandedKeys = expandedList.map(item => item.shopOrderNo);
this.$set(this.expandedShopRows, unitOrderNo, expandedKeys);
},
getCommonParams() {
const params = {
receiverName: this.searchForm.receiverName || null,