refactor(store-product): 重构商品列表展示

- 将商品名称列拆分为多个子列,展示更多价格信息
- 合并供货价、商户价和零售价列,以节省空间
- 将库存和销量列合并为一个列,提高信息密度
- 调整部分列的显示顺序和样式
This commit is contained in:
mkm 2024-11-19 16:36:38 +08:00
parent ca4ef3df88
commit 40dcdd2682
1 changed files with 24 additions and 23 deletions

View File

@ -117,12 +117,20 @@
/> />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column label="商品名称" prop="store_name" show-overflow-tooltip>
label="商品名称" <template #default="{ row }">
prop="store_name" <div>{{ row.store_name }}</div>
min-width="200" <div>
show-overflow-tooltip 供货价:<span style="color: red">{{ row.purchase }}</span>
/> </div>
<div>
商户价: <span style="color: red">{{ row.cost }}</span>
</div>
<div>
零售价:<span style="color: red">{{ row.price }}</span>
</div>
</template>
</el-table-column>
<el-table-column label="分类" prop="cate_name" show-overflow-tooltip /> <el-table-column label="分类" prop="cate_name" show-overflow-tooltip />
<el-table-column label="单位" prop="unit_name" show-overflow-tooltip /> <el-table-column label="单位" prop="unit_name" show-overflow-tooltip />
<el-table-column <el-table-column
@ -130,30 +138,23 @@
prop="product_type_name" prop="product_type_name"
show-overflow-tooltip show-overflow-tooltip
/> />
<el-table-column label="供货价" prop="purchase" show-overflow-tooltip /> <!-- <el-table-column label="供货价" prop="purchase" show-overflow-tooltip />
<el-table-column label="商户价" prop="cost" show-overflow-tooltip /> <el-table-column label="商户价" prop="cost" show-overflow-tooltip /> -->
<!-- <el-table-column <!-- <el-table-column
label="会员价" label="会员价"
prop="vip_price" prop="vip_price"
min-width="120" min-width="120"
show-overflow-tooltip show-overflow-tooltip
/> --> /> -->
<el-table-column label="零售价" prop="price" show-overflow-tooltip /> <!-- <el-table-column label="零售价" prop="price" show-overflow-tooltip /> -->
<el-table-column label="起批量" prop="batch" show-overflow-tooltip /> <el-table-column label="起批量" prop="batch" show-overflow-tooltip />
<el-table-column <el-table-column label="毛利率" prop="rose" show-overflow-tooltip />
label="毛利率" <el-table-column label="库存/销量" prop="stock" show-overflow-tooltip>
prop="rose" <template #default="{ row }">
min-width="100" <span class="mr-1">{{ row.stock }}</span
show-overflow-tooltip >/<span class="ml-1">{{ row.sales }}</span>
/> </template>
<el-table-column label="售卖库存" prop="stock" show-overflow-tooltip /> </el-table-column>
<!-- <el-table-column
label="兑换库存"
prop="swap"
min-width="100"
show-overflow-tooltip
/> -->
<el-table-column label="销量" prop="sales" show-overflow-tooltip />
<!-- <el-table-column label="商品来源" prop="system_store_name" min-width="200" show-overflow-tooltip /> --> <!-- <el-table-column label="商品来源" prop="system_store_name" min-width="200" show-overflow-tooltip /> -->
<el-table-column label="状态" prop="is_show"> <el-table-column label="状态" prop="is_show">
<template #default="{ row }"> <template #default="{ row }">