From af18fd6fb9e1a500be5369550b737ccce12a7d23 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期二, 18 四月 2023 14:29:22 +0800 Subject: [PATCH] 修改表单校验 --- src/views/analyse/applyReview/components/reportDialog.vue | 2 src/views/experiment/project/index.ts | 26 ++++-- src/views/analyse/assessApply/index.vue | 2 src/views/experiment/project/components/selectRoom.vue | 7 + src/views/experiment/developing/components/developDialog.vue | 3 src/views/experiment/project/components/projectDialog.vue | 189 +++++++++++++++++++++++++++++++++++++++++------ src/views/experiment/project/components/selectMaterial.vue | 1 7 files changed, 189 insertions(+), 41 deletions(-) diff --git a/src/views/analyse/applyReview/components/reportDialog.vue b/src/views/analyse/applyReview/components/reportDialog.vue index dbda8f2..5724dfa 100644 --- a/src/views/analyse/applyReview/components/reportDialog.vue +++ b/src/views/analyse/applyReview/components/reportDialog.vue @@ -178,7 +178,7 @@ <td class="w-25 m-color">{{item.approveStage}}</td> <td class="w-25">{{item.approvePerson}}</td> <td class="w-25 m-color">审批结果</td> - <td class="w-25" :class="item.approveStatus==3?'redTit':''">{{item.approveStatus==1?'未审批':item.approveStatus==2?'通过':'未通过'}}</td> + <td class="w-25">{{item.approveStatus==1?'未审批':item.approveStatus==2?'通过':'未通过'}}</td> </tr> <tr> <td class="w-25 m-color autoheight">审批意见</td> diff --git a/src/views/analyse/assessApply/index.vue b/src/views/analyse/assessApply/index.vue index aca3df3..d587bcd 100644 --- a/src/views/analyse/assessApply/index.vue +++ b/src/views/analyse/assessApply/index.vue @@ -67,7 +67,7 @@ <el-button size="small" v-if="scope.row.stage == 3" text type="primary" :icon="Edit" @click="toReport(scope.row)">生成评估报告</el-button> <el-button size="small" text type="primary" :icon="Edit" @click="openRiskDialog(scope.row)">管理实验现实风险</el-button> <el-button size="small" v-if="scope.row.stage == 4 && !scope.row.assessPerson" text type="primary" :icon="View" @click="openReportDialog('提交', scope.row)">提交审批</el-button> - <el-button size="small" v-if="scope.row.stage == 4 && scope.row.assessPerson" text type="primary" :icon="View" @click="openReportDialog('修改', scope.row)">修改</el-button> + <el-button size="small" v-if="scope.row.stage == 4 && !scope.row.assessPerson" text type="primary" :icon="View" @click="openReportDialog('修改', scope.row)">修改</el-button> <el-button size="small" v-if="scope.row.stage == 4 && scope.row.assessPerson" text type="primary" :icon="Edit" @click="openReportDialog('查看',scope.row)">查看</el-button> </template> </el-table-column> diff --git a/src/views/experiment/developing/components/developDialog.vue b/src/views/experiment/developing/components/developDialog.vue index e963df5..823cd90 100644 --- a/src/views/experiment/developing/components/developDialog.vue +++ b/src/views/experiment/developing/components/developDialog.vue @@ -3,8 +3,7 @@ <el-dialog :title="projectDialogState.title" v-model="projectDialogState.projectDialogVisible" width="80%"> <el-form ref="ProjectFormRef" :rules="projectDialogState.projectFormRules" :model="projectDialogState.projectForm" size="default" label-width="0"> <table class="report-table"> - <th class="m-color b-font" style="text-align: center">***研究所/***大学<br />科学研究实验项目安全风险基础信息录入表(已开展 - )(带*为必填项)</th> + <th class="m-color b-font" style="text-align: center">***研究所/***大学<br />科学研究实验项目安全风险基础信息录入表(已开展)(带<span style="color: red">*</span>为必填项)</th> <tr> <td class="w-25 m-color required">实验名称</td> <td class="w-75 m-color"> diff --git a/src/views/experiment/project/components/projectDialog.vue b/src/views/experiment/project/components/projectDialog.vue index fdbd79c..104df10 100644 --- a/src/views/experiment/project/components/projectDialog.vue +++ b/src/views/experiment/project/components/projectDialog.vue @@ -3,7 +3,7 @@ <el-dialog :title="projectDialogState.title" v-model="projectDialogState.projectDialogVisible" width="80%"> <el-form ref="ProjectFormRef" :rules="projectDialogState.projectFormRules" :model="projectDialogState.projectForm" size="default" label-width="0"> <table class="report-table"> - <th class="m-color b-font" style="text-align: center">***研究所/***大学<br />科学研究实验项目安全风险基础信息录入表(新立项)(带*为必填项)</th> + <th class="m-color b-font" style="text-align: center">***研究所/***大学<br />科学研究实验项目安全风险基础信息录入表(新立项)(带<span style="color: red">*</span>为必填项)</th> <tr> <td class="w-25 m-color required">实验名称</td> <td class="w-75 m-color"> @@ -15,7 +15,7 @@ <tr> <td class="w-25 m-color required">实验类型</td> <td class="w-75 m-color"> - + <el-form-item prop="experimentType" style="display: flex;justify-content: center"> <el-radio-group style="text-align: center" :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.experimentType"> <el-radio :label="1">化学类</el-radio> <el-radio :label="2">生物类</el-radio> @@ -24,31 +24,38 @@ <el-radio :label="5">特种设备类</el-radio> <el-radio :label="6">其他类</el-radio> </el-radio-group> - - + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">部门</td> <td class="w-25 m-color"> + <el-form-item prop="dep"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.dep" /> + </el-form-item> </td> <td class="w-25 m-color required">立项时间</td> <td class="w-25 m-color"> - <el-date-picker :disabled="projectDialogState.disabled" type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" v-model="projectDialogState.projectForm.createExperimentTime" /> + <el-form-item prop="createExperimentTime"> + <el-date-picker :disabled="projectDialogState.disabled" type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" v-model="projectDialogState.projectForm.createExperimentTime" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">负责人</td> <td class="w-25 m-color"> - <el-select style="width: 100%" disabled v-model="projectDialogState.projectForm.liabilityUserId" clearable filterable> - <el-option :key="userInfos.uid" :value="userInfos.uid" :label="userInfos.userName"></el-option> - </el-select> + <el-form-item prop="liabilityUserId"> + <el-select style="width: 100%" disabled v-model="projectDialogState.projectForm.liabilityUserId" clearable filterable> + <el-option :key="userInfos.uid" :value="userInfos.uid" :label="userInfos.userName"></el-option> + </el-select> + </el-form-item> <!-- <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.liabilityUserId"/>--> </td> <td class="w-25 m-color required">电话</td> <td class="w-25 m-color"> - <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.liabilityUserPhone" /> + <el-form-item prop="liabilityUserPhone"> + <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.liabilityUserPhone" /> + </el-form-item> </td> </tr> <tr> @@ -62,11 +69,15 @@ <!-- :label="item.personName"--> <!-- ></el-option>--> <!-- </el-select>--> - <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.safeLiabilityUser" /> + <el-form-item prop="safeLiabilityUser"> + <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.safeLiabilityUser" /> + </el-form-item> </td> <td class="w-25 m-color required">电话</td> <td class="w-25 m-color"> + <el-form-item prop="safeLiabilityUserPhone"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.safeLiabilityUserPhone" /> + </el-form-item> </td> </tr> <select-room ref="selectRoomRef" v-model:disabled="projectDialogState.disabled" v-model:data="projectDialogState.projectForm.siteList"></select-room> @@ -75,75 +86,99 @@ <tr> <td class="w-25 m-color required">实验步骤</td> <td class="w-75 m-color"> + <el-form-item prop="experimentStep"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.experimentStep" placeholder="请输入实验步骤" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">操作方法</td> <td class="w-75 m-color"> + <el-form-item prop="experimentMethod"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.experimentMethod" placeholder="请输入操作方法" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">工艺过程</td> <td class="w-75 m-color"> + <el-form-item prop="process"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.process" placeholder="请输入工艺过程" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">特殊/关键过程</td> <td class="w-75 m-color"> + <el-form-item prop="keyProcess"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.keyProcess" placeholder="请输入特殊/关键过程" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">预防措施</td> <td class="w-75 m-color"> + <el-form-item prop="measure"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.measure" placeholder="请输入预防措施" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">是否存在过夜、老化实验</td> <td class="w-25 m-color"> + <el-form-item prop="timeout"> <el-radio-group :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.timeout"> <el-radio :label="1">存在</el-radio> <el-radio :label="2">不存在</el-radio> </el-radio-group> + </el-form-item> </td> <td class="w-25 m-color required">过夜、老化保障措施</td> <td class="w-25 m-color"> + <el-form-item prop="timeoutManager"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.timeoutManager" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">是否在封闭条件下</td> <td class="w-25 m-color"> + <el-form-item prop="closed"> <el-radio-group :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.closed"> <el-radio :label="1">存在</el-radio> <el-radio :label="2">不存在</el-radio> </el-radio-group> + </el-form-item> </td> <td class="w-25 m-color required">封闭条件保障措施</td> <td class="w-25 m-color"> + <el-form-item prop="unclosedManager"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.unclosedManager" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">实验场所防爆措施条件和设施情况</td> <td class="w-75 m-color"> + <el-form-item prop="explosionProof"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.explosionProof" placeholder="请输入" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">实验场所防火措施条件和设施情况</td> <td class="w-75 m-color"> + <el-form-item prop="fireProof"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.fireProof" placeholder="请输入" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color required">实验场所防中毒措施条件和设施情况</td> <td class="w-75 m-color"> + <el-form-item prop="poisonProof"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.poisonProof" placeholder="请输入" /> + </el-form-item> </td> </tr> @@ -168,7 +203,9 @@ <tr> <td class="w-25 m-color required">安全管理制度</td> <td class="w-75 m-color"> + <el-form-item prop="safeManagerMethod"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.safeManagerMethod" placeholder="请输入" /> + </el-form-item> </td> </tr> <tr class="m-color b-font" style="text-align: center">应急预案/应急演练</tr> @@ -180,29 +217,41 @@ </tr> <tr> <td class="w-25 m-color"> + <el-form-item prop="emergencyPlan"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.emergencyPlan" /> + </el-form-item> </td> <td class="w-25 m-color"> + <el-form-item prop="emergencyPlanName"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.emergencyPlanName" /> + </el-form-item> </td> <td class="w-25 m-color"> + <el-form-item prop="emergencyDrillStatus"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.emergencyDrillStatus" /> + </el-form-item> </td> <td class="w-25 m-color"> + <el-form-item prop="emergencyDrill"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.emergencyDrill" /> + </el-form-item> </td> </tr> <tr class="m-color b-font" style=" text-align: center">其他信息</tr> <tr> <td class="w-25 m-color required">实验场所是否需要分区隔断</td> <td class="w-75 m-color"> + <el-form-item prop="partitionCondition"> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.partitionCondition" placeholder="请输入" /> + </el-form-item> </td> </tr> <tr> <td class="w-25 m-color">其它基础信息(详细描述)</td> <td class="w-75 m-color"> + <el-form-item> <el-input :disabled="projectDialogState.disabled" v-model="projectDialogState.projectForm.note" placeholder="请输入" /> + </el-form-item> </td> </tr> </table> @@ -223,14 +272,15 @@ import {projectApi} from "/@/api/experiment/project"; import {personApi} from "/@/api/basic/person"; import {userApi} from "/@/api/systemManage/user"; -import SelectRoom from "/@/views/experiment/project/components/selectRoom.vue"; import {useUserInfo} from "/@/stores/userInfo"; import {storeToRefs} from "pinia"; +import {checkChineseName, verifyPhone} from "/@/utils/toolsValidate"; const SelectEquipment = defineAsyncComponent(() => import('./selectEquipment.vue')) const SelectMaterial = defineAsyncComponent(() => import('./selectMaterial.vue')) const SelectDanger = defineAsyncComponent(() => import('./selectDanger.vue')) const SelectPerson = defineAsyncComponent(() => import('./selectPerson.vue')) +const SelectRoom = defineAsyncComponent(() => import('./selectRoom.vue')) const ProjectFormRef = ref() const selectPersonRef = ref() const selectEquipmentRef = ref() @@ -286,7 +336,33 @@ ] }, projectFormRules: { - + experimentName: [{ required: true, message: '', trigger: 'blur' }], + experimentType: [{ required: true, message: '', trigger: 'blur' }], + liabilityUserId: [{ required: true, message: '', trigger: 'blur' }], + liabilityUserPhone: [{ required: true, message: '', trigger: 'blur' }], + safeLiabilityUser: [{ required: true, message: '', trigger: 'blur' }], + safeLiabilityUserPhone: [{ required: true, message: '', trigger: 'blur' }], + dep: [{ required: true, message: '', trigger: 'blur' }], + experimentStep: [{ required: true, message: '', trigger: 'blur' }], + experimentMethod: [{ required: true, message: '', trigger: 'blur' }], + process: [{ required: true, message: '', trigger: 'blur' }], + keyProcess: [{ required: true, message: '', trigger: 'blur' }], + measure: [{ required: true, message: '', trigger: 'blur' }], + timeout: [{ required: true, message: '', trigger: 'blur' }], + timeoutManager: [{ required: true, message: '', trigger: 'blur' }], + closed: [{ required: true, message: '', trigger: 'blur' }], + unclosedManager: [{ required: true, message: '', trigger: 'blur' }], + explosionProof: [{ required: true, message: '', trigger: 'blur' }], + fireProof: [{ required: true, message: '', trigger: 'blur' }], + poisonProof: [{ required: true, message: '', trigger: 'blur' }], + hazardousWaste: [{ required: true, message: '', trigger: 'blur' }], + safeManagerMethod: [{ required: true, message: '', trigger: 'blur' }], + emergencyPlan: [{ required: true, message: '', trigger: 'blur' }], + emergencyDrill: [{ required: true, message: '', trigger: 'blur' }], + emergencyPlanName: [{ required: true, message: '', trigger: 'blur' }], + emergencyDrillStatus: [{ required: true, message: '', trigger: 'blur' }], + partitionCondition: [{ required: true, message: '', trigger: 'blur' }], + createExperimentTime: [{ required: true, message: '', trigger: 'blur' }] }, allPersonList: [], allRoomList: [], @@ -342,15 +418,11 @@ partitionCondition: "", note: "", createExperimentTime: '', - persons: [ - ], + persons: [], siteList: [], - deviceList: [ - ], - stuffList: [ - ], - hazardousWasteList: [ - ] + deviceList: [], + stuffList: [], + hazardousWasteList: [] }; }else if(title === '整改'){ projectDialogState.title = '整改'; @@ -379,12 +451,69 @@ ProjectFormRef.value.validate(async(valid: boolean) => { if(valid){ if(projectDialogState.title === '新增'){ + if(checkChineseName(projectDialogState.projectForm.safeLiabilityUser) == false){ + ElMessage({ + type: 'warning', + message: '安全负责人姓名格式有误', + duration: 1000 + }); + return + } + if(verifyPhone(projectDialogState.projectForm.safeLiabilityUserPhone) == false || verifyPhone(projectDialogState.projectForm.liabilityUserPhone) == false){ + ElMessage({ + type: 'warning', + message: '请输入正确的手机号', + duration: 1000 + }); + return + } + if(projectDialogState.projectForm.siteList.length === 0){ + ElMessage({ + type: 'warning', + message: '请至少添加一处实验场所', + duration: 1000 + }); + return + } + if(projectDialogState.projectForm.stuffList.length === 0){ + ElMessage({ + type: 'warning', + message: '请至少选择一种试剂/材料', + duration: 1000 + }); + return + } + if(projectDialogState.projectForm.deviceList.length === 0){ + ElMessage({ + type: 'warning', + message: '请至少选择一种仪器/设备', + duration: 1000 + }); + return + } + if(projectDialogState.projectForm.hazardousWasteList.length === 0){ + ElMessage({ + type: 'warning', + message: '请选择添加危废数据', + duration: 1000 + }); + return + } + if(projectDialogState.projectForm.persons.length === 0){ + ElMessage({ + type: 'warning', + message: '请至少添加一名实验人员', + duration: 1000 + }); + return + } projectDialogState.projectForm.persons = selectPersonRef.value.dataList projectDialogState.projectForm.hazardousWasteList = selectDangerRef.value.dataList - projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(({siteId}) => ({siteId})) + // projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(({siteId}) => ({siteId})) + projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(obj => ({siteId:obj.siteId})) projectDialogState.projectForm.stuffList = selectMaterialRef.value.dataList projectDialogState.projectForm.deviceList = selectEquipmentRef.value.dataList - let res = await projectApi().addProject(projectDialogState.projectForm); + let res = await projectApi().addProject(projectDialogState.projectForm) if(res.data.code === 100){ emit('refresh') projectDialogState.projectDialogVisible = false; @@ -392,6 +521,7 @@ type: 'success', message: '新增成功' }) + }else{ ElMessage({ type: 'warning', @@ -399,7 +529,9 @@ }); } }else{ - projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(({siteId}) => ({siteId})) + console.log(selectRoomRef.value.dataList,'selectRoomRef.value.dataList',selectMaterialRef.value.dataList) + // projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(({siteId}) => ({siteId})) + projectDialogState.projectForm.siteList = selectRoomRef.value.dataList.map(obj => ({siteId:obj.siteId})) projectDialogState.projectForm.hazardousWasteList = selectDangerRef.value.dataList.map(obj => ({classify:obj.classify,wasteStorage:obj.wasteStorage,handAmount:obj.handAmount})) let res = await projectApi().modProject(projectDialogState.projectForm) if(res.data.code === 100){ @@ -463,7 +595,6 @@ onMounted(() => { getAllPersonList(); getPersonList(); - console.log(userInfos.value,typeof userInfos.value.uid,'u') }); </script> @@ -569,7 +700,15 @@ .m-color { color: #0c4995; } - +::v-deep(.el-form-item){ + height: 100%; + display: flex; + justify-content: center; + .el-form-item__content{ + display: flex; + justify-content: center; + } +} .roomSelect{ ::v-deep(.el-popper){ .el-select-dropdown__item{ diff --git a/src/views/experiment/project/components/selectMaterial.vue b/src/views/experiment/project/components/selectMaterial.vue index 6834a01..8017fb3 100644 --- a/src/views/experiment/project/components/selectMaterial.vue +++ b/src/views/experiment/project/components/selectMaterial.vue @@ -89,7 +89,6 @@ }; watchEffect(() => { - console.log(selectMaterialState.materialList,'selectMaterialState.materialList') selectMaterialState.materialList = props.data as Array<AllMaterialListType> selectMaterialState.disabled = props.disabled }); diff --git a/src/views/experiment/project/components/selectRoom.vue b/src/views/experiment/project/components/selectRoom.vue index 918828e..70b693b 100644 --- a/src/views/experiment/project/components/selectRoom.vue +++ b/src/views/experiment/project/components/selectRoom.vue @@ -11,7 +11,7 @@ </tr> <tr v-for="(item,index) in selectRoomState.roomList" :key="index"> <td class="w-14"> - <el-select :disabled="selectRoomState.disabled" filterable v-model="item.siteId" @change="giveOtherMaterialValue($event, index)" @focus="checkAllRoom($event, index)"> + <el-select :disabled="selectRoomState.disabled" filterable v-model="item.siteId" @change="giveOtherRoomValue($event, index)" @focus="checkAllRoom($event, index)"> <el-option v-for="item in selectRoomState.allRoomList" :key="item.id" @@ -135,8 +135,8 @@ } }; -const giveOtherMaterialValue = (value: number, index:number) => { - const data = selectRoomState.allRoomList.find(item => item.id === value) as roomListType +const giveOtherRoomValue = (value: number, index:number) => { + const data = selectRoomState.allRoomList.find(item => item.id === value) as allRoomListType selectRoomState.roomList[index] = { siteId: data.id, siteName: data.siteName, @@ -149,6 +149,7 @@ }; const formatList = (formatList: Array<roomListType>) => { + console.log(formatList,'formatList') selectRoomState.roomList = formatList }; diff --git a/src/views/experiment/project/index.ts b/src/views/experiment/project/index.ts index 188cb14..eacbe83 100644 --- a/src/views/experiment/project/index.ts +++ b/src/views/experiment/project/index.ts @@ -155,7 +155,7 @@ declare interface SelectRoomType { disabled: boolean roomList: Array<roomListType>, - allRoomList: Array<roomListType>, + allRoomList: Array<allRoomListType>, specialDeviceList: Array<stuffType> memberList: Array<any> typeList: Array<any> @@ -164,13 +164,23 @@ } declare interface roomListType { - siteId?: null | number, - siteName?: string, - floor?: string, - room?: string, - fireFacilities?: null | number, - partitionStatus?: null | number, - siteType?: string, + siteId: null | number, + siteName: string, + floor: string, + room: string, + fireFacilities: null | number, + partitionStatus: null | number, + siteType: string, +} + +declare interface allRoomListType { + id: null | number, + siteName: string, + floor: string, + room: string, + fireFacilities: null | number, + partitionStatus: null | number, + siteType: string, } declare interface stuffType { -- Gitblit v1.9.2