root/ludu-admin-vue3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

OrderTableColumn: 商品信息列样式调整2

Browse Source
This commit is contained in:
puhui999 2023-10-19 15:54:23 +08:00
parent 094f8e16db
commit 5b3bcecef2
1 changed files with 24 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/views/mall/trade/order/components/OrderTableColumn.vue
View File

@ -40,8 +40,8 @@
<el-table-column min-width="300" prop="spuName"> <el-table-column min-width="300" prop="spuName">
<template #header> <template #header>
<div <div
class="flex items-center" class="mr-[20px] h-[35px] flex items-center pl-[10px] pr-[10px]"
style="width: 100%; height: 35px; background-color: #f7f7f7" style="background-color: #f7f7f7"
> >
<span class="mr-20px">订单号：{{ scope.row.no }} </span> <span class="mr-20px">订单号：{{ scope.row.no }} </span>
<span class="mr-20px">下单时间：{{ formatDate(scope.row.createTime) }}</span> <span class="mr-20px">下单时间：{{ formatDate(scope.row.createTime) }}</span>
@ -64,16 +64,31 @@
</template> </template>
<template #default="{ row }"> <template #default="{ row }">
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mb-[10px] mr-[10px] flex items-start">
<div class="mr-[10px]">
<el-image <el-image
:src="row.picUrl" :src="row.picUrl"
class="mb-[13px] mr-[10px] h-[40px] w-[40px] v-middle" class="!h-[45px] !w-[45px]"
fit="contain"
@click="imagePreview(row.picUrl)" @click="imagePreview(row.picUrl)"
/> >
<span class="mb-[13px] mr-[10px]">{{ row.spuName }}</span> <template #error>
<div class="image-slot">
<icon icon="ep:picture" />
</div>
</template>
</el-image>
</div>
<ElTooltip :content="row.spuName" placement="top">
<span class="overflow-ellipsis max-h-[45px] overflow-hidden">
{{ row.spuName }}
</span>
</ElTooltip>
</div>
<el-tag <el-tag
v-for="property in row.properties" v-for="property in row.properties"
:key="property.propertyId" :key="property.propertyId"
class="mb-[13px] mr-[10px]" class="mb-[10px] mr-[10px]"
> >
{{ property.propertyName }}: {{ property.valueName }} {{ property.propertyName }}: {{ property.valueName }}
</el-tag> </el-tag>