加油,新时代打工人!
源码下载地址
<template><div @mouseenter="mousein = true" @mouseleave="mousein = false"><el-input type="text" clearable autocomplete="off" v-model="searchDoc.code" placeholder="请选择" size="small" :style="style"@on-focus="handleShowDatatable(true)" @on-blur="handleShowDatatable(false)" @on-change="handleSearchData" /><div ref="tableContainer" :style="tableStyle" v-show="showDatatable" ><el-table:data="searchData"style="width:500px;"@row-click="handleRowClick"><el-table-columnprop="date"label="日期"width="180"></el-table-column><el-table-columnprop="name"label="姓名"width="180"></el-table-column><el-table-columnprop="address"label="地址"></el-table-column><el-table></div></div>
</template><script>export default {name: 'DiseaseCode',props: {value: {type: Object},width: {type: [Number, String]},index:{type: [Number, String]},},data(){return {loading: false,searchDoc: {code: '',id: 0},mousein: false,showDatatable: false,tableStyle: {'position':'absolute','background-color':'#FFFFFF','z-index':10,'max-height':'200px','overflow-y':'auto',},searchColumns: [{title: '编码',key: 'code',width: 160},{title: '名称',key: 'name',width: 170},{title: '助记码',key: 'mnemonicCodes'}],searchData: []}},methods: {handleSearchData(){ this.loading = trueaxios.request({url: '/diseaseCode/selectByCode',method: 'get',params: {code: this.searchDoc.code}}).then(res => {this.searchData = res.data}).catch(err => {this.$Message.error('请求疾病编码信息时异常: ', err)}).finally(() => {this.loading = false})},handleRowClick(item){this.searchDoc = {code: item.code,name:item.name,mnemonicCodes:item.mnemonicCodes}let data={index:this.index,searchDoc:this.searchDoc}this.$emit('sendcode',data.searchDoc.code)this.closeDatatable()},handleShowDatatable(isShow){if(!this.mousein && !isShow){this.showDatatable = false}else{this.showDatatable = trueif(this.searchData.length == 0){this.handleSearchData()}}},closeDatatable(){this.showDatatable = false}},computed: {style(){let style = {width: '200px'}if(this.width){style.width = `${this.width}px`}return style}},watch: {searchDoc: function(val){if(!val.code){this.searchDoc.id = 0}this.$emit('input', this.searchDoc)}},mounted(){}}
</script>