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