15 changed files with 1362 additions and 110 deletions
			
			
		| @ -1,37 +1,106 @@ | |||
| <template> | |||
|   <div style="height: 100%"> | |||
|     <el-form id="formDiagnosis" ref="form" :model="diagnosis" label-width="120px" style="margin-top: 32px"> | |||
|       <el-form-item label="诊断:" style="width: 540px" prop="zd"> | |||
|         <el-input v-model="diagnosis.zd" type="textarea" auto-complete="off" :rows="4" style="width: 420px" /> | |||
|       </el-form-item> | |||
|       <el-form-item label="处理:" style="width: 540px" prop="cl"> | |||
|         <el-input v-model="diagnosis.cl" type="textarea" auto-complete="off" :rows="4" style="width: 420px" /> | |||
|       </el-form-item> | |||
|       <el-form-item label="治疗意见:" style="width: 540px" prop="zlyj"> | |||
|         <el-input v-model="diagnosis.zlyj" type="textarea" auto-complete="off" :rows="4" style="width: 420px" /> | |||
|       </el-form-item> | |||
|     </el-form> | |||
|   <div style="height: 100%;display: flex"> | |||
|     <div class="historyTaking"> | |||
|       <el-form id="formDiagnosis" ref="form" :model="diagnosis" label-width="120px" style="margin-top: 32px"> | |||
|         <el-form-item label="诊断:" style="width: 540px" prop="zd"> | |||
|           <el-input v-model="diagnosis.zd" type="textarea" auto-complete="off" :rows="4" style="width: 420px" @focus="setCurWord('诊断')" /> | |||
|         </el-form-item> | |||
|         <el-form-item label="处理:" style="width: 540px" prop="cl"> | |||
|           <el-input v-model="diagnosis.cl" type="textarea" auto-complete="off" :rows="4" style="width: 420px" @focus="setCurWord('处理')" /> | |||
|         </el-form-item> | |||
|         <el-form-item label="治疗意见:" style="width: 540px" prop="zlyj"> | |||
|           <el-input v-model="diagnosis.zlyj" type="textarea" auto-complete="off" :rows="4" style="width: 420px" @focus="setCurWord('治疗意见')" /> | |||
|         </el-form-item> | |||
|       </el-form> | |||
|     </div> | |||
|     <div v-if="curWord" class="rightText"> | |||
|       <div style="text-align: left;margin-bottom: 16px"> | |||
|         常用内容模板: | |||
|       </div> | |||
|       <div class="wordContent"> | |||
|         <el-tooltip v-for="(item,index) in commonList" :key="index" effect="dark" placement="top-start"> | |||
|           <span slot="content" class="tooltips">{{ item }}</span> | |||
|           <el-button class="wordBtn" @click="combineWord(item)">{{ item }}</el-button> | |||
|         </el-tooltip> | |||
|         <el-button type="primary" @click="openTextTemplate">更多</el-button> | |||
|       </div> | |||
|     </div> | |||
|   </div> | |||
| </template> | |||
| 
 | |||
| <script> | |||
| export default { | |||
|   name: 'DiagnosisForm', | |||
|   props: ['diagnosis'], | |||
|   props: ['diagnosis', 'commonList'], | |||
|   data() { | |||
|     return { | |||
|       curWord: '' | |||
|     } | |||
|   }, | |||
|   methods: { | |||
|     reset() { | |||
|       this.$nextTick(() => { | |||
|         this.$refs.form.resetFields() | |||
|       }) | |||
|     }, | |||
|     setCurWord(word) { | |||
|       this.curWord = word | |||
|     }, | |||
|     combineWord(text) { | |||
|       switch (this.curWord) { | |||
|         case '诊断': | |||
|           if (!this.diagnosis.zd) { | |||
|             this.diagnosis.zd = '' | |||
|           } | |||
|           this.diagnosis.zd = this.diagnosis.zd + text | |||
|           break | |||
|         case '处理': | |||
|           if (!this.diagnosis.cl) { | |||
|             this.diagnosis.cl = '' | |||
|           } | |||
|           this.diagnosis.cl = this.diagnosis.cl + text | |||
|           break | |||
|         case '治疗意见': | |||
|           if (!this.diagnosis.zlyj) { | |||
|             this.diagnosis.zlyj = '' | |||
|           } | |||
|           this.diagnosis.zlyj = this.diagnosis.zlyj + text | |||
|           break | |||
|       } | |||
|     }, | |||
|     openTextTemplate() { | |||
|       this.$emit('openDrawer', this.curWord) | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| 
 | |||
| <style lang="scss"> | |||
| <style scoped lang="scss"> | |||
| #formDiagnosis{ | |||
|   .el-textarea__inner{ | |||
|     font-size: 16px; | |||
|   } | |||
| } | |||
| .wordContent{ | |||
|   text-align: left; | |||
| } | |||
| .historyTaking{ | |||
|   height: 100%; | |||
|   padding: 16px 16px 0 0; | |||
|   width: 50%; | |||
|   overflow: hidden; | |||
|   overflow-y: scroll; | |||
| } | |||
| .wordBtn{ | |||
|   max-width: 200px; | |||
|   overflow: hidden; | |||
|   text-overflow: ellipsis; | |||
| } | |||
| .rightText{ | |||
|   width: 50%; | |||
|   padding: 16px; | |||
| } | |||
| .tooltips{ | |||
|   max-width: 200px !important; | |||
| } | |||
| </style> | |||
|  | |||
| @ -0,0 +1,93 @@ | |||
| <template> | |||
|   <div class="content"> | |||
|     <div class="leftContent"> | |||
|       <div | |||
|         v-for="(item,index) in historyList" | |||
|         :key="index" | |||
|         :class="curIndex===index?'active':''" | |||
|         class="dateItem" | |||
|         @click="getCurRecord(item,index)" | |||
|       > | |||
|         {{ item.createDate }} | |||
|       </div> | |||
|     </div> | |||
|     <div class="rightBox"> | |||
|       <history-record-form :patient-data="patientData" :history-data="curRecord" @introduceHistory="introduceHistory" /> | |||
|     </div> | |||
|   </div> | |||
| </template> | |||
| 
 | |||
| <script> | |||
| import AllFormPrint from '@/components/360View/medicalRecord/outPatientRecord/allFormPrint.vue' | |||
| import HistoryRecordForm from '@/components/360View/medicalRecord/outPatientRecord/historyRecordForm.vue' | |||
| 
 | |||
| export default { | |||
|   name: 'HistoryCallRecord', | |||
|   components: { HistoryRecordForm, AllFormPrint }, | |||
|   props: ['patientId', 'patientData'], | |||
|   data() { | |||
|     return { | |||
|       historyList: [], | |||
|       curRecord: {}, | |||
|       curIndex: '' | |||
|     } | |||
|   }, | |||
|   created() { | |||
|     this.queryPatientHistory() | |||
|   }, | |||
|   methods: { | |||
|     // 历史记录列表 | |||
|     queryPatientHistory() { | |||
|       this.$http.get('/mjz/getPatientMjzHistory', { | |||
|         params: { | |||
|           patientId: this.patientId | |||
|         } | |||
|       }).then(res => { | |||
|         this.historyList = res.data.data | |||
|         if (this.historyList.length) { | |||
|           this.curIndex = 0 | |||
|           this.curRecord = this.historyList[0] | |||
|         } | |||
|       }) | |||
|     }, | |||
|     getCurRecord(item, index) { | |||
|       this.curIndex = index | |||
|       this.curRecord = item | |||
|     }, | |||
|     // 引入 | |||
|     introduceHistory(param) { | |||
|       this.$emit('introduceHistory', param) | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| 
 | |||
| <style lang="scss" scoped> | |||
| .dateItem{ | |||
|   padding: 5px; | |||
| } | |||
| .active{ | |||
|   background: #409EFF; | |||
|   color: #FFFFFF; | |||
| } | |||
| .content{ | |||
|   display: flex; | |||
|   justify-content: space-between; | |||
|   height: 100%; | |||
|   padding: 0 0 10px 0; | |||
|   color: #000; | |||
| } | |||
| .leftContent{ | |||
|   width: 20%; | |||
|   text-align: left; | |||
|   padding-right: 10px; | |||
|   font-size: 16px; | |||
| } | |||
| .rightBox{ | |||
|   flex: 1; | |||
|   text-align: left; | |||
|   padding: 0 0 0 20px; | |||
|   font-size: 16px; | |||
|   border-left: 1px solid #ccc; | |||
| } | |||
| </style> | |||
| @ -0,0 +1,123 @@ | |||
| <template> | |||
|   <div id="allForeForm"> | |||
|     <div class="printTitle"> | |||
|       门急诊病历 | |||
|     </div> | |||
|     <div v-if="patientData" class="patientInfo"> | |||
|       <div> | |||
|         姓名:{{ patientData.patientName }} | |||
|       </div> | |||
|       <div> | |||
|         性别:{{ patientData.patientSex }} | |||
|       </div> | |||
|       <div> | |||
|         年龄:{{ patientData.patientAge }} | |||
|       </div> | |||
|       <div> | |||
|         登记号:{{ patientData.patientId }} | |||
|       </div> | |||
|       <div v-if="historyData"> | |||
|         日期:{{ historyData.createDate }} | |||
|       </div> | |||
|     </div> | |||
|     <div v-if="historyData"> | |||
|       <div class="labelItem"> | |||
|         <span>主诉:</span> | |||
|         {{ historyData.zhuSu }} | |||
|         <span v-if="historyData.zhuSu" @click="introduceHistory(historyData.zhuSu,'主诉')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>现病史:</span> | |||
|         {{ historyData.xbs }} | |||
|         <span v-if="historyData.xbs" @click="introduceHistory(historyData.xbs,'现病史')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>既往病史:</span> | |||
|         {{ historyData.jws }} | |||
|         <span v-if="historyData.jws" @click="introduceHistory(historyData.jws,'既往病史')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>过敏史:</span> | |||
|         {{ historyData.gms }} | |||
|         <span v-if="historyData.gms" @click="introduceHistory(historyData.gms,'过敏史')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>周身其他病史:</span> | |||
|         {{ historyData.zsqtbs }} | |||
|         <span v-if="historyData.zsqtbs" @click="introduceHistory(historyData.zsqtbs,'周身其他病史')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>诊断:</span> | |||
|         {{ historyData.zd }} | |||
|         <span v-if="historyData.zd" @click="introduceHistory(historyData.zd,'诊断')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>处理:</span> | |||
|         {{ historyData.cl }} | |||
|         <span v-if="historyData.cl" @click="introduceHistory(historyData.cl,'处理')">【引入】</span> | |||
|       </div> | |||
|       <div class="labelItem"> | |||
|         <span>治疗意见:</span> | |||
|         {{ historyData.zlyj }} | |||
|         <span v-if="historyData.zlyj" @click="introduceHistory(historyData.zlyj,'治疗意见')">【引入】</span> | |||
|       </div> | |||
|     </div> | |||
|   </div> | |||
| </template> | |||
| 
 | |||
| <script> | |||
| export default { | |||
|   name: 'HistoryRecordForm', | |||
|   props: ['patientData', 'historyData'], | |||
|   methods: { | |||
|     introduceHistory(content, type) { | |||
|       const param = { | |||
|         content, | |||
|         type | |||
|       } | |||
|       this.$emit('introduceHistory', param) | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| 
 | |||
| <style lang="scss" scoped> | |||
| .title{ | |||
|   text-align: center; | |||
|   margin-top: 50px; | |||
| } | |||
| #allForeForm{ | |||
|   text-align: left; | |||
| } | |||
| .fore{ | |||
|   width: calc(100% - 10px); | |||
| } | |||
| .labelItem{ | |||
|   font-size: 16px; | |||
|   word-break: break-all; | |||
|   margin: 5px 0; | |||
|   span{ | |||
|     display: inline-block; | |||
|   } | |||
|   span:nth-child(1){ | |||
|     font-weight: bold; | |||
|   } | |||
|   span:nth-child(2){ | |||
|     color: #409EFF; | |||
|     cursor: pointer; | |||
|   } | |||
| } | |||
| .printTitle{ | |||
|   font-size: 20px; | |||
|   font-weight: bold; | |||
|   text-align: center; | |||
| } | |||
| .patientInfo{ | |||
|   display: flex; | |||
|   border-bottom: 1px solid #000; | |||
|   padding: 10px 0; | |||
|   >div{ | |||
|     padding-right: 20px; | |||
|   } | |||
| } | |||
| </style> | |||
| @ -0,0 +1,5 @@ | |||
| <template> | |||
|   <div> | |||
|     <router-view /> | |||
|   </div> | |||
| </template> | |||
| @ -0,0 +1,151 @@ | |||
| <template> | |||
|   <div class="template-add-dialog"> | |||
|     <el-dialog | |||
|       width="40%" | |||
|       :visible.sync="visible" | |||
|       :title="!dataForm.id ? '新增模板分类' : '修改模板分类'" | |||
|       :close-on-click-modal="false" | |||
|       :close-on-press-escape="false" | |||
|       @close="closeDialog" | |||
|     > | |||
|       <el-form | |||
|         ref="dataForm" | |||
|         :model="dataForm" | |||
|         :rules="dataRule" | |||
|         label-width="auto" | |||
|       > | |||
|         <el-form-item prop="content" label="分类名称"> | |||
|           <el-input | |||
|             v-model="dataForm.content" | |||
|             placeholder="分类名称" | |||
|             size="small" | |||
|           /> | |||
|         </el-form-item> | |||
|         <!-- 排序 --> | |||
|         <el-form-item prop="sort" label="排序"> | |||
|           <el-input-number v-model="dataForm.sort" controls-position="right" :min="0" label="排序" /> | |||
|         </el-form-item> | |||
|       </el-form> | |||
|       <template slot="footer"> | |||
|         <el-button @click="visible = false">{{ $t('cancel') }}</el-button> | |||
|         <el-button type="primary" @click="dataFormSubmitHandle">{{ $t('confirm') }}</el-button> | |||
|         <!-- <el-button type="primary" @click="exportContent">引入</el-button> --> | |||
|       </template> | |||
|     </el-dialog> | |||
|   </div> | |||
| 
 | |||
| </template> | |||
| 
 | |||
| <script> | |||
| export default { | |||
|   props: { | |||
|     systemInfo: { | |||
|       type: Object, | |||
|       default: () => { | |||
|         return {} | |||
|       } | |||
|     } | |||
|   }, | |||
|   data() { | |||
|     return { | |||
|       visible: false, | |||
|       modelType: '', | |||
|       dataForm: { | |||
|         pid: 0, | |||
|         // 类型 1:科室,2:个人 | |||
|         type: '', | |||
|         sort: 0, | |||
|         content: '' | |||
|       } | |||
|     } | |||
|   }, | |||
|   computed: { | |||
|     dataRule() { | |||
|       return { | |||
|         content: [ | |||
|           { required: true, message: '请输入内容', trigger: 'blur' } | |||
|         ] | |||
|       } | |||
|     } | |||
|   }, | |||
|   methods: { | |||
|     init() { | |||
|       this.visible = true | |||
|       this.$nextTick(() => { | |||
|         this.$refs.dataForm.resetFields() | |||
|         if (this.dataForm.id) { | |||
|           !this.modelType && this.getInfo() | |||
|         } | |||
|       }) | |||
|     }, | |||
|     // 获取信息 | |||
|     getInfo() { | |||
|       this.$http.get('/bd/template/getTemplateById', { | |||
|         params: { | |||
|           id: this.dataForm.id | |||
|         } | |||
|       }).then(({ data: res }) => { | |||
|         if (res.code !== 0) { | |||
|           return this.$message.error(res.msg) | |||
|         } | |||
|         this.dataForm = res.data | |||
|       }).catch(() => {}) | |||
|     }, | |||
|     // 表单提交 | |||
|     dataFormSubmitHandle() { | |||
|       this.$refs.dataForm.validate((valid) => { | |||
|         if (!valid) { | |||
|           return false | |||
|         } | |||
|         this.dataForm.type = parseFloat(this.dataForm.type) | |||
|         let url = '' | |||
|         if (this.dataForm.id) { | |||
|           url = '/bd/template/updateBdTemplate' | |||
|         } else { | |||
|           url = '/bd/template/addBdTemplate' | |||
|         } | |||
|         this.$http.post(url, { ...this.dataForm }) | |||
|           .then(({ data: res }) => { | |||
|             if (res.code !== 0) { | |||
|               return this.$message.error(res.msg) | |||
|             } | |||
|             this.$message({ | |||
|               message: this.$t('prompt.success'), | |||
|               type: 'success', | |||
|               duration: 500, | |||
|               onClose: () => { | |||
|                 this.visible = false | |||
|                 this.$emit('refreshDataList') | |||
|               } | |||
|             }) | |||
|           }).catch(() => {}) | |||
|       }) | |||
|     }, | |||
|     closeDialog() { | |||
|       this.$emit('closeDialog') | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| 
 | |||
| <style lang="scss"> | |||
| .template-add-dialog{ | |||
|   .el-form-item { | |||
|     margin-bottom:8px | |||
|   } | |||
|   .el-select { | |||
|     width: 100%; | |||
|   } | |||
|   .el-form-item__error { | |||
|     top: 27% !important; | |||
|     right: 10px !important; | |||
|     left: auto; | |||
|   } | |||
|   .el-input-number { | |||
|     width: 100%; | |||
|   } | |||
|   .el-input__inner { | |||
|     text-align: left; | |||
|   } | |||
| } | |||
| </style> | |||
| @ -0,0 +1,149 @@ | |||
| <template> | |||
|   <div class="template-add-dialog"> | |||
|     <el-dialog | |||
|       width="50%" | |||
|       :visible.sync="visible" | |||
|       :title="!dataForm.id ? '新增' : '编辑'" | |||
|       :close-on-click-modal="false" | |||
|       :close-on-press-escape="false" | |||
|       @close="closeDialog" | |||
|     > | |||
|       <el-form | |||
|         ref="dataForm" | |||
|         :model="dataForm" | |||
|         :rules="dataRule" | |||
|         label-width="auto" | |||
|       > | |||
|         <el-form-item prop="contentValue" label="模板内容" style="margin-top:20px;"> | |||
|           <el-input | |||
|             v-model="dataForm.contentValue" | |||
|             type="textarea" | |||
|             :autosize="{ minRows: 18}" | |||
|             placeholder="请输入内容" | |||
|           /> | |||
|         </el-form-item> | |||
|         <!-- 排序 --> | |||
|         <el-form-item prop="sort" label="排序"> | |||
|           <el-input-number v-model="dataForm.sort" controls-position="right" :min="0" label="排序" /> | |||
|         </el-form-item> | |||
|       </el-form> | |||
|       <template slot="footer"> | |||
|         <el-button @click="visible = false">{{ $t('cancel') }}</el-button> | |||
|         <el-button type="primary" @click="dataFormSubmitHandle">{{ $t('confirm') }}</el-button> | |||
|         <!-- <el-button type="primary" @click="exportContent">引入</el-button> --> | |||
|       </template> | |||
|     </el-dialog> | |||
|   </div> | |||
| 
 | |||
| </template> | |||
| 
 | |||
| <script> | |||
| export default { | |||
|   props: { | |||
|     systemInfo: { | |||
|       type: Object, | |||
|       default: () => { | |||
|         return {} | |||
|       } | |||
|     } | |||
|   }, | |||
|   data() { | |||
|     return { | |||
|       visible: false, | |||
|       type: '', | |||
|       dataForm: { | |||
|         treeId: '', | |||
|         contentValue: '', | |||
|         sort: '' | |||
|       } | |||
|     } | |||
|   }, | |||
|   computed: { | |||
|     dataRule() { | |||
|       return { | |||
|         contentValue: [ | |||
|           { required: true, message: this.$t('validate.required'), trigger: 'blur' } | |||
|         ] | |||
|       } | |||
|     } | |||
|   }, | |||
|   methods: { | |||
|     init() { | |||
|       this.visible = true | |||
|       this.$nextTick(() => { | |||
|         this.$refs.dataForm.resetFields() | |||
|         if (this.dataForm.id) { | |||
|           this.getInfo() | |||
|         } | |||
|       }) | |||
|     }, | |||
|     // 获取信息 | |||
|     getInfo() { | |||
|       this.$http.get('/bd/template/getInfoById', { | |||
|         params: { | |||
|           id: this.dataForm.id | |||
|         } | |||
|       }).then(({ data: res }) => { | |||
|         if (res.code !== 0) { | |||
|           return this.$message.error(res.msg) | |||
|         } | |||
|         this.dataForm = res.data | |||
|       }).catch(() => {}) | |||
|     }, | |||
|     // 表单提交 | |||
|     dataFormSubmitHandle() { | |||
|       this.$refs.dataForm.validate((valid) => { | |||
|         if (!valid) { | |||
|           return false | |||
|         } | |||
|         let url = '' | |||
|         if (this.dataForm.id) { | |||
|           url = '/bd/template/updateBdTemplateValue' | |||
|         } else { | |||
|           url = '/bd/template/addBdTemplateValue' | |||
|         } | |||
|         this.updateTemplate({ ...this.dataForm }, url) | |||
|       }) | |||
|     }, | |||
|     // 新增/修改 | |||
|     updateTemplate(dataForm, url) { | |||
|       this.$http.post(url, { ...dataForm }).then(({ data: res }) => { | |||
|         if (res.code !== 0) { | |||
|           return this.$message.error(res.msg) | |||
|         } | |||
|         this.$message({ | |||
|           message: this.$t('prompt.success'), | |||
|           type: 'success', | |||
|           duration: 500, | |||
|           onClose: () => { | |||
|             this.visible = false | |||
|             this.$emit('refreshDataList') | |||
|           } | |||
|         }) | |||
|       }).catch(() => {}) | |||
|     }, | |||
|     closeDialog() { | |||
|       this.$emit('closeDialog') | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| 
 | |||
| <style lang="scss"> | |||
| .template-add-dialog{ | |||
|   .el-form-item { | |||
|     margin-bottom:8px | |||
|   } | |||
|   .el-select { | |||
|     width: 100%; | |||
|   } | |||
|   .el-form-item__error { | |||
|     top: 27% !important; | |||
|     right: 10px !important; | |||
|     left: auto; | |||
|   } | |||
|   .el-input__inner { | |||
|     text-align: left; | |||
|   } | |||
| } | |||
| </style> | |||
| @ -0,0 +1,64 @@ | |||
| <template> | |||
|   <div class="template-management-father"> | |||
|     <div class="template-management"> | |||
|       <el-tabs v-model="mainActiveName"> | |||
|         <el-tab-pane label="科室" name="1" class="tab-p"> | |||
|           <tabFun v-if="mainActiveName==='1'" ref="tabFunRef1" main-active-name="1" :page-title="pageTitle" @yinruTemplateClick="yinruTemplateClick" /> | |||
|         </el-tab-pane> | |||
|         <el-tab-pane label="个人" name="2" class="tab-p"> | |||
|           <tabFun v-if="mainActiveName==='2'" ref="tabFunRef2" main-active-name="2" :page-title="pageTitle" @yinruTemplateClick="yinruTemplateClick" /> | |||
|         </el-tab-pane> | |||
|       </el-tabs> | |||
|     </div> | |||
|   </div> | |||
| 
 | |||
| </template> | |||
| <script> | |||
| import tabFun from './tab-fun.vue' | |||
| export default { | |||
|   components: { | |||
|     tabFun | |||
|   }, | |||
|   props: { | |||
|     pageTitle: { | |||
|       type: String, | |||
|       default: '模板管理' | |||
|     } | |||
|   }, | |||
|   data() { | |||
|     return { | |||
|       mainActiveName: '1' | |||
|     } | |||
|   }, | |||
|   created() { | |||
|   }, | |||
|   methods: { | |||
|     // 引入内容 | |||
|     yinruTemplateClick(item) { | |||
|       this.$emit('yinruTemplateClick', item) | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| <style lang="scss" scoped> | |||
| .template-management-father { | |||
|   height: calc(100vh - 50px - 32px); | |||
|   width: 100%; | |||
| } | |||
| .template-management { | |||
|   background: #fff; | |||
|   padding: 12px; | |||
|   width: 100%; | |||
|   height: calc(100vh - 60px); | |||
| } | |||
| </style> | |||
| <style lang="scss" > | |||
| .template-management { | |||
|   .el-tabs__nav-wrap::after { | |||
|     height: 1px !important; | |||
|   } | |||
|   .el-tabs__header { | |||
|     margin-bottom: 6px; | |||
|   } | |||
| } | |||
| </style> | |||
| @ -0,0 +1,378 @@ | |||
| <template> | |||
|   <div class="tab-fun"> | |||
|     <div class="leftlist"> | |||
|       <div class="leftlist-ul" :class="pageTitle=='模板管理' ? 'leftlistMb' : 'leftlistDa'"> | |||
|         <el-tree | |||
|           ref="templateTree" | |||
|           :data="fenleiList" | |||
|           :props="defaultProps" | |||
|           node-key="id" | |||
|           accordion | |||
|           highlight-current | |||
|           default-expand-all | |||
|           :expand-on-click-node="false" | |||
|         > | |||
|           <span slot-scope="{ node, data }" class="custom-tree-node treeItem" @click="leftListClick(data)"> | |||
|             <el-tooltip show-overflow-tip class="item" effect="dark" placement="top-start"> | |||
|               <div slot="content" class="tooltips">{{ node.label }}</div> | |||
|               <span class="treeContent">{{ node.label }}</span> | |||
|             </el-tooltip> | |||
|             <span v-show="pageTitle=='模板管理'"> | |||
|               <el-button | |||
|                 class="operateBtn" | |||
|                 type="text" | |||
|                 size="mini" | |||
|                 icon="el-icon-edit" | |||
|                 @click="() => addEditFenlei(data)" | |||
|               /> | |||
|               <el-button | |||
|                 class="operateBtn" | |||
|                 type="text" | |||
|                 size="mini" | |||
|                 icon="el-icon-plus" | |||
|                 @click="() => addEditFenlei(data,'新增子节点')" | |||
|               /> | |||
|               <el-button | |||
|                 class="operateBtn" | |||
|                 type="text" | |||
|                 size="mini" | |||
|                 icon="el-icon-delete" | |||
|                 @click="() => deleteFenleiClick(data,'分类')" | |||
|               /> | |||
|             </span> | |||
|           </span> | |||
|         </el-tree> | |||
|       </div> | |||
|       <el-button v-show="pageTitle=='模板管理'" type="primary" icon="el-icon-plus" class="plus-fenlei" circle @click="addEditFenlei" /> | |||
|     </div> | |||
|     <div class="rightlist"> | |||
|       <div v-if="contentList.length" class="rightlist-ul" :class="pageTitle=='模板管理' ? 'rightlistMb' : 'rightlistDa'"> | |||
|         <div v-for="(item,index) in contentList" :key="index" class="flex rightli" @dblclick="yinruTemplateClick(item)"> | |||
|           <div class="rightContentli"> | |||
|             <span>{{ item.contentValue }}</span> | |||
|           </div> | |||
|           <span v-if="pageTitle=='模板管理'" class="buttonli"> | |||
|             <span | |||
|               style="color: #1890ff; padding-right: 8px" | |||
|               class="cursor" | |||
|               @click="setOften(item)" | |||
|             > | |||
|               <el-icon :class="[item.usual?'el-icon-star-on':'el-icon-star-off',item.usual?'active':'']" /> | |||
|             </span> | |||
|             <span | |||
|               style="color: #1890ff; padding-right: 8px" | |||
|               class="cursor" | |||
|               @click="addEditContent(item)" | |||
|             >编辑</span> | |||
|             <span | |||
|               style="color: #ff4d4f;" | |||
|               class="cursor" | |||
|               @click="deleteFenleiClick(item)" | |||
|             >删除</span> | |||
|           </span> | |||
|           <span v-else class="buttonli"> | |||
|             <span | |||
|               style="color: #1890ff; padding-right: 8px" | |||
|               class="cursor" | |||
|               @click="yinruTemplateClick(item)" | |||
|             >引入</span> | |||
|           </span> | |||
|         </div> | |||
|       </div> | |||
|       <div v-else class="nodata"> | |||
|         <img src="@/assets/img/nodata.png" alt=""> | |||
|       </div> | |||
|       <el-button v-show="pageTitle=='模板管理'" type="primary" icon="el-icon-plus" class="plus" circle @click="addEditContent()" /> | |||
|     </div> | |||
|     <add-or-update | |||
|       v-if="addContentVisible" | |||
|       ref="addContentRef" | |||
|       @refreshDataList="getContent" | |||
|       @closeDialog="addContentVisible=false" | |||
|     /> | |||
|     <addFenlei | |||
|       v-if="addfenleiVisible" | |||
|       ref="addfenleiRef" | |||
|       @refreshDataList="getfenleiList" | |||
|       @closeDialog="addfenleiVisible=false" | |||
|     /> | |||
|   </div> | |||
| 
 | |||
| </template> | |||
| <script> | |||
| import addOrUpdate from './add-or-update.vue' | |||
| import mixinViewModule from '@/mixins/view-module' | |||
| import addFenlei from './add-fenlei.vue' | |||
| export default { | |||
|   components: { | |||
|     addOrUpdate, | |||
|     addFenlei | |||
|   }, | |||
|   mixins: [mixinViewModule], | |||
|   props: { | |||
|     mainActiveName: { | |||
|       type: String, | |||
|       default: '' | |||
|     }, | |||
|     pageTitle: { | |||
|       type: String, | |||
|       default: '' | |||
|     } | |||
|   }, | |||
|   data() { | |||
|     return { | |||
|       addContentVisible: false, | |||
|       addfenleiVisible: false, | |||
|       fenleiList: [], | |||
|       currentFenleiList: {}, | |||
|       contentList: [], | |||
|       currentContentList: {}, | |||
|       defaultProps: { | |||
|         children: 'childList', | |||
|         label: 'content' | |||
|       } | |||
|     } | |||
|   }, | |||
|   mounted() { | |||
|     this.getfenleiList() | |||
|   }, | |||
|   methods: { | |||
|     // 获取分类列表 | |||
|     async getfenleiList() { | |||
|       const { data: res } = await this.$http.get('/bd/template/getListByType', { | |||
|         params: { | |||
|           type: this.mainActiveName | |||
|         } | |||
|       }) | |||
|       if (res.code === 0) { | |||
|         this.fenleiList = res.data | |||
|         res.data && res.data.length > 0 ? this.currentFenleiList = res.data[0] : '' | |||
|         this.$nextTick(() => { | |||
|           this.$refs.templateTree.setCurrentKey(this.currentFenleiList.id) | |||
|         }) | |||
|         res.data && res.data.length > 0 ? this.getContent() : '' | |||
|       } else { | |||
|         this.$message.error(res.msg) | |||
|       } | |||
|     }, | |||
|     // 获取内容 | |||
|     async getContent() { | |||
|       const { data: res } = await this.$http.get('/bd/template/getInfoByTreeId', { | |||
|         params: { | |||
|           treeId: this.currentFenleiList.id | |||
|         } | |||
|       }) | |||
|       if (res.code === 0) { | |||
|         this.contentList = res.data | |||
|       } else { | |||
|         this.$message.error(res.msg) | |||
|       } | |||
|     }, | |||
|     // 点击tab | |||
|     handleClick(item) { | |||
|       this.getfenleiList() | |||
|     }, | |||
|     // 点击左侧列表 | |||
|     leftListClick(formItem) { | |||
|       this.currentFenleiList = formItem | |||
|       this.getContent() | |||
|     }, | |||
|     // 新增/编辑分类 | |||
|     addEditFenlei(item, other) { | |||
|       this.addfenleiVisible = true | |||
|       this.$nextTick(() => { | |||
|         // 类型 1:科室,2:个人 | |||
|         this.$refs.addfenleiRef.dataForm.type = this.mainActiveName | |||
|         this.$refs.addfenleiRef.modelType = other | |||
|         item && !other ? this.$refs.addfenleiRef.dataForm.id = item.id : '' | |||
|         item && other ? this.$refs.addfenleiRef.dataForm.pid = item.id : '' | |||
|         this.$refs.addfenleiRef.init() | |||
|       }) | |||
|     }, | |||
|     // 设为常用 | |||
|     setOften(item) { | |||
|       const usual = !item.usual | |||
|       this.$http.post('/bd/template/updateBdTemplateValue', { id: item.id, usual, sort: item.sort }).then(({ data: res }) => { | |||
|         if (res.code !== 0) { | |||
|           return this.$message.error(res.msg) | |||
|         } | |||
|         this.$message({ | |||
|           message: this.$t('prompt.success'), | |||
|           type: 'success', | |||
|           duration: 500, | |||
|           onClose: () => { | |||
|             this.visible = false | |||
|             this.getContent() | |||
|           } | |||
|         }) | |||
|       }).catch(() => {}) | |||
|     }, | |||
|     // 新增内容 | |||
|     addEditContent(item) { | |||
|       this.addContentVisible = true | |||
|       this.$nextTick(() => { | |||
|         this.$refs.addContentRef.dataForm.treeId = this.currentFenleiList.id // 新增所需的树id | |||
|         item ? this.$refs.addContentRef.dataForm.id = item.id : '' // 修改 | |||
|         this.$refs.addContentRef.init() // 打开弹窗 | |||
|       }) | |||
|     }, | |||
|     // 删除分类 | |||
|     deleteFenleiClick(item, flag) { | |||
|       const text = flag === '分类' ? '删除此分类将同时删除分类级下的所有内容,您确定要删除此模板分类吗?' : '您确定要删除此内容吗?' | |||
|       const url = flag === '分类' ? '/bd/template/deleteBdTemplate' : '/bd/template/deleteBdTemplateValue' | |||
|       this.$confirmFun(text).then(async() => { | |||
|         const { data: res } = await this.$http.get(url, { | |||
|           params: { | |||
|             id: item.id | |||
|           } | |||
|         }) | |||
|         if (res.code === 0) { | |||
|           this.$message({ | |||
|             message: this.$t('prompt.success'), | |||
|             type: 'success', | |||
|             duration: 500, | |||
|             onClose: () => { | |||
|               flag === '分类' ? (this.getfenleiList(), this.getContent()) : this.getContent() | |||
|             } | |||
|           }) | |||
|         } else { | |||
|           this.$message.error(res.msg) | |||
|         } | |||
|       }) | |||
|     }, | |||
|     // 引入内容 | |||
|     yinruTemplateClick(item) { | |||
|       this.$emit('yinruTemplateClick', item) | |||
|     } | |||
|   } | |||
| } | |||
| </script> | |||
| <style lang="scss" scoped> | |||
| .nodata{ | |||
|   width: 100%; | |||
|   height: 100%; | |||
|   display: flex; | |||
|   align-items: center; | |||
|   justify-content: center; | |||
| } | |||
| ::v-deep .el-icon-caret-right:before { | |||
|   color: #262626; | |||
| } | |||
| .treeContent{ | |||
|   width: 100px; | |||
|   overflow: hidden; | |||
|   text-overflow: ellipsis; | |||
| } | |||
| ::v-deep .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{ | |||
|   background-color: #409EFF; | |||
|   color: #FFFFFF; | |||
|   button{ | |||
|     color: #FFFFFF; | |||
|   } | |||
| } | |||
| .treeItem{ | |||
|   width: 100%; | |||
|   padding-right: 10px; | |||
|   display: flex; | |||
|   justify-content: space-between; | |||
|   align-items: center; | |||
|   .operateBtn{ | |||
|     font-size: 16px; | |||
|     color: #333; | |||
|   } | |||
| } | |||
| .tooltips{ | |||
|   max-width: 200px; | |||
| } | |||
| .tab-fun { | |||
|    display: flex; | |||
|    height: calc(100vh - 125px); | |||
|   .flex{ | |||
|     display: flex; | |||
|   } | |||
|   .active{ | |||
|     font-size: 18px !important; | |||
|   } | |||
|   .leftlist { | |||
|     width: 240px; | |||
|     min-width: 200px; | |||
|     border-right: 1px solid #ccc; | |||
|     position: relative; | |||
|   } | |||
|   .leftlist-ul { | |||
|     overflow-y: auto; | |||
|   } | |||
|   .leftlistMb{ | |||
|     height: calc(100vh - 160px); | |||
| 
 | |||
|   } | |||
|   .leftlistDa { | |||
|     height: calc(100vh - 110px); | |||
|   } | |||
|   .plus-fenlei { | |||
|     position: absolute; | |||
|     right: 10px; | |||
|     bottom: 0; | |||
|   } | |||
|   .rightlist { | |||
|     flex: 1; | |||
|     position: relative; | |||
|   } | |||
|   .rightlist-ul { | |||
|      overflow-y: auto; | |||
|   } | |||
|   .rightlistMb{ | |||
|     height: calc(100vh - 160px); | |||
| 
 | |||
|   } | |||
|   .rightlistDa { | |||
|     height: calc(100vh - 110px); | |||
|   } | |||
|   .plus { | |||
|     position: absolute; | |||
|     right: 0px; | |||
|     bottom: 0; | |||
|   } | |||
|   .li { | |||
|       padding: 6px 12px; | |||
|       text-align: center; | |||
|       cursor: pointer; | |||
|       display: flex; | |||
|       justify-content: space-between; | |||
|       align-items: center; | |||
|       border-bottom: 1px solid #ccc; | |||
|     } | |||
|     .currentLi { | |||
|       background: #1890ff; | |||
|       color: #fff; | |||
|       padding: 6px 12px; | |||
|       text-align: center; | |||
|     } | |||
|     .rightli { | |||
|       padding: 6px 10px; | |||
|       text-align: left; | |||
|       border-bottom: 1px solid #ebeef5; | |||
|       white-space: normal; | |||
|       word-break: break-all; | |||
|     } | |||
|     .buttonli { | |||
|       display: inline-block; | |||
|       text-align: center; | |||
|       padding-left:20px; | |||
|     } | |||
|     .rightContentli { | |||
|       flex: 1; | |||
|     } | |||
|     .rightContentli-title { | |||
|       font-weight: 700; | |||
|       font-size: 18px; | |||
|     } | |||
|     .rightli:hover { | |||
|       background: #f5f7fa; | |||
|     } | |||
|   .cursor { | |||
|     cursor: pointer; | |||
| 
 | |||
|   } | |||
| } | |||
| </style> | |||
					Loading…
					
					
				
		Reference in new issue