<script setup lang="ts">
|
import { ref, watch } from 'vue';
|
import { Button, Empty, Space, Table } from 'ant-design-vue';
|
import { requestClient } from '#/api/request';
|
|
const props = defineProps<{ workOrderId?: number; itemId?: number }>();
|
interface TechnicalFile {
|
id: number;
|
fileName?: string;
|
versionNo?: number;
|
previewURL?: string;
|
downloadURL?: string;
|
}
|
const files = ref<TechnicalFile[]>([]);
|
const loading = ref(false);
|
watch(() => [props.workOrderId, props.itemId] as const, async ([workOrderId, itemId], _old, onCleanup) => {
|
let active = true;
|
onCleanup(() => { active = false; });
|
files.value = [];
|
if (!workOrderId && !itemId) {
|
loading.value = false;
|
return;
|
}
|
loading.value = true;
|
try {
|
const data: TechnicalFile[] = workOrderId
|
? await requestClient.get('/mes/pro/work-order/technical-files', { params: { id: workOrderId } })
|
: await requestClient.get('/mdm/item/technical-file/list', { params: { itemId } });
|
if (active) files.value = data || [];
|
} finally {
|
if (active) loading.value = false;
|
}
|
}, { immediate: true });
|
</script>
|
|
<template>
|
<p class="mb-3 text-xs text-gray-500">{{ workOrderId ? '显示生产订单创建时留存的技术文件。' : '显示物料当前技术文件,下发时保存到生产订单。' }}预览后可使用浏览器打印,其他格式可下载后打印。</p>
|
<Table v-if="files.length || loading" :data-source="files" :loading="loading" :pagination="false" row-key="id" size="small">
|
<Table.Column title="文件名称" data-index="fileName" />
|
<Table.Column title="文件版本" data-index="versionNo" />
|
<Table.Column title="操作" key="actions">
|
<template #default="{ record }">
|
<Space>
|
<Button v-if="record.previewURL" type="link" :href="record.previewURL" target="_blank" rel="noopener noreferrer">预览 / 打印</Button>
|
<Button v-if="record.downloadURL" type="link" :href="record.downloadURL" target="_blank" rel="noopener noreferrer">下载</Button>
|
</Space>
|
</template>
|
</Table.Column>
|
</Table>
|
<Empty v-else :description="workOrderId ? '该工单没有留存技术文件' : '当前物料没有技术文件'" />
|
</template>
|