|
|
<template> <div style="display: flex; "> <div style="width:230px;"> <div style="display: flex;"> <span>项目类别</span> <el-cascader :options="dict.itemTypeTree" v-model="itemTypeIds" style="margin-left: 3px;width:160px;" :props="{ checkStrictly: true, expandTrigger: 'hover', ...customerOrg.treeprops, }" :show-all-levels="false" clearable filterable @change="parseAsbitem" size="small" ref="example" popper-class="example"> </el-cascader> </div> <div class="mainareaBox"> <el-table :data="asbItems" :height="400" @row-dblclick="dbClickChoosedAsb" @selection-change="handleSelectionChange" size="small"> <el-table-column type="selection" align="center" width="60" /> <el-table-column prop="displayName" label="未选诊断" width="160" /> </el-table> </div> </div>
<div style="width:110px;margin-top: 70px;"> <div class="btnList"> <el-button type="primary" @click="addAbs(asbItemChoosed)" style="width:90px;">添加 <i class="el-icon-right"></i> </el-button> </div> <div class="btnList"> <el-button type="primary" @click="delAbs(asbItemOCXChoosed)" style="width:90px;">移除 <i class="el-icon-back"></i> </el-button> </div> </div>
<div style="display: block; width:230px;">
<div class="disTotal"> <el-select v-model="asbItemId" placeholder="快速选择诊断" size="small" filterable clearable remote automatic-dropdown :remote-method="remoteMethod" @change="quickChoosedAsb" default-first-option ref="asbItemId" style="width:150px;text-align: left;padding-right: 15px;"> <el-option v-for="item in quickAsb" :key="item.id" :value="item.id" :label="item.displayName" /> </el-select> </div>
<div class="mainareaBox"> <el-table :data="diagnosis.dataAsbitemOCX" height="400" width="100%" @row-dblclick="removeAbs" @selection-change="selecteditems" size="small"> <!-- temporaryselection personnelUnit.nogroupselected--> <el-table-column type="selection" align="center" width="60" /> <el-table-column label="已选诊断" width="160" prop="displayName" /> </el-table> </div> </div>
<div style="width:100px;margin-top: 70px;"> <div class="btnList"> <el-button type="primary" @click="diagnosisTemplateVisble = true" style="width:90px;">复制模板</el-button> </div> <div class="btnList"> <el-button type="primary" @click="btnOk('close')" style="width:90px;">确定 <i class="el-icon-check"></i> </el-button> </div> <!-- <div class="btnList" style="text-align: center;background-color: rgb(192, 192, 192);border-radius: 5%;padding: 5px 0;"> 已选组合项<br> 目为空时即<br> 表示选择所<br> 有组合项自 </div> --> </div>
<!--诊断模板--> <el-dialog title="诊断模板" :visible.sync="diagnosisTemplateVisble" width="600px" height="400" :show-close="false" :close-on-click-modal="false" :append-to-body="true"> <el-table :data="dict.diagnosisTemplates" border height="350" row-key="id" size="small" highlight-current-row @row-click="rowClick" @row-dblclick="rowDblclick" ref="patientList" style="margin-top: -10px;"> <el-table-column type="index" width="50" label="序号" align="center" /> <!-- <el-table-column prop="id" label="编号" width="300"> </el-table-column> --> <el-table-column prop="displayName" width="150" label="诊断模板名称" align="center"> </el-table-column> <el-table-column prop="creatorName" width="70" label="创建者" align="center"> </el-table-column> <el-table-column prop="creationTime" label="创建时间" width="160" align="center"> <template slot-scope="scope"> {{ moment(scope.row.creationTime).format("yyyy-MM-DD HH:mm:ss") }} </template> </el-table-column> <el-table-column prop="lastModifierName" width="70" label="修改者" align="center"> </el-table-column> <el-table-column prop="lastModificationTime" label="修改时间" width="160" align="center"> <template slot-scope="scope"> {{ moment(scope.row.lastModificationTime).format("yyyy-MM-DD HH:mm:ss") }} </template> </el-table-column>
</el-table> <span slot="footer" class="dialog-footer"> <el-button @click="diagnosisTemplateVisble = false" style="width:90px;">取消</el-button> <el-button type="primary" @click="copyDiagnosisTemplate" style="width:90px;">确定</el-button> </span> </el-dialog>
</div></template><script>
import { mapState, mapActions } from "vuex";import moment from "moment";import { getapi, postapi, putapi, deletapi } from "@/api/api";import { dddw, arrayFilter, arrayReduce, arrayExistObj, deepCopy } from "../../utlis/proFunc";
export default { components: {
}, props: ["patientRegisterForm", "payTypeFlag"], data() { return { itemTypeIds: [], //项目类别
asbItems: [], //可被选的 asbItem
asbItemChoosed: [], //勾选的 未选组合项目
asbItemOCXChoosed: [], //勾选的 已选组合项目
asbItemQuick: [], //可供 快速选择的组合项目
quickAsb: [], //快速选择当前显的下拉数据
asbItemId: '', //快速选择的组合项目ID
diagnosisTemplateVisble: false, diagnosisTemplateId: '', //当前选中套餐ID
packageAsbitems: [], //套餐中包含的组合项目
}; }, computed: { ...mapState(["dict", "customerOrg", "patientRegister", "personnelUnit", "diagnosis"]), },
created() {
},
mounted() { this.dictInit(); // this.diagnosis.dataAsbitemOCX=[]
// this.patientRegister.query.StatisticsOCX = ''
},
methods: { moment, dddw,
dictInit() { getapi('/api/app/diagnosis-template/in-filter') .then(res => { if (res.code > -1) this.dict.diagnosisTemplates = res.data })
//分析可选组合项目，及快速可选组合项目的数据
this.parseAsbitem();
},
//分析可选组合项目，及快速可选组合项目的数据
parseAsbitem(v) { this.asbItemQuick = deepCopy(this.dict.asbItemAll); arrayReduce(this.asbItemQuick, this.diagnosis.dataAsbitemOCX, 'id'); this.asbItems = deepCopy(this.asbItemQuick); if (this.itemTypeIds && this.itemTypeIds.length > 0) { this.asbItems = arrayFilter(this.asbItems, 'itemTypeId', this.itemTypeIds[this.itemTypeIds.length - 1]) } if (v) { this.$refs.example.toggleDropDownVisible(); } },
//未选组合项目 勾选情况
handleSelectionChange(val) { // this.selecteddata = val;
this.asbItemChoosed = val; //console.log(this.asbItemChoosed);
},
// 添加组合项目
///api/app/register-asbitem/many/3fa85f64-5717-4562-b3fc-2c963f66afa6'
addAbs(asbItemChoosed) {
if (asbItemChoosed.length < 1) { alert("请选择要添加的诊断") return } arrayReduce(this.asbItems, asbItemChoosed, 'id') arrayReduce(this.asbItemQuick, asbItemChoosed, 'id') // 选模板时，防止重复添加
let tempArr = [] asbItemChoosed.forEach(e => { if(arrayExistObj(this.diagnosis.dataAsbitemOCX,'id',e.id) < 0) tempArr.push(e) }); this.diagnosis.dataAsbitemOCX = this.diagnosis.dataAsbitemOCX.concat(tempArr)
this.btnOk(); },
//人员已选组合项目 勾选情况
selecteditems(val) { this.asbItemOCXChoosed = val },
//删除 人员已选中的组合项目
///api/app/register-asbitem/many?RegisterAsbitemIds=3fa85f64-5717-4562-b3fc-2c963f66afa6
delAbs(absForDel) { if (absForDel.length < 1) { alert("请选择要移除的诊断") return } arrayReduce(this.diagnosis.dataAsbitemOCX, absForDel, 'id'); this.asbItems = this.asbItems.concat(absForDel) this.asbItemQuick = this.asbItemQuick.concat(absForDel) this.btnOk(); },
//双击删除已选项目
removeAbs(row) { this.delAbs([row]); },
//双击选择组合项目
dbClickChoosedAsb(row) { this.addAbs([row]); },
//快速选择组合项目
quickChoosedAsb(v) { //远程查询时，设置了 value-key 也不管用，只能取到value console.log('quickChoosedAsb',v)
let lfind = -1 if (v) { lfind = arrayExistObj(this.asbItemQuick, 'id', v) if (lfind > -1) { this.addAbs([this.asbItemQuick[lfind]]) } } },
//快速选择组合项目时，调整可按拼间简码及简称查找
remoteMethod(keyWords) { //console.log('remoteMethod',this.dict.asbItemQuick)
if (keyWords) { this.quickAsb = []; this.asbItemQuick.forEach(item => { if (item.displayName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1 || item.simpleCode.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1 // || item.shortName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
) { this.quickAsb.push(item); } }); } else { this.quickAsb = deepCopy(this.asbItemQuick); } },
//选中诊断模板
rowClick(row) { this.diagnosisTemplateId = row.id },
//双击选诊断模板，并确认复制
rowDblclick(row) { this.copyDiagnosisTemplate() },
//复制诊断模板(确认选中诊断模板)
copyDiagnosisTemplate() { if (!this.diagnosisTemplateId) { this.$message.warning({ showClose: true, message: "请先选择诊断模板！" }) return } // 获取模板的诊断，并添加到已选
postapi('/api/app/diagnosistemplatedetail/getdiagnosistemplateindiagnosis', { diagnosisTemplateId: this.diagnosisTemplateId }) .then(res => { if (res.code > -1) { this.addAbs(res.data) this.diagnosisTemplateVisble = false } }) },
btnOk(closed) { if (this.diagnosis.dataAsbitemOCX && this.diagnosis.dataAsbitemOCX.length > 0) { switch (this.diagnosis.dataAsbitemOCX.length) { case 1: this.patientRegister.query.StatisticsOCX = this.diagnosis.dataAsbitemOCX[0].displayName break; default: this.patientRegister.query.StatisticsOCX = this.diagnosis.dataAsbitemOCX[0].displayName + '，… + ' + this.diagnosis.dataAsbitemOCX.length break; } } else { this.patientRegister.query.StatisticsOCX = '' }
if (closed) { this.diagnosis.dialogAsbitemOCX = false } }
},
//监听事件
watch: {
},};</script><style lang="scss" scoped>@import "../../assets/css/global.css";
.mainareaBox { border: 1px solid #000; height: 400px; margin-top: 5px;}
.btnList { margin-top: 5px; margin-left: 10px; margin-right: 10px;}
.disTotal { margin-left: 10px;}</style><style>.example .el-cascader-panel .el-radio { width: 100%; height: 100%; z-index: 10; position: absolute; top: 0px; right: 0px;}
.example .el-cascader-panel .el-radio__input { /* margin-top: 10px; margin-left: 8px; */ display: none;}
.example .el-cascader-panel .el-cascader-node__postfix { top: 10px;}</style>
|
