- <template>
- <div class="operate" v-loading.fullscreen.lock="loading" element-loading-text="加载中..." element-loading-background="rgba(0, 0, 0, 0.6)">
- <div>
- <el-steps :active="active" finish-status="success" align-center class="steps">
- <el-step title="验收申请提交" />
- <el-step title="验收审查" />
- <el-step title="验收合格" />
- </el-steps>
- <el-form ref="ruleForm" :model="form" :rules="rules" :disabled="opts.type === 'view'">
- <el-row :gutter="20">
- <el-col :span="8">
- <el-form-item label="项目名称:" prop="projectNo" class="formItem110">
- <el-select v-model="form.projectNo" placeholder="请选择项目名称" style="width: 100%" @change="projectChange">
- <el-option v-for="dict in projectList" :key="dict.projectNo" :label="dict.projectName" :value="dict.projectNo" />
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="项目编码:" prop="projectNo" class="formItem110">
- <el-input v-model="form.projectNo" disabled />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="项目类型:" prop="projectTypeName" class="formItem110">
- <el-input v-model="form.projectTypeName" disabled />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="申请时间:" prop="applicationTime">
- <el-date-picker
- style="width: 100%"
- clearable
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD HH:mm:ss"
- v-model="form.applicationTime"
- type="date"
- range-separator="到"
- placeholder="申请时间"
- />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="海绵占地面积:" prop="spongeProjectArea" class="formItem110">
- <el-input v-model="form.spongeProjectArea" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="建设单位:" prop="chargeDepartment" class="formItem110">
- <el-input v-model="form.chargeDepartment" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="项目总投资(万元):" prop="accomplishTotalInvest">
- <el-input v-model="form.accomplishTotalInvest" placeholder="请输入完成项目总投资" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="海绵投资(万元):" prop="spongeInvest">
- <el-input v-model="form.spongeInvest" placeholder="请输入海绵投资" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="年径流量总控制率%:" prop="annualRunoffTotalControlRate">
- <el-input v-model="form.annualRunoffTotalControlRate" placeholder="请输入年径流量总控制率" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="年SS总量去除率不低于%:" prop="turbidityRemovalRate">
- <el-input v-model="form.turbidityRemovalRate" placeholder="请输入年SS总量去除率不低于" />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="申请奖励金额(万元):" prop="bonusAmountApplied">
- <el-input v-model="form.bonusAmountApplied" placeholder="请输入申请奖励金额" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-divider content-position="left">海绵建设内容</el-divider>
- <div class="pl20">
- <el-form-item label="(定量填写海绵设施面积、体积等信息):" prop="achievementTarget" class="formItem140">
- <el-input v-model="form.achievementTarget" type="textarea" resize="none" />
- </el-form-item>
- <!-- <el-form-item label="海绵设施类型及规模:" prop="spongeTypeScale" class="formItem140">
- <el-input v-model="form.spongeTypeScale" type="textarea" resize="none" :disabled="opts.type === 'audit'" />
- </el-form-item> -->
- <el-form-item label="其他情况说明:" prop="otherDescription" class="formItem140">
- <el-input v-model="form.otherDescription" type="textarea" resize="none" :disabled="opts.type === 'audit'" />
- </el-form-item>
- </div>
- <el-divider content-position="left">奖补申请资料上传</el-divider>
- <div class="box" v-for="(item, i) in form.projectProcessAttachmentSaveRequestList">
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item
- :label="`${item.name}:`"
- :prop="'projectProcessAttachmentSaveRequestList.' + i + '.' + 'filieDescription'"
- class="formItem300"
- :rules="opts.type === 'add' || (i < 10 && opts.type === 'audit') ? rules['filieDescription'] : []"
- >
- <el-input v-model="item.filieDescription" />
- </el-form-item>
- </el-col>
- <el-col :span="2">
- <el-upload
- class="upload-demo"
- action="/system/upload"
- :headers="uploadHeader"
- :before-upload="rawFile => beforeUpload(rawFile, ['.rar', '.zip', '.doc', '.docx', '.pdf'])"
- :on-success="response => onSuccess(response, item)"
- :on-error="(error, uploadFile, uploadFiles) => onError(error, uploadFile, uploadFiles)"
- :show-file-list="false"
- >
- <el-button icon="Upload" size="mini" type="primary" :disabled="i < 10 && opts.type === 'audit'">上传文件</el-button>
- </el-upload>
- </el-col>
- <el-col :span="10">
- <span class="tips">支持文件格式:.rar .zip .doc .docx .pdf ,单个文件不能超过500kb</span>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12" :offset="12">
- <div class="fileSaveRequestList">
- <div class="file-item" v-for="(it, index) in item.fileList">
- <span>{{ it.name }}</span>
- <el-button type="danger" link @click="reoveFile(item.fileList, index)" :disabled="i < 10 && opts.type === 'audit'"
- >删除</el-button
- >
- </div>
- </div>
- </el-col>
- </el-row>
- </div>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="指定处理人:" prop="dealUsers" class="formItem110">
- <el-select v-model="form.dealUsers" placeholder="请选择指定处理人" style="width: 100%" :disabled="opts.type === 'audit'">
- <el-option v-for="dict in userLists" :key="dict.userId" :label="dict.nickName" :value="dict.userId" />
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="流程抄送人:" prop="pushUsers" class="formItem110">
- <el-select v-model="form.pushUsers" placeholder="请选择流程抄送人" style="width: 100%" :disabled="opts.type === 'audit'">
- <el-option v-for="dict in userLists" :key="dict.userId" :label="dict.nickName" :value="dict.userId" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-form-item label="审核意见:" prop="approveComment" class="formItem110" v-if="opts.type === 'audit'">
- <el-input v-model="form.approveComment" type="textarea" resize="none" />
- </el-form-item>
- <el-divider content-position="left" v-if="form.status && form.status !== 'start'">流程日志</el-divider>
- <div class="stapesBox" v-if="form.status && form.status !== 'start'">
- <el-steps direction="vertical" :active="stapesDate.length">
- <el-step v-for="i in stapesDate" :title="i.activityName" style="width: 300px">
- <template #description>
- <div class="direction">时间:{{ i.endTime }}</div>
- <div class="direction">分配人:{{ i.assigneeName }}</div>
- <div class="direction">任务备注:{{ i.comment }}</div>
- </template>
- </el-step>
- </el-steps>
- </div>
- </el-form>
- </div>
- </div>
- </template>
-
- <script setup>
- import { required } from '@/utils/validate-helper';
- import { inheritAttr } from '@/utils/v3';
- import { getProjectInfoNewList, getDicts } from '@/api/project/projectApproval';
- import { projectInfoNewDetail } from '@/api/project/projectInformationNew';
- import {
- projectCompletionAcceptanceeAdd,
- projectCompletionAcceptanceeEdit,
- projectCompletionAcceptanceeStartWorkFlow,
- projectCompletionAcceptanceeDetail,
- projectCompletionAcceptanceApprove,
- } from '@/api/project/recordsReward';
- import { workflowProcess, userList } from '@/api/project/constructionPermits';
- import uploadHeader from '@/utils/getUploadHeader';
- import useUserStore from '@/store/modules/user';
- const { proxy } = getCurrentInstance();
- const emit = defineEmits(['close']);
- const props = defineProps({
- curRow: {
- type: Object,
- default: () => ({}),
- },
- opts: {
- type: Object,
- default: () => ({}),
- },
- types: {
- type: Array,
- default: [],
- },
- companyList: {
- type: Array,
- default: () => [],
- },
- });
- const { acceptance_material } = proxy.useDict('acceptance_material');
- const { curRow, opts } = props;
- const loading = ref(false);
- const active = ref(0);
- const form = reactive({
- achievementTarget: '',
- bonusAmountApplied: '',
- turbidityRemovalRate: '',
- annualRunoffTotalControlRate: '',
- spongeInvest: '',
- accomplishTotalInvest: '',
- spongeProjectArea: '',
- projectName: '',
- projectNo: '',
- projectTypeId: '',
- projectTypeName: '',
- chargeUser: '',
- phone: '',
- applicationTime: '',
- chargeDepartment: '',
- designUnit: '',
- designUnitName: '',
- constructUnit: '',
- constructUnitName: '',
- supervisorUnit: '',
- supervisorUnitName: '',
- achievementTarget: '',
- spongeTypeScale: '',
- otherDescription: '',
- projectProcessAttachmentSaveRequestList: [],
- fileSaveRequestList: [],
- dealUsers: '',
- pushUsers: '',
- status: '',
- approveComment: '',
- workflowInstanceId: '',
- });
-
- const rules = reactive({
- projectName: required('项目名称'),
- projectNo: required('项目编码'),
- projectTypeId: required('项目类型'),
- chargeUser: required('联系人'),
- phone: required('联系电话'),
- chargeDepartment: required('建设单位'),
- designUnit: required('设计单位'),
- constructUnit: required('施工单位'),
- supervisorUnit: required('监理单位'),
- achievementTarget: required('建设指标达成情况'),
- spongeTypeScale: required('海绵设施类型及规模'),
- otherDescription: required('其他情况说明'),
- filieDescription: required('内容'),
- approveComment: required('审核意见'),
- });
-
- const stapesDate = ref([]);
-
- const projectList = ref([]);
- const userLists = ref([]);
-
- const getUserList = async () => {
- const res = await userList();
- if (res?.code !== 200) return;
- userLists.value = res?.data || [];
- };
-
- const getProjectList = async () => {
- const res = await getProjectInfoNewList();
- if (res?.code !== 200) return;
- projectList.value = res?.data || [];
- if (opts.type === 'add' && projectList.value.length) {
- projectChange(projectList.value[0].projectNo);
- }
- };
-
- const projectChange = async val => {
- const res = await projectInfoNewDetail(val);
- if (res?.code !== 200) return;
- inheritAttr(res.data, form);
- // form.projectTypeIdName = props.types.find(it => it.id === form.projectTypeId)?.projectTypeName;
- form.designUnitName = props.companyList.find(it => it.id === form.designUnit)?.unitName || '';
- form.constructUnitName = props.companyList.find(it => it.id === form.constructUnit)?.unitName || '';
-
- form.achievementTarget = '';
- form.spongeTypeScale = '';
- form.otherDescription = '';
- form.dealUsers = '';
- form.pushUsers = '';
- getDictMaps('acceptance_material');
- };
-
- const getDictMaps = async dictType => {
- const res = await getDicts(dictType);
- if (res?.code !== 200) return;
- if (res?.data) {
- form.projectProcessAttachmentSaveRequestList = [];
- for (const item of res.data) {
- form.projectProcessAttachmentSaveRequestList.push({
- fileList: [],
- dictData: item.dictValue,
- dictType: item.dictType,
- filieDescription: '',
- projectNo: '',
- name: item.dictLabel,
- });
- }
- form.projectProcessAttachmentSaveRequestList = form.projectProcessAttachmentSaveRequestList.slice(0, 10);
- }
-
- setTimeout(() => {
- if (proxy.$refs.ruleForm) {
- proxy.$refs.ruleForm.clearValidate();
- }
- });
- };
-
- const getProjectTypeFileList = async (fileGroup, type, list, filterList) => {
- for (const key in fileGroup) {
- if (key === type) {
- if (Object.hasOwnProperty.call(fileGroup, key)) {
- const element = fileGroup[key];
- for (const item of element) {
- const info = filterList.value.find(it => it.value === item.dictData);
- if (!info) continue;
- list.push({
- fileList: item.fileList,
- dictData: item.dictData,
- dictType: item.dictType,
- filieDescription: item.filieDescription,
- projectNo: item.projectNo,
- name: info.label,
- });
- }
- }
- }
- }
- };
-
- const getDetail = async () => {
- const res = await projectCompletionAcceptanceeDetail(curRow.id);
- if (res?.code !== 200) return;
- inheritAttr(res.data, form);
- // form.projectTypeIdName = props.types.find(it => it.id === form.projectTypeId)?.projectTypeName;
- form.designUnitName = props.companyList.find(it => it.id === form.designUnit)?.unitName || '';
- form.constructUnitName = props.companyList.find(it => it.id === form.constructUnit)?.unitName || '';
- form.dealUsers = form.dealUsers * 1 || '';
- form.pushUsers = form.pushUsers * 1 || '';
-
- const fileGroup = res.data.fileGroup;
- form.projectProcessAttachmentSaveRequestList = [];
- getProjectTypeFileList(fileGroup, 'acceptance_material', form.projectProcessAttachmentSaveRequestList, acceptance_material);
-
- if (form.status && form.status !== 'start') {
- workflowProcessM(res.data.id);
- if (form.status === 'projectInquiry') {
- active.value = 1;
- } else if (form.status === 'manualReview') {
- active.value = 2;
- }
- }
-
- if (opts.type === 'audit') {
- const res = await getDicts('acceptance_material');
- if (res?.code !== 200) return;
- if (res?.data) {
- res.data = res.data.slice(10);
- for (const item of res.data) {
- form.projectProcessAttachmentSaveRequestList.push({
- fileList: [],
- dictData: item.dictValue,
- dictType: item.dictType,
- filieDescription: '',
- projectNo: '',
- name: item.dictLabel,
- });
- }
- }
- }
- };
-
- const beforeUpload = rawFile => {
- console.log(rawFile);
- if (rawFile.name.length > 50) {
- proxy.$modal.msgError(`文件名称过长(50个字符以内),请先修改再上传!`);
- return false;
- }
- return true;
- };
-
- const onSuccess = (response, item) => {
- console.log(response);
- item.fileList.push({
- ...response.data,
- refType: item.dictType,
- refField: item.dictData,
- });
- };
-
- const onError = (error, uploadFile, uploadFiles) => {
- console.log(error, uploadFile, uploadFiles);
- };
-
- const reoveFile = (fileList, index) => {
- proxy.$modal
- .confirm('是否确认删除?')
- .then(async () => {
- fileList.splice(index, 1);
- })
- .catch(() => {});
- };
-
- const submit = type => {
- proxy.$refs.ruleForm.validate(async (valid, fields) => {
- if (valid) {
- if (type === 2) {
- if (!form.dealUsers) return proxy.$modal.msgError('请指定处理人!');
- if (!form.pushUsers) return proxy.$modal.msgError('请指定抄送人!');
- }
- loading.value = true;
- const params = JSON.parse(JSON.stringify(form));
- params.status = '';
- for (const item of params.projectProcessAttachmentSaveRequestList) {
- item.projectNo = params.projectNo;
- for (const it of item.fileList) {
- params.fileSaveRequestList.push(it);
- }
- }
- console.log(params);
- let methed = '';
- if (type === 1) {
- if (curRow?.id) {
- params.id = curRow.id;
- methed = projectCompletionAcceptanceeEdit;
- } else {
- methed = projectCompletionAcceptanceeAdd;
- }
- } else {
- if (curRow?.id) {
- params.id = curRow.id;
- }
- methed = projectCompletionAcceptanceeStartWorkFlow;
- }
- const res = await methed(params);
- loading.value = false;
- if (res?.code !== 200) return;
- proxy.$modal.msgSuccess('操作成功!');
- emit('close');
- } else {
- console.log('error submit!', fields);
- }
- });
- };
-
- const handleAudit = result => {
- proxy.$refs.ruleForm.validate(async (valid, fields) => {
- if (valid) {
- const params = JSON.parse(JSON.stringify(form));
- delete params.list1;
- params.fileSaveRequestList = [];
- for (let i = 0; i < params.projectProcessAttachmentSaveRequestList.length; i++) {
- if (opts.type === 'audit' && i < 10) continue;
- const item = params.projectProcessAttachmentSaveRequestList[i];
- if (result === 'true' && !item.filieDescription) {
- return proxy.$modal.msgError(`${item.name}文件说明不能为空!`);
- }
- item.projectNo = params.projectNo;
- for (const it of item.fileList) {
- params.fileSaveRequestList.push(it);
- }
- }
- loading.value = true;
- if (opts.type === 'audit') {
- params.projectProcessAttachmentSaveRequestList = params.projectProcessAttachmentSaveRequestList.slice(10);
- }
- params.approveResult = result;
- params.submitUserId = useUserStore().userId;
- params.id = curRow.id;
- console.log(params);
- try {
- const res = await projectCompletionAcceptanceApprove(params);
- loading.value = false;
- if (res?.code !== 200) return;
- proxy.$modal.msgSuccess('操作成功!');
- emit('close');
- } catch (error) {
- loading.value = false;
- }
- } else {
- console.log('error submit!', fields);
- }
- });
- };
-
- //获取流程日志
- const workflowProcessM = async id => {
- let params = {
- businessKey: id,
- workflowKey: 'projectBonusNoticeRecord',
- workflowUserId: '',
- };
- let { data } = await workflowProcess(params);
- stapesDate.value = data;
- };
-
- onMounted(() => {
- getProjectList();
- getUserList();
- if (curRow?.id) {
- getDetail();
- }
- });
-
- defineExpose({
- submit,
- handleAudit,
- });
- </script>
-
- <style lang="scss" scoped>
- .operate {
- .steps {
- margin-bottom: 20px;
- }
-
- .pl20 {
- padding-left: 20px;
- }
-
- .tips {
- margin-left: 10px;
- line-height: 30px;
- }
-
- .mb5 {
- margin-bottom: 5px;
- }
-
- .mb0 {
- margin-bottom: 0;
- }
-
- .fileSaveRequestList {
- .file-item {
- white-space: nowrap;
- display: flex;
- align-items: center;
- .del {
- flex-shrink: 0;
- color: #f56c6c;
- cursor: pointer;
- margin-left: 10px;
- }
- }
- }
- .box {
- margin-bottom: 10px;
- }
-
- .direction {
- min-width: 190px;
- }
-
- .stapesBox {
- min-height: 100px;
- margin-bottom: 30px;
- margin-left: 30px;
- }
- }
- </style>