<template>
|
<ElDrawer
|
:model-value="visible"
|
:title="t('pages.basicInfo.whMat.detail.title')"
|
size="960px"
|
destroy-on-close
|
@update:model-value="handleVisibleChange"
|
>
|
<ElScrollbar class="h-[calc(100vh-180px)] pr-1">
|
<div v-if="loading" class="py-6">
|
<ElSkeleton :rows="12" animated />
|
</div>
|
<div v-else class="space-y-4">
|
<ElDescriptions :title="t('pages.basicInfo.whMat.detail.sections.basic')" :column="2" border>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.code')">{{ detail.code || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.name')">{{ detail.name || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.groupName')">{{ detail.groupName || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.shipperName')">{{ detail.shipperName || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.barcode')">{{ detail.barcode || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.spec')">{{ detail.spec || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.model')">{{ detail.model || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.color')">{{ detail.color || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.size')">{{ detail.size || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.description')">{{ detail.describle || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
</ElDescriptions>
|
|
<ElDescriptions :title="t('pages.basicInfo.whMat.detail.sections.stock')" :column="2" border>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.unit')">{{ detail.unit || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.purUnit')">{{ detail.purUnit || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.stockUnit')">{{ detail.stockUnit || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.stockLevel')">{{ detail.stockLevelText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.flagLabelManage')">{{ detail.flagLabelManageText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.flagCheck')">{{ detail.flagCheckText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.safeQty')">{{ detail.safeQty ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.minQty')">{{ detail.minQty ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.maxQty')">{{ detail.maxQty ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.stagn')">{{ detail.stagn ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.valid')">{{ detail.valid ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.validWarn')">{{ detail.validWarn ?? t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('table.status')">{{ detail.statusText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.baseUnit')">{{ detail.baseUnit || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.useOrgName')">{{ detail.useOrgName || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('pages.basicInfo.whMat.detail.erpClsId')">{{ detail.erpClsId || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('table.memo')">{{ detail.memo || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
</ElDescriptions>
|
|
<ElDescriptions :title="t('pages.basicInfo.whMat.detail.sections.audit')" :column="2" border>
|
<ElDescriptionsItem :label="t('table.createBy')">{{ detail.createByText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('table.createTime')">{{ detail.createTimeText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('table.updateBy')">{{ detail.updateByText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
<ElDescriptionsItem :label="t('table.updateTime')">{{ detail.updateTimeText || t('common.placeholder.empty') }}</ElDescriptionsItem>
|
</ElDescriptions>
|
|
<ElDescriptions v-if="extendFieldEntries.length" :title="t('pages.basicInfo.whMat.detail.sections.extend')" :column="2" border>
|
<ElDescriptionsItem
|
v-for="entry in extendFieldEntries"
|
:key="entry.key"
|
:label="entry.key"
|
>
|
{{ entry.value || t('common.placeholder.empty') }}
|
</ElDescriptionsItem>
|
</ElDescriptions>
|
</div>
|
</ElScrollbar>
|
</ElDrawer>
|
</template>
|
|
<script setup>
|
import { computed } from 'vue'
|
import { useI18n } from 'vue-i18n'
|
|
const props = defineProps({
|
visible: { type: Boolean, default: false },
|
loading: { type: Boolean, default: false },
|
detail: { type: Object, default: () => ({}) }
|
})
|
|
const emit = defineEmits(['update:visible'])
|
const { t } = useI18n()
|
|
const visible = computed({
|
get: () => props.visible,
|
set: (value) => emit('update:visible', value)
|
})
|
|
const extendFieldEntries = computed(() => {
|
const fields = props.detail?.extendFields
|
if (!fields || typeof fields !== 'object') {
|
return []
|
}
|
return Object.entries(fields)
|
.map(([key, value]) => ({
|
key,
|
value: String(value ?? '').trim()
|
}))
|
.filter((item) => item.key)
|
})
|
|
function handleVisibleChange(value) {
|
visible.value = value
|
}
|
</script>
|
