From 4deabefdddee5dd5e4b23ad312cf557b3291e1cb Mon Sep 17 00:00:00 2001 From: 13937891274 <kxc0822> Date: 星期二, 09 八月 2022 15:16:50 +0800 Subject: [PATCH] 页面修改 --- src/components/checkTemplate/index.vue | 2 src/views/contingencyManagement/panManagement/component/approvalProcess.vue | 316 +++++++++++++++++----------------- src/views/contingencyManagement/panManagement/index.vue | 12 src/views/contingencyManagement/panManagement/component/openAdd.vue | 20 +- src/views/contingencyManagement/panManagement/component/approval.vue | 160 +++++++++-------- 5 files changed, 255 insertions(+), 255 deletions(-) diff --git a/src/components/checkTemplate/index.vue b/src/components/checkTemplate/index.vue index 24f6c25..d1c750c 100644 --- a/src/components/checkTemplate/index.vue +++ b/src/components/checkTemplate/index.vue @@ -1,5 +1,5 @@ <template> - <el-dialog v-model="dialogVisible" title="选择检查模板" width="900px" draggable :fullscreen="full"> + <el-dialog v-model="dialogVisible" title="选择应急队伍" width="900px" draggable :fullscreen="full"> <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> <el-row> <el-col :span="18"> diff --git a/src/views/contingencyManagement/panManagement/component/approval.vue b/src/views/contingencyManagement/panManagement/component/approval.vue index b6db937..e341bfc 100644 --- a/src/views/contingencyManagement/panManagement/component/approval.vue +++ b/src/views/contingencyManagement/panManagement/component/approval.vue @@ -6,19 +6,19 @@ <el-row :gutter="35"> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="审批名称" prop="workName"> - <el-input v-model="ruleForm.workName" placeholder="请填写队伍名称"></el-input> + <el-input v-model="ruleForm.workName" placeholder="请填写队伍名称" disabled></el-input> </el-form-item> </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="审批标题" prop="title"> - <el-input v-model="ruleForm.title" placeholder="请填写审批名称"></el-input> - </el-form-item> - </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="审批标题" prop="title"> + <el-input v-model="ruleForm.title" placeholder="请填写审批名称" disabled></el-input> + </el-form-item> + </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="审批人" prop="approvePersonId"> - <el-input v-model="ruleForm.approvePersonName" placeholder="请选择" class="input-with-select"> + <el-input v-model="ruleForm.approvePersonName" placeholder="请选择" class="input-with-select" disabled> <template #append> - <el-button :icon="Search" @click="openUser" /> + <el-button :icon="Search" @click="openUser" :disabled="disabled"/> </template> </el-input> </el-form-item> @@ -26,8 +26,8 @@ <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> <el-form-item label="审批结果" prop="authorUid"> <el-radio-group v-model="ruleForm.approveResult"> - <el-radio :label="false">不通过</el-radio> - <el-radio :label="true">通过</el-radio> + <el-radio :label="false">不通过</el-radio> + <el-radio :label="true">通过</el-radio> </el-radio-group> </el-form-item> </el-col> @@ -37,25 +37,25 @@ </el-form-item> </el-col> <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> - <el-form-item label="是否完成" prop="authorUid" @change="typeChang"> + <el-form-item label="是否完成" prop="complete" @change="typeChang"> <el-radio-group v-model="ruleForm.complete"> <el-radio :label="false">是</el-radio> <el-radio :label="true">否</el-radio> </el-radio-group> </el-form-item> </el-col> - <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="审批名称" prop="workName"> - <el-input v-model="ruleForm.twoWorkName" placeholder="请填写队伍名称"></el-input> - </el-form-item> - </el-col> - <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="审批标题" prop="title"> - <el-input v-model="ruleForm.twoTitle" placeholder="请填写审批名称"></el-input> - </el-form-item> - </el-col> <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="审批人" prop="authorUid"> + <el-form-item label="审批名称" prop="twoWorkName"> + <el-input v-model="ruleForm.twoWorkName" placeholder="请填写队伍名称"></el-input> + </el-form-item> + </el-col> + <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="审批标题" prop="twoTitle"> + <el-input v-model="ruleForm.twoTitle" placeholder="请填写审批名称"></el-input> + </el-form-item> + </el-col> + <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="审批人" prop="twoApprovePersonName"> <el-input v-model="ruleForm.twoApprovePersonName" placeholder="请选择" class="input-with-select"> <template #append> <el-button :icon="Search" @click="openUser" /> @@ -88,72 +88,78 @@ export default defineComponent({ name: 'openAdd', components: { - DailogSearchUserManger, + DailogSearchUserManger, }, setup(prop, { emit }) { const isShowDialog = ref(false); const ruleFormRef = ref<FormInstance>(); const ruleForm = ref({ - approveId: '', - workName: '', // 审批名称 - title: '', //审批标题 - approvePersonId: '', // - approvePersonName: '', // 审批人 - approveStatus: 2, //审批状态 - relateType: 1, //业务类型 - approveResult: false, //审批结果 - approveMemo: '', //审批意见 - relateId: '', - twoWorkName:'', - twoTitle:'', - twoApprovePersonId:'', - twoApprovePersonName:'' + approveId: '', + workName: '', // 审批名称 + title: '', //审批标题 + approvePersonId: '', // + approvePersonName: '', // 审批人 + approveStatus: 2, //审批状态 + relateType: 1, //业务类型 + approveResult: false, //审批结果 + approveMemo: '', //审批意见 + relateId: '', + twoWorkName: '', + twoTitle: '', + twoApprovePersonId: '', + twoApprovePersonName: '', }); const titles = ref(); const disabled = ref(); - const uid = ref(); + const uid = ref(); // 打开弹窗 - const openDialog = (title: string, id: number, type: boolean) => { + const openDialog = (title: string, approveId: number, type: boolean, id: number) => { isShowDialog.value = true; titles.value = title; disabled.value = type; - ruleForm.value.relateId = id; - uid.value = id; - if(title == '查看审批' || title == '修改审批') { - emergencyPlanApi() - .approvalProcessEmergencyPlan(id) - .then((res) => { - if (res.data.code == 200) { - ruleForm.value = res.data.data; - } - }); - } + + uid.value = approveId; + if (title == '查看审批' || title == '审批') { + emergencyPlanApi() + .approvalProcessEmergencyPlan(approveId) + .then((res) => { + if (res.data.code == 200) { + ruleForm.value = res.data.data; + ruleForm.value.relateId = id; + } + }); + } }; const submitForm = async () => { - ruleForm.value.workName = ruleForm.value.twoWorkName - ruleForm.value.title = ruleForm.value.twoTitle - ruleForm.value.approvePersonId = ruleForm.value.twoApprovePersonId - ruleForm.value.approvePersonName = ruleForm.value.twoApprovePersonName - isShowDialog.value = false; - emergencyPlanApi() - .editApprovalEmergencyPlan(ruleForm.value) - .then((res) => { - if (res.data.code == 200) { - ElMessage({ - showClose: true, - message: '修改成功', - type: 'success', - }); - emit('myAdd', true); - } else { - ElMessage({ - showClose: true, - message: res.data.msg, - type: 'error', - }); - emit('myAdd', true); - } - }); + console.log(ruleForm.value); + ruleForm.value.workName = ruleForm.value.twoWorkName; + ruleForm.value.title = ruleForm.value.twoTitle; + ruleForm.value.approvePersonId = ruleForm.value.twoApprovePersonId; + ruleForm.value.approvePersonName = ruleForm.value.twoApprovePersonName; + ruleForm.value.relateType = 1; + isShowDialog.value = false; + if(ruleForm.value.complete == false) { + ruleForm.value.approveStatus=3 + } + emergencyPlanApi() + .editApprovalEmergencyPlan(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: '修改成功', + type: 'success', + }); + emit('myAdd', true); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + emit('myAdd', true); + } + }); }; const resetForm = () => { isShowDialog.value = false; @@ -165,8 +171,8 @@ }; //回显 const onUser = (e: any) => { - ruleForm.value.twoApprovePersonId = e[0].uid; - ruleForm.value.twoApprovePersonName = e[0].realName; + ruleForm.value.twoApprovePersonId = e[0].uid; + ruleForm.value.twoApprovePersonName = e[0].realName; }; const typeChang = () => { console.log('tag', ruleForm); @@ -198,7 +204,7 @@ resetForm, onUser, typeChang, - uid, + uid, }; }, }); diff --git a/src/views/contingencyManagement/panManagement/component/approvalProcess.vue b/src/views/contingencyManagement/panManagement/component/approvalProcess.vue index 2356a0b..209c51a 100644 --- a/src/views/contingencyManagement/panManagement/component/approvalProcess.vue +++ b/src/views/contingencyManagement/panManagement/component/approvalProcess.vue @@ -1,50 +1,45 @@ <template> - <div class="system-edit-user-container"> - <el-dialog title="查看审批流程" v-model="isShowDialog" width="60%" draggable :fullscreen="full"> - <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> - <el-row :gutter="35"> - <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> - <el-table - :data="tableData" - style="width: 100%; margin-top: 15px" - ref="multipleTableRef" - :model="formInline" - :header-cell-style="{ background: '#f6f7fa', color: '#909399' }" - > - <el-table-column prop="workName" label="审批人" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="title" label="审批标题" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="approvePersonName" label="编写人" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="approveMemo" label="审批意见" show-overflow-tooltip sortable></el-table-column> - <el-table-column label="操作" width="200" align="center"> - <template #default="scope"> - <el-button size="small" text type="primary" @click="onReduction(scope.row.id)">还原</el-button> - </template> - </el-table-column> - </el-table> - </el-col> - </el-row> - <div class="pages"> - <el-pagination - v-if="tableData.length == 0 ? false : true" - v-model:currentPage="pageIndex" - v-model:page-size="pageSize" - :page-sizes="[10, 20, 30]" - :pager-count="5" - class="mt15" - background - layout="total, sizes, prev, pager, next, jumper" - :total="total" - @size-change="onHandleSizeChange" - @current-change="onHandleCurrentChange" - /> - </div> - <template #footer> + <div class="system-edit-user-container"> + <el-dialog title="查看审批流程" v-model="isShowDialog" width="60%" draggable :fullscreen="full"> + <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> + <el-row :gutter="35"> + <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> + <el-table + :data="tableData" + style="width: 100%; margin-top: 15px" + ref="multipleTableRef" + :model="formInline" + :header-cell-style="{ background: '#f6f7fa', color: '#909399' }" + > + <el-table-column prop="workName" label="审批人" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="title" label="审批标题" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="approvePersonName" label="编写人" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="approveMemo" label="审批意见" show-overflow-tooltip sortable></el-table-column> + </el-table> + </el-col> + </el-row> + <div class="pages"> + <el-pagination + v-if="tableData.length == 0 ? false : true" + v-model:currentPage="pageIndex" + v-model:page-size="pageSize" + :page-sizes="[10, 20, 30]" + :pager-count="5" + class="mt15" + background + layout="total, sizes, prev, pager, next, jumper" + :total="total" + @size-change="onHandleSizeChange" + @current-change="onHandleCurrentChange" + /> + </div> + <template #footer> <span class="dialog-footer"> <el-button @click="onCancel">取消</el-button> </span> - </template> - </el-dialog> - </div> + </template> + </el-dialog> + </div> </template> <script lang="ts"> @@ -52,151 +47,150 @@ import type { FormInstance } from 'element-plus'; import { - // ElMessageBox, - ElMessage, + // ElMessageBox, + ElMessage, } from 'element-plus'; import { Search, FullScreen } from '@element-plus/icons-vue'; import { emergencyPlanApi } from '../../../../api/contingencyManagement/emergencyPlan'; export default defineComponent({ - name: 'abolishLibrary', - components: {}, - setup(prop, { emit }) { - // 列表参数 - const listQuery = reactive({ - pageIndex: 1, - pageSize: 10, - searchParams: { - relateType: 1, - relateId: '', - startTime: '', - endTime: '', - }, - }); - // 定义表格数据 - const tableData = ref([]); + name: 'abolishLibrary', + components: {}, + setup(prop, { emit }) { + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + relateType: 1, + relateId: '', + startTime: '', + endTime: '', + }, + }); + // 定义表格数据 + const tableData = ref([]); - // 列表数据请求 - const openDialog = async () => { - isShowDialog.value = true; - let res = await emergencyPlanApi().processEmergencyPlan(listQuery); - if (res.data.code === '200') { - tableData.value = res.data.data; - pageIndex.value = res.data.pageIndex; - pageSize.value = res.data.pageSize; - total.value = res.data.total; - } else { - ElMessage({ - showClose: true, - type: 'error', - message: res.data.msg, - }); - } - }; + // 列表数据请求 + const uid = ref(); + const openDialog = async (id: number) => { + isShowDialog.value = true; + listQuery.searchParams.relateId=id + uid.value = id; + let res = await emergencyPlanApi().processEmergencyPlan(listQuery); + if (res.data.code === '200') { + tableData.value = res.data.data; + pageIndex.value = res.data.pageIndex; + pageSize.value = res.data.pageSize; + total.value = res.data.total; + } else { + ElMessage({ + showClose: true, + type: 'error', + message: res.data.msg, + }); + } + }; - const isShowDialog = ref(false); + const isShowDialog = ref(false); - const ruleFormRef = ref<FormInstance>(); - // 打开弹窗 - // const openDialog = () => { - // isShowDialog.value = true; - // }; - // 关闭弹窗 - const closeDialog = () => { - isShowDialog.value = false; - }; - // 取消 - const onCancel = () => { - closeDialog(); - }; - const onReduction = async () => { - isShowDialog.value = false; - }; - // 分页 - const pageIndex = ref(); - const pageSize = ref(); - const total = ref(); - // 分页改变 - const handleSizeChange = (val: number) => { - listQuery.pageSize = val; - }; - // 分页未改变 - const handleCurrentChange = (val: number) => { - listQuery.pageIndex = val; - }; - //全屏 - const full = ref(false); - const toggleFullscreen = () => { - if (full.value == false) { - full.value = true; - } else { - full.value = false; - } - }; - return { - openDialog, - closeDialog, - isShowDialog, - onCancel, - tableData, - Search, - ruleFormRef, - pageIndex, - pageSize, - handleSizeChange, - handleCurrentChange, - toggleFullscreen, - FullScreen, - full, - listQuery, - // onSubmit, - total, - emit, - onReduction, - }; - }, + const ruleFormRef = ref<FormInstance>(); + // 打开弹窗 + // const openDialog = () => { + // isShowDialog.value = true; + // }; + // 关闭弹窗 + const closeDialog = () => { + isShowDialog.value = false; + }; + // 取消 + const onCancel = () => { + closeDialog(); + }; + // 分页 + const pageIndex = ref(); + const pageSize = ref(); + const total = ref(); + // 分页改变 + const handleSizeChange = (val: number) => { + listQuery.pageSize = val; + }; + // 分页未改变 + const handleCurrentChange = (val: number) => { + listQuery.pageIndex = val; + }; + //全屏 + const full = ref(false); + const toggleFullscreen = () => { + if (full.value == false) { + full.value = true; + } else { + full.value = false; + } + }; + return { + openDialog, + closeDialog, + isShowDialog, + onCancel, + tableData, + Search, + ruleFormRef, + pageIndex, + pageSize, + handleSizeChange, + handleCurrentChange, + toggleFullscreen, + FullScreen, + full, + listQuery, + total, + emit, + uid, + }; + }, }); </script> <style scoped lang="scss"> .textarea { - height: 168px !important; + height: 168px !important; } .textarea ::v-deep .el-textarea__inner { - height: 168px !important; + height: 168px !important; } ::v-deep .el-table__cell { - font-weight: 400; + font-weight: 400; } //分页 .pages { - display: flex; - justify-content: flex-end; + display: flex; + justify-content: flex-end; } ::v-deep .el-pagination .el-pager li { - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } ::v-deep .el-pagination .el-pager li.is-active { - background-color: #409eff; - color: #fff; + background-color: #409eff; + color: #fff; } ::v-deep .el-pagination .btn-prev { - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } ::v-deep .el-pagination button:disabled { - color: #c0c4cc; + color: #c0c4cc; } ::v-deep .el-pagination .btn-next { - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } </style> \ No newline at end of file diff --git a/src/views/contingencyManagement/panManagement/component/openAdd.vue b/src/views/contingencyManagement/panManagement/component/openAdd.vue index 072e8cf..c1cf6c0 100644 --- a/src/views/contingencyManagement/panManagement/component/openAdd.vue +++ b/src/views/contingencyManagement/panManagement/component/openAdd.vue @@ -1,6 +1,6 @@ <template> <div class="system-edit-user-container"> - <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full" :close-on-click-modal="false"> + <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full" :close-on-click-modal="false" @close="resetForm(ruleFormRef)"> <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="120px" :disabled="disabled"> <el-row :gutter="35"> @@ -69,9 +69,7 @@ class="w100" :props="propse" clearable - multiple :render-after-expand="false" - show-checkbox placeholder="请选择" /> </el-form-item> @@ -89,7 +87,7 @@ </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="应急队伍" prop="emergencyTeam"> - <el-input v-model="ruleForm.emergencyTeam" placeholder="请选择" class="input-with-select"> + <el-input v-model="ruleForm.teamName" placeholder="请选择" class="input-with-select"> <template #append> <el-button :icon="Search" @click="daiInpt(0)" /> </template> @@ -176,9 +174,9 @@ // fileName: 'name', // }, ], - emergencyTeam: '', //应急队伍 areaList: [], //区域列表 teamList: [], + teamId: '', //应急队伍 deptList: [], abolishStatus: false, }); @@ -198,9 +196,9 @@ ruleForm.value = res.data.data; let arr = []; for (let i = 0; i < ruleForm.value.teamList.length; i++) { - arr.push(ruleForm.value.teamList[i].emergencyTeam); + arr.push(ruleForm.value.teamList[i].teamName); } - ruleForm.value.emergencyTeam = arr.toString(); + ruleForm.value.teamName = arr.toString(); } }); } @@ -326,7 +324,7 @@ // fileName: 'name', // }, ], - emergencyTeam: '', //应急队伍 + teamId: '', //应急队伍ID areaList: [], //区域列表 teamList: [ ], @@ -339,6 +337,7 @@ isShowDialog.value = false; if (!formEl) return; formEl.resetFields(); + ruleForm.value = {} }; // 应急队伍弹窗 const Shows = ref(); @@ -347,14 +346,15 @@ }; const SearchUser = (val: any) => { let arr = []; + ruleForm.value.teamList=[] for (let i = 0; i < val.length; i++) { arr.push(val[i].teamName); ruleForm.value.teamList.push({ userUid: val[i].uid, - emergencyTeam: val[i].teamName, + teamName: val[i].teamName, }); } - ruleForm.value.emergencyTeam = arr.toString(); + ruleForm.value.teamName = arr.toString(); }; // 选择区域弹窗 const openRef = ref(); diff --git a/src/views/contingencyManagement/panManagement/index.vue b/src/views/contingencyManagement/panManagement/index.vue index cc2ec1b..5667b4b 100644 --- a/src/views/contingencyManagement/panManagement/index.vue +++ b/src/views/contingencyManagement/panManagement/index.vue @@ -107,7 +107,7 @@ text type="primary" v-if="scope.row.approveStatus === 2 && scope.row.checkApprove === true" - @click="onApproval('修改',scope.row.approveId)" + @click="onApproval('修改',scope.row.approveId,scope.row.id)" > 审批 </el-button> @@ -116,7 +116,7 @@ text type="primary" v-if="scope.row.approveStatus === 2 && scope.row.checkApprove === false" - @click="onApproval('详情',scope.row.id)" + @click="onApproval('详情',scope.row.approveId,scope.row.id)" > 查看审批 </el-button> @@ -471,17 +471,17 @@ }; // 审批 const approvalRef = ref(); - const onApproval = (val: string,row: object) => { + const onApproval = (val: string,row: object,id) => { if(val=='详情'){ approvalRef.value.openDialog('查看审批', row, true); } else { - approvalRef.value.openDialog('修改审批', row, false); + approvalRef.value.openDialog('审批', row, false,id); } }; // 审批流程 const processRef = ref(); - const onApprovalProcess = () => { - processRef.value.openDialog(); + const onApprovalProcess = (row:object,id) => { + processRef.value.openDialog(row,id); }; //全屏 -- Gitblit v1.9.2