<template> <van-form ref='form' class="doc-form doctor-info"> <div class="doc-form-label" required>诊断单位</div> <van-field is-link v-model='form.diseaseUnitName' readonly placeholder='请选择' name="diseaseUnitId" /> <div class="doc-form-label" required>诊断科室</div> <van-field is-link v-model='form.diseaseOfficeName' readonly placeholder='请选择' name="diseaseOfficeId" @click="showOffice = true" :rules="[{ required: true, message: '请选择' }]" /> <DocOffice v-model:show="showOffice" v-model:value="form.diseaseOfficeId" :unitId="form.diseaseUnitId" @change="officeChange" /> <div class="doc-form-label" required>诊断医生</div> <van-field is-link v-model='form.diseaseDoctorName' readonly placeholder='请选择' name="diseaseDoctorId" @click="showDoctor = true" :rules="[{ required: true, message: '请选择' }]" /> <DocOfficeDoctor v-model:show="showDoctor" :allowClear="false" v-model:value="form.diseaseDoctorId" :unitId="form.diseaseUnitId" :officeId="form.diseaseOfficeId" @change="(option) => { form.diseaseDoctorName = option.staffName }" /> </van-form> </template> <script> import { useStore } from '@/doctor/store' import dayjs from 'dayjs' import DocOffice from '@/doctor/components/docOffice/DocOffice.vue' import DocOfficeDoctor from '@/doctor/components/docOfficeDoctor/DocOfficeDoctor.vue' const defaultForm = (info = {}) => { const form = { createDate: undefined, // 诊断单位 diseaseUnitId: undefined, diseaseUnitName: undefined, // 诊断科室 diseaseOfficeId: undefined, diseaseOfficeName: undefined, // 诊断医生 diseaseDoctorId: undefined, diseaseDoctorName: undefined, // 录入单位 createUnitId: undefined, createUnitName: undefined, // 录入科室 createOfficeId: undefined, createOfficeName: undefined, // 录入医生 createDoctorId: undefined, createDoctorName: undefined } Reflect.ownKeys(form).forEach(key => { if (info[key] != undefined) { form[key] = info[key] } }) return form } export default { components: { DocOffice, DocOfficeDoctor }, props: { info: { default: () => ({}) } }, data() { return { form: {}, store: useStore(), showUnit: false, showOffice: false, showDoctor: false } }, computed: { authInfo() { return this.store.authInfo } }, methods: { initForm() { this.form.createDate = dayjs().format('YYYY-MM-DD') // 诊断单位 this.form.diseaseUnitId = this.authInfo.unitId this.form.diseaseUnitName = this.authInfo.unitName // 诊断科室 this.form.diseaseOfficeId = this.authInfo.officeId this.form.diseaseOfficeName = this.authInfo.officeName // 诊断医生 this.form.diseaseDoctorId = this.authInfo.relationId this.form.diseaseDoctorName = this.authInfo.nickName // 录入单位 this.form.createUnitId = this.authInfo.unitId this.form.createUnitName = this.authInfo.unitName // 录入科室 this.form.createOfficeId = this.authInfo.officeId this.form.createOfficeName = this.authInfo.officeName // 录入医生 this.form.createDoctorId = this.authInfo.relationId this.form.createDoctorName = this.authInfo.nickName }, unitChange(option = {}) { this.form.diseaseUnitName = option.unitName this.form.diseaseDoctorId = undefined this.form.diseaseDoctorName = undefined this.form.diseaseOfficeId = undefined this.form.diseaseOfficeName = undefined }, officeChange(option = {}) { this.form.diseaseOfficeName = option.officeName this.form.diseaseDoctorId = undefined this.form.diseaseDoctorName = undefined }, submit() { return new Promise((resolve, reject) => { this.$refs.form.validate().then(() => { resolve(this.form) }).catch((e) => { reject('医生信息校验失败') console.warn('医生信息校验失败', e) const array = e || [] if (array.length) { this.$refs.form.scrollToField(array[0].name) } }) }) } }, watch: { info: { handler(info) { this.form = defaultForm(info) if (!this.info.id) { this.initForm() } }, immediate: true } } } </script> <style lang="less" scoped></style>