马宇豪
2025-04-02 5c45db7c1be28da293b3583c16834ee97e8bac47
src/views/analyse/assessApply/components/riskUnitDialog.vue
@@ -1,59 +1,60 @@
<template>
    <div class="system-menu-dialog-container">
        <el-dialog :title="riskUnitDialogState.title" v-model="riskUnitDialogState.riskUnitDialogVisible" width="600px">
            <el-form ref="riskUnitFormRef" :rules="riskUnitDialogState.riskUnitFormRules" :model="riskUnitDialogState.riskUnitForm" size="default" label-width="120px">
                <el-row :gutter="35">
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="风险单元编号" prop="riskCode">
                            <el-input v-model="riskUnitDialogState.riskUnitForm.riskCode" placeholder="风险单元编号" clearable class="input-length"></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="riskName">
                            <el-input v-model="riskUnitDialogState.riskUnitForm.riskName" placeholder="风险单元名称" clearable class="input-length"></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="riskUnitTypeId">
                        <el-select v-model="riskUnitDialogState.riskUnitForm.riskUnitTypeId" placeholder="风险单元类型" clearable class="input-length">
                          <el-option v-for="item in riskUnitDialogState.riskTypeList" :key="item.id" :label="item.riskType" :value="item.id"></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="负责人" prop="liabilityUserId">
                            <el-select v-model="riskUnitDialogState.riskUnitForm.liabilityUserId" placeholder="负责人" clearable class="input-length">
                                <el-option v-for="item in riskUnitDialogState.allPersonList" :key="item.id" :label="item.personName" :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="负责部门" prop="liabilityDep">
                            <el-input v-model="riskUnitDialogState.riskUnitForm.liabilityDep" placeholder="负责部门" clearable class="input-length"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" v-if="riskUnitDialogState.experimentType === 1">
                      <el-form-item label="基础风险单元" prop="basicRiskUnitId">
                        <el-select v-model="riskUnitDialogState.riskUnitForm.basicRiskUnitId" placeholder="基础风险单元" clearable class="input-length">
                          <el-option v-for="item in riskUnitDialogState.basicUnitList" :key="item.id" :label="item.riskName" :value="item.id"></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="风险单元描述">
                            <el-input type="textarea" :rows="3" v-model="riskUnitDialogState.riskUnitForm.description" placeholder="风险单元描述" clearable class="input-length"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <template #footer>
  <div class="system-menu-dialog-container">
    <el-dialog :title="riskUnitDialogState.title" v-model="riskUnitDialogState.riskUnitDialogVisible" width="600px">
      <el-form ref="riskUnitFormRef" :rules="riskUnitDialogState.riskUnitFormRules" :model="riskUnitDialogState.riskUnitForm" size="default" label-width="120px">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="风险单元编号" prop="riskCode">
              <el-input v-model="riskUnitDialogState.riskUnitForm.riskCode" :disabled="riskUnitDialogState.disabled" placeholder="风险单元编号" clearable class="input-length"></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="riskName">
              <el-input v-model="riskUnitDialogState.riskUnitForm.riskName" :disabled="riskUnitDialogState.disabled" placeholder="风险单元名称" clearable class="input-length"></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="riskUnitTypeId">
              <el-select v-model="riskUnitDialogState.riskUnitForm.riskUnitTypeId" :disabled="riskUnitDialogState.disabled" placeholder="风险单元类型" clearable class="input-length">
                <el-option v-for="item in riskUnitDialogState.riskTypeList" :key="item.id" :label="item.riskType" :value="item.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="负责人" prop="liabilityUserId">
              <el-select v-model="riskUnitDialogState.riskUnitForm.liabilityUserId" :disabled="riskUnitDialogState.disabled" placeholder="负责人" clearable class="input-length">
                <el-option v-for="item in riskUnitDialogState.allPersonList" :key="item.id" :label="item.personName" :value="item.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="负责部门" prop="liabilityDepId">
              <el-cascader :options="riskUnitDialogState.departmentData" :disabled="riskUnitDialogState.disabled" :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'depName' }" placeholder="负责部门" clearable v-model="riskUnitDialogState.riskUnitForm.liabilityDepId"> </el-cascader>
<!--              <el-input v-model="riskUnitDialogState.riskUnitForm.liabilityDep" :disabled="riskUnitDialogState.disabled" placeholder="负责部门" clearable class="input-length"></el-input>-->
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" v-if="riskUnitDialogState.experimentType === 1">
            <el-form-item label="基础风险单元" prop="basicRiskUnitId">
              <el-select v-model="riskUnitDialogState.riskUnitForm.basicRiskUnitId" :disabled="riskUnitDialogState.disabled" placeholder="基础风险单元" clearable class="input-length">
                <el-option v-for="item in riskUnitDialogState.basicUnitList" :key="item.id" :label="item.riskName" :value="item.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="风险单元描述">
              <el-input type="textarea" :rows="3" v-model="riskUnitDialogState.riskUnitForm.description" :disabled="riskUnitDialogState.disabled" placeholder="风险单元描述" clearable class="input-length"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
            <span class="dialog-footer">
               <el-button @click="riskUnitDialogState.riskUnitDialogVisible = !riskUnitDialogState.riskUnitDialogVisible" size="default">取 消</el-button>
               <el-button type="primary" @click="onSubmitRiskUnit" size="default">确定</el-button>
               <el-button type="primary" @click="onSubmitRiskUnit" v-if="!riskUnitDialogState.disabled" size="default">确定</el-button>
            </span>
            </template>
        </el-dialog>
    </div>
      </template>
    </el-dialog>
  </div>
</template>
<script setup lang="ts">
@@ -61,132 +62,151 @@
import { isValidKey } from "/@/utils/methods";
import {ElMessage} from "element-plus";
import {riskUnitApi} from "/@/api/analyse/riskUnit";
import {departmentApi} from "/@/api/systemManage/department";
const riskUnitFormRef = ref()
const riskUnitDialogState = reactive<RiskUnitDialogType>({
    title: '新增',
    experimentType: 2,
    riskUnitDialogVisible: false,
    riskUnitForm: {
        experimentId: null,
        riskCode: '',
        riskName: '',
        riskUnitTypeId: null,
        liabilityUserId: null,
        liabilityDep: '',
        description: '',
        basicRiskUnitId: null,
    },
    riskUnitFormRules: {
        riskCode: [{ required: true, message: '请填写风险单元编号', trigger: 'blur' }],
        riskName: [{ required: true, message: '请填写风险单元名称', trigger: 'blur' }],
        riskUnitTypeId: [{ required: true, message: '请选择风险单元类型', trigger: 'blur' }],
        liabilityUserId: [{ required: true, message: '请选择负责人', trigger: 'change' }],
        basicRiskUnitId: [{ required: true, message: '请选择基础风险单元', trigger: 'change' }]
    },
    specialDeviceList: [],
    deviceUnitList: [
        {id:1, name: '台'},
        {id:2, name: '个'},
        {id:3, name: '件'}
    ],
    riskTypeList: [],
    basicUnitList: [],
    allPersonList: [],
    allExperimentList: [],
    experimentTypeList: [
        {id: 2, name: '实验风险'},
        {id: 1, name: '固有风险'},
    ],
  title: '',
  experimentType: 2,
  disabled: false,
  riskUnitDialogVisible: false,
  riskUnitForm: {
    id: null,
    experimentId: null,
    riskCode: '',
    riskName: '',
    riskUnitTypeId: null,
    liabilityUserId: null,
    liabilityDepId: null,
    description: '',
    basicRiskUnitId: null,
  },
  departmentData: [],
  riskUnitFormRules: {
    riskCode: [{ required: true, message: '请填写风险单元编号', trigger: 'blur' }],
    riskName: [{ required: true, message: '请填写风险单元名称', trigger: 'blur' }],
    riskUnitTypeId: [{ required: true, message: '请选择风险单元类型', trigger: 'blur' }],
    liabilityUserId: [{ required: true, message: '请选择负责人', trigger: 'change' }],
    basicRiskUnitId: [{ required: true, message: '请选择基础风险单元', trigger: 'change' }]
  },
  specialDeviceList: [],
  deviceUnitList: [
    {id:1, name: '台'},
    {id:2, name: '个'},
    {id:3, name: '件'}
  ],
  riskTypeList: [],
  basicUnitList: [],
  allPersonList: [],
  allExperimentList: [],
  experimentTypeList: [
    {id: 2, name: '实验风险'},
    {id: 1, name: '固有风险'},
  ],
})
const showRiskUnitDialog = (id: number, liabilityUserId: number, basicUnitList: UnitType [], allPersonList: AllPersonListType [], allRiskTypeList: RiskType []) => {
    riskUnitDialogState.riskUnitDialogVisible = true;
    riskUnitDialogState.basicUnitList = basicUnitList
    riskUnitDialogState.allPersonList = allPersonList
    riskUnitDialogState.riskTypeList = allRiskTypeList
    setTimeout(() => {
        riskUnitFormRef.value.clearValidate();
    });
const showRiskUnitDialog = (title: string, val, id: number, basicUnitList: UnitType [], allPersonList: AllPersonListType [], allRiskTypeList: RiskType []) => {
  getDeptData()
  riskUnitDialogState.riskUnitDialogVisible = true;
  riskUnitDialogState.basicUnitList = basicUnitList
  riskUnitDialogState.allPersonList = allPersonList
  riskUnitDialogState.riskTypeList = allRiskTypeList
  riskUnitDialogState.disabled = false
  setTimeout(() => {
    riskUnitFormRef.value.clearValidate();
  });
  if(title === '新增'){
    riskUnitDialogState.title = '新增';
    riskUnitDialogState.riskUnitForm = {
        experimentId: id,
        riskCode: '',
        riskName: '',
        riskUnitTypeId: null,
        liabilityUserId: liabilityUserId,
        liabilityDep: '',
        description: '',
        basicRiskUnitId: null,
      id: null,
      experimentId: id,
      riskCode: '',
      riskName: '',
      riskUnitTypeId: null,
      liabilityUserId: null,
      liabilityDepId: null,
      description: '',
      basicRiskUnitId: null,
    };
  }else if(title === '查看'){
    riskUnitDialogState.title = '查看';
    riskUnitDialogState.disabled = true
    for(let i in riskUnitDialogState.riskUnitForm){
      if(isValidKey(i, riskUnitDialogState.riskUnitForm)){
        riskUnitDialogState.riskUnitForm[i] = val[i];
      }
    }
  }else{
    riskUnitDialogState.title = '编辑';
    for(let i in riskUnitDialogState.riskUnitForm){
      if(isValidKey(i, riskUnitDialogState.riskUnitForm)){
        riskUnitDialogState.riskUnitForm[i] = val[i];
      }
    }
  }
};
const getDeptData =async () => {
  let res = await departmentApi().getDepartmentList()
  if (res.data.code === 100) {
    riskUnitDialogState.departmentData = res.data.data
  } else {
    ElMessage({
      type: 'warning',
      message: res.data.msg
    });
  }
}
const onSubmitRiskUnit = () => {
    riskUnitFormRef.value.validate(async(valid: boolean) => {
        if(valid){
            if(riskUnitDialogState.title === '新增' && riskUnitDialogState.experimentType === 1){
                let { experimentId,basicRiskUnitId} = riskUnitDialogState.riskUnitForm
                let query = { experimentId,basicRiskUnitId }
                let res = await riskUnitApi().addBasicRiskUnit(query);
                if(res.data.code === 100){
                    emit('refresh')
                    riskUnitDialogState.riskUnitDialogVisible = false;
                    ElMessage({
                        type: 'success',
                        message: '新增成功'
                    })
                }else{
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg,
                    });
                }
            }else if(riskUnitDialogState.title === '新增' && riskUnitDialogState.experimentType === 2){
                let { basicRiskUnitId, ...query} = riskUnitDialogState.riskUnitForm
                let res = await riskUnitApi().addRiskUnit(query);
                if(res.data.code === 100){
                    emit('refresh')
                    riskUnitDialogState.riskUnitDialogVisible = false;
                    ElMessage({
                        type: 'success',
                        message: '新增成功'
                    })
                }else{
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg,
                    });
                }
            }else{
                let res = await riskUnitApi().modRiskUnit(riskUnitDialogState.riskUnitForm)
                if(res.data.code === 100){
                    emit('refresh')
                    riskUnitDialogState.riskUnitDialogVisible = false;
                    ElMessage({
                        type: 'success',
                        message: '编辑成功'
                    })
                }else{
                    ElMessage({
                        type: 'warning',
                        message: res.data.msg,
                    });
                }
            }
  riskUnitFormRef.value.validate(async(valid: boolean) => {
    if(valid){
      if(riskUnitDialogState.title === '新增'){
        let { id, basicRiskUnitId, ...query} = riskUnitDialogState.riskUnitForm
        let res = await riskUnitApi().addRiskUnit(query);
        if(res.data.code === 100){
          emit('refresh')
          riskUnitDialogState.riskUnitDialogVisible = false;
          ElMessage({
            type: 'success',
            message: '新增成功'
          })
        }else{
            ElMessage({
                type: 'warning',
                message: '请完善基本信息',
            });
          ElMessage({
            type: 'warning',
            message: res.data.msg,
          });
        }
    })
      }else{
        let res = await riskUnitApi().modRiskUnit(riskUnitDialogState.riskUnitForm)
        if(res.data.code === 100){
          emit('refresh')
          riskUnitDialogState.riskUnitDialogVisible = false;
          ElMessage({
            type: 'success',
            message: '编辑成功'
          })
        }else{
          ElMessage({
            type: 'warning',
            message: res.data.msg,
          });
        }
      }
    }else{
      ElMessage({
        type: 'warning',
        message: '请完善基本信息',
      });
    }
  })
}
const emit = defineEmits(['refresh'])
defineExpose({
    showRiskUnitDialog
  showRiskUnitDialog
})
</script>