Skip to content

F
factory_front
Commit f75b0645 by wusiyi
Options

feat: podcn卡片字段展示优化

parent 120cd885
Showing with 177 additions and 84 deletions
src/views/order/pod/index.vue
...@@ -331,21 +331,42 @@ ...@@ -331,21 +331,42 @@
<img :src="item?.image" height="28" /> <img :src="item?.image" height="28" />
</div> </div>
</div> </div>
<b <div class="flex-row">
v-if="cardItem" <el-tooltip
:style="{ class="item"
color: effect="dark"
:content="'用户编码: ' + cardItem?.userMark"
placement="bottom"
>
<span
style="
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: inline-block;
"
@click.stop="copy(String(cardItem?.userMark || ''))"
>
{{ cardItem?.userMark }}
</span>
</el-tooltip>
<b
v-if="cardItem"
:style="{
color:
(Number(cardItem.customizedQuantity) || 0) > 1
? 'red'
: '#67C23A',
}"
>
{{
(Number(cardItem.customizedQuantity) || 0) > 1 (Number(cardItem.customizedQuantity) || 0) > 1
? 'red' ? '多'
: '#67C23A', : '单'
}" }}
> </b>
{{ </div>
(Number(cardItem.customizedQuantity) || 0) > 1
? '多'
: '单'
}}
</b>
</div> </div>
</template> </template>
<template #info> <template #info>
...@@ -355,11 +376,10 @@ ...@@ -355,11 +376,10 @@
<el-tooltip <el-tooltip
class="item" class="item"
effect="dark" effect="dark"
:content="cardItem?.baseSku" :content="'Base SKU: ' + cardItem?.baseSku"
placement="bottom" placement="bottom"
> >
<span <span
title="Base SKU"
style=" style="
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
...@@ -381,14 +401,14 @@ ...@@ -381,14 +401,14 @@
<el-tooltip <el-tooltip
class="item" class="item"
effect="dark" effect="dark"
:content="'补胚数量'" :content="
'补胚数量: ' + (cardItem?.replenishmentNum || '--')
"
placement="bottom" placement="bottom"
> >
<span <span
>补胚数量：{{ >补胚数量：{{ cardItem?.replenishmentNum || '--' }}
cardItem?.replenishmentNum || '--' </span>
}}</span
>
</el-tooltip> </el-tooltip>
</el-col> </el-col>
<el-col <el-col
...@@ -397,11 +417,16 @@ ...@@ -397,11 +417,16 @@
:offset="0" :offset="0"
style="text-align: right" style="text-align: right"
> >
<span <el-tooltip
v-if="['INVALID', 'TO_BE_CONFIRMED'].includes(status)" v-if="['INVALID', 'TO_BE_CONFIRMED'].includes(status)"
class="item"
effect="dark"
:content="'数量: ' + (cardItem?.num || '--')"
placement="bottom"
> >
数量：{{ cardItem?.num }} <span> 数量：{{ cardItem?.num }} </span>
</span> </el-tooltip>
<template v-else> <template v-else>
<el-tooltip <el-tooltip
v-if="status !== 'TO_BE_REPLENISHMENT'" v-if="status !== 'TO_BE_REPLENISHMENT'"
...@@ -411,8 +436,8 @@ ...@@ -411,8 +436,8 @@
['TO_BE_REPLENISHMENT', 'IN_PRODUCTION'].includes( ['TO_BE_REPLENISHMENT', 'IN_PRODUCTION'].includes(
status, status,
) )
? '未生产数量' ? '未生产数量: ' + cardItem?.notPassNum
: '已生产数量' : '已生产数量: ' + cardItem?.passNum
" "
placement="bottom" placement="bottom"
> >
...@@ -440,23 +465,31 @@ ...@@ -440,23 +465,31 @@
align-items: center; align-items: center;
" "
> >
<span <el-tooltip
title="Variant SKU" class="item"
style=" effect="dark"
display: inline-block; :content="'Variant SKU: ' + cardItem?.variantSku"
width: 100%; placement="bottom"
overflow: hidden;
text-overflow: ellipsis;
"
> >
{{ cardItem?.variantSku }} <span
</span> style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
>
{{ cardItem?.variantSku }}
</span>
</el-tooltip>
</el-col> </el-col>
<el-col :span="10" :offset="0" style="text-align: right"> <el-col :span="10" :offset="0" style="text-align: right">
<el-tooltip <el-tooltip
class="item" class="item"
effect="dark" effect="dark"
:content="'货号'" :content="
'货号: ' + (cardItem?.supplierItemNo || '--')
"
placement="bottom" placement="bottom"
> >
<span <span
...@@ -475,35 +508,46 @@ ...@@ -475,35 +508,46 @@
align-items: center; align-items: center;
" "
> >
<span>工艺：</span> <el-tooltip
<span class="item"
:title="String(cardItem?.processName)" effect="dark"
style=" :content="'工艺: ' + (cardItem?.processName || '--')"
display: inline-block; placement="bottom"
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
> >
{{ cardItem?.processName }} <span
</span> style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
>
{{ '工艺：' + (cardItem?.processName || '--') }}
</span>
</el-tooltip>
</el-col> </el-col>
<el-col <el-col
:span="12" :span="12"
:offset="0" :offset="0"
style="white-space: nowrap; text-align: right" style="white-space: nowrap; text-align: right"
> >
<span <el-tooltip
:title="`店铺单号:${cardItem?.shopNumber}`" class="item"
style=" effect="dark"
display: inline-block; :content="'店铺单号: ' + cardItem?.shopNumber"
width: 100%; placement="bottom"
overflow: hidden;
text-overflow: ellipsis;
"
> >
{{ cardItem?.shopNumber }} <span
</span> style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
>
{{ cardItem?.shopNumber }}
</span>
</el-tooltip>
</el-col> </el-col>
</el-row> </el-row>
<el-row style="margin-top: 5px"> <el-row style="margin-top: 5px">
...@@ -512,29 +556,63 @@ ...@@ -512,29 +556,63 @@
:offset="0" :offset="0"
style="white-space: nowrap" style="white-space: nowrap"
> >
<span <el-tooltip
:title="`第三方生产单号:${cardItem?.thirdSubOrderNumber}`" class="item"
style=" effect="dark"
display: inline-block; :content="
width: 100%; '第三方生产单号: ' + cardItem?.thirdSubOrderNumber
overflow: hidden;
text-overflow: ellipsis;
"
@click.stop="
copy(String(cardItem?.thirdSubOrderNumber || ''))
" "
placement="bottom"
> >
{{ cardItem?.thirdSubOrderNumber }} <span
</span> style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
@click.stop="
copy(String(cardItem?.thirdSubOrderNumber || ''))
"
>
{{ cardItem?.thirdSubOrderNumber }}
</span>
</el-tooltip>
</el-col> </el-col>
<el-col :span="12" :offset="0" style="text-align: right"> <el-col
:span="12"
:offset="0"
style="white-space: nowrap; text-align: right"
>
<el-tooltip
class="item"
effect="dark"
:content="'批次号: ' + cardItem?.factoryOrderNumber"
placement="bottom"
>
<span
style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
@click.stop="
copy(String(cardItem?.factoryOrderNumber || ''))
"
>
{{ cardItem?.factoryOrderNumber }}
</span>
</el-tooltip>
</el-col>
<!-- <el-col :span="12" :offset="0" style="text-align: right">
<span v-if="!cardItem?.expectDeliveryTime" <span v-if="!cardItem?.expectDeliveryTime"
>期望交货时间：--</span >期望交货时间：--</span
> >
<span v-else title="期望交货时间"> <span v-else title="期望交货时间">
{{ cardItem?.expectDeliveryTime || '--' }} {{ cardItem?.expectDeliveryTime || '--' }}
</span> </span>
</el-col> </el-col> -->
</el-row> </el-row>
<el-row style="margin-top: 5px"> <el-row style="margin-top: 5px">
<el-col <el-col
...@@ -560,20 +638,28 @@ ...@@ -560,20 +638,28 @@
:offset="0" :offset="0"
style="white-space: nowrap; text-align: right" style="white-space: nowrap; text-align: right"
> >
<span <el-tooltip
:title="`第三方订单号:${cardItem?.thirdOrderNumber}`" class="item"
style=" effect="dark"
display: inline-block; :content="
width: 100%; '第三方订单号: ' + cardItem?.thirdOrderNumber
overflow: hidden;
text-overflow: ellipsis;
"
@click.stop="
copy(String(cardItem?.thirdOrderNumber || ''))
" "
placement="bottom"
> >
{{ cardItem?.thirdOrderNumber }} <span
</span> style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
"
@click.stop="
copy(String(cardItem?.thirdOrderNumber || ''))
"
>
{{ cardItem?.thirdOrderNumber }}
</span>
</el-tooltip>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
...@@ -2317,6 +2403,13 @@ onBeforeUnmount(() => { ...@@ -2317,6 +2403,13 @@ onBeforeUnmount(() => {
font-size: 15px; font-size: 15px;
} }
} }
.flex-row {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 15px;
}
} }
} }
.no-data { .no-data {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment