| | |
| | | <script lang="ts" setup> |
| | | import type { MesPdArchiveApi } from '#/api/mes/pd/archive'; |
| | | import type { MesPdVersionChangeApi } from '#/api/mes/pd/version-change'; |
| | | |
| | | import { ref } from 'vue'; |
| | | import { ref, watch } from 'vue'; |
| | | |
| | | import { useVbenModal } from '#/packages/effects/common-ui/src'; |
| | | import { Modal, Descriptions, Table, Tabs, Spin, message } from 'ant-design-vue'; |
| | | |
| | | import { Alert, Descriptions, Tabs } from 'ant-design-vue'; |
| | | import { getPdArchiveDetailByProduct } from '#/api/mes/pd/archive'; |
| | | import { FilePreviewModal, useFilePreview } from '#/components/file-preview'; |
| | | |
| | | import { getPdArchive } from '#/api/mes/pd/archive'; |
| | | |
| | | import MaterialPanel from '#/views/mes/pd/project/modules/material-panel.vue'; |
| | | import VersionChangeList from '#/views/mes/pd/project/modules/version-change/version-change-list.vue'; |
| | | |
| | | const detail = ref<MesPdArchiveApi.Archive>(); |
| | | const activeTab = ref('version-change'); |
| | | const materialVersion = ref<string>(); |
| | | const materialVersionHint = ref<string>(); |
| | | |
| | | function handleViewMaterials(row: MesPdVersionChangeApi.VersionChange) { |
| | | materialVersion.value = row.toVersion; |
| | | materialVersionHint.value = `变更单 ${row.code}:${row.fromVersion} → ${row.toVersion}`; |
| | | activeTab.value = 'material'; |
| | | interface Props { |
| | | visible: boolean; |
| | | productCode?: string; |
| | | } |
| | | |
| | | function clearMaterialVersionFilter() { |
| | | materialVersion.value = detail.value?.version; |
| | | materialVersionHint.value = undefined; |
| | | const props = withDefaults(defineProps<Props>(), { |
| | | productCode: '', |
| | | }); |
| | | |
| | | interface Emits { |
| | | (e: 'update:visible', value: boolean): void; |
| | | } |
| | | |
| | | const [Modal, modalApi] = useVbenModal({ |
| | | async onOpenChange(isOpen: boolean) { |
| | | if (!isOpen) { |
| | | detail.value = undefined; |
| | | activeTab.value = 'version-change'; |
| | | materialVersion.value = undefined; |
| | | materialVersionHint.value = undefined; |
| | | return; |
| | | } |
| | | const data = modalApi.getData<{ id: number }>(); |
| | | modalApi.lock(); |
| | | try { |
| | | detail.value = await getPdArchive(data.id); |
| | | materialVersion.value = detail.value.version; |
| | | } finally { |
| | | modalApi.unlock(); |
| | | } |
| | | 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(); |
| | | |
| | | const archiveColumns = [ |
| | | { title: '归档编号', dataIndex: 'archiveCode', key: 'archiveCode' }, |
| | | { title: '归档人', dataIndex: 'archiverNickname', key: 'archiverNickname' }, |
| | | { title: '归档状态', dataIndex: 'archiveStatus', key: 'archiveStatus' }, |
| | | { 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: 'documentVersion', key: 'documentVersion', width: 80 }, |
| | | { title: '文件名', dataIndex: 'fileName', key: 'fileName' }, |
| | | { title: '上传人', dataIndex: 'uploadUserNickname', key: 'uploadUserNickname' }, |
| | | { title: '上传时间', dataIndex: 'uploadTime', key: 'uploadTime' }, |
| | | { |
| | | title: '操作', |
| | | key: 'action', |
| | | width: 120, |
| | | }, |
| | | ]; |
| | | |
| | | watch(() => props.visible, async (newVal) => { |
| | | if (newVal && props.productCode) { |
| | | open.value = true; |
| | | loading.value = true; |
| | | detailList.value = []; |
| | | activeProject.value = '0'; |
| | | try { |
| | | detailList.value = await getPdArchiveDetailByProduct(props.productCode); |
| | | } catch { |
| | | message.error('获取归档详情失败'); |
| | | } finally { |
| | | loading.value = false; |
| | | } |
| | | } else if (!newVal) { |
| | | open.value = false; |
| | | detailList.value = []; |
| | | } |
| | | }); |
| | | |
| | | defineExpose({ |
| | | open: (id: number) => modalApi.setData({ id }).open(), |
| | | }); |
| | | function handleClose() { |
| | | emit('update:visible', false); |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <Modal class="w-4/5" title="归档详情"> |
| | | <Descriptions v-if="detail" :column="3" bordered class="mx-4 mb-4" size="small"> |
| | | <Descriptions.Item label="归档编号">{{ detail.code }}</Descriptions.Item> |
| | | <Descriptions.Item label="产品编码">{{ detail.productCode }}</Descriptions.Item> |
| | | <Descriptions.Item label="产品名称">{{ detail.productName }}</Descriptions.Item> |
| | | <Descriptions.Item label="设计版本">{{ detail.version }}</Descriptions.Item> |
| | | <Descriptions.Item label="任务编码">{{ detail.projectCode }}</Descriptions.Item> |
| | | <Descriptions.Item label="任务名称">{{ detail.projectName }}</Descriptions.Item> |
| | | <Descriptions.Item label="资料数">{{ detail.documentCount ?? '-' }}</Descriptions.Item> |
| | | <Descriptions.Item label="归档人">{{ detail.archiverName || '-' }}</Descriptions.Item> |
| | | <Descriptions.Item label="归档路径" :span="3"> |
| | | {{ detail.storagePath || '-' }} |
| | | </Descriptions.Item> |
| | | <Descriptions.Item label="备注" :span="3">{{ detail.remark || '-' }}</Descriptions.Item> |
| | | </Descriptions> |
| | | <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"> |
| | | <Spin /> |
| | | </div> |
| | | <template v-else> |
| | | <Tabs v-if="detailList.length > 0" v-model:active-key="activeProject" type="card"> |
| | | <Tabs.TabPane |
| | | v-for="(detail, index) in detailList" |
| | | :key="String(index)" |
| | | :tab="detail.project.taskName || '项目'" |
| | | > |
| | | <!-- 项目信息 --> |
| | | <Descriptions :column="3" bordered size="small" class="mb-4"> |
| | | <Descriptions.Item label="任务编码">{{ detail.project.taskCode }}</Descriptions.Item> |
| | | <Descriptions.Item label="任务名称">{{ detail.project.taskName }}</Descriptions.Item> |
| | | <Descriptions.Item label="产品编码">{{ detail.project.productCode }}</Descriptions.Item> |
| | | <Descriptions.Item label="产品名称">{{ detail.project.productName }}</Descriptions.Item> |
| | | <Descriptions.Item label="版本号">{{ detail.project.version }}</Descriptions.Item> |
| | | <Descriptions.Item label="主设计师">{{ detail.project.chiefDesignerNickname }}</Descriptions.Item> |
| | | <Descriptions.Item label="审核人">{{ detail.project.reviewerNickname }}</Descriptions.Item> |
| | | <Descriptions.Item label="计划完成">{{ detail.project.planFinishTime }}</Descriptions.Item> |
| | | </Descriptions> |
| | | |
| | | <template v-if="detail?.projectId"> |
| | | <Tabs v-model:active-key="activeTab" class="mx-4"> |
| | | <Tabs.TabPane key="version-change" tab="版本变更记录"> |
| | | <VersionChangeList |
| | | form-type="detail" |
| | | :project-id="detail.projectId" |
| | | :project-version="detail.version" |
| | | @view-materials="handleViewMaterials" |
| | | /> |
| | | </Tabs.TabPane> |
| | | <Tabs.TabPane key="material" tab="版本资料"> |
| | | <Alert |
| | | v-if="materialVersionHint" |
| | | class="mb-3" |
| | | closable |
| | | show-icon |
| | | type="info" |
| | | :message="`正在查看 ${materialVersion} 版本资料(${materialVersionHint})`" |
| | | @close="clearMaterialVersionFilter" |
| | | /> |
| | | <MaterialPanel |
| | | form-type="detail" |
| | | :project-id="detail.projectId" |
| | | table-title="版本资料" |
| | | :version="materialVersion" |
| | | /> |
| | | <!-- 归档记录 --> |
| | | <div class="mb-4"> |
| | | <h4 class="mb-2 text-sm font-medium">归档记录</h4> |
| | | <Table |
| | | :columns="archiveColumns" |
| | | :data-source="detail.archives" |
| | | :pagination="false" |
| | | bordered |
| | | row-key="id" |
| | | size="small" |
| | | /> |
| | | </div> |
| | | |
| | | <!-- 设计资料 --> |
| | | <div> |
| | | <h4 class="mb-2 text-sm font-medium">设计资料</h4> |
| | | <Table |
| | | :columns="documentColumns" |
| | | :data-source="detail.documents" |
| | | :pagination="false" |
| | | bordered |
| | | row-key="id" |
| | | size="small" |
| | | > |
| | | <template #bodyCell="{ column, record }"> |
| | | <template v-if="column.key === 'action'"> |
| | | <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> |
| | | </Table> |
| | | </div> |
| | | </Tabs.TabPane> |
| | | </Tabs> |
| | | <div v-else class="py-8 text-center text-gray-400"> |
| | | 暂无归档记录 |
| | | </div> |
| | | </template> |
| | | </Modal> |
| | | </template> |