shj
2022-07-29 17c7c68a17e6502d09299ea385e01413595c17d4
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,
    };
  },
});