修改接口和页面

马宇豪

2023-04-14 36e71978a92ee64375b2c339e5e05d47b6b23fba

 src/views/analyse/assessApply/components/reportDialog.vue

@@ -1,11 +1,12 @@
<template>
    <div class="system-menu-dialog-container">
        <el-dialog :title="reportDialogState.title" v-model="reportDialogState.reportDialogVisible" width="80%">
          <div style="text-align: center;font-size: 20px;font-weight: bolder;color: #0c4995">{{reportDialogState.reportForm.experimentName}}实验安全风险评估报告表（带<span style="color: red">*</span>为填写内容）</div>
            <el-form ref="reportFormRef" :rules="reportDialogState.reportFormRules" :model="reportDialogState.reportForm" size="default" label-width="0">
                <table class="report-table">
                    <th class="m-color b-font" style="text-align: center">实验基本信息</th>
                    <tr>
                        <td class="w-25 m-color required">实验名称</td>
                        <td class="w-25 m-color">实验名称</td>
                        <td class="w-75 m-color">
                            <el-form-item prop="experimentName">
                                <el-input readonly v-model="reportDialogState.reportForm.experimentName" placeholder="请输入实验名称" />
@@ -13,79 +14,82 @@
                        </td>
                    </tr>
                    <tr>
                        <td class="w-25 m-color required">实验类型</td>
                        <td class="w-75 m-color">
                            <el-radio-group style="text-align: center" disabled v-model="reportDialogState.reportForm.experimentType">
                                <el-radio :label="1">化学类</el-radio>
                                <el-radio :label="2">生物类</el-radio>
                                <el-radio :label="3">辐射类</el-radio>
                                <el-radio :label="4">机电类</el-radio>
                                <el-radio :label="5">特种设备类</el-radio>
                                <el-radio :label="6">其他类</el-radio>
                            </el-radio-group>
                        <td class="w-25 m-color">实验类型</td>
                        <td class="w-75" style="text-align: left;padding-left: 11px">
<!--                            <el-radio-group style="text-align: center" disabled v-model="reportDialogState.reportForm.experimentType">-->
<!--                                <el-radio :label="1">化学类</el-radio>-->
<!--                                <el-radio :label="2">生物类</el-radio>-->
<!--                                <el-radio :label="3">辐射类</el-radio>-->
<!--                                <el-radio :label="4">机电类</el-radio>-->
<!--                                <el-radio :label="5">特种设备类</el-radio>-->
<!--                                <el-radio :label="6">其他类</el-radio>-->
<!--                            </el-radio-group>-->
                            {{reportDialogState.experimentTypeList.find(i=>i.id === reportDialogState.reportForm.experimentType)?.name}}
                        </td>
                    </tr>
                    <tr>
                      <td class="w-25 m-color required">负责人</td>
                      <td class="w-25 m-color">负责人</td>
                      <td class="w-25 m-color">
                        <el-select style="width: 100%" disabled v-model="reportDialogState.reportForm.liabilityUserId" clearable filterable @change="getLiabilityUserPhone($event)">
                          <el-option
                              v-for="item in reportDialogState.systemPersonList"
                              :key="item.id"
                              :value="item.id"
                              :label="item.realName"
                          ></el-option>
                        </el-select>
<!--                        <el-select style="width: 100%" disabled v-model="reportDialogState.reportForm.liabilityUserId" clearable filterable @change="getLiabilityUserPhone($event)">-->
<!--                          <el-option-->
<!--                              v-for="item in reportDialogState.systemPersonList"-->
<!--                              :key="item.id"-->
<!--                              :value="item.id"-->
<!--                              :label="item.realName"-->
<!--                          ></el-option>-->
<!--                        </el-select>-->
                        <el-input readonly v-model="reportDialogState.reportForm.personUser" />
                      </td>
                      <td class="w-25 m-color required">电话</td>
                      <td class="w-25 m-color">电话</td>
                      <td class="w-25 m-color">
                        <el-input readonly v-model="reportDialogState.reportForm.liabilityUserPhone" />
                        <el-input disabled v-model="reportDialogState.reportForm.personUserPhone" />
                      </td>
                    </tr>
                    <tr>
                      <td class="w-25 m-color required">安全负责人</td>
                      <td class="w-25 m-color">安全负责人</td>
                      <td class="w-25 m-color">
                        <el-select v-if="reportDialogState.reportForm.safeLiabilityUserId" style="width: 100%" disabled v-model="reportDialogState.reportForm.safeLiabilityUserId" @change="getSafeLiabilityUserPhone($event)" clearable filterable>
                          <el-option
                              v-for="item in reportDialogState.allPersonList"
                              :key="item.id"
                              :value="item.id"
                              :label="item.personName"
                          ></el-option>
                        </el-select>
                        <el-input v-else disabled v-model="reportDialogState.reportForm.safeLiabilityUser" />
<!--                        <el-select v-if="reportDialogState.reportForm.safeLiabilityUserId" style="width: 100%" disabled v-model="reportDialogState.reportForm.safeLiabilityUserId" @change="getSafeLiabilityUserPhone($event)" clearable filterable>-->
<!--                          <el-option-->
<!--                              v-for="item in reportDialogState.allPersonList"-->
<!--                              :key="item.id"-->
<!--                              :value="item.id"-->
<!--                              :label="item.personName"-->
<!--                          ></el-option>-->
<!--                        </el-select>-->
                        <el-input disabled v-model="reportDialogState.reportForm.safePersonUser" />
                      </td>
                      <td class="w-25 m-color required">电话</td>
                      <td class="w-25 m-color">电话</td>
                      <td class="w-25 m-color">
                        <el-input readonly v-model="reportDialogState.reportForm.safeLiabilityUserPhone" />
                        <el-input readonly v-model="reportDialogState.reportForm.safePersonUserPhone" />
                      </td>
                    </tr>
                    <tr>
                      <td class="w-25 m-color required">部门</td>
                      <td class="w-25 m-color">部门</td>
                      <td class="w-75 m-color">
                        <el-input readonly v-model="reportDialogState.reportForm.dep" />
                      </td>
                    </tr>
                    <tr class="m-color b-font" style="text-align: center">实验场所</tr>
                    <tr>
                      <td class="w-14 m-color required">场所名称</td>
                      <td class="w-14 m-color">场所名称</td>
                      <td class="w-14 m-color">所在楼栋</td>
                      <td class="w-14 m-color">房间</td>
                      <td class="w-14 m-color">有无消防设施</td>
                      <td class="w-14 m-color">有无隔断</td>
                      <td class="w-14 m-color">场所性质</td>
                    </tr>
                    <tr v-for="(item,index) in reportDialogState.reportForm.siteList" :key="index">
                    <tr v-for="(item,index) in reportDialogState.reportForm.experimentSite" :key="index">
                      <td class="w-14">
                        <el-select disabled filterable v-model="item.siteId">
                          <el-option
                              v-for="item in reportDialogState.allRoomList"
                              :key="item.id"
                              :value="item.id"
                              :label="item.siteName"
                          >
                          </el-option>
                        </el-select>
<!--                        <el-select disabled filterable v-model="item.siteId">-->
<!--                          <el-option-->
<!--                              v-for="item in reportDialogState.allRoomList"-->
<!--                              :key="item.id"-->
<!--                              :value="item.id"-->
<!--                              :label="item.siteName"-->
<!--                          >-->
<!--                          </el-option>-->
<!--                        </el-select>-->
                        <el-input disabled v-model="item.siteName" />
                      </td>
                      <td class="w-14">
                        <el-input disabled v-model="item.floor" />
@@ -105,71 +109,75 @@
                    </tr>
                    <tr>
                      <td class="w-25 m-color required">评估人</td>
                      <td class="w-25 m-color">
                        <el-select style="width: 100%" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.assessUserId" clearable filterable>
                          <el-option
                              v-for="item in reportDialogState.allPersonList"
                              :key="item.id"
                              :value="item.id"
                              :label="item.personName"
                          ></el-option>
                        </el-select>
                      <td class="w-75 m-color">
<!--                        <el-select style="width: 100%" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.assessPerson" clearable filterable>-->
<!--                          <el-option-->
<!--                              v-for="item in reportDialogState.allPersonList"-->
<!--                              :key="item.id"-->
<!--                              :value="item.id"-->
<!--                              :label="item.personName"-->
<!--                          ></el-option>-->
<!--                        </el-select>-->
                        <el-input :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.assessPerson" placeholder="评估人" />
                      </td>
                      <td class="w-25 m-color required">评估时间</td>
                      <td class="w-25 m-color">
                        <el-date-picker :disabled="reportDialogState.disabled"  type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" v-model="reportDialogState.reportForm.assessTime" />
                      </td>
<!--                      <td class="w-25 m-color required">评估时间</td>-->
<!--                      <td class="w-25 m-color">-->
<!--                        <el-date-picker :disabled="reportDialogState.disabled"  type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" v-model="reportDialogState.reportForm.assessTime" />-->
<!--                      </td>-->
                    </tr>

                    <tr class="m-color b-font" style="text-align: center">实验概况</tr>
                    <tr>
                        <el-input type="textarea" :autosize="{ minRows: 3}" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.experimentDesc" placeholder="（简要描述实验原理、实验步骤、所用试剂或材料设备等）" />
                        <el-input type="textarea" :autosize="{ minRows: 3}" disabled v-model="reportDialogState.reportForm.experimentDesc" placeholder="（简要描述实验原理、实验步骤、所用试剂或材料设备等）" />
                    </tr>
                    <tr class="m-color b-font" style="text-align: center">实验涉及的危险源</tr>
                    <tr>
                      <td class="w-25 m-color required">危险源种类</td>
                      <td class="w-25 m-color">危险源种类</td>
                      <td class="w-75 m-color">
                        <el-radio-group :disabled="reportDialogState.disabled"  v-model="reportDialogState.reportForm.dangerSource">
                          <el-radio :label="1">化学安全</el-radio>
                          <el-radio :label="2">辐射安全</el-radio>
                          <el-radio :label="3">特种设备安全</el-radio>
                          <el-radio :label="4">机电安全</el-radio>
                          <el-radio :label="5">电气安全</el-radio>
                          <el-radio :label="6">生物安全</el-radio>
                          <el-radio :label="7">激光安全</el-radio>
                          <el-radio :label="8">其他安全</el-radio>
                        </el-radio-group>
<!--                        <el-radio-group disabled v-model="reportDialogState.reportForm.dangerSource">-->
<!--                          <el-radio :label="1">化学安全</el-radio>-->
<!--                          <el-radio :label="2">辐射安全</el-radio>-->
<!--                          <el-radio :label="3">特种设备安全</el-radio>-->
<!--                          <el-radio :label="4">机电安全</el-radio>-->
<!--                          <el-radio :label="5">电气安全</el-radio>-->
<!--                          <el-radio :label="6">生物安全</el-radio>-->
<!--                          <el-radio :label="7">激光安全</el-radio>-->
<!--                          <el-radio :label="8">其他安全</el-radio>-->
<!--                        </el-radio-group>-->
                        <el-checkbox-group disabled>
                          <el-checkbox v-for="item in reportDialogState.reportForm.riskSourceType" :label="item.riskSourceType" :checked="item.status==1?true:false"/>
                        </el-checkbox-group>
                      </td>
                    </tr>
                    <select-danger ref="selectDangerRef" v-model:data="reportDialogState.reportForm.riskSource" v-model:disabled="reportDialogState.disabled"></select-danger>
                    <tr class="m-color b-font" style="text-align: center">安全风险分析（总结）</tr>
                    <tr class="m-color b-font required" style="text-align: center">安全风险分析（总结）</tr>
                    <tr>
                      <el-input type="textarea" :autosize="{ minRows: 3}" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.safeRiskAnalysis" placeholder="1.实验过程中是否有爆炸、火灾、腐蚀、中毒风险、产生危险废弃物等（根据危险源清单，分析实验过程中可能对人身安全、人体健康、实验室环境和周边环境等带来的负面影响）" />
                    </tr>
                    <tr class="m-color b-font" style="text-align: center">拟采取的防护和应急措施</tr>
                    <tr>
                      <el-input type="textarea" :autosize="{ minRows: 3}" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.emergencyMeasure" placeholder="" />
                      <el-input type="textarea" :autosize="{ minRows: 3}" disabled v-model="reportDialogState.reportForm.emergencyMeasure" placeholder="" />
                    </tr>
                    <tr class="m-color b-font" style="text-align: center">实验和实验项目综合风险等级评定</tr>
                    <tr class="m-color b-font required" style="text-align: center">实验和实验项目综合风险等级评定</tr>
                    <tr>
                      <td class="m-color" style="width: 100%">
                        <el-radio-group :disabled="reportDialogState.disabled"  v-model="reportDialogState.reportForm.assessLevel">
                          <el-radio :label="4">重大风险（一级）</el-radio>
                          <el-radio :label="3">较大风险（二级）</el-radio>
                          <el-radio :label="2">一般风险（三级）</el-radio>
                          <el-radio :label="1">低风险（四级）</el-radio>
                          <el-radio :label="1">低风险（一级）</el-radio>
                          <el-radio :label="2">一般风险（二级）</el-radio>
                          <el-radio :label="3">较大风险（三级）</el-radio>
                          <el-radio :label="4">重大风险（四级）</el-radio>
                        </el-radio-group>
                      </td>
                    </tr>
                    <tr>
                      <el-input type="textarea" :autosize="{ minRows: 3}" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.reskLevelReason" placeholder="请输入评定依据" />
                      <el-input type="textarea" :autosize="{ minRows: 3}" :disabled="reportDialogState.disabled" v-model="reportDialogState.reportForm.description" placeholder="评定依据（必填）" />
                    </tr>
                </table>
            </el-form>
            <template #footer>
              <span class="dialog-footer" style="padding-top:10px;text-align: center !important;">
                <el-button @click="reportDialogState.reportDialogVisible = !reportDialogState.reportDialogVisible" size="default">取 消</el-button>
                <el-button type="primary" v-if="!reportDialogState.disabled" @click="onSubmitProject" size="default">提交审批</el-button>
                <el-button type="primary" v-if="!reportDialogState.disabled" @click="onSubmitProject()" size="default">提交审批</el-button>
              </span>
            </template>
        </el-dialog>
@@ -183,6 +191,7 @@
import {personApi} from "/@/api/basic/person";
import {userApi} from "/@/api/systemManage/user";
import {roomApi} from "/@/api/basic/room";
import {assessApplyApi} from "/@/api/analyse/assessApply";

const SelectDanger = defineAsyncComponent(() => import('./selectDanger.vue'))
const selectDangerRef = ref()
@@ -191,30 +200,49 @@
    title: '',
    disabled: false,
    reportDialogVisible: false,
    reportForm:   {
    reportForm: {
        id: null,
        experimentName: "",
        experimentType: null,
        liabilityUserId: null,
        liabilityUserPhone: '',
        safeLiabilityUserId: null,
        safeLiabilityUser: '',
        safeLiabilityUserPhone: '',
        personUser: '',
        personUserId: null,
        personUserPhone: '',
        safePersonUserId: null,
        safePersonUser: '',
        safePersonUserPhone: '',
        dep: "",
        siteList: [],
        experimentSite: [],
        experimentDesc: '',
        safeRiskAnalysis: '',
        emergencyMeasure: '',
        assessPerson:'',
        safeRiskAnalysis: '',
        assessLevel:null,
        riskSource: []
        riskSource: [],
        riskSourceType: [],
        description: '',
        person:[]
    },
    reportFormRules: {},
    reportFormRules: {
      assessPerson: [{ required: true, message: '请填写评估人员', trigger: 'blur' }],
      safeRiskAnalysis: [{ required: true, message: '请填写安全风险分析', trigger: 'blur' }],
      assessLevel: [{ required: true, message: '请选择风险等级评定', trigger: 'blur' }],
      description: [{ required: true, message: '请填写风险等级评定依据', trigger: 'blur' }],
    },
    allPersonList: [],
    allRoomList: [],
    systemPersonList: [],
    experimentTypeList: [
      {id: 1, name: '化学类'},
      {id: 2, name: '生物类'},
      {id: 3, name: '辐射类'},
      {id: 4, name: '机电类'},
      {id: 5, name: '特种设备类'},
      {id: 6, name: '其它类'}
    ]
})

const showReportDialog = (title: string, value: ProjectType, allRoomList: RoomType []) => {
    getReportData(value.id)
    reportDialogState.reportDialogVisible = true;
    reportDialogState.allRoomList = allRoomList
    setTimeout(() => {
@@ -223,19 +251,22 @@
    if(title === '提交'){
      reportDialogState.title = '提交报告';
      reportDialogState.disabled = false
      for(let i in reportDialogState.reportForm) {
        if(isValidKey(i, reportDialogState.reportForm)) {
          reportDialogState.reportForm[i] = value[i];
        }
      }
      // for(let i in reportDialogState.reportForm) {
      //   if(isValidKey(i, reportDialogState.reportForm)) {
      //     reportDialogState.reportForm[i] = value[i];
      //   }
      // }
    }else if(title === '修改'){
      reportDialogState.title = '修改报告';
      reportDialogState.disabled = false
    }else{
        reportDialogState.title = '查看';
        reportDialogState.disabled = true
        for(let i in reportDialogState.reportForm) {
            if(isValidKey(i, reportDialogState.reportForm)) {
                reportDialogState.reportForm[i] = value[i];
            }
        }
        // for(let i in reportDialogState.reportForm) {
        //     if(isValidKey(i, reportDialogState.reportForm)) {
        //         reportDialogState.reportForm[i] = value[i];
        //     }
        // }
    }
};

@@ -243,33 +274,85 @@
    return key in object;
};

const getLiabilityUserPhone = (value: number)=>{
  const data = reportDialogState.systemPersonList.find(item => item.id === value) as AllPersonListType
  reportDialogState.reportForm.liabilityUserPhone = data.phone
}

const getSafeLiabilityUserPhone = (value: number)=>{
  const data = reportDialogState.allPersonList.find(item => item.id === value) as AllPersonListType
  reportDialogState.reportForm.safeLiabilityUserPhone = data.phone
}

const hasSafeSystem = (value: number) =>{
  if(value == 2){
    reportDialogState.reportForm.safeInformationSystem = ''
const getReportData = async (id:number|null|undefined) => {
  let res = await assessApplyApi().getRiskReportPage({
    experimentId: id,
    pageIndex: 1,
    pageSize: 10,
    tag: 3
  });
  if(res.data.code === 100){
    reportDialogState.reportForm = {
      id: null,
      experimentName: "",
      experimentType: null,
      personUser: '',
      personUserId: null,
      personUserPhone: '',
      safePersonUserId: null,
      safePersonUser: '',
      safePersonUserPhone: '',
      dep: "",
      experimentSite: [],
      experimentDesc: '',
      emergencyMeasure: '',
      assessPerson:'',
      safeRiskAnalysis: '',
      assessLevel:null,
      riskSource: [],
      riskSourceType: [],
      description: '',
      person:[]
    }
    if(res.data.data&&res.data.data.length==0){
      ElMessage({
        type: 'warning',
        message: '暂时无法获取实验信息，可能与用户身份有关'
      });
    }else{
      for(let i in reportDialogState.reportForm) {
        if(isValidKey(i, reportDialogState.reportForm)) {
          reportDialogState.reportForm[i] = res.data.data[0][i];
        }
      }
    }
  }else{
    ElMessage({
      type: 'warning',
      message: res.data.msg
    });
  }
}
};

// const getLiabilityUserPhone = (value: number)=>{
//   const data = reportDialogState.systemPersonList.find(item => item.id === value) as AllPersonListType
//   reportDialogState.reportForm.liabilityUserPhone = data.phone
// }
//
// const getSafeLiabilityUserPhone = (value: number)=>{
//   const data = reportDialogState.allPersonList.find(item => item.id === value) as AllPersonListType
//   reportDialogState.reportForm.safeLiabilityUserPhone = data.phone
// }

// const hasSafeSystem = (value: number) =>{
//   if(value == 2){
//     reportDialogState.reportForm.safeInformationSystem = ''
//   }
// }

const onSubmitProject = () => {
    reportFormRef.value.validate(async(valid: boolean) => {
        if(valid){
            if(reportDialogState.title === '新增'){
                let res = await projectApi().addDevelop(reportDialogState.reportForm);
          const { id,assessPerson,safeRiskAnalysis,assessLevel,description } = reportDialogState.reportForm
          const data = { id,assessPerson,safeRiskAnalysis,assessLevel,description }
            if(reportDialogState.title === '提交报告'){
                let res = await assessApplyApi().updateRiskReport(data);
                if(res.data.code === 100){
                    emit('refresh')
                    reportDialogState.reportDialogVisible = false;
                    ElMessage({
                        type: 'success',
                        message: '新增成功'
                        message: '提交报告成功'
                    })
                }else{
                    ElMessage({
@@ -278,13 +361,13 @@
                    });
                }
            }else{
                let res = await projectApi().modProject(reportDialogState.reportForm)
                let res = await assessApplyApi().updateRiskReportInfo(data)
                if(res.data.code === 100){
                  emit('refresh')
                  reportDialogState.reportDialogVisible = false;
                  ElMessage({
                    type: 'success',
                    message: '整改已提交'
                    message: '修改报告成功'
                  })
                }else{
                  ElMessage({
@@ -366,6 +449,14 @@
    line-height: 42px;
    border-bottom: 1px solid #ccc;

  &.required {
    &::before {
      content: "*";
      display: inline-block;
      color: red;
    }
  }

&:last-of-type {
     border-bottom: none;
 }