From 191e2daab12f365990b24a5f47c2fac8474167dc Mon Sep 17 00:00:00 2001 From: 13937891274 <kxc0822> Date: 星期四, 28 七月 2022 18:04:14 +0800 Subject: [PATCH] 数据对接 --- src/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue | 151 ++++++++++++++++++++++++++----------------------- 1 files changed, 80 insertions(+), 71 deletions(-) diff --git a/src/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue b/src/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue index da7030d..8cbed2a 100644 --- a/src/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue +++ b/src/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue @@ -1,7 +1,7 @@ <template> <div class="system-edit-user-container"> <el-dialog - title="查看应急预案启动记录" + :title="titles" v-model="isShowDialog" width="769px" draggable @@ -10,16 +10,16 @@ <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> <el-form ref="ruleFormRef" - :rules="rules" :model="ruleForm" size="default" label-width="120px" + :disabled="disabled" > <el-row :gutter="35"> <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="应急预案" prop="teamName"> <el-input - v-model="ruleForm.teamLeader" + v-model="ruleForm.planId" placeholder="请选择" class="input-with-select" > @@ -33,7 +33,7 @@ <el-form-item label="备注"> <el-input class="textarea" - v-model="ruleForm.describe" + v-model="ruleForm.remark" type="textarea" maxlength="150" placeholder="请填写备注" @@ -44,7 +44,8 @@ </el-form> <template #footer> <span class="dialog-footer"> - <el-button size="default" @click="onCancel">关闭</el-button> + <el-button size="default" @click="resetForm(ruleFormRef)">关闭</el-button> + <el-button size="default" v-if="disabled == true ? false : true" type="primary" @click="submitForm(titles, ruleFormRef)">确定</el-button> </span> </template> </el-dialog> @@ -56,14 +57,13 @@ <script lang="ts"> import { - reactive, - toRefs, ref, defineComponent } from 'vue'; import type { FormInstance, } from 'element-plus' +import { ElMessage } from 'element-plus'; import { Search, FullScreen @@ -71,37 +71,7 @@ import UserSelections from "/@/components/userSelections/index.vue" import AddEmergencyPersonnel from "/@/views/contingencyManagement/contingency/component/addEmergencyPersonnel.vue"; import EditEmergencyPersonnel from "/@/views/contingencyManagement/contingency/component/editEmergencyPersonnel.vue"; -// 定义接口来定义对象的类型 -interface DeptData { - deptName: string; - createTime: string; - status: boolean; - sort: number | string; - describe: string; - id: number; - children?: DeptData[]; -} -// 定义接口来定义对象的类型 -interface RuleFormRow { - // teamName: string; - // teamLevel: string; - // teamLeader: string; - // responsibleDepartment: any - // teamPhone: string; - // telephone: string; - // describe: string; - selectPeople:string - jobNumber: string; - personnelName: string; - personnelGender: string; - phone: string; - position: string; -} -interface UserState { - isShowDialog: boolean; - ruleForm: RuleFormRow; - deptData: Array<DeptData>; -} +import {emergencyPlanLogApi} from "/@/api/emergencyPlanLog"; export default defineComponent({ name: 'openEdit', @@ -110,44 +80,79 @@ AddEmergencyPersonnel, EditEmergencyPersonnel }, - setup() { - const state = reactive<UserState>({ - isShowDialog: false, - ruleForm: { - selectPeople:'111', //选择人员 - jobNumber: '', // 人员工号 - phone: '', // 手机号码 - personnelGender: '', //人员性别 - position: '', //职位 - personnelName: '', // 人员名称 - }, - deptData: [], // 部门数据 - }); + setup(props, { emit }) { + const isShowDialog = ref(false); - // 关闭弹窗 - const closeDialog = () => { - state.isShowDialog = false; - }; - // 取消 - const onCancel = () => { - closeDialog(); - }; - // // 新增 - // const onSubmit = () => { - // closeDialog(); - // }; + const ruleFormRef = ref<FormInstance>(); + const ruleForm= ref({ + planId: '应急预案', //应急预案人员 + remark: '', // 备注 + }) + const titles = ref(); + const disabled = ref(); // 打开用户选择弹窗 const userRef = ref(); const openUser = () => { userRef.value.openDialog(); }; - - const ruleFormRef = ref<FormInstance>() // 打开弹窗 - const openDialog = (row: RuleFormRow) => { - state.ruleForm = row; - state.isShowDialog = true; + const openDialog = (title: string, id: number, type: boolean) => { + isShowDialog.value = true; + titles.value = title; + disabled.value = type; + if (title == '查看应急预案启动记录' || title == '修改应急预案启动记录') { + emergencyPlanLogApi() + .seeEmergencyPlanLog(id) + .then((res) => { + if (res.data.code == 200) { + ruleForm.value = res.data.data; + } + }); + } + }; + // 表单提交验证必填项 + const submitForm = async (title: string, formEl: FormInstance | undefined) => { + if (title == '修改应急预案启动记录') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + emergencyPlanLogApi() + .editEmergencyPlanLog(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 = { + planId: '应急预案', //应急预案人员 + remark: '', // 备注 + }; + } + }; + const resetForm = (formEl: FormInstance | undefined) => { + isShowDialog.value = false; + if (!formEl) return; + formEl.resetFields(); }; //全屏 const full = ref(false); @@ -160,16 +165,20 @@ }; return { openDialog, - closeDialog, - onCancel, Search, ruleFormRef, openUser, userRef, - ...toRefs(state), toggleFullscreen, FullScreen, full, + titles, + disabled, + emit, + ruleForm, + submitForm, + resetForm, + isShowDialog, }; }, }); -- Gitblit v1.9.2