From d8215ff56e7bf39b43c52d7f27de5e7e427e67cf Mon Sep 17 00:00:00 2001 From: zhaojiale <631455805@qq.com> Date: 星期三, 10 八月 2022 10:55:23 +0800 Subject: [PATCH] 事故管理修改 --- src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue | 555 +++++++++++++++++++++++++++++++++---------------------- 1 files changed, 332 insertions(+), 223 deletions(-) diff --git a/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue b/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue index 10ba7d3..a1a8412 100644 --- a/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue +++ b/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue @@ -1,11 +1,12 @@ <template> <div class="system-edit-user-container"> <el-dialog - title="新建应急演练计划发布" + :title="titles" v-model="isShowDialog" width="769px" draggable :fullscreen="full" + @close="resetForm(ruleFormRef)" > <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> <el-form @@ -13,39 +14,44 @@ :model="ruleForm" size="default" label-width="120px" + :disabled="disabled" > <el-row :gutter="35"> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="演练名称" prop="teamName"> - <el-input v-model="ruleForm.teamName" placeholder="请填写演练名称"></el-input> + <el-form-item label="演练名称" prop="drillName"> + <el-input v-model="ruleForm.drillName" 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="teamName"> - <el-input v-model="ruleForm.teamName" placeholder="请填写演练地点"></el-input> + <el-form-item label="演练地点" prop="drillAddress"> + <el-input v-model="ruleForm.drillAddress" 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="主办部门" placeholder="请选择"> + <el-form-item label="主办部门" placeholder="请选择" prop="departmentId"> <el-tree-select - v-model="ruleForm.responsibleDepartment" - :data="data" class="w100" + v-model="ruleForm.departmentId" + :data="data" + check-strictly + class="w100" + :props="propse" + clearable placeholder="请选择"/> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="演练方式" prop="teamLevel"> - <el-select v-model="ruleForm.teamLevel" class="w100" placeholder="请选择"> - <el-option label="综合" value="admin"></el-option> - <el-option label="桌面" value="common3"></el-option> - <el-option label="专项" value="common2"></el-option> + <el-form-item label="演练方式" prop="drillWay"> + <el-select v-model="ruleForm.drillWay" class="w100" placeholder="请选择"> + <el-option label="综合" value="1"></el-option> + <el-option label="桌面" value="2"></el-option> + <el-option label="专项" value="3"></el-option> </el-select> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="应急预案" prop="telephone" > + <el-form-item label="应急预案" prop="planName" > <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.planName" placeholder="请选择" class="input-with-select" > @@ -56,59 +62,63 @@ </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="演练级别" prop="teamPhone"> - <el-select v-model="ruleForm.teamLevel" class="w100" placeholder="请选择"> - <el-option label="公司级" value="admin"></el-option> - <el-option label="分厂级" value="common"></el-option> - <el-option label="车间级" value="common1"></el-option> + <el-form-item label="演练级别" prop="drillLevel"> + <el-select v-model="ruleForm.drillLevel" class="w100" placeholder="请选择"> + <el-option label="公司级" value="1"></el-option> + <el-option label="分厂级" value="2"></el-option> + <el-option label="车间级" value="3"></el-option> </el-select> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="计划定制日期" prop="teamPhone"> - <el-date-picker v-model="datetime" type="datetime" placeholder="选择日期时间" style="width: 100%" /> + <el-form-item label="计划定制日期" prop="makingPlanDate"> + <el-date-picker v-model="ruleForm.makingPlanDate" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 100%" /> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="计划演练日期" prop="teamPhone"> - <el-date-picker v-model="drillDate" type="datetime" placeholder="选择日期时间" style="width: 100%" /> + <el-form-item label="计划演练日期" prop="drillPlanDate"> + <el-date-picker v-model="ruleForm.drillPlanDate" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 100%" /> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="修改时间" prop="teamPhone"> - <el-date-picker v-model="editDate" type="datetime" placeholder="选择日期时间" style="width: 100%" /> + <el-form-item label="修改时间" prop="gmtModitify"> + <el-date-picker v-model="ruleForm.gmtModitify" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 100%" /> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="计划定制人" prop="teamPhone"> - <el-input v-model="ruleForm.planCustomizer" disabled placeholder="请填写演练地点"></el-input> + <el-form-item label="计划定制人" prop="makingUserName"> + <el-input v-model="ruleForm.makingUserName" 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="telephone"> + <el-form-item label="制定部门" prop="makingDepartmentId"> <el-tree-select - v-model="ruleForm.responsibleDepartment" - :data="data" class="w100" + v-model="ruleForm.makingDepartmentId" + check-strictly + :data="data" + class="w100" + :props="propse" + clearable placeholder="请选择"/> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="演练人员" prop="telephone" > + <el-form-item label="演练人员" prop="userListString" > <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.userListString" placeholder="请选择" class="input-with-select" > <template #append> - <el-button :icon="Search" @click="openUser"/> + <el-button :icon="Search" @click="openUser(0)"/> </template> </el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> - <el-form-item label="演练目的" prop="telephone"> + <el-form-item label="演练目的" prop="purpose"> <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.purpose" placeholder="请填写演练目的" class="input-with-select textarea" type="textarea" @@ -117,32 +127,32 @@ </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="演练负责人" prop="telephone" > + <el-form-item label="演练负责人" prop="chargeUserListString" > <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.chargeUserListString" placeholder="请选择" class="input-with-select" > <template #append> - <el-button :icon="Search" @click="openUser"/> + <el-button :icon="Search" @click="openUser(1)"/> </template> </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="teamName"> - <el-input v-model="ruleForm.teamName" placeholder="请填写演练名称"></el-input> + <el-form-item label="保险措施" prop="insuranceMeasures"> + <el-input v-model="ruleForm.insuranceMeasures" 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="teamName"> - <el-input v-model="ruleForm.teamName" placeholder="请填写演练名称"></el-input> + <el-form-item label="演练经费" prop="drillExpense"> + <el-input v-model="ruleForm.drillExpense" placeholder="请填写演练经费"></el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> - <el-form-item label="备注信息" prop="telephone"> + <el-form-item label="备注信息" prop="remark"> <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.remark" placeholder="请填写备注信息" class="input-with-select textarea" type="textarea" @@ -152,86 +162,128 @@ </el-col> <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" style="margin-bottom: 0!important;"> <el-form-item label="预案附件"> - <el-upload - v-model:file-list="fileList" - class="upload-demo" - action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" - :on-change="handleChange" - > - <el-button type="primary" - >点击上传</el-button> - <template #tip> - <div class="el-upload__tip"> - 添加相关附件 - </div> - </template> - </el-upload> + <!--<el-upload--> + <!--v-model:file-list="fileList"--> + <!--class="upload-demo"--> + <!--action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"--> + <!--:on-change="handleChange"--> + <!-->--> + <!--<el-button type="primary"--> + <!-->点击上传</el-button>--> + <!--<template #tip>--> + <!--<div class="el-upload__tip">--> + <!--添加相关附件--> + <!--</div>--> + <!--</template>--> + <!--</el-upload>--> </el-form-item> </el-col> </el-row> </el-form> <template #footer> <span class="dialog-footer"> - <el-button @click="onCancel" size="default">关闭</el-button> - <el-button size="default" type="primary" @click="submitForm(ruleFormRef)">确定</el-button> + <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button> + <el-button size="default" v-if="disabled == true ? false : true" type="primary" @click="submitForm(titles, ruleFormRef)">确定</el-button> </span> </template> </el-dialog> - <RegionsDialog ref="Shows"/> - <UserCheckbox ref="userRef"/> + <RegionsDialog ref="Shows" @SearchUser="onUser" /> + <DailogSearchUser ref="userRef" @SearchUser="SearchUser" /> + <DailogSearchUser ref="userFZRef" @SearchUser="SearchFZUser" /> </div> </template> <script lang="ts"> -import { reactive, +import { + // reactive, ref, - defineComponent + defineComponent, + onMounted, } from 'vue'; import type { UploadUserFile, FormInstance, - // FormRules, } from 'element-plus' - +import { ElMessage } from 'element-plus'; import { Search, FullScreen } from '@element-plus/icons-vue' -import UserCheckbox from "/@/components/userCheckbox/index.vue" +import DailogSearchUser from "/@/components/DailogSearchUser/index.vue" import RegionsDialog from "/@/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/regionsDialog.vue" +import {releaseDrillPlanApi} from "/@/api/contingencyManagement/emergencyDrillPlan"; +import {goalManagementApi} from "/@/api/goalManagement"; +import { Session } from '/@/utils/storage'; export default defineComponent({ name: 'openAdd', components: { RegionsDialog, - UserCheckbox, + DailogSearchUser }, - setup() { + setup(props, { emit }) { const isShowDialog = ref(false) const ruleFormRef = ref<FormInstance>() //定义表单 - const ruleForm = reactive({ - teamName: '', // 队伍名称 - planCustomizer: '胡海涛', //计划定制人 - teamLeader: '', //队伍负责人 - department: [], // 负责人部门 - phone: '', // 负责人手机 - telephone: '', // 固定电话 + const ruleForm = ref ({ + makingPlanDate: '', // 计划制定日期 + drillPlanDate: '', //计划演练日期 + makingUserUid: '', //计划制定人ID + makingUserName: '', //计划制定人Name + makingDepartmentId: '', // 计划制定部门ID + planId: '', // 应急预案ID + planName: '', // 应急预案name + departmentId: '', // 主办部门ID + drillExpense: '', // 演练经费 + drillLevel: '', //演练级别 + drillAddress: '', //演练地点 + drillName: '', // 演练名称 + drillWay: '', // 演练方式 + insuranceMeasures: '', // 保险措施 + remark: '', // 备注 + purpose: '', // 演练目的 + fileList: [ + ], + userList: [ + ], + chargeUserList:[], + userListString:'',//演练人员字段(回填使用) + chargeUserListString:'',//演练负责人字段(回填使用) }); + const titles = ref(); + const disabled = ref(); // 打开弹窗 - const openDialog = () => { - // state.ruleForm = row; + const openDialog = (title: string, id: number, type: boolean) => { + ruleForm.value.makingUserUid = Session.get('uid'); + ruleForm.value.makingUserName = Session.get('realName'); isShowDialog.value = true; - }; - // 关闭弹窗 - const closeDialog = () => { - isShowDialog.value = false; - }; - // 取消 - const onCancel = () => { - closeDialog(); + titles.value = title; + disabled.value = type; + if (title == '查看应急演练计划发布' || title == '修改应急演练计划发布') { + releaseDrillPlanApi() + .seeReleaseDrillPlan(id) + .then((res) => { + if (res.data.code == 200) { + ruleForm.value = res.data.data; + ruleForm.value.userListString='' + ruleForm.value.chargeUserListString='' + for(var a = 0;a<res.data.data.userList.length;a++){ + if(res.data.data.userList[a].type==1){ + ruleForm.value.userListString += res.data.data.userList[a].userName+';' + } + // if(res.data.data.userList[a].type==2){ + // ruleForm.value.chargeUserListString += res.data.data.userList[a].userName+';' + // } + } + // alert(res.data.data.chargeUserList.length) + for(var a = 0;a<res.data.data.chargeUserList.length;a++){ + ruleForm.value.chargeUserListString += res.data.data.chargeUserList[a].userName+';' + } + } + }); + } }; //日期选择器 const value1 = ref('') @@ -240,150 +292,202 @@ // 可选择树 const treeSelect = ref() const tree = [ - { - value: '1', - label: 'Level one 1', - children: [ - { - value: '1-1', - label: 'Level two 1-1', - children: [ - { - value: '1-1-1', - label: 'Level three 1-1-1', - }, - ], - }, - ], - }, - { - value: '2', - label: 'Level one 2', - children: [ - { - value: '2-1', - label: 'Level two 2-1', - children: [ - { - value: '2-1-1', - label: 'Level three 2-1-1', - }, - ], - }, - { - value: '2-2', - label: 'Level two 2-2', - children: [ - { - value: '2-2-1', - label: 'Level three 2-2-1', - }, - ], - }, - ], - }, - { - value: '3', - label: 'Level one 3', - children: [ - { - value: '3-1', - label: 'Level two 3-1', - children: [ - { - value: '3-1-1', - label: 'Level three 3-1-1', - }, - ], - }, - { - value: '3-2', - label: 'Level two 3-2', - children: [ - { - value: '3-2-1', - label: 'Level three 3-2-1', - }, - ], - }, - ], - }, ] + //部门树 + const department = () => { + goalManagementApi() + .getTreedepartment() + .then((res) => { + if (res.data.code == 200) { + data.value = res.data.data; + } else { + ElMessage.error(res.data.msg); + } + }); + }; //定义树形下拉框 const responsibleDepartment = ref() - const data = [ - { - value: '1', - label: '广汇能源综合物流发展有限责任公司', - children: [ - { - value: '1-1', - label: '经营班子', - children: [], - }, - ], - }, - { - value: '2', - label: '生产运行部', - children: [ - { - value: '2-1', - label: '灌装一班', - children: [] - }, - { - value: '2-2', - label: '工艺四班', - children: [], - }, - ], - }, - { - value: '3', - label: '设备部', - children: [ - { - value: '3-1', - label: '仪表班', - children: [], - }, - { - value: '3-2', - label: '机修班', - children: [], - }, - ], - }, - ] - + const data = ref() + const propse = { + label: 'depName', + children: 'children', + value: 'depId', + }; + onMounted(() => { + department(); + }); // 表单提交验证必填项 - const submitForm = async (formEl: FormInstance | undefined) => { - if (!formEl) return - await formEl.validate((valid, fields) => { - if (valid) { - console.log('submit!') - } else { - console.log('error submit!', fields) - } - }) + const submitForm = async (title: string, formEl: FormInstance | undefined) => { + ruleForm.value.userList = ruleForm.value.userList.concat(ruleForm.value.chargeUserList) + if (title == '新建应急演练计划发布') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + releaseDrillPlanApi() + .addReleaseDrillPlan(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + emit('myAdd', true); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + emit('myAdd', true); + } + formEl.resetFields(); + }); + } else { + console.log('error submit!', fields); + } + }); + } + else if (title == '修改应急演练计划发布') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + releaseDrillPlanApi() + .editReleaseDrillPlan(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); + } + formEl.resetFields(); + }); + } else { + console.log('error submit!', fields); + } + }); + formEl.resetFields(); + ruleForm.value = { + makingPlanDate: '', // 计划制定日期 + drillPlanDate: '', //计划演练日期 + makingUserUid: '', //计划制定人ID + makingDepartmentId: '', // 计划制定部门ID + planId: '', // 应急预案ID + planName: '', // 应急预案name + departmentId: '', // 主办部门ID + drillExpense: '', // 演练经费 + drillLevel: '', //演练级别 + drillAddress: '', //演练地点 + drillName: '', // 演练名称 + drillWay: '', // 演练方式 + insuranceMeasures: '', // 保险措施 + remark: '', // 备注 + purpose: '', // 演练目的 + fileList: [ + ], + userList: [ + ], + chargeUserList:[], + userListString:'',//演练人员字段(回填使用) + chargeUserListString:'',//演练负责人字段(回填使用) + }; + } } + const resetForm = (formEl: FormInstance | undefined) => { + isShowDialog.value = false; + if (!formEl) return; + ruleForm.value = { + makingPlanDate: '', // 计划制定日期 + drillPlanDate: '', //计划演练日期 + makingUserUid: '', //计划制定人ID + makingDepartmentId: '', // 计划制定部门ID + planId: '', // 应急预案ID + planName: '', // 应急预案name + departmentId: '', // 主办部门ID + drillExpense: '', // 演练经费 + drillLevel: '', //演练级别 + drillAddress: '', //演练地点 + drillName: '', // 演练名称 + drillWay: '', // 演练方式 + insuranceMeasures: '', // 保险措施 + remark: '', // 备注 + purpose: '', // 演练目的 + fileList: [ + ], + userList: [ + ], + chargeUserList:[], + userListString:'',//演练人员字段(回填使用) + chargeUserListString:'',//演练负责人字段(回填使用) + }; + formEl.resetFields(); + }; // 应急队伍弹窗 const Shows=ref() - const daiInpt=()=>{ + const daiInpt = () => { Shows.value.openDailog() } + const onUser = (e:any) => { + ruleForm.value.planId=e.id + ruleForm.value.planName=e.name + }; // 打开用户选择弹窗 const userRef = ref(); - const openUser = () => { - userRef.value.openDialog(); + const userFZRef = ref(); + //打开演练人员和演练负责人弹窗 type 0 演练人员 1 演练负责人 + const openUser = (type:number) => { + if(type==0){ + userRef.value.openDailog(0); + }else if(type==1){ + userFZRef.value.openDailog(0); + } + }; + const SearchUser = (e:any) => { + console.log('演练人员',e) + ruleForm.value.userListString='' + ruleForm.value.userList=[] + for(var a = 0;a<e.length;a++){ + ruleForm.value.userList.push( + { + type: 1, + userName: e[a].realName, + userUid: e[a].uid, + } + ) + ruleForm.value.userListString+=e[a].realName+';' + } + + }; + const SearchFZUser = (e:any) => { + console.log('演练负责人员',e[0].userName) + ruleForm.value.chargeUserListString='' + ruleForm.value.chargeUserList=[] + // ruleForm.value.chargeUserList = [] + for(var a = 0;a<e.length;a++){ + ruleForm.value.chargeUserList.push( + { + type: 2, + userName: e[a].realName, + userUid: e[a].uid, + } + ) + ruleForm.value.chargeUserListString+=e[a].realName+';' + } }; // 计划定制日期 - const datetime = ref('') - // 计划演练日期 - const drillDate = ref('') - // 修改时间 - const editDate = ref('') + const datetime = ref(''); //全屏 const full = ref(false); const toggleFullscreen = () => { @@ -395,12 +499,12 @@ }; return { openDialog, - closeDialog, isShowDialog, - onCancel, fileList, responsibleDepartment, data, + department, + propse, Search, ruleForm, value1, @@ -410,15 +514,20 @@ Shows, ruleFormRef, submitForm, - // rules, openUser, userRef, datetime, - drillDate, - editDate, toggleFullscreen, FullScreen, full, + titles, + disabled, + resetForm, + emit, + onUser, + userFZRef, + SearchUser, + SearchFZUser }; }, }); -- Gitblit v1.9.2