<template>
|
<ElDrawer
|
:model-value="visible"
|
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="基础信息" :column="2" border>
|
<ElDescriptionsItem label="当前排号">{{ detail.currentRow ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="起始排号">{{ detail.startRow ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="终止排号">{{ detail.endRow ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="设备数量">{{ detail.deviceQty ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="起始设备号">{{ detail.startDeviceNo ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="终止设备号">{{ detail.endDeviceNo ?? '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="库区类型">{{ detail.typeIdText || '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="站点列表" :span="2">
|
<div v-if="staListItems.length" class="flex flex-wrap gap-2">
|
<ElTag v-for="item in staListItems" :key="item" effect="plain">{{ item }}</ElTag>
|
</div>
|
<span v-else>--</span>
|
</ElDescriptionsItem>
|
<ElDescriptionsItem label="物料相似">
|
<ElTag :type="detail.beSimilarType || 'info'" effect="light">
|
{{ detail.beSimilarText || '--' }}
|
</ElTag>
|
</ElDescriptionsItem>
|
<ElDescriptionsItem label="空板靠近">
|
<ElTag :type="detail.emptySimilarType || 'info'" effect="light">
|
{{ detail.emptySimilarText || '--' }}
|
</ElTag>
|
</ElDescriptionsItem>
|
<ElDescriptionsItem label="备注" :span="2">{{ detail.memo || '--' }}</ElDescriptionsItem>
|
</ElDescriptions>
|
|
<ElDescriptions title="审计信息" :column="2" border>
|
<ElDescriptionsItem label="创建人">{{ detail.createByText || '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="创建时间">{{ detail.createTimeText || '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="更新人">{{ detail.updateByText || '--' }}</ElDescriptionsItem>
|
<ElDescriptionsItem label="更新时间">{{ detail.updateTimeText || '--' }}</ElDescriptionsItem>
|
</ElDescriptions>
|
</div>
|
</ElScrollbar>
|
</ElDrawer>
|
</template>
|
|
<script setup>
|
import { computed } from 'vue'
|
|
const props = defineProps({
|
visible: { type: Boolean, default: false },
|
loading: { type: Boolean, default: false },
|
detail: { type: Object, default: () => ({}) }
|
})
|
|
const emit = defineEmits(['update:visible'])
|
|
const visible = computed({
|
get: () => props.visible,
|
set: (value) => emit('update:visible', value)
|
})
|
|
const staListItems = computed(() => {
|
if (Array.isArray(props.detail?.staListItems) && props.detail.staListItems.length) {
|
return props.detail.staListItems
|
}
|
const text = String(props.detail?.staList || '').trim()
|
return text ? text.split(/[;,,\n\r]+/g).map((item) => item.trim()).filter(Boolean) : []
|
})
|
|
function handleVisibleChange(value) {
|
visible.value = value
|
}
|
</script>
|