医院管理
This commit is contained in:
@@ -0,0 +1,294 @@
|
||||
<template>
|
||||
<!-- Modal -->
|
||||
<a-modal
|
||||
v-model:visible="modalVisible"
|
||||
fullscreen
|
||||
:title="title"
|
||||
title-align="start"
|
||||
:footer="false"
|
||||
@cancel="handleClose"
|
||||
>
|
||||
<div class="titlebox">
|
||||
<div class="bar"></div>
|
||||
<div class="name">基本信息</div>
|
||||
</div>
|
||||
<a-form :model="modalForm" ref="modalFormRef" :auto-label-width="true" :rules="rules">
|
||||
<a-row :gutter="24" style="margin-top: 35px">
|
||||
<a-col :span="12">
|
||||
<a-form-item field="hospital_name" label="医院名称:">
|
||||
<a-input
|
||||
v-model="modalForm.hospital_name"
|
||||
placeholder="请输入医院名称"
|
||||
:style="{ width: '250px' }"
|
||||
></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item field="county_id" label="选择省市区:">
|
||||
<div class="row">
|
||||
<a-select
|
||||
v-model="modalForm.province_id"
|
||||
placeholder="请选择省份"
|
||||
:style="{ width: '162px',marginRight:'10px' }"
|
||||
@change="changeProvice"
|
||||
>
|
||||
<a-option
|
||||
v-for="item in provinceData"
|
||||
:key="item.area_id"
|
||||
:value="Number(item.area_id)"
|
||||
:label="item.area_name"
|
||||
>{{ item.area_name }}</a-option
|
||||
>
|
||||
</a-select>
|
||||
|
||||
|
||||
<a-select
|
||||
v-model="modalForm.city_id"
|
||||
placeholder="请选择城市"
|
||||
:style="{ width: '162px',marginRight:'10px' }"
|
||||
@change="changeCity"
|
||||
>
|
||||
<a-option
|
||||
v-for="item in cityData"
|
||||
:key="item.area_id"
|
||||
:value="Number(item.area_id)"
|
||||
:label="item.area_name"
|
||||
>{{ item.area_name }}</a-option
|
||||
>
|
||||
</a-select>
|
||||
<a-select
|
||||
v-model="modalForm.county_id"
|
||||
placeholder="请选择区县"
|
||||
:style="{ width: '182px' }"
|
||||
>
|
||||
<a-option
|
||||
v-for="item in countryData"
|
||||
:key="item.area_id"
|
||||
:value="Number(item.area_id)"
|
||||
:label="item.area_name"
|
||||
>{{ item.area_name }}</a-option
|
||||
>
|
||||
</a-select>
|
||||
|
||||
</div>
|
||||
</a-form-item>
|
||||
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item field="address" label="详细地址:">
|
||||
<a-input
|
||||
v-model="modalForm.address"
|
||||
placeholder="请输入详细地址"
|
||||
:style="{ width: '250px' }"
|
||||
></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item field="hospital_level_name" label="医院等级:">
|
||||
<a-select v-model="modalForm.hospital_level_name" placeholder="请选择药品类型" :style="{ width: '182px' }">
|
||||
<a-option value="一级">一级</a-option>
|
||||
<a-option value="二级">二级</a-option>
|
||||
<a-option value="三级">三级</a-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item field="tele_phone" label="电话:">
|
||||
<a-input
|
||||
v-model="modalForm.tele_phone"
|
||||
placeholder="请输入电话"
|
||||
:style="{ width: '250px' }"
|
||||
></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item field="post_code" label="邮政编码:">
|
||||
<a-input
|
||||
v-model="modalForm.post_code"
|
||||
placeholder="请输入邮政编码"
|
||||
:style="{ width: '250px' }"
|
||||
></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item field="desc" label="描述:">
|
||||
<a-textarea v-model="modalForm.desc " :auto-size="{
|
||||
minRows:2,
|
||||
maxRows:5
|
||||
}" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
<a-divider />
|
||||
</a-form>
|
||||
<div class="titlebox" >
|
||||
<div class="bar"></div>
|
||||
<div class="name">操作</div>
|
||||
</div>
|
||||
<a-row :gutter="24" style="margin-top: 35px;" >
|
||||
<a-col :span="24">
|
||||
<a-form-item field="" label="" no-style>
|
||||
<a-space >
|
||||
<a-button type="primary" @click="handleSubmit">保存</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, toRefs,watch,getCurrentInstance} from 'vue';
|
||||
import { getAreaList,addHospital,updateHospital } from '@/api/basic/list';
|
||||
const { proxy } = getCurrentInstance();
|
||||
const props = defineProps({
|
||||
// 是否显示
|
||||
modalVisible: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
id:{
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
modalForm: {
|
||||
type: Object,
|
||||
},
|
||||
});
|
||||
const title=ref('');
|
||||
const emits = defineEmits(['familyVisibleChange','freshDetail']);
|
||||
const { modalVisible, modalForm } = toRefs(props);
|
||||
const provinceData = ref([]);
|
||||
const cityData = ref([]);
|
||||
const countryData = ref([]);
|
||||
|
||||
//获取区域列表
|
||||
const handelAreaList = (area_id = '', parent_id = '', area_type) => {
|
||||
getAreaList({
|
||||
area_id,
|
||||
area_type,
|
||||
parent_id,
|
||||
}).then((res) => {
|
||||
const { data, code, message } = res;
|
||||
if (code == 200) {
|
||||
if (area_type == 2) {
|
||||
provinceData.value = data;
|
||||
|
||||
}
|
||||
if (area_type == 3) {
|
||||
cityData.value = data;
|
||||
|
||||
}
|
||||
if (area_type == 4) {
|
||||
countryData.value = data;
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
//切换省份
|
||||
const changeProvice = (value) => {
|
||||
modalForm.city_id = '';
|
||||
modalForm.county_id = '';
|
||||
handelAreaList('', value, 3);
|
||||
};
|
||||
//切换省份
|
||||
const changeCity = (value) => {
|
||||
modalForm.county_id = '';
|
||||
handelAreaList('', value, 4);
|
||||
};
|
||||
watch(()=>props.id,()=>{
|
||||
if(props.id){
|
||||
title.value="编辑医院"
|
||||
}else{
|
||||
title.value="修改医院"
|
||||
}
|
||||
|
||||
},{immediate:true})
|
||||
watch(()=>props.modalForm,()=>{
|
||||
if(props.id){
|
||||
handelAreaList('',modalForm.value.province_id
|
||||
,3)
|
||||
handelAreaList('',modalForm.value.city_id
|
||||
,4)
|
||||
}
|
||||
|
||||
|
||||
},{immediate:true,deep:true})
|
||||
|
||||
const rules = {
|
||||
hospital_name: [{ required: true, message: '请输入医院名称' }],
|
||||
county_id:[{ required: true, message: '请选择省市区' }],
|
||||
hospital_level_name:[{ required: true, message: '请选择医院等级' }],
|
||||
address:[{ required: true, message: '请输入详细地址' }],
|
||||
};
|
||||
const handleSubmit=()=>{
|
||||
proxy.$refs.modalFormRef.validate(async (valid) => {
|
||||
let data=null;
|
||||
let {hospital_name,hospital_status,hospital_level_name,post_code,tele_phone,province_id,city_id,county_id,address,desc}=modalForm.value;
|
||||
if (!valid) {
|
||||
if(props.id){
|
||||
data= await updateHospital(props.id,{
|
||||
hospital_name,
|
||||
hospital_status,
|
||||
hospital_level_name,
|
||||
post_code,
|
||||
tele_phone,
|
||||
province_id,
|
||||
city_id,
|
||||
county_id,
|
||||
address,
|
||||
desc
|
||||
})
|
||||
}else{
|
||||
data= await addHospital({
|
||||
hospital_name,
|
||||
hospital_status,
|
||||
hospital_level_name,
|
||||
post_code,
|
||||
tele_phone,
|
||||
province_id,
|
||||
city_id,
|
||||
county_id,
|
||||
address,
|
||||
desc
|
||||
});
|
||||
}
|
||||
if(data.code==200){
|
||||
props.id?proxy.$message.success('修改成功'):proxy.$message.success('添加成功');
|
||||
emits('freshDetail');
|
||||
}
|
||||
handleClose();
|
||||
emits('freshDetail');
|
||||
|
||||
}else {
|
||||
console.log(valid)
|
||||
proxy.$message.error('表单校验失败');
|
||||
//done(false);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// Akiraka 20230210 关闭弹窗
|
||||
const handleClose = () => {
|
||||
proxy.$refs.modalFormRef.resetFields();
|
||||
emits('familyVisibleChange', false);
|
||||
};
|
||||
const getData = () => {
|
||||
handelAreaList('', '', 2);
|
||||
};
|
||||
defineExpose({
|
||||
getData,
|
||||
});
|
||||
</script>
|
||||
<style scoped>
|
||||
.row {
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user