295 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			295 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Plaintext
		
	
	
| <template>
 | |
|   <div class="form-container">
 | |
|     <el-card class="box-card">
 | |
|       <div style="width:80%;">
 | |
|         <el-form
 | |
|           ref="specialtyForm"
 | |
|           v-loading="loading"
 | |
|           :rules="specialtyRules"
 | |
|           :model="specialtyForm"
 | |
|           class="demo-ruleForm"
 | |
|           label-width="150px"
 | |
|         >
 | |
|           <el-row>
 | |
|             <el-col :span="12">
 | |
|               <el-form-item label="Specialty: " prop="SpecialityId">
 | |
|                 <el-select
 | |
|                   v-model="specialtyForm.SpecialityId"
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   placeholder="Please select"
 | |
|                   style="width:100%;"
 | |
|                   size="small"
 | |
|                 >
 | |
|                   <!-- <el-option
 | |
|                     v-for="(key,value) of dictionaryList.Department"
 | |
|                     :key="key"
 | |
|                     :label="key"
 | |
|                     :value="value"
 | |
|                   /> -->
 | |
|                   <el-option
 | |
|                     v-for="item of dictionaryList.Department"
 | |
|                     :key="item.Id"
 | |
|                     :label="item.Value"
 | |
|                     :value="item.Id"
 | |
|                   />
 | |
|                   <el-option label="Other" :value="otherId" />
 | |
|                 </el-select>
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item v-if="specialtyForm.SpecialityId==otherId" class="other-item" prop="SpecialityOther">
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.SpecialityOther"
 | |
|                   placeholder="Please specify (required)"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item v-if="specialtyForm.SpecialityId==otherId" prop="SpecialityOtherCN" class="other-item">
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.SpecialityOtherCN"
 | |
|                   placeholder="请用中文注明"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|           </el-row>
 | |
|           <el-row>
 | |
|             <el-col :span="12">
 | |
|               <el-form-item label="Subspeciality: " prop="SubspecialityIds">
 | |
|                 <el-select
 | |
|                   v-model="specialtyForm.SubspecialityIds"
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   placeholder="select"
 | |
|                   multiple
 | |
|                   style="width:100%;"
 | |
|                   size="small"
 | |
|                 >
 | |
|                   <!-- <el-option
 | |
|                     v-for="(key,value) of dictionaryList.Subspeciality"
 | |
|                     :key="key"
 | |
|                     :label="key"
 | |
|                     :value="value"
 | |
|                   /> -->
 | |
|                   <el-option
 | |
|                     v-for="item of dictionaryList.Subspeciality"
 | |
|                     :key="item.Id"
 | |
|                     :label="item.Value"
 | |
|                     :value="item.Id"
 | |
|                   />
 | |
|                   <el-option label="Other" :value="otherId" />
 | |
|                 </el-select>
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item
 | |
|                 v-if="specialtyForm.SubspecialityIds && specialtyForm.SubspecialityIds.indexOf(otherId)>-1"
 | |
|                 class="other-item"
 | |
|                 prop="SubspecialityOther"
 | |
|               >
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.SubspecialityOther"
 | |
|                   placeholder="Please specify (required)"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item
 | |
|                 v-if="specialtyForm.SubspecialityIds && specialtyForm.SubspecialityIds.indexOf(otherId)>-1"
 | |
|                 class="other-item"
 | |
|                 prop="SubspecialityOtherCN"
 | |
|               >
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.SubspecialityOtherCN"
 | |
|                   placeholder="请用中文注明"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|           </el-row>
 | |
| 
 | |
|           <el-row>
 | |
|             <el-col :span="12">
 | |
|               <el-form-item label="Modality: " prop="ReadingTypeIds">
 | |
|                 <el-select
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.ReadingTypeIds"
 | |
|                   placeholder="Please select"
 | |
|                   style="width:100%;"
 | |
|                   multiple
 | |
|                   size="small"
 | |
|                 >
 | |
|                   <!-- <el-option
 | |
|                     v-for="(key,value) of dictionaryList.ReadingType"
 | |
|                     :key="key"
 | |
|                     :label="key"
 | |
|                     :value="value"
 | |
|                   /> -->
 | |
|                   <el-option
 | |
|                     v-for="item of dictionaryList.ReadingType"
 | |
|                     :key="item.Id"
 | |
|                     :label="item.Value"
 | |
|                     :value="item.Id"
 | |
|                   />
 | |
|                   <el-option label="Other" :value="otherId" />
 | |
|                 </el-select>
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item
 | |
|                 v-if="specialtyForm.ReadingTypeIds && specialtyForm.ReadingTypeIds.indexOf(otherId)>-1"
 | |
|                 prop="ReadingTypeOther"
 | |
|                 class="other-item"
 | |
|               >
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.ReadingTypeOther"
 | |
|                   placeholder="Please specify (required)"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|             <el-col :span="6">
 | |
|               <el-form-item
 | |
|                 v-if="specialtyForm.ReadingTypeIds && specialtyForm.ReadingTypeIds.indexOf(otherId)>-1"
 | |
|                 prop="ReadingTypeOtherCN"
 | |
|                 class="other-item"
 | |
|               >
 | |
|                 <el-input
 | |
|                   :disabled="$route.query.ReviewStatus === '1'"
 | |
|                   v-model="specialtyForm.ReadingTypeOtherCN"
 | |
|                   placeholder="请用中文注明"
 | |
|                   size="small"
 | |
|                 />
 | |
|               </el-form-item>
 | |
|             </el-col>
 | |
|           </el-row>
 | |
|           <el-form-item>
 | |
|             <el-button type="primary" :disabled="isDisabled || $route.query.ReviewStatus === '1'" size="small" @click="handleSave">Save</el-button>
 | |
|           </el-form-item>
 | |
|         </el-form>
 | |
|       </div>
 | |
|     </el-card>
 | |
|   </div>
 | |
| </template>
 | |
| <script>
 | |
| import { getSpecialtyInfo, updateSpecialtyInfo } from '@/api/reviewers'
 | |
| import { getBasicDataSelects } from '@/api/dictionary/dictionary'
 | |
| export default {
 | |
|   name: 'Specialty',
 | |
|   data() {
 | |
|     return {
 | |
|       specialtyForm: {
 | |
|         ReadingTypeIds: [],
 | |
|         ReadingTypeOther: '',
 | |
|         ReadingTypeOtherCN: '',
 | |
|         SubspecialityIds: [],
 | |
|         SubspecialityOther: '',
 | |
|         SubspecialityOtherCN: '',
 | |
|         SpecialityId: '',
 | |
|         SpecialityOther: '',
 | |
|         SpecialityOtherCN: ''
 | |
|       },
 | |
|       specialtyRules: {
 | |
|         SpecialityId: [{ required: true, message: 'Please select speciality', trigger: 'blur' }],
 | |
|         SpecialityOther: [
 | |
|           { required: true, message: 'Please specify', trigger: 'blur' },
 | |
|           { max: 50, message: 'The maximum length is 50' }
 | |
|         ],
 | |
|         SpecialityOtherCN: [{ max: 50, message: 'The maximum length is 50' }],
 | |
|         ReadingTypeIds: [{ required: true, message: 'Please select clinical reading type', trigger: 'blur' }],
 | |
|         ReadingTypeOther: [
 | |
|           { required: true, message: 'Please specify', trigger: 'blur' },
 | |
|           { max: 50, message: 'The maximum length is 50' }
 | |
|         ],
 | |
|         ReadingTypeOtherCN: [
 | |
|           { max: 50, message: 'The maximum length is 50' }
 | |
|         ],
 | |
|         SubspecialityIds: [{ required: true, message: 'Please select subspecialty', trigger: 'blur' }],
 | |
|         SubspecialityOther: [
 | |
|           { required: true, message: 'Please specify', trigger: 'blur' },
 | |
|           { max: 50, message: 'The maximum length is 50' }
 | |
|         ],
 | |
|         SubspecialityOtherCN: [
 | |
|           { max: 50, message: 'The maximum length is 50' }
 | |
|         ]
 | |
|       },
 | |
|       selectId: '00000000-0000-0000-0000-000000000000',
 | |
|       otherId: 'ef84e9cb-f1a6-49d7-b6da-34be2c12abd5',
 | |
|       isDisabled: false,
 | |
|       loading: false,
 | |
|       dictionaryList: {}
 | |
|     }
 | |
|   },
 | |
|   mounted() {
 | |
|     this.initSpecialty()
 | |
|   },
 | |
|   methods: {
 | |
|     handleSave() {
 | |
|       this.$refs.specialtyForm.validate(valid => {
 | |
|         if (valid) {
 | |
|           this.isDisabled = true
 | |
|           const params = {}
 | |
|           params.ReadingTypeIds = this.specialtyForm.ReadingTypeIds
 | |
|           params.ReadingTypeOther = params.ReadingTypeIds.indexOf(this.otherId) > -1 ? this.specialtyForm.ReadingTypeOther : ''
 | |
|           params.ReadingTypeOtherCN = params.ReadingTypeIds.indexOf(this.otherId) > -1 ? this.specialtyForm.ReadingTypeOtherCN : ''
 | |
|           params.SubspecialityIds = this.specialtyForm.SubspecialityIds
 | |
|           params.SubspecialityOther = params.SubspecialityIds.indexOf(this.otherId) > -1 ? this.specialtyForm.SubspecialityOther : ''
 | |
|           params.SubspecialityOtherCN = params.SubspecialityIds.indexOf(this.otherId) > -1 ? this.specialtyForm.SubspecialityOtherCN : ''
 | |
|           params.SpecialityId = this.specialtyForm.SpecialityId
 | |
|           params.SpecialityOther = params.SpecialityId === this.otherId ? this.specialtyForm.SpecialityOther : ''
 | |
|           params.SpecialityOtherCN = params.SpecialityId === this.otherId ? this.specialtyForm.SpecialityOtherCN : ''
 | |
|           params.Id = this.$route.query.Id
 | |
|           updateSpecialtyInfo(params).then(res => {
 | |
|             this.isDisabled = false
 | |
|             this.$message.success('Saved successfully')
 | |
|             this.specialtyForm.Id = res.Result
 | |
|           })
 | |
|             .catch(() => {
 | |
|               this.isDisabled = false
 | |
|             })
 | |
|         }
 | |
|       })
 | |
|     },
 | |
|     initForm() {
 | |
|       this.loading = true
 | |
|       const id = this.$route.query.Id
 | |
|       if (id) {
 | |
|         getSpecialtyInfo(id).then(res => {
 | |
|           this.specialtyForm.ReadingTypeIds = res.Result.ReadingTypeIds.length > 0 ? res.Result.ReadingTypeIds : []
 | |
|           this.specialtyForm.ReadingTypeOther = res.Result.ReadingTypeOther
 | |
|           this.specialtyForm.ReadingTypeOtherCN = res.Result.ReadingTypeOtherCN
 | |
|           this.specialtyForm.SubspecialityIds = res.Result.SubspecialityIds
 | |
|           this.specialtyForm.SubspecialityOther = res.Result.SubspecialityOther
 | |
|           this.specialtyForm.SubspecialityOtherCN = res.Result.SubspecialityOtherCN
 | |
|           this.specialtyForm.SpecialityId = res.Result.SpecialityId === this.selectId ? '' : res.Result.SpecialityId
 | |
|           this.specialtyForm.SpecialityOther = res.Result.SpecialityOther
 | |
|           this.specialtyForm.SpecialityOtherCN = res.Result.SpecialityOtherCN
 | |
|           this.loading = false
 | |
|         }).catch(() => { this.loading = false })
 | |
|       }
 | |
|     },
 | |
|     async initSpecialty() {
 | |
|       await this.getDicData()
 | |
|       this.initForm()
 | |
|     },
 | |
|     getDicData() {
 | |
|       getBasicDataSelects(['Department', 'Subspeciality', 'ReadingType']).then(res => {
 | |
|         this.dictionaryList = { ...res.Result }
 | |
|       })
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| <style lang="scss">
 | |
| .other-item .el-form-item__content{
 | |
|   margin-left: 80px !important;
 | |
| }
 | |
| </style>
 |