zhangwencui
2 天以前 ceeeb4f3315fbd4e4ca3e91efffcee0a54bc22ee
src/views/mes/pd/archive/modules/detail.vue
@@ -1,28 +1,79 @@
<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' },
@@ -30,21 +81,26 @@
  {
    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 {
@@ -52,18 +108,22 @@
  }
}
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">
@@ -110,7 +170,10 @@
            >
              <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>