<template>
|
<div class="system-menu-dialog-container">
|
<el-dialog :title="roomDialogState.title" v-model="roomDialogState.roomDialogVisible" :close-on-click-modal="false" width="600px">
|
<el-form ref="roomFormRef" :rules="roomDialogState.roomFormRules" :model="roomDialogState.roomForm" 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="siteName">
|
<el-input v-model="roomDialogState.roomForm.siteName" 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="floor">
|
<el-input v-model="roomDialogState.roomForm.floor" 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="room">
|
<el-input v-model="roomDialogState.roomForm.room" 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="siteLiabilityPersonId">
|
<el-select v-model="roomDialogState.roomForm.siteLiabilityPersonId" placeholder="场所责任人" clearable class="input-length">
|
<el-option v-for="item in memberList" :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="safeLiabilityPersonId">
|
<el-select v-model="roomDialogState.roomForm.safeLiabilityPersonId" placeholder="场所安全员" clearable class="input-length">
|
<el-option v-for="item in memberList" :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="fireFacilities">
|
<el-select v-model="roomDialogState.roomForm.fireFacilities" placeholder="有无消防设施" clearable class="input-length">
|
<el-option :key="1" label="有" :value="1"></el-option>
|
<el-option :key="2" label="无" :value="2"></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="partitionStatus">
|
<el-select v-model="roomDialogState.roomForm.partitionStatus" placeholder="有无隔断" clearable class="input-length">
|
<el-option :key="1" label="有" :value="1"></el-option>
|
<el-option :key="2" label="无" :value="2"></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="siteTypeId">
|
<el-select v-model="roomDialogState.roomForm.siteTypeId" placeholder="场所性质" clearable class="input-length">
|
<el-option v-for="item in typeList" :key="item.id" :label="item.siteType" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="roomDialogState.roomDialogVisible = !roomDialogState.roomDialogVisible" size="default">取 消</el-button>
|
<el-button type="primary" @click="onSubmitRoom" size="default">确定</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { reactive, ref, defineProps} from "vue";
|
import {ElMessage} from "element-plus";
|
import {roomApi} from "/@/api/basic/room";
|
|
const roomFormRef = ref()
|
|
const roomDialogState = reactive<RoomDialogType>({
|
title: '',
|
roomDialogVisible: false,
|
roomForm: {
|
siteName: '',
|
floor: '',
|
room: '',
|
siteLiabilityPersonId: null,
|
safeLiabilityPersonId: null,
|
fireFacilities: null,
|
partitionStatus: null,
|
siteTypeId: null
|
},
|
roomFormRules: {
|
siteName: [{ required: true, message: '请填写实验室名称', trigger: 'blur' }],
|
floor: [{ required: true, message: '请填写楼名称', trigger: 'blur' }],
|
room: [{ required: true, message: '请填写房间', trigger: 'blur' }],
|
siteLiabilityPersonId: [{ required: true, message: '请选择场所责任人', trigger: 'blur' }],
|
safeLiabilityPersonId: [{ required: true, message: '请选择场所安全员', trigger: 'blur' }],
|
fireFacilities: [{ required: true, message: '请选择有无消防设施', trigger: 'blur' }],
|
partitionStatus: [{ required: true, message: '请选择有无隔断', trigger: 'blur' }],
|
siteTypeId: [{ required: true, message: '请选择场所性质', trigger: 'blur' }]
|
},
|
specialDeviceList: [],
|
deviceUnitList: [
|
{id:1, name: '台'},
|
{id:2, name: '个'},
|
{id:3, name: '件'}
|
]
|
})
|
|
const showroomDialog = (title: string, value: RoomType, specialDeviceList: Type []) => {
|
|
roomDialogState.roomDialogVisible = true;
|
roomDialogState.specialDeviceList = specialDeviceList;
|
setTimeout(() => {
|
roomFormRef.value.clearValidate();
|
});
|
if(title === '新增'){
|
roomDialogState.title = '新增';
|
roomDialogState.roomForm = {
|
siteName: '',
|
floor: '',
|
room: '',
|
siteLiabilityPersonId: null,
|
safeLiabilityPersonId: null,
|
fireFacilities: null,
|
partitionStatus: null,
|
siteTypeId: null
|
};
|
}else{
|
roomDialogState.title = '编辑'
|
roomDialogState.roomForm = {
|
id: value.id,
|
siteName: value.siteName,
|
floor: value.floor,
|
room: value.room,
|
siteLiabilityPersonId: value.siteLiabilityPersonId,
|
safeLiabilityPersonId: value.safeLiabilityPersonId,
|
fireFacilities: value.fireFacilities,
|
partitionStatus: value.partitionStatus,
|
siteTypeId: value.siteTypeId
|
};
|
}
|
};
|
|
const onSubmitRoom = () => {
|
roomFormRef.value.validate(async(valid: boolean) => {
|
if(valid){
|
if(roomDialogState.title === '新增'){
|
let res = await roomApi().addRoom(roomDialogState.roomForm);
|
if(res.data.code === 100){
|
emit('refresh')
|
roomDialogState.roomDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '新增成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}else{
|
let res = await roomApi().modRoom(roomDialogState.roomForm)
|
if(res.data.code === 100){
|
emit('refresh')
|
roomDialogState.roomDialogVisible = false;
|
ElMessage({
|
type: 'success',
|
message: '编辑成功'
|
})
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg,
|
});
|
}
|
}
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: '请完善基本信息',
|
});
|
}
|
})
|
}
|
|
const emit = defineEmits(['refresh'])
|
|
defineProps({
|
memberList: Array,
|
typeList: Array
|
})
|
|
defineExpose({
|
showroomDialog
|
})
|
</script>
|
|
<style scoped>
|
|
</style>
|
