| | |
| | | <script lang="ts" setup> |
| | | import type { MesPdArchiveApi } from '#/api/mes/pd/archive'; |
| | | |
| | | import { ref } from 'vue'; |
| | | import { ref, watch } from 'vue'; |
| | | |
| | | import { Modal, Descriptions, Table, Tabs, message } from 'ant-design-vue'; |
| | | import { Modal, Descriptions, Table, Tabs, Spin, message } from 'ant-design-vue'; |
| | | |
| | | import { getPdArchiveDetailByProduct } from '#/api/mes/pd/archive'; |
| | | import { FilePreviewModal, useFilePreview } from '#/components/file-preview'; |
| | | import { DICT_TYPE } from '#/packages/constants/src'; |
| | | import { getDictOptions } from '#/packages/effects/hooks/src'; |
| | | |
| | | import { getPdDocumentTypeOptions } from '../../project/data'; |
| | | |
| | | interface Props { |
| | | visible: boolean; |
| | | productCode?: string; |
| | | } |
| | | |
| | | const props = withDefaults(defineProps<Props>(), { |
| | | productCode: '', |
| | | }); |
| | | |
| | | interface Emits { |
| | | (e: 'update:visible', value: boolean): void; |
| | | } |
| | | |
| | | const emit = defineEmits<Emits>(); |
| | | |
| | | const open = ref(false); |
| | | const loading = ref(false); |
| | | const detailList = ref<MesPdArchiveApi.DetailItem[]>([]); |
| | | const activeProject = ref('0'); |
| | | |
| | | const { openPreview, previewState } = useFilePreview(); |
| | | |
| | | /** 资料类型中文名:复用项目资料列表的同一份映射(getPdDocumentTypeOptions),避免两处维护 */ |
| | | function documentTypeText(value?: string) { |
| | | if (!value) return '-'; |
| | | return ( |
| | | getPdDocumentTypeOptions().find((item) => item.value === value)?.label ?? |
| | | String(value) |
| | | ); |
| | | } |
| | | |
| | | /** 归档状态中文名:字典 mes_pd_archive_status */ |
| | | function archiveStatusText(value?: number) { |
| | | if (value === undefined || value === null || value === '') return '-'; |
| | | return ( |
| | | getDictOptions(DICT_TYPE.MES_PD_ARCHIVE_STATUS, 'number').find( |
| | | (item) => Number(item.value) === Number(value), |
| | | )?.label ?? String(value) |
| | | ); |
| | | } |
| | | |
| | | const archiveColumns = [ |
| | | { title: '归档编号', dataIndex: 'archiveCode', key: 'archiveCode' }, |
| | | { title: '归档人', dataIndex: 'archiverNickname', key: 'archiverNickname' }, |
| | | { title: '归档状态', dataIndex: 'archiveStatus', key: 'archiveStatus' }, |
| | | { |
| | | title: '归档状态', |
| | | dataIndex: 'archiveStatus', |
| | | key: 'archiveStatus', |
| | | customRender: ({ text }: { text: number }) => archiveStatusText(text), |
| | | }, |
| | | { title: '归档时间', dataIndex: 'archiveTime', key: 'archiveTime' }, |
| | | { title: '备注', dataIndex: 'remark', key: 'remark', ellipsis: true }, |
| | | ]; |
| | | |
| | | const documentColumns = [ |
| | | { title: '资料名称', dataIndex: 'documentName', key: 'documentName' }, |
| | | { title: '资料类型', dataIndex: 'documentType', key: 'documentType' }, |
| | | { |
| | | title: '资料类型', |
| | | dataIndex: 'documentType', |
| | | key: 'documentType', |
| | | customRender: ({ text }: { text: string }) => documentTypeText(text), |
| | | }, |
| | | { title: '版本', dataIndex: 'documentVersion', key: 'documentVersion', width: 80 }, |
| | | { title: '文件名', dataIndex: 'fileName', key: 'fileName' }, |
| | | { title: '上传人', dataIndex: 'uploadUserNickname', key: 'uploadUserNickname' }, |
| | |
| | | { |
| | | title: '操作', |
| | | key: 'action', |
| | | width: 80, |
| | | width: 120, |
| | | }, |
| | | ]; |
| | | |
| | | async function handleOpen(productCode?: string) { |
| | | if (!productCode) { |
| | | message.warning('产品编码为空,无法查看归档'); |
| | | return; |
| | | watch(() => props.visible, async (newVal) => { |
| | | if (newVal && props.productCode) { |
| | | loadData(props.productCode); |
| | | } else if (!newVal) { |
| | | open.value = false; |
| | | detailList.value = []; |
| | | } |
| | | }); |
| | | |
| | | async function loadData(code: string) { |
| | | open.value = true; |
| | | loading.value = true; |
| | | detailList.value = []; |
| | | activeProject.value = '0'; |
| | | loading.value = true; |
| | | try { |
| | | detailList.value = await getPdArchiveDetailByProduct(productCode); |
| | | detailList.value = await getPdArchiveDetailByProduct(code); |
| | | } catch { |
| | | message.error('获取归档详情失败'); |
| | | } finally { |
| | |
| | | } |
| | | } |
| | | |
| | | function handleClose() { |
| | | open.value = false; |
| | | detailList.value = []; |
| | | function openModal(code: string) { |
| | | loadData(code); |
| | | } |
| | | |
| | | defineExpose({ open: handleOpen }); |
| | | defineExpose({ open: openModal }); |
| | | |
| | | function handleClose() { |
| | | emit('update:visible', false); |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <FilePreviewModal v-bind="previewState" /> |
| | | <Modal v-model:open="open" title="归档详情" width="80%" :footer="null" @cancel="handleClose"> |
| | | <div v-if="loading" class="flex justify-center py-8"> |
| | | <a-spin /> |
| | | <Spin /> |
| | | </div> |
| | | <template v-else> |
| | | <Tabs v-if="detailList.length > 0" v-model:active-key="activeProject" type="card"> |
| | |
| | | > |
| | | <template #bodyCell="{ column, record }"> |
| | | <template v-if="column.key === 'action'"> |
| | | <a v-if="record.fileUrl" :href="record.fileUrl" target="_blank" class="text-primary">下载</a> |
| | | <template v-if="record.fileUrl"> |
| | | <a class="mr-2" @click="openPreview(record.fileUrl, record.fileName)">预览</a> |
| | | <a :href="record.fileUrl" target="_blank">下载</a> |
| | | </template> |
| | | <span v-else class="text-gray-400">-</span> |
| | | </template> |
| | | </template> |