<template>
|
<div class="system-menu-dialog-container">
|
<el-dialog :title="identifyDialogState.title" v-model="identifyDialogState.identifyDialogVisible" width="600px">
|
<el-form ref="identifyFormRef" :rules="identifyDialogState.identifyFormRules" :model="identifyDialogState.identifyForm" size="default" label-width="140px">
|
<el-row :gutter="35">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="技术措施" prop="technologyMeasure">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.technologyMeasure" placeholder="技术措施" clearable></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="manageMeasure">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.manageMeasure" placeholder="管理措施" clearable></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="educationMeasure">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.educationMeasure" placeholder="教育措施" clearable></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="personalProtectionMeasure">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.personalProtectionMeasure" placeholder="防护措施" clearable></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="emergencyMeasure">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.emergencyMeasure" placeholder="应急措施" clearable></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="identificationMethod">
|
<el-select class="input-length" :disabled="true" v-model="identifyDialogState.identifyForm.identificationMethod" style="width:100%" placeholder="辨识方法" clearable>
|
<el-option v-for="item in identifyDialogState.identificationMethodList" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<div style="width: 100%" v-if="identifyDialogState.identifyForm.identificationMethod === 5">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="检查项目" prop="analogyCheckItem">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.analogyCheckItem" placeholder="检查项目" clearable></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="analogyRiskFactor">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.analogyRiskFactor" placeholder="存在风险因素" clearable></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="analogyResult">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.analogyResult" placeholder="可能产生的后果" clearable></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="analogyReference">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.analogyReference" placeholder="类比参照" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</div>
|
|
<div style="width: 100%" v-if="identifyDialogState.identifyForm.identificationMethod === 4">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="节点" prop="hazopNode">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopNode" placeholder="节点" clearable></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="hazopParam">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopParam" placeholder="参数" clearable></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="hazopParamDesc">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopParamDesc" placeholder="参数描述" clearable></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="hazopGuide">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopGuide" placeholder="引导词" clearable></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="hazopDeviation">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopDeviation" placeholder="偏差" clearable></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="hazopPossibleCauses">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopPossibleCauses" placeholder="可能原因" clearable></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="hazopResult">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.hazopResult" placeholder="主要后果" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</div>
|
|
<div style="width: 100%" v-if="identifyDialogState.identifyForm.identificationMethod === 2">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="作业步骤" prop="jhaCheckItem">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.jhaCheckItem" placeholder="作业步骤" clearable></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="jhaRiskFactor">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.jhaRiskFactor" placeholder="危险源或潜在事件" clearable></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="jhaResult">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.jhaResult" placeholder="可能发生的事故" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</div>
|
|
<div style="width: 100%" v-if="identifyDialogState.identifyForm.identificationMethod === 1">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="检查项目" prop="phaCheckItem">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.phaCheckItem" placeholder="检查项目" clearable></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="phaRiskFactor">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.phaRiskFactor" placeholder="存在风险因素" clearable></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="phaResult">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.phaResult" placeholder="可能产生的后果" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</div>
|
|
<div style="width: 100%" v-if="identifyDialogState.identifyForm.identificationMethod === 3">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="检查项目" prop="sclCheckItem">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.sclCheckItem" placeholder="检查项目" clearable></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="sclCheckStandard">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.sclCheckStandard" placeholder="检查标准" clearable></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="sclCheckUnstandard">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.sclCheckUnstandard" placeholder="不符合标准情况" clearable></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="sclCheckResult">
|
<el-input class="input-length" :disabled="identifyDialogState.disabled" v-model="identifyDialogState.identifyForm.sclCheckResult" placeholder="主要后果" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
</div>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="identifyDialogState.identifyDialogVisible = !identifyDialogState.identifyDialogVisible" size="default">取 消</el-button>
|
<el-button v-if="!identifyDialogState.disabled" type="primary" @click="onSubmitIdentify" size="default">确定</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { reactive, ref } from "vue";
|
import {ElMessage} from "element-plus";
|
import {identifyApi} from "/@/api/analyse/identify";
|
import {isValidKey} from "/@/utils/methods";
|
|
const identifyFormRef = ref()
|
|
const identifyDialogState = reactive<IdentifyDialogType>({
|
title: '',
|
time:[],
|
disabled: false,
|
identifyDialogVisible: false,
|
identifyForm: {
|
id: null,
|
technologyMeasure: '',
|
manageMeasure: '',
|
educationMeasure: '',
|
personalProtectionMeasure: '',
|
emergencyMeasure: '',
|
identificationMethod: null,
|
analogyCheckItem: '',
|
analogyRiskFactor: '',
|
analogyResult: '',
|
analogyReference: '',
|
hazopNode: '',
|
hazopParam: '',
|
hazopParamDesc: '',
|
hazopGuide: '',
|
hazopDeviation: '',
|
hazopPossibleCauses: '',
|
hazopResult: '',
|
jhaCheckItem: '',
|
jhaRiskFactor: '',
|
jhaResult: '',
|
phaCheckItem: '',
|
phaRiskFactor: '',
|
phaResult: '',
|
sclCheckItem: '',
|
sclCheckStandard: '',
|
sclCheckUnstandard: '',
|
sclCheckResult: '',
|
hazopId: null,
|
jhaId: null,
|
phaId: null,
|
sclId: null,
|
analogyId: null,
|
},
|
identifyFormRules: {
|
deviceCode: [{ required: true, message: '请填写设备编号', trigger: 'blur' }],
|
deviceName: [{ required: true, message: '请填写设备名称', trigger: 'blur' }],
|
devicePower: [{ required: true, message: '请填写设备功率', trigger: 'blur' }],
|
riskUnitId: [{ required: true, message: '请选择风险分析单元', trigger: 'change' }],
|
identifyUserId: [{ required: true, message: '请选择计划制定人', trigger: 'change' }],
|
identificationMethod: [{ required: true, message: '请选择辨识方法', trigger: 'change' }],
|
identificationUserId: [{ required: true, message: '请选择负责人', trigger: 'change' }],
|
evaluateMethod: [{ required: true, message: '请选择推荐评价方法', trigger: 'change' }],
|
evaluateUserId: [{ required: true, message: '请选择评价专家', trigger: 'change' }],
|
},
|
planList: [],
|
personList: [],
|
identificationMethodList: [
|
{id:1, name: 'PHA'},
|
{id:2, name: 'JHA'},
|
{id:3, name: 'SCL'},
|
{id:4, name: 'HAZOP'},
|
{id:5, name: '类比法'},
|
],
|
evaluateMethodList: [
|
{id:1, name: 'LEC'},
|
{id:2, name: 'LS'},
|
{id:3, name: 'MES'},
|
{id:4, name: 'RS'},
|
]
|
})
|
|
const showIdentifyDialog = (title: string, value: IdentifyType, identifyQueryForm: IdentifyType) => {
|
identifyDialogState.identifyDialogVisible = true;
|
identifyDialogState.disabled = false
|
setTimeout(() => {
|
identifyFormRef.value.clearValidate();
|
});
|
if(title === '新增'){
|
identifyDialogState.title = '新增';
|
identifyDialogState.identifyForm = {
|
id: null,
|
technologyMeasure: '',
|
manageMeasure: '',
|
educationMeasure: '',
|
personalProtectionMeasure: '',
|
emergencyMeasure: '',
|
identificationMethod: null,
|
analogyCheckItem: '',
|
analogyRiskFactor: '',
|
analogyResult: '',
|
analogyReference: '',
|
hazopNode: '',
|
hazopParam: '',
|
hazopParamDesc: '',
|
hazopGuide: '',
|
hazopDeviation: '',
|
hazopPossibleCauses: '',
|
hazopResult: '',
|
jhaCheckItem: '',
|
jhaRiskFactor: '',
|
jhaResult: '',
|
phaCheckItem: '',
|
phaRiskFactor: '',
|
phaResult: '',
|
sclCheckItem: '',
|
sclCheckStandard: '',
|
sclCheckUnstandard: '',
|
sclCheckResult: '',
|
hazopId: null,
|
jhaId: null,
|
phaId: null,
|
sclId: null,
|
analogyId: null,
|
};
|
}else if(title === '查看'){
|
identifyDialogState.title = '查看';
|
identifyDialogState.disabled = true
|
for(let i in identifyDialogState.identifyForm){
|
if(isValidKey(i, identifyDialogState.identifyForm)){
|
identifyDialogState.identifyForm[i] = identifyQueryForm[i];
|
}
|
}
|
}else{
|
identifyDialogState.title = '编辑';
|
identifyDialogState.identifyForm.hazopId = identifyQueryForm.hazopId;
|
identifyDialogState.identifyForm.jhaId = identifyQueryForm.jhaId;
|
identifyDialogState.identifyForm.phaId = identifyQueryForm.phaId;
|
identifyDialogState.identifyForm.sclId = identifyQueryForm.sclId;
|
identifyDialogState.identifyForm.analogyId = identifyQueryForm.analogyId;
|
for(let i in identifyDialogState.identifyForm){
|
if(isValidKey(i, identifyDialogState.identifyForm)){
|
identifyDialogState.identifyForm[i] = identifyQueryForm[i];
|
}
|
}
|
}
|
identifyDialogState.identifyForm.id = value.id;
|
identifyDialogState.identifyForm.identificationMethod = value.identificationMethod;
|
};
|
|
const onSubmitIdentify = () => {
|
identifyFormRef.value.validate(async(valid: boolean) => {
|
if(valid){
|
if(identifyDialogState.title === '新增'){
|
let { hazopId, jhaId, phaId, sclId, analogyId, ...data } = identifyDialogState.identifyForm
|
let res = await identifyApi().addIdentify(data);
|
if(res.data.code === 100){
|
emit('refresh',1,res.data.data)
|
identifyDialogState.identifyDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '新增成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}else{
|
let res = await identifyApi().modIdentify(identifyDialogState.identifyForm)
|
if(res.data.code === 100){
|
emit('refresh',2,identifyDialogState.identifyForm)
|
identifyDialogState.identifyDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '编辑成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: '请完善基本信息',
|
});
|
}
|
})
|
}
|
|
const emit = defineEmits(['refresh'])
|
|
defineExpose({
|
showIdentifyDialog
|
})
|
</script>
|
|
<style scoped>
|
|
</style>
|