<script lang="ts" setup>
|
import type { FormType } from '../data';
|
import type { MesPdProjectApi } from '#/api/mes/pd/project';
|
|
import { computed, onMounted, ref } from 'vue';
|
import { useRoute, useRouter } from 'vue-router';
|
|
import { useUserStore } from '@vben/stores';
|
|
import { Page, useVbenModal } from '#/packages/effects/common-ui/src';
|
import { useTabs } from '#/packages/effects/hooks/src';
|
import { MesPdProjectStatusEnum } from '#/packages/constants/src';
|
|
import { Card, message, Tabs } from 'ant-design-vue';
|
|
import {
|
archivePdProject,
|
getPdProject,
|
getPdProjectApproverIds,
|
publishPdProject,
|
submitPdProjectApproval,
|
uploadPdProject,
|
} from '#/api/mes/pd/project';
|
import { useDescription } from '#/components/description';
|
import { ACTION_ICON, TableAction } from '#/adapter/vxe-table';
|
import { $t } from '#/locales';
|
|
import Form from '../modules/form.vue';
|
import AuditModal from '../modules/audit-modal.vue';
|
import DocumentAuditList from '../modules/document-audit-list.vue';
|
import DocumentList from '../modules/document-list.vue';
|
import WorkflowTimeline from '../modules/workflow-timeline.vue';
|
import TaskDraftBanner from '../modules/task-draft-banner.vue';
|
import { useDetailSchema } from './data';
|
|
const route = useRoute();
|
const router = useRouter();
|
const tabs = useTabs();
|
|
const loading = ref(false);
|
const projectId = ref(0);
|
const project = ref<MesPdProjectApi.Project>({});
|
const activeTab = ref('workflow');
|
|
const isPendingPublish = computed(
|
() => project.value.status === MesPdProjectStatusEnum.PENDING_PUBLISH,
|
);
|
const isPendingUpload = computed(
|
() => project.value.status === MesPdProjectStatusEnum.PENDING_UPLOAD,
|
);
|
const isPendingAudit = computed(
|
() => project.value.status === MesPdProjectStatusEnum.PENDING_AUDIT,
|
);
|
const isPendingArchive = computed(
|
() => project.value.status === MesPdProjectStatusEnum.PENDING_ARCHIVE,
|
);
|
const isApproving = computed(
|
() => project.value.status === MesPdProjectStatusEnum.APPROVING,
|
);
|
const isArchived = computed(
|
() => project.value.status === MesPdProjectStatusEnum.ARCHIVED,
|
);
|
|
const isFormEditable = computed(
|
() => isPendingPublish.value,
|
);
|
|
const materialFormType = computed<FormType>(() =>
|
isPendingPublish.value || isPendingUpload.value ? 'update' : 'detail',
|
);
|
|
const [Descriptions] = useDescription({
|
bordered: false,
|
column: 4,
|
schema: useDetailSchema(),
|
});
|
|
const [FormModal, formModalApi] = useVbenModal({
|
connectedComponent: Form,
|
destroyOnClose: true,
|
});
|
|
const [AuditModalComp, auditModalApi] = useVbenModal({
|
connectedComponent: AuditModal,
|
destroyOnClose: true,
|
});
|
|
const userStore = useUserStore();
|
const currentUserId = userStore.userInfo?.id; // 当前登录用户 ID，用于审核人权限判断
|
|
/** 审批配置中该业务的审核人编号集合，决定「审核 / 审核不通过」按钮是否展示 */
|
const approverIds = ref<number[]>([]);
|
|
/** 拉取审核人集合；失败时保持为空（按钮不展示），不阻断详情加载 */
|
async function loadApproverIds() {
|
try {
|
approverIds.value = (await getPdProjectApproverIds()) ?? [];
|
} catch {
|
approverIds.value = [];
|
}
|
}
|
|
/** 当前登录用户是否为该业务的审核人，且单据处于审批中状态 */
|
const canAudit = computed(
|
() =>
|
isApproving.value &&
|
!!currentUserId &&
|
approverIds.value.includes(currentUserId),
|
);
|
|
async function loadProjectDetail() {
|
loading.value = true;
|
try {
|
project.value = await getPdProject(projectId.value);
|
if (isPendingUpload.value) {
|
activeTab.value = 'material';
|
} else if (isPendingAudit.value) {
|
activeTab.value = 'audit';
|
}
|
} finally {
|
loading.value = false;
|
}
|
}
|
|
function handleBack() {
|
tabs.closeCurrentTab();
|
router.push({ path: '/mes/pd/project' });
|
}
|
|
function handleEdit() {
|
formModalApi.setData({ formType: 'update', id: projectId.value }).open();
|
}
|
|
async function handlePublish() {
|
const hideLoading = message.loading({ content: '发布中…', duration: 0 });
|
try {
|
await publishPdProject(projectId.value);
|
message.success('任务已发布，进入待上传状态');
|
loadProjectDetail();
|
} finally {
|
hideLoading();
|
}
|
}
|
|
async function handleUpload() {
|
const hideLoading = message.loading({ content: '提交审核中…', duration: 0 });
|
try {
|
await uploadPdProject(projectId.value);
|
message.success('已提交资料审核');
|
tabs.closeCurrentTab();
|
router.back();
|
} finally {
|
hideLoading();
|
}
|
}
|
|
/** 提交审批 - 审核人由「系统管理 - 审批配置」统一指定，此处无需选择 */
|
async function handleSubmit() {
|
const hideLoading = message.loading({
|
content: '正在提交审批...',
|
duration: 0,
|
});
|
try {
|
await submitPdProjectApproval(projectId.value);
|
message.success('提交审批成功');
|
loadProjectDetail();
|
} finally {
|
hideLoading();
|
}
|
}
|
|
/** 审核 - 通过 / 不通过 */
|
function handleAudit(pass: boolean) {
|
auditModalApi.setData({ pass, row: project.value }).open();
|
}
|
|
async function handleArchive() {
|
const hideLoading = message.loading({ content: '归档中…', duration: 0 });
|
try {
|
await archivePdProject(projectId.value);
|
message.success('已归档');
|
loadProjectDetail();
|
} finally {
|
hideLoading();
|
}
|
}
|
|
onMounted(() => {
|
projectId.value = Number(route.params.id);
|
loadProjectDetail();
|
// 进入页面即拉取审核人集合，用于控制审核按钮显隐
|
loadApproverIds();
|
});
|
</script>
|
|
<template>
|
<Page
|
auto-content-height
|
:loading="loading"
|
:title="project.taskName || '设计任务详情'"
|
>
|
<FormModal @success="loadProjectDetail" />
|
<AuditModalComp @success="loadProjectDetail" />
|
|
<template #extra>
|
<TableAction
|
:actions="[
|
{
|
label: '返回',
|
type: 'default',
|
icon: 'lucide:arrow-left',
|
onClick: handleBack,
|
},
|
{
|
label: $t('common.edit'),
|
type: 'primary',
|
icon: ACTION_ICON.EDIT,
|
ifShow: isFormEditable,
|
onClick: handleEdit,
|
},
|
{
|
label: '发布',
|
type: 'primary',
|
ifShow: isPendingPublish,
|
onClick: handlePublish,
|
},
|
{
|
label: '确认上传',
|
type: 'primary',
|
ifShow: isPendingUpload,
|
onClick: handleUpload,
|
},
|
{
|
label: '提交审批',
|
type: 'primary',
|
ifShow: isPendingAudit,
|
// 审核人由审批配置统一指定，提交前仅二次确认，不再弹选流程框
|
popConfirm: {
|
title: '确认提交审批？提交后由审批配置中指定的审核人处理。',
|
confirm: handleSubmit,
|
},
|
},
|
{
|
label: '审核',
|
type: 'primary',
|
icon: ACTION_ICON.AUDIT,
|
// 仅「审批中 + 当前登录用户在审批配置的审核人名单内」才显示
|
ifShow: canAudit,
|
onClick: () => handleAudit(true),
|
},
|
{
|
label: '审核不通过',
|
type: 'default',
|
danger: true,
|
// 同上，与「审核」成对出现
|
ifShow: canAudit,
|
onClick: () => handleAudit(false),
|
},
|
{
|
label: '归档',
|
type: 'default',
|
ifShow: isPendingArchive,
|
onClick: handleArchive,
|
},
|
]"
|
/>
|
</template>
|
|
<TaskDraftBanner
|
v-if="isPendingPublish"
|
:designer-name="project.chiefDesignerNickname"
|
:product-name="project.productName"
|
:version="project.version"
|
@edit="handleEdit"
|
@publish="handlePublish"
|
/>
|
|
<Card class="min-h-[10%]">
|
<Descriptions :data="project" />
|
</Card>
|
|
<Card class="mt-4 min-h-[60%]">
|
<Tabs v-model:active-key="activeTab">
|
<Tabs.TabPane key="workflow" tab="流程进度" :force-render="true">
|
<WorkflowTimeline :status="project.status ?? 0" />
|
</Tabs.TabPane>
|
<Tabs.TabPane v-if="!isPendingAudit" key="material" tab="设计资料">
|
<p v-if="isPendingPublish" class="mb-3 text-sm text-amber-600">
|
请先发布任务后再上传设计资料
|
</p>
|
<DocumentList
|
:form-type="materialFormType"
|
:project-id="projectId"
|
:project-status="project.status"
|
/>
|
</Tabs.TabPane>
|
<Tabs.TabPane v-if="isPendingAudit" key="audit" tab="资料审核">
|
<DocumentAuditList :project-id="projectId" @success="loadProjectDetail" />
|
</Tabs.TabPane>
|
</Tabs>
|
</Card>
|
</Page>
|
</template>
|
