<template>
|
<div class="system-menu-dialog-container">
|
<el-dialog :title="planDialogState.title" v-model="planDialogState.planDialogVisible" width="600px">
|
<el-form ref="planFormRef" :rules="planDialogState.planFormRules" :model="planDialogState.planForm" 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="riskUnitId">
|
<el-select :disabled="planDialogState.disabled" v-model="planDialogState.planForm.riskUnitId" style="width:100%" placeholder="风险分析单元" clearable>
|
<el-option v-for="item in planDialogState.riskUnitList" :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="评估计划名称" prop="assessPlanName">
|
<el-input :disabled="planDialogState.disabled" v-model="planDialogState.planForm.assessPlanName" 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="assessTime">
|
<el-date-picker
|
:disabled="planDialogState.disabled"
|
type="datetimerange"
|
v-model="planDialogState.planForm.assessTime"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
format="YYYY-MM-DD HH:mm:ss"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
popper-class="pickTime"
|
@change="formatTime">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
|
<el-form-item label="计划制定人" prop="planUserId">
|
<el-select :disabled="planDialogState.disabled" v-model="planDialogState.planForm.planUserId" style="width:100%" placeholder="计划制定人" clearable>
|
<el-option v-for="item in planDialogState.personList" :key="item.id" :label="item.realName" :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 valueSelect">
|
<el-form-item label="辨识专家" prop="identificationUserId">
|
<el-select :disabled="planDialogState.disabled" v-model="planDialogState.planForm.identificationUserId" style="width:100%" :teleported="false" placeholder="辨识专家" clearable>
|
<el-option v-for="item in planDialogState.bsExperts" :key="item.id" :label="item.realName" :value="item.id">
|
<div class="valueTable">
|
<div><div>姓名：</div><span>{{item.realName}}</span></div>
|
<div><div>专业：</div><span>{{item.userIdentities?.map(i=>i.userIdentity).join(',')}}</span></div>
|
</div>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20 valueSelect">
|
<el-form-item label="评价专家" prop="evaluateUserId">
|
<el-select :disabled="planDialogState.disabled" v-model="planDialogState.planForm.evaluateUserId" style="width:100%" :teleported="false" placeholder="评价专家" clearable>
|
<el-option v-for="item in planDialogState.pjExperts" :key="item.id" :label="item.realName" :value="item.id">
|
<div class="valueTable">
|
<div><div>姓名：</div><span>{{item.realName}}</span></div>
|
<div><div>专业：</div><span>{{item.userIdentities?.map(i=>i.userIdentity).join(',')}}</span></div>
|
</div>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="planDialogState.planDialogVisible = !planDialogState.planDialogVisible" size="default">取 消</el-button>
|
<el-button v-if="!planDialogState.disabled" type="primary" @click="onSubmitPlan" size="default">确定</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { reactive, ref, getCurrentInstance } from "vue";
|
import {ElMessage} from "element-plus";
|
import {planApi} from "/@/api/analyse/plan";
|
import {isValidKey} from "/@/utils/methods";
|
|
const planFormRef = ref()
|
|
const planDialogState = reactive<PlanDialogType>({
|
title: '',
|
disabled: false,
|
planDialogVisible: false,
|
planForm: {
|
riskUnitId: null,
|
planUserId: null,
|
assessPlanName: '',
|
assessTime: [],
|
assessStartTime: '',
|
assessEndTime: '',
|
identificationUserId: null,
|
evaluateUserId: null,
|
riskType: 2
|
},
|
planFormRules: {
|
riskUnitId: [{ required: true, message: '请选择风险分析单元', trigger: 'change' }],
|
assessPlanName: [{ required: true, message: '请填写评估计划名称', trigger: 'blur' }],
|
assessTime: [{ required: true, message: '请选择评估时间', trigger: 'blur' }],
|
planUserId: [{ required: true, message: '请选择计划制定人', trigger: 'change' }],
|
identificationUserId: [{ required: true, message: '请选择辨识专家', trigger: 'change' }],
|
evaluateUserId: [{ required: true, message: '请选择评价专家', trigger: 'change' }],
|
},
|
riskUnitList: [],
|
personList: [],
|
bsExperts: [],
|
pjExperts: []
|
})
|
|
const showPlanDialog = (title: string, value: PlanType, riskUnitList: RiskUnitType [], personList: SystemPersonType [],bsExperts:[],pjExperts:[]) => {
|
planDialogState.planDialogVisible = true;
|
planDialogState.riskUnitList = riskUnitList;
|
planDialogState.personList = personList;
|
planDialogState.bsExperts = bsExperts;
|
planDialogState.pjExperts = pjExperts;
|
planDialogState.disabled = false
|
setTimeout(() => {
|
planFormRef.value.clearValidate();
|
});
|
if(title === '新增'){
|
planDialogState.title = '新增';
|
planDialogState.planForm = {
|
riskUnitId: null,
|
planUserId: null,
|
assessPlanName: '',
|
assessTime: [],
|
assessStartTime: '',
|
assessEndTime: '',
|
identificationUserId: null,
|
evaluateUserId: null,
|
riskType: 2
|
};
|
}else if(title === '查看'){
|
planDialogState.title = '查看';
|
planDialogState.disabled = true
|
for(let i in planDialogState.planForm){
|
if(isValidKey(i, planDialogState.planForm)){
|
planDialogState.planForm[i] = value[i]
|
}
|
}
|
planDialogState.planForm.assessTime=[value.assessStartTime, value.assessEndTime]
|
console.log(value,planDialogState.planForm.assessTime,'time')
|
}else{
|
planDialogState.title = '编辑';
|
planDialogState.planForm.id = value.id
|
for(let i in planDialogState.planForm){
|
if(isValidKey(i, planDialogState.planForm)){
|
planDialogState.planForm[i] = value[i]
|
}
|
}
|
planDialogState.planForm.assessTime=[value.assessStartTime, value.assessEndTime]
|
}
|
};
|
|
const formatTime = () => {
|
planDialogState.planForm.assessStartTime = planDialogState.planForm.assessTime == [] ? '' : planDialogState.planForm.assessTime[0]
|
planDialogState.planForm.assessEndTime = planDialogState.planForm.assessTime == [] ? '' : planDialogState.planForm.assessTime[1]
|
};
|
|
const onSubmitPlan = () => {
|
planFormRef.value.validate(async(valid: boolean) => {
|
if(valid){
|
formatTime()
|
delete planDialogState.planForm.assessTime
|
if(planDialogState.title === '新增'){
|
let res = await planApi().addPlan(planDialogState.planForm);
|
if(res.data.code === 100){
|
emit('refresh')
|
planDialogState.planDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '新增成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}else{
|
let res = await planApi().modPlan(planDialogState.planForm)
|
if(res.data.code === 100){
|
emit('refresh')
|
planDialogState.planDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '编辑成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: '请完善基本信息',
|
});
|
}
|
})
|
}
|
|
const emit = defineEmits(['refresh'])
|
|
defineExpose({
|
showPlanDialog
|
})
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep(.pickTime){
|
position: absolute !important;
|
top: 0 !important;
|
}
|
.valueSelect{
|
::v-deep(.el-popper){
|
.el-select-dropdown__item{
|
width: 100%;
|
height: auto;
|
white-space: normal;
|
word-break: break-all;
|
word-wrap: break-word;
|
overflow: auto;
|
padding: 10px 25px;
|
border-bottom: 1px solid #ccc;
|
|
.valueTable{
|
&>div{
|
line-height: 1.5;
|
margin-bottom: 6px;
|
display: flex;
|
align-items: center;
|
|
div{
|
color: #999;
|
}
|
|
span{
|
font-weight: bolder;
|
}
|
|
&:last-of-type{
|
margin-bottom: 0;
|
}
|
}
|
}
|
}
|
}
|
}
|
</style>
|
