This commit is contained in:
2025-07-10 15:16:44 +08:00
parent 39e239a886
commit b331d17032
11 changed files with 1577 additions and 684 deletions

View File

@ -163,12 +163,11 @@ const handleSelectionChange = (selection: any) => {
}; };
const handleDetail = async (row) => { const handleDetail = async (row) => {
const res = await listByIds(row.attachments); const res = await listByIds(row.id);
tableDetail.value = { tableDetail.value = {
...row, ...row,
...res.data[0] ...res.data[0]
}; };
console.log('🚀 ~ handleDetail ~ tableDetail.value:', tableDetail.value);
detailVisible.value = true; detailVisible.value = true;
}; };

View File

@ -12,65 +12,22 @@
</el-table-column> </el-table-column>
<el-table-column align="center" prop="bookName" label="卷册名称" /> <el-table-column align="center" prop="bookName" label="卷册名称" />
<el-table-column align="center" prop="bookNo" label="卷册号" /> <el-table-column align="center" prop="bookNo" label="卷册号" />
<!-- <el-table-column align="center" label="附图">
<template #default="{ row }">
<ImagePreview :src="row.hasAttachment" disabled :width="80" />
</template>
</el-table-column> -->
<!-- <el-table-column align="center" prop="changeReasons" label="变更原因" width="100">
<template #default="{ row }">
{{ row.changeReasons?.join(', ') }}
</template>
</el-table-column> -->
<el-table-column align="center" prop="changeContent" label="变更内容" /> <el-table-column align="center" prop="changeContent" label="变更内容" />
<el-table-column align="center" prop="costEstimate" label="变更费用估算" /> <el-table-column align="center" prop="costEstimate" label="变更费用估算1" />
<el-table-column label="流程状态" align="center" prop="status">
<!-- <el-table-column label="施工承包单位" align="center">
<el-table-column align="center" prop="contractorManager" label="项目经理" width="100" />
<el-table-column align="center" prop="contractorDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.contractorDate) }}</template>
</el-table-column>
</el-table-column>
<el-table-column label="总承包单位" align="center">
<el-table-column align="center" prop="generalTechLeader" label="项目技术负责人" width="150" />
<el-table-column align="center" prop="generalDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.generalDate) }}</template>
</el-table-column>
</el-table-column>
<el-table-column label="设计单位" align="center">
<el-table-column align="center" prop="designer" label="设计代表" width="100" />
<el-table-column align="center" prop="designerDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.designerDate) }}</template>
</el-table-column>
</el-table-column>
<el-table-column label="项目监理单位" align="center">
<el-table-column align="center" prop="supervisorEngineer" label="监理工程师" width="100" />
<el-table-column align="center" prop="chiefSupervisor" label="总监理工程师" width="110" />
<el-table-column align="center" prop="supervisorDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.supervisorDate) }}</template>
</el-table-column>
</el-table-column>
<el-table-column label="建设单位" align="center">
<el-table-column align="center" prop="ownerLeader" label="负责人" />
<el-table-column align="center" prop="ownerDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.ownerDate) }}</template>
</el-table-column>
</el-table-column> -->
<el-table-column align="center" prop="content" label="操作" width="160">
<template #default="scope"> <template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column align="center" prop="content" label="操作" width="240">
<template #default="scope">
<el-button link type="warning" v-if="scope.row.status === 'draft'" icon="Edit" @click="handleUpdate(scope.row)" class="ml-3">审批 </el-button>
<el-button link type="primary" icon="View" @click="handleViewInfo(scope.row)" class="ml-3"> 查看流程 </el-button>
<el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button> <el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button>
<!-- <el-button link type="primary" icon="Download" @click="handleDownload()"> 下载 </el-button> -->
<!-- <el-button link type="warning" icon="Edit" @click="handleDelete(scope.row)"> 修改 </el-button> -->
<el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button> <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 详情 --> <!-- 详情 -->
<el-dialog title="变更单详情" v-model="detailVisible" width="1000"> <el-dialog title="变更单详情" v-model="detailVisible" width="1000">
<div class="w[850px] ma word-export-wrapper" ref="exportRef"> <div class="w[850px] ma word-export-wrapper" ref="exportRef">
@ -189,36 +146,16 @@
import { listByIds } from '@/api/system/oss'; import { listByIds } from '@/api/system/oss';
import { dayjs } from 'element-plus'; import { dayjs } from 'element-plus';
import { saveAs } from 'file-saver'; import { saveAs } from 'file-saver';
const form = reactive({ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
projectName: '', const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
unitName: '',
profession: '',
applyDate: '2025-6-23 13:03:56',
bookName: '',
bookNo: '',
hasAttachment:
'http://58.17.134.85:9000/xinnengyuan-dev/doc/safety/knowledge/1897160897167638529/知识库/指导手册/2025-06-27_2f56bca1c4bc46c6b226858a18713c48.jpg', // 附图链接或图片地址
changeReasons: [0, 3, 5],
changeContent: '',
costEstimate: '',
contractorManager: '',
contractorDate: '',
generalTechLeader: '',
generalDate: '',
designer: '',
designerDate: '',
supervisorEngineer: '',
chiefSupervisor: '',
supervisorDate: '',
ownerLeader: '',
ownerDate: ''
});
const props = defineProps({ const props = defineProps({
data: { data: {
type: Array, type: Array,
default: () => [] default: () => []
},
thumbnail:{
type: String,
default:''
} }
}); });
const tableDetail = ref<any>({}); const tableDetail = ref<any>({});
@ -237,13 +174,11 @@ const detailVisible = ref(false);
const formatDate = (val: string | Date) => (val ? dayjs(val).format('YYYY-MM-DD') : ''); const formatDate = (val: string | Date) => (val ? dayjs(val).format('YYYY-MM-DD') : '');
const handleDetail = async (row) => { const handleDetail = async (row) => {
const res = await listByIds(row.hasAttachment); const res = await listByIds(row.id);
tableDetail.value = { tableDetail.value = {
...row, ...row,
hasAttachmentList: res.data hasAttachmentList: res.data
}; };
console.log(tableDetail.value);
detailVisible.value = true; detailVisible.value = true;
}; };
/** 多选框选中数据 */ /** 多选框选中数据 */
@ -254,7 +189,32 @@ const handleSelectionChange = (selection: any) => {
const handleDelete = (row) => { const handleDelete = (row) => {
emit('delete', row.id); emit('delete', row.id);
}; };
const handleUpdate = (row) => {
// 添加审批
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/cory/template/indexEdit`,
query: {
thumbnailUrl:props.thumbnail,
row:JSON.stringify(row),
id: row.id,
type: 'update'
}
});
};
const handleViewInfo = (row) => {
// 添加审批
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/cory/template/indexEdit`,
query: {
thumbnailUrl:props.thumbnail,
row:JSON.stringify(row),
id: row.id,
type: 'view'
}
});
};
const handleDownload = () => { const handleDownload = () => {
const style = ` const style = `
<style> <style>

View File

@ -1,75 +1,63 @@
<template> <template>
<div class="p-2"> <div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
<div v-show="showSearch" class="mb-[10px]"> <el-tab-pane label="变更单" name="1"
<el-card shadow="hover"> ><el-card shadow="never">
<el-form ref="queryFormRef" :model="queryParams" :inline="true"> <template #header>
<el-form-item label="模板类型" prop="projectType"> <el-row :gutter="10" class="mb8">
<el-select v-model="queryParams.projectType" placeholder="请选择模板类型" clearable filterable @change="selectType"> <el-col :span="1.5">
<el-option v-for="item in projectTypeOptions" :key="item.name" :label="item.name" :value="item.name"> </el-option> <el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAddApp" v-hasPermi="['quality:qualityInspection:add']"
</el-select> >上传变更单模版</el-button
</el-form-item> >
<!-- <el-form-item> </el-col>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
<el-button icon="Refresh" @click="resetQuery">重置</el-button> </el-row>
</el-form-item> --> </template>
</el-form> <EngineeringChangeApplicationForm
</el-card> @selection-change="handleSelectionChange"
</div> :data="tableData"
</transition> :thumbnail="projectTypeOptions[1].thumbnail"
<el-card shadow="never"> @delete="handleDelete"
></EngineeringChangeApplicationForm>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/> </el-card
></el-tab-pane>
<el-tab-pane label="外部联系单" name="0"
><el-card shadow="never">
<template #header> <template #header>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']" <el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']"
>新增</el-button >上传外部联系单模版</el-button
> >
</el-col> </el-col>
<!-- <el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['quality:qualityInspection:edit']"
>修改</el-button
>
</el-col> -->
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="Delete"
:disabled="multiple"
@click="handleDelete()"
v-hasPermi="['quality:qualityInspection:remove']"
>删除</el-button
>
</el-col>
<!-- <el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['quality:qualityInspection:export']">导出</el-button>
</el-col> -->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
</template> </template>
<!-- card body -->
<Contactform <Contactform
v-if="queryParams.projectType == '外部联系单'"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
:data="tableData" :data="tableData"
@delete="handleDelete" @delete="handleDelete"
></Contactform> ></Contactform>
<EngineeringChangeApplicationForm <pagination
v-if="queryParams.projectType == '变更单'" v-show="total > 0"
@selection-change="handleSelectionChange" :total="total"
:data="tableData" v-model:page="queryParams.pageNum"
@delete="handleDelete" v-model:limit="queryParams.pageSize"
></EngineeringChangeApplicationForm> @pagination="getList"
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> /> </el-card
</el-card> ></el-tab-pane>
</el-tabs>
<el-dialog title="新增模板" v-model="dialogVisible" width="800"> <el-dialog title="新增模板" v-model="dialogVisible" width="800">
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px"> <el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
<div class="flex"> <div class="flex">
<!-- <img :src="thumbnailUrl" alt="" style="width: 150px;" /> -->
<div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div> <div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div>
<div>
<div v-if="queryParams.projectType == '外部联系单'">
<el-form-item label="工程名称" prop="projectName"> <el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" /> <el-input v-model="form.projectName" placeholder="请输入工程名称" />
</el-form-item> </el-form-item>
@ -111,94 +99,6 @@
<el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
</div> </div>
<div v-if="queryParams.projectType === '变更单'">
<el-form-item label="工程名称">
<el-input v-model="form.projectName" />
</el-form-item>
<el-form-item label="提出单位">
<el-input v-model="form.unitName" />
</el-form-item>
<el-form-item label="专业">
<el-input v-model="form.profession" />
</el-form-item>
<el-form-item label="提出日期">
<el-date-picker v-model="form.applyDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-form-item label="卷册名称">
<el-input v-model="form.bookName" />
</el-form-item>
<el-form-item label="卷册号">
<el-input v-model="form.bookNo" />
</el-form-item>
<el-form-item label="附图">
<image-upload v-model="form.hasAttachment"></image-upload>
</el-form-item>
<el-form-item label="变更原因">
<el-checkbox-group v-model="form.changeReasons">
<el-checkbox label="设计漏项" class="w45%" />
<el-checkbox label="设计改进" />
<el-checkbox label="设计差错" class="w45%" />
<el-checkbox label="接口差错" />
<el-checkbox label="业主要求" class="w45%" />
<el-checkbox label="施工承包商要求" />
<el-checkbox label="外部资料不符" class="w45%" />
<el-checkbox label="材料代用或其他" />
</el-checkbox-group>
</el-form-item>
<el-form-item label="变更内容">
<el-input v-model="form.changeContent" />
</el-form-item>
<el-form-item label="变更费用估算">
<el-input v-model="form.costEstimate" />
</el-form-item>
<el-divider class="mb-10! mt-10!">施工承包单位</el-divider>
<el-form-item label="项目经理" prop="asupervisorLeader">
<el-input v-model="form.asupervisorLeader" placeholder="请输入项目经理姓名" />
</el-form-item>
<el-form-item label="日期" prop="asupervisorDate">
<el-date-picker v-model="form.asupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">总承包单位</el-divider>
<el-form-item label="项目技术负责人" prop="bsupervisorLeader">
<el-input v-model="form.bsupervisorLeader" placeholder="请输入项目技术负责人姓名" />
</el-form-item>
<el-form-item label="日期" prop="bsupervisorDate">
<el-date-picker v-model="form.bsupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">设计单位</el-divider>
<el-form-item label="设计代表" prop="csupervisorLeader">
<el-input v-model="form.csupervisorLeader" placeholder="请输入设计代表姓名" />
</el-form-item>
<el-form-item label="日期" prop="csupervisorDate">
<el-date-picker v-model="form.csupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">项目监理单位</el-divider>
<el-form-item label="监理工程师" prop="dsupervisorLeader">
<el-input v-model="form.dsupervisorLeader" placeholder="请输入监理工程师姓名" />
</el-form-item>
<el-form-item label="总监理工程师" prop="dasupervisorLeader">
<el-input v-model="form.dasupervisorLeader" placeholder="请输入总监理工程师姓名" />
</el-form-item>
<el-form-item label="日期" prop="dsupervisorDate">
<el-date-picker v-model="form.dsupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">建设单位</el-divider>
<el-form-item label="负责人" prop="esupervisorLeader">
<el-input v-model="form.esupervisorLeader" placeholder="请输入负责人姓名" />
</el-form-item>
<el-form-item label="日期" prop="esupervisorDate">
<el-date-picker v-model="form.esupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
</div>
</div> </div>
</el-form> </el-form>
<template #footer> <template #footer>
@ -224,15 +124,10 @@ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const userStore = useUserStoreHook(); const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目 // 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject); const currentProject = computed(() => userStore.selectedProject);
const { safety_inspection_violation_type, safety_inspection_check_type } = toRefs<any>(
proxy?.useDict('safety_inspection_violation_type', 'safety_inspection_check_type')
);
const teamOpt = ref([]);
const foremanOpt = ref([]);
const thumbnailUrl = ref(''); const thumbnailUrl = ref('');
const tableData = ref([]); const tableData = ref([]);
const total = ref(0); const total = ref(0);
const activeName = ref('1')
const formRef = ref<FormInstance>(); const formRef = ref<FormInstance>();
const dialogVisible = ref<boolean>(false); const dialogVisible = ref<boolean>(false);
const showSearch = ref(true); const showSearch = ref(true);
@ -338,17 +233,6 @@ const handleAdd = () => {
dialogVisible.value = true; dialogVisible.value = true;
}; };
const changeForeman = (value: string | number) => {
// const team = teamList.value.filter((team) => team.id === value)[0];
// foremanOpt.value = team.foremanList?.map((foreman: foremanQuery) => ({
// label: foreman.foremanName,
// value: foreman.foremanId
// }));
// form.value.correctorId = '';
};
const handleQuery = () => {};
const resetQuery = () => {};
const getList = async () => { const getList = async () => {
if (!queryParams.value.projectType) { if (!queryParams.value.projectType) {
const res = await listContactTypeformtemplate(queryParams.value); const res = await listContactTypeformtemplate(queryParams.value);
@ -376,8 +260,6 @@ const handleDelete = async (id?: string) => {
getList(); getList();
} }
}; };
const handleUpdate = () => {};
/** 多选框选中数据 */ /** 多选框选中数据 */
const handleSelectionChange = (selection: any) => { const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item) => item.id); ids.value = selection.map((item) => item.id);
@ -392,10 +274,23 @@ const selectType = (value: string) => {
getList(); getList();
}; };
const resetForm = () => { const handleClick=(val)=>{
formRef.value?.resetFields(); console.log(val);
}; queryParams.value.projectType=val.props.name;
getList();
}
const handleAddApp=(row)=>{
// 添加审批
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/cory/template/indexEdit`,
query: {
thumbnailUrl: projectTypeOptions.value[1].thumbnail,
row,
type: 'add'
}
});
}
onMounted(() => { onMounted(() => {
getList(); getList();
}); });

View File

@ -0,0 +1,442 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.status"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">变更联系单</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="100px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<div class="flex">
<div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div>
<div>
<el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" />
</el-form-item>
<el-form-item label="编号" prop="serialNumber">
<el-input v-model="form.serialNumber" placeholder="请输入编号" />
</el-form-item>
<el-form-item label="致" prop="to">
<el-input v-model="form.to" placeholder="致:" />
</el-form-item>
<el-form-item label="主题" prop="subject">
<el-input v-model="form.subject" placeholder="请输入主题" />
</el-form-item>
<el-form-item label="内容" prop="content">
<el-input v-model="form.content" type="textarea" :rows="6" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="附件" prop="attachments">
<file-upload v-model="form.attachments" :limit="1" :file-type="['pdf', 'png', 'jpg', 'jpeg', 'gif', 'bmp']"></file-upload>
</el-form-item>
<el-divider class="mb-10! mt-10!">施工项目部</el-divider>
<el-form-item label="项目负责人" prop="contractorLeader">
<el-input v-model="form.contractorLeader" placeholder="请输入负责人姓名" />
</el-form-item>
<el-form-item label="日期" prop="contractorDate">
<el-date-picker v-model="form.contractorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">项目监理机构</el-divider>
<el-form-item label="总监理工程师" prop="supervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入总监理工程师姓名" />
</el-form-item>
<el-form-item label="日期" prop="supervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
<el-divider class="mb-10! mt-10!">建设单位</el-divider>
<el-form-item label="业主代表" prop="ownerRep">
<el-input v-model="form.ownerRep" placeholder="请输入业主代表" />
</el-form-item>
<el-form-item label="日期" prop="ownerDate">
<el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
</div>
</div>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
import { listByIds } from '@/api/system/oss';
import { addContactnotice,getContactnotice ,updateContactnotice} from '@/api/cory/contactnotice';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
const thumbnailUrl = ref('');
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCodeOptions = [
{
value: currentProject.value?.id + '_changecontact',
label: '变更联系单审批'
},
];
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
projectType: '',
projectName: '',
serialNumber: '',
to: '',
subject: '',
content: '',
attachments: '',
contractorLeader: '',
contractorDate: '',
supervisorLeader: '',
supervisorDate: '',
ownerRep: '',
ownerDate: '',
unitName: '',
profession: '',
applyDate: '',
bookName: '',
bookNo: '',
hasAttachment: '',
changeReasons: [],
changeContent: '',
costEstimate: '',
status: ''
};
const data = reactive({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
projectId: currentProject.value?.id,
fileName: undefined,
fileType: undefined,
fileSuffix: undefined,
fileStatus: undefined,
originalName: undefined,
newest: undefined,
params: {}
},
rules: {
projectName: [{ required: true, message: '请输入工程名称', trigger: 'blur' }],
projectType: [{ required: true, message: '请选择模板类型', trigger: 'blur' }],
serialNumber: [{ required: true, message: '请输入编号', trigger: 'blur' }],
to: [{ required: true, message: '请输入接收方', trigger: 'blur' }],
subject: [{ required: true, message: '请输入主题', trigger: 'blur' }],
content: [{ required: true, message: '请输入内容', trigger: 'blur' }]
}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getContactnotice(routeParams.value.id);
var data = {
...JSON.parse(routeParams.value.row),
...JSON.parse(res.data.detail)
};
console.log(routeParams.value);
Object.assign(form.value, data);
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
leaveFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
// var res;
// if (form.value.id) {
// res = await updateContactnotice(form.value).finally(() => (buttonLoading.value = false));
// } else {
// res = await addContactnotice(form.value).finally(() => (buttonLoading.value = false));
// }
// if (res.code == 200) {
dialog.visible = false;
submit(status.value, form.value);
// }
}
});
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.status === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
console.log(data);
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
thumbnailUrl.value = proxy.$route.query.thumbnailUrl;
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -38,12 +38,7 @@
<template #header> <template #header>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['design:designChange:add']">新增</el-button> <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['design:designChange:add']">上传设计变更</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['design:designChange:remove']"
>删除</el-button
>
</el-col> </el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
@ -68,16 +63,24 @@
</el-table-column> </el-table-column>
<el-table-column label="变更内容" align="center" prop="changeContent" /> <el-table-column label="变更内容" align="center" prop="changeContent" />
<!-- <el-table-column label="变更费用估算" align="center" prop="costEstimation" /> --> <!-- <el-table-column label="变更费用估算" align="center" prop="costEstimation" /> -->
<el-table-column label="变更文件" align="center" prop="fileId"> <el-table-column label="变更文件" align="center" >
<template #default="scope"> <template #default="scope">
<span style="color: rgb(41 145 255); cursor: pointer" @click="onOpen(scope.row.file.url)"> {{ scope.row.file.originalName }}</span> <span v-if="scope.row.file" style="color: rgb(41 145 255); cursor: pointer" @click="onOpen(scope.row.file.url)"> {{ scope.row.file.originalName }}</span>
</template>
</el-table-column>
<el-table-column label="流程状态" align="center" prop="status">
<template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.status" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" align="center" prop="remark" /> <el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope"> <template #default="scope">
<el-tooltip content="查看" placement="top"> <el-tooltip content="查看流程" placement="top">
<el-button link type="primary" icon="View" @click="handleView(scope.row)"></el-button> <el-button link type="primary" icon="View" @click="handleViewInfo(scope.row)"></el-button>
</el-tooltip>
<el-tooltip content="查看文档" placement="top">
<el-button link type="primary" icon="Word" @click="handleView(scope.row)"></el-button>
</el-tooltip> </el-tooltip>
<el-tooltip content="修改" placement="top"> <el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['design:designChange:edit']"></el-button> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['design:designChange:edit']"></el-button>
@ -90,91 +93,13 @@
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card> </el-card>
<el-dialog
:title="dialog.title"
v-model="dialog.visible"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="800px"
append-to-body
>
<el-form ref="designChangeFormRef" :model="form" :rules="rules" label-width="110px">
<el-row>
<el-col :span="12">
<el-form-item label="申请单编号" prop="formNo">
<el-input v-model="form.formNo" placeholder="请输入申请单编号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="工程名称" prop="projectName"> <el-input v-model="form.projectName" placeholder="请输入工程名称" /> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="提出单位" prop="submitUnit">
<el-input v-model="form.submitUnit" placeholder="请输入提出单位" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="专业" prop="specialty">
<el-input v-model="form.specialty" placeholder="请输入专业" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="提出日期" prop="submitDate">
<el-date-picker clearable v-model="form.submitDate" type="date" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择提出日期">
</el-date-picker> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="卷册名称" prop="volumeName"> <el-input v-model="form.volumeName" placeholder="请输入卷册名称" /> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="卷册号" prop="volumeNo"> <el-input v-model="form.volumeNo" placeholder="请输入卷册号" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="附图" prop="attachmentPic"> <image-upload v-model="form.attachmentPic" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="变更原因" prop="changeReason">
<el-checkbox-group v-model="form.changeReason">
<el-checkbox v-for="dict in design_change_reason_type" :key="dict.value" :label="dict.value">
{{ dict.label }}
</el-checkbox>
</el-checkbox-group>
</el-form-item></el-col
>
<el-col :span="24">
<el-form-item label="变更内容" prop="changeContent">
<el-input v-model="form.changeContent" type="textarea" placeholder="请输入内容" /> </el-form-item
></el-col>
<!-- <el-col :span="12">
<el-form-item label="变更费用估算" prop="costEstimation">
<el-input v-model="form.costEstimation" type="textarea" placeholder="请输入内容" /> </el-form-item
></el-col> -->
<el-col :span="24">
<el-form-item label="变更费用估算表" label-width="110px" prop="costEstimationFile">
<file-upload v-model="form.costEstimationFile" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="变更文件" prop="fileId"> <file-upload v-model="form.fileId" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24"
><el-form-item label="备注" prop="remark"> <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> </el-form-item
></el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
<wordDetial ref="wordDetialRef"></wordDetial> <wordDetial ref="wordDetialRef"></wordDetial>
</div> </div>
</template> </template>
<script setup name="DesignChange" lang="ts"> <script setup name="DesignChange" lang="ts">
import { listDesignChange, getDesignChange, delDesignChange, addDesignChange, updateDesignChange } from '@/api/design/designChange'; import { listDesignChange, delDesignChange } from '@/api/design/designChange';
import { DesignChangeVO, DesignChangeQuery, DesignChangeForm } from '@/api/design/designChange/types'; import { DesignChangeVO, } from '@/api/design/designChange/types';
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
import wordDetial from '@/components/wordDetial/index'; import wordDetial from '@/components/wordDetial/index';
@ -185,7 +110,6 @@ const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目 // 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject); const currentProject = computed(() => userStore.selectedProject);
const designChangeList = ref<DesignChangeVO[]>([]); const designChangeList = ref<DesignChangeVO[]>([]);
const buttonLoading = ref(false);
const wordDetialRef = ref<InstanceType<typeof wordDetial>>(); const wordDetialRef = ref<InstanceType<typeof wordDetial>>();
const loading = ref(true); const loading = ref(true);
const showSearch = ref(true); const showSearch = ref(true);
@ -193,36 +117,9 @@ const ids = ref<Array<string | number>>([]);
const single = ref(true); const single = ref(true);
const multiple = ref(true); const multiple = ref(true);
const total = ref(0); const total = ref(0);
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const queryFormRef = ref<ElFormInstance>(); const queryFormRef = ref<ElFormInstance>();
const designChangeFormRef = ref<ElFormInstance>(); const data = reactive({
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: DesignChangeForm = {
id: undefined,
projectId: currentProject.value?.id,
formNo: undefined,
projectName: undefined,
submitUnit: undefined,
specialty: undefined,
submitDate: undefined,
volumeName: undefined,
volumeNo: undefined,
attachmentPic: undefined,
changeReason: [],
changeContent: undefined,
costEstimation: undefined,
costEstimationFile: undefined,
fileId: undefined,
status: undefined,
remark: undefined
};
const data = reactive<PageData<DesignChangeForm, DesignChangeQuery>>({
form: { ...initFormData },
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
@ -238,13 +135,9 @@ const data = reactive<PageData<DesignChangeForm, DesignChangeQuery>>({
status: undefined, status: undefined,
params: {} params: {}
}, },
rules: {
id: [{ required: true, message: '主键id不能为空', trigger: 'blur' }],
projectId: [{ required: true, message: '项目id不能为空', trigger: 'blur' }]
}
}); });
const { queryParams, form, rules } = toRefs(data); const { queryParams} = toRefs(data);
/** 查询设计变更管理列表 */ /** 查询设计变更管理列表 */
const getList = async () => { const getList = async () => {
@ -255,18 +148,6 @@ const getList = async () => {
loading.value = false; loading.value = false;
}; };
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
designChangeFormRef.value?.resetFields();
};
/** 搜索按钮操作 */ /** 搜索按钮操作 */
const handleQuery = () => { const handleQuery = () => {
queryParams.value.pageNum = 1; queryParams.value.pageNum = 1;
@ -288,40 +169,37 @@ const handleSelectionChange = (selection: DesignChangeVO[]) => {
/** 新增按钮操作 */ /** 新增按钮操作 */
const handleAdd = () => { const handleAdd = () => {
reset(); proxy.$tab.closePage(proxy.$route);
dialog.visible = true; proxy.$router.push({
dialog.title = '添加设计变更'; path: `/workflows/designChange/indexEdit`,
}; query: {
type: 'add'
/** 修改按钮操作 */
const handleUpdate = async (row?: DesignChangeVO) => {
reset();
const _id = row?.id || ids.value[0];
const res = await getDesignChange(_id);
Object.assign(form.value, res.data);
form.value.changeReason = form.value.changeReason.split(',');
dialog.visible = true;
dialog.title = '修改设计变更';
};
/** 提交按钮 */
const submitForm = () => {
designChangeFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
form.value.changeReason = form.value.changeReason.join(',');
if (form.value.id) {
await updateDesignChange({ ...form.value }).finally(() => (buttonLoading.value = false));
} else {
await addDesignChange(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
} }
}); });
}; };
/** 修改按钮操作 */
const handleUpdate = async (row?: DesignChangeVO) => {
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/workflows/designChange/indexEdit`,
query: {
id: row.id,
type: 'update'
}
});
};
/** 查看按钮操作 */
const handleViewInfo = (row) => {
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/workflows/designChange/indexEdit`,
query: {
id: row.id,
type: 'view'
}
});
};
/** 删除按钮操作 */ /** 删除按钮操作 */
const handleDelete = async (row?: DesignChangeVO) => { const handleDelete = async (row?: DesignChangeVO) => {
const _ids = row?.id || ids.value; const _ids = row?.id || ids.value;
@ -346,7 +224,6 @@ const listeningProject = watch(
() => currentProject.value.id, () => currentProject.value.id,
(nid, oid) => { (nid, oid) => {
queryParams.value.projectId = nid; queryParams.value.projectId = nid;
form.value.projectId = nid;
getList(); getList();
} }
); );

View File

@ -0,0 +1,442 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.status"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">设计变更信息</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="100px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<el-row>
<el-col :span="12">
<el-form-item label="申请单编号" prop="formNo">
<el-input v-model="form.formNo" placeholder="请输入申请单编号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" /> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="提出单位" prop="submitUnit">
<el-input v-model="form.submitUnit" placeholder="请输入提出单位" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="专业" prop="specialty">
<el-input v-model="form.specialty" placeholder="请输入专业" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="提出日期" prop="submitDate">
<el-date-picker clearable v-model="form.submitDate" type="date" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择提出日期">
</el-date-picker> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="卷册名称" prop="volumeName"> <el-input v-model="form.volumeName" placeholder="请输入卷册名称" /> </el-form-item
></el-col>
<el-col :span="12">
<el-form-item label="卷册号" prop="volumeNo"> <el-input v-model="form.volumeNo" placeholder="请输入卷册号" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="附图" prop="attachmentPic"> <image-upload v-model="form.attachmentPic" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="变更原因" prop="changeReason">
<el-checkbox-group v-model="form.changeReason">
<el-checkbox v-for="dict in design_change_reason_type" :key="dict.value" :value="dict.value">
{{ dict.label }}
</el-checkbox>
</el-checkbox-group>
</el-form-item></el-col
>
<el-col :span="24">
<el-form-item label="变更内容" prop="changeContent">
<el-input v-model="form.changeContent" type="textarea" placeholder="请输入内容" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="变更费用估算表" label-width="110px" prop="costEstimationFile">
<file-upload v-model="form.costEstimationFile" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24">
<el-form-item label="变更文件" prop="fileId"> <file-upload v-model="form.fileId" :fileSize="100" /> </el-form-item
></el-col>
<el-col :span="24"
><el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> </el-form-item
></el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
import { getDesignChange, addDesignChange, updateDesignChange } from '@/api/design/designChange';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCodeOptions = [
{
value: currentProject.value?.id + '_designchanged',
label: '设计变更审批'
},
];
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const approvalButtonRef = ref<InstanceType<typeof ApprovalButton>>();
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
formNo: undefined,
projectName: undefined,
submitUnit: undefined,
specialty: undefined,
submitDate: undefined,
volumeName: undefined,
volumeNo: undefined,
attachmentPic: undefined,
changeReason: [],
changeContent: undefined,
costEstimation: undefined,
costEstimationFile: undefined,
fileId: undefined,
status: undefined,
remark: undefined
};
const data = reactive({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
projectId: currentProject.value?.id,
fileName: undefined,
fileType: undefined,
fileSuffix: undefined,
fileStatus: undefined,
originalName: undefined,
newest: undefined,
params: {}
},
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getDesignChange(routeParams.value.id);
Object.assign(form.value, res.data);
if(form.value.changeReason.length >0){
form.value.changeReason = form.value.changeReason.split(',');
}
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
var changeReason=''
if(form.value.changeReason.length >0){
changeReason = form.value.changeReason.join(',');
}
leaveFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
var res;
if (form.value.id) {
res = await updateDesignChange({...form.value,changeReason}).finally(() => (buttonLoading.value = false));
} else {
res = await addDesignChange({...form.value,changeReason}).finally(() => (buttonLoading.value = false));
}
if (res.code == 200) {
dialog.visible = false;
submit(status.value, res.data);
}
}
});
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.status === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -88,8 +88,8 @@
</template> </template>
<script setup name="Drawing" lang="ts"> <script setup name="Drawing" lang="ts">
import { listDrawing, getDrawing, delDrawing, addDrawing, updateDrawing } from '@/api/design/drawing'; import { listDrawing,delDrawing, } from '@/api/design/drawing';
import { DrawingVO, DrawingQuery, DrawingForm } from '@/api/design/drawing/types'; import { DrawingVO} from '@/api/design/drawing/types';
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
import { LeaveVO } from '@/api/workflow/leave/types'; import { LeaveVO } from '@/api/workflow/leave/types';
import { cancelProcessApply } from '@/api/workflow/instance'; import { cancelProcessApply } from '@/api/workflow/instance';
@ -110,29 +110,9 @@ const ids = ref<Array<string | number>>([]);
const single = ref(true); const single = ref(true);
const multiple = ref(true); const multiple = ref(true);
const total = ref(0); const total = ref(0);
const fileList = ref([]); // 存储上传的文件列表
const selectedFile = ref(null); // 当前选中的文件
const queryFormRef = ref<ElFormInstance>(); const queryFormRef = ref<ElFormInstance>();
const drawingFormRef = ref<ElFormInstance>();
const activeName = ref('1'); const activeName = ref('1');
const dialog = reactive({ const data = reactive({
visible: false,
title: '',
isEdit: false
});
const initFormData: DrawingForm = {
id: undefined,
projectId: currentProject.value?.id,
versionNumber: undefined,
fileName: undefined,
fileUrl: undefined,
fileType: undefined,
fileSuffix: undefined,
originalName: undefined,
remark: undefined
};
const data = reactive<PageData<DrawingForm, DrawingQuery>>({
form: { ...initFormData },
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
@ -145,30 +125,9 @@ const data = reactive<PageData<DrawingForm, DrawingQuery>>({
newest: undefined, newest: undefined,
params: {} params: {}
}, },
rules: {
versionNumber: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
fileName: [{ required: true, message: '文件名称不能为空', trigger: 'blur' }],
fileType: [{ required: true, message: '文件类型不能为空', trigger: 'change' }],
file: [
{
validator: (rule, value, callback) => {
console.log(dialog.isEdit);
console.log(fileList.value);
// 新增时必须上传文件
if (!dialog.isEdit && !fileList.value.length) {
callback(new Error('请上传图纸文件'));
} else {
callback();
}
},
trigger: 'change'
}
]
}
}); });
const { queryParams, form, rules } = toRefs(data); const { queryParams } = toRefs(data);
/** 查询图纸管理列表 */ /** 查询图纸管理列表 */
const getList = async () => { const getList = async () => {
@ -179,20 +138,6 @@ const getList = async () => {
loading.value = false; loading.value = false;
}; };
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
drawingFormRef.value?.resetFields();
fileList.value = [];
selectedFile.value = null;
};
/** 搜索按钮操作 */ /** 搜索按钮操作 */
const handleQuery = () => { const handleQuery = () => {
queryParams.value.pageNum = 1; queryParams.value.pageNum = 1;
@ -288,7 +233,6 @@ const listeningProject = watch(
() => currentProject.value.id, () => currentProject.value.id,
(nid, oid) => { (nid, oid) => {
queryParams.value.projectId = nid; queryParams.value.projectId = nid;
form.value.projectId = nid;
getList(); getList();
} }
); );

View File

@ -176,7 +176,7 @@ const data = reactive<PageData<LeaveForm, LeaveQuery>>({
versionNumber: [{ required: true, message: '版本号不能为空', trigger: 'blur' }], versionNumber: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
fileName: [{ required: true, message: '文件名称不能为空', trigger: 'blur' }], fileName: [{ required: true, message: '文件名称不能为空', trigger: 'blur' }],
fileType: [{ required: true, message: '文件类型不能为空', trigger: 'change' }], fileType: [{ required: true, message: '文件类型不能为空', trigger: 'change' }],
file: [ fileUrl: [
{ {
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
// 新增时必须上传文件 // 新增时必须上传文件

View File

@ -78,15 +78,14 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card> </el-card>
</div> </div>
</template> </template>
<script setup name="SpecialScheme" lang="ts"> <script setup name="SpecialScheme" lang="ts">
import { listSpecialScheme, getSpecialScheme, delSpecialScheme, addSpecialScheme, updateSpecialScheme } from '@/api/design/specialScheme'; import { listSpecialScheme,delSpecialScheme} from '@/api/design/specialScheme';
import { SpecialSchemeVO, SpecialSchemeQuery, SpecialSchemeForm } from '@/api/design/specialScheme/types'; import { SpecialSchemeVO } from '@/api/design/specialScheme/types';
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
import { cancelProcessApply } from '@/api/workflow/instance'; import { cancelProcessApply } from '@/api/workflow/instance';
@ -97,7 +96,6 @@ const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目 // 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject); const currentProject = computed(() => userStore.selectedProject);
const specialSchemeList = ref<SpecialSchemeVO[]>([]); const specialSchemeList = ref<SpecialSchemeVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true); const loading = ref(true);
const showSearch = ref(true); const showSearch = ref(true);
const ids = ref<Array<string | number>>([]); const ids = ref<Array<string | number>>([]);
@ -106,24 +104,8 @@ const multiple = ref(true);
const total = ref(0); const total = ref(0);
const queryFormRef = ref<ElFormInstance>(); const queryFormRef = ref<ElFormInstance>();
const specialSchemeFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({ const data = reactive({
visible: false,
title: ''
});
const initFormData: SpecialSchemeForm = {
id: undefined,
projectId: currentProject.value?.id,
versionNumber: undefined,
fileName: undefined,
fileUrl: undefined,
fileSuffix: undefined,
remark: undefined
};
const data = reactive<PageData<SpecialSchemeForm, SpecialSchemeQuery>>({
form: { ...initFormData },
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
@ -134,13 +116,9 @@ const data = reactive<PageData<SpecialSchemeForm, SpecialSchemeQuery>>({
status: undefined, status: undefined,
params: {} params: {}
}, },
rules: {
versionNumber: [{ required: true, message: '版本号不能为空', trigger: 'blur' }],
fileName: [{ required: true, message: '文件名称不能为空', trigger: 'blur' }]
}
}); });
const { queryParams, form, rules } = toRefs(data); const { queryParams } = toRefs(data);
/** 查询专项方案管理列表 */ /** 查询专项方案管理列表 */
const getList = async () => { const getList = async () => {
@ -151,18 +129,6 @@ const getList = async () => {
loading.value = false; loading.value = false;
}; };
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
specialSchemeFormRef.value?.resetFields();
};
/** 搜索按钮操作 */ /** 搜索按钮操作 */
const handleQuery = () => { const handleQuery = () => {
queryParams.value.pageNum = 1; queryParams.value.pageNum = 1;
@ -204,24 +170,6 @@ const handleUpdate = async (row?: SpecialSchemeVO) => {
} }
}); });
}; };
/** 提交按钮 */
const submitForm = () => {
specialSchemeFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateSpecialScheme(form.value).finally(() => (buttonLoading.value = false));
} else {
await addSpecialScheme(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 删除按钮操作 */ /** 删除按钮操作 */
const handleDelete = async (row?: SpecialSchemeVO) => { const handleDelete = async (row?: SpecialSchemeVO) => {
const _ids = row?.id || ids.value; const _ids = row?.id || ids.value;
@ -265,7 +213,6 @@ const listeningProject = watch(
() => currentProject.value.id, () => currentProject.value.id,
(nid, oid) => { (nid, oid) => {
queryParams.value.projectId = nid; queryParams.value.projectId = nid;
form.value.projectId = nid;
getList(); getList();
} }
); );

View File

@ -1,4 +1,5 @@
<template> <template>
<div>
<el-tabs v-model="activeName" class="demo-tabs p5" @tab-click="handleCheckMian"> <el-tabs v-model="activeName" class="demo-tabs p5" @tab-click="handleCheckMian">
<el-tab-pane label="资料" name="first"> <el-tab-pane label="资料" name="first">
<div class="profile_engin"> <div class="profile_engin">
@ -81,10 +82,20 @@
<el-table-column label="序号" align="center" type="index" min-width="50px" /> <el-table-column label="序号" align="center" type="index" min-width="50px" />
<el-table-column label="文件名称" align="center" prop="fileName"></el-table-column> <el-table-column label="文件名称" align="center" prop="fileName"></el-table-column>
<el-table-column label="文件类型" align="center" prop="fileSuffix" width="100px" /> <el-table-column label="文件类型" align="center" prop="fileSuffix" width="100px" />
<el-table-column label="流程状态" align="center" prop="status">
<template #default="scope">
<dict-tag :options="wf_business_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column label="上传时间" align="center" prop="createTime"> </el-table-column> <el-table-column label="上传时间" align="center" prop="createTime"> </el-table-column>
<el-table-column label="操作" align="center" width="300"> <el-table-column label="操作" align="center" width="300">
<template #default="scope"> <template #default="scope">
<el-button type="primary" link @click="handleApproval(scope.row)"
><el-icon><Plus /></el-icon>审批</el-button
>
<el-button type="primary" link @click="handleViewApproval(scope.row)"
><el-icon><View /></el-icon>流程查看</el-button
>
<el-button type="primary" link @click="handleView(scope.row)" v-if="acceptType.includes(scope.row.fileSuffix)" <el-button type="primary" link @click="handleView(scope.row)" v-if="acceptType.includes(scope.row.fileSuffix)"
><el-icon><View /></el-icon>查看</el-button ><el-icon><View /></el-icon>查看</el-button
> >
@ -138,6 +149,7 @@
<RecyclingStation ref="recylingRef"></RecyclingStation> <RecyclingStation ref="recylingRef"></RecyclingStation>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div>
</template> </template>
<script setup name="KnowledgeDocument" lang="ts"> <script setup name="KnowledgeDocument" lang="ts">
@ -153,7 +165,6 @@ import {
import documentsEdit from './component/documentsEdit.vue'; import documentsEdit from './component/documentsEdit.vue';
import documentsDeailsVue from './component/documentsDeails.vue'; import documentsDeailsVue from './component/documentsDeails.vue';
import RecyclingStation from './component/recyclingStation.vue'; import RecyclingStation from './component/recyclingStation.vue';
import { useUserStoreHook } from '@/store/modules/user'; import { useUserStoreHook } from '@/store/modules/user';
import bookFile from './component/bookFile.vue'; import bookFile from './component/bookFile.vue';
const activeName = ref('first'); const activeName = ref('first');
@ -162,6 +173,7 @@ const { proxy } = getCurrentInstance() as any;
const userStore = useUserStoreHook(); const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目 // 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject); const currentProject = computed(() => userStore.selectedProject);
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const uploadUrl = computed(() => { const uploadUrl = computed(() => {
return `/design/technicalStandard/file`; return `/design/technicalStandard/file`;
}); });
@ -171,7 +183,6 @@ const uploadParams = computed(() => {
projectId: state.projectId projectId: state.projectId
}; };
}); });
const imgUrl = ref<string>(''); const imgUrl = ref<string>('');
const filterText = ref(''); const filterText = ref('');
const treeRef = ref(); const treeRef = ref();
@ -289,7 +300,7 @@ const setInfo = (arr) => {
const handleNodeClick = (row) => { const handleNodeClick = (row) => {
state.parentRow = row; state.parentRow = row;
state.parentPid = row.parentId; state.parentPid = row.parentId;
console.log('🚀 ~ handleNodeClick ~ state.parentPid:', state.parentPid); console.log(row);
state.parentName = row.label; state.parentName = row.label;
state.paramsQuery.folderId = row.id; state.paramsQuery.folderId = row.id;
getdocumentDataList(); getdocumentDataList();
@ -461,6 +472,26 @@ const listeningProject = watch(
onUnmounted(() => { onUnmounted(() => {
listeningProject(); listeningProject();
}); });
const handleApproval = (row) => {
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/technicalStandard/indexEdit`,
query: {
id: row.id,
type: 'update'
}
});
};
const handleViewApproval = (row) => {
proxy.$tab.closePage(proxy.$route);
proxy.$router.push({
path: `/technicalStandard/indexEdit`,
query: {
id: row.id,
type: 'view'
}
});
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -491,7 +522,7 @@ onUnmounted(() => {
width: 100%; width: 100%;
} }
.tree_left1 { .tree_left1 {
width: 30%; width: 20%;
background-color: #fff; background-color: #fff;
border: 1px solid #dddddd; border: 1px solid #dddddd;
border-radius: 6px; border-radius: 6px;
@ -554,7 +585,7 @@ onUnmounted(() => {
} }
} }
.list_right { .list_right {
width: 69.5%; width:79.5%;
background: white; background: white;
border: 1px solid #ededed; border: 1px solid #ededed;
padding: 10px; padding: 10px;

View File

@ -0,0 +1,356 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.status"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">设计原则</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
v-loading="loading"
:disabled="routeParams.type === 'view'"
:model="form"
:rules="rules"
label-width="100px"
class="space-y-4"
>
<div class="grid grid-cols-1 gap-4">
<el-row>
<el-col :span="12">
<el-form-item label="文件名称" prop="formNo">
<el-input disabled v-model="form.fileName" placeholder="请输入文件名称" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="文件" prop="formNo">
<div style="display: flex;">
<span style="color: rgb(50, 142, 248);" >{{ form.originalName }}</span>
<!-- <el-button type="primary" link @click="handleView(scope.row)"
><el-icon><View /></el-icon>查看</el-button
> -->
</div>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm, LeaveQuery, LeaveVO } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
const { design_change_reason_type } = toRefs<any>(proxy?.useDict('design_change_reason_type'));
import { getKnowledgeDocument } from '@/api/design/technicalStandard';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const flowCodeOptions = [
{
value: currentProject.value?.id + '_principletechnical',
label: '设计原则审批'
},
{
value: currentProject.value?.id + '_requirementstechnica',
label: '业主需求清单审批'
}
];
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
fileName:undefined,
fileUrl:undefined,
status:undefined,
originalName:undefined
};
const data = reactive({
form: { ...initFormData },
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getKnowledgeDocument(routeParams.value.id);
Object.assign(form.value, res.data);
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
submit(status.value,form.value);
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.status === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>