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 res = await listByIds(row.attachments);
const res = await listByIds(row.id);
tableDetail.value = {
...row,
...res.data[0]
};
console.log('🚀 ~ handleDetail ~ tableDetail.value:', tableDetail.value);
detailVisible.value = true;
};

View File

@ -12,65 +12,22 @@
</el-table-column>
<el-table-column align="center" prop="bookName" 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="costEstimate" label="变更费用估算" />
<!-- <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 align="center" prop="costEstimate" label="变更费用估算1" />
<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>
<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">
<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="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>
</template>
</el-table-column>
</el-table>
<!-- 详情 -->
<el-dialog title="变更单详情" v-model="detailVisible" width="1000">
<div class="w[850px] ma word-export-wrapper" ref="exportRef">
@ -189,36 +146,16 @@
import { listByIds } from '@/api/system/oss';
import { dayjs } from 'element-plus';
import { saveAs } from 'file-saver';
const form = reactive({
projectName: '',
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 { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status'));
const props = defineProps({
data: {
type: Array,
default: () => []
},
thumbnail:{
type: String,
default:''
}
});
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 handleDetail = async (row) => {
const res = await listByIds(row.hasAttachment);
const res = await listByIds(row.id);
tableDetail.value = {
...row,
hasAttachmentList: res.data
};
console.log(tableDetail.value);
detailVisible.value = true;
};
/** 多选框选中数据 */
@ -254,7 +189,32 @@ const handleSelectionChange = (selection: any) => {
const handleDelete = (row) => {
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 style = `
<style>

View File

@ -1,75 +1,63 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="模板类型" prop="projectType">
<el-select v-model="queryParams.projectType" placeholder="请选择模板类型" clearable filterable @change="selectType">
<el-option v-for="item in projectTypeOptions" :key="item.name" :label="item.name" :value="item.name"> </el-option>
</el-select>
</el-form-item>
<!-- <el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item> -->
</el-form>
</el-card>
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']"
>新增</el-button
>
</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>
</el-row>
</template>
<!-- card body -->
<Contactform
v-if="queryParams.projectType == '外部联系单'"
@selection-change="handleSelectionChange"
:data="tableData"
@delete="handleDelete"
></Contactform>
<EngineeringChangeApplicationForm
v-if="queryParams.projectType == '变更单'"
@selection-change="handleSelectionChange"
:data="tableData"
@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-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="变更单" name="1"
><el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAddApp" v-hasPermi="['quality:qualityInspection:add']"
>上传变更单模版</el-button
>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<EngineeringChangeApplicationForm
@selection-change="handleSelectionChange"
:data="tableData"
:thumbnail="projectTypeOptions[1].thumbnail"
@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>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" :disabled="addSingle" @click="handleAdd" v-hasPermi="['quality:qualityInspection:add']"
>上传外部联系单模版</el-button
>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<Contactform
@selection-change="handleSelectionChange"
:data="tableData"
@delete="handleDelete"
></Contactform>
<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-tabs>
<el-dialog title="新增模板" v-model="dialogVisible" width="800">
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
<div class="flex">
<!-- <img :src="thumbnailUrl" alt="" style="width: 150px;" /> -->
<div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div>
<div v-if="queryParams.projectType == '外部联系单'">
<div>
<el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" />
</el-form-item>
@ -111,94 +99,6 @@
<el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item>
</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>
</el-form>
<template #footer>
@ -224,15 +124,10 @@ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
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 tableData = ref([]);
const total = ref(0);
const activeName = ref('1')
const formRef = ref<FormInstance>();
const dialogVisible = ref<boolean>(false);
const showSearch = ref(true);
@ -338,17 +233,6 @@ const handleAdd = () => {
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 () => {
if (!queryParams.value.projectType) {
const res = await listContactTypeformtemplate(queryParams.value);
@ -376,8 +260,6 @@ const handleDelete = async (id?: string) => {
getList();
}
};
const handleUpdate = () => {};
/** 多选框选中数据 */
const handleSelectionChange = (selection: any) => {
ids.value = selection.map((item) => item.id);
@ -392,10 +274,23 @@ const selectType = (value: string) => {
getList();
};
const resetForm = () => {
formRef.value?.resetFields();
};
const handleClick=(val)=>{
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(() => {
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>