You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

294 lines
8.7 KiB

<template>
<div style="display: flex; margin-top: -30px;">
<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">
</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:100px;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="report.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="addAbs(asbItemChoosed)" 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>
</div>
</template>
<script>
import { mapState, mapActions } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import { arrayFilter, arrayReduce, arrayExistObj, deepCopy } from "../../utlis/proFunc";
export default {
props: ["patientRegisterForm", "payTypeFlag"],
data() {
return {
itemTypeIds: [], //项目类别
asbItems: [], //可被选的 asbItem
asbItemChoosed: [], //勾选的 未选组合项目
asbItemOCXChoosed: [], //勾选的 已选组合项目
asbItemQuick: [], //可供 快速选择的组合项目
quickAsb: [], //快速选择当前显的下拉数据
asbItemId: '', //快速选择的组合项目ID
};
},
computed: {
...mapState(["dict", "customerOrg", "patientRegister", "personnelUnit", "report"]),
},
created() {
},
mounted() {
this.dictInit();
},
methods: {
dictInit() {
getapi("/api/app/asbitem/in-filter?Filter").then((res) => {
if (res.code == 1) {
this.dict.asbItemAll = res.data.items;
this.parseAsbitem();
}
});
},
//分析可选组合项目,及快速可选组合项目的数据
parseAsbitem() {
this.asbItemQuick = deepCopy(this.dict.asbItemAll);
arrayReduce(this.asbItemQuick, this.report.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])
}
},
//未选组合项目 勾选情况
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')
this.report.dataAsbitemOCX = this.report.dataAsbitemOCX.concat(asbItemChoosed)
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.report.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);
}
},
btnOk(closed){
if(this.report.dataAsbitemOCX && this.report.dataAsbitemOCX.length > 0){
switch (this.report.dataAsbitemOCX.length) {
case 1:
this.patientRegister.query.asbitemOCX = this.report.dataAsbitemOCX[0].displayName
break;
default:
this.patientRegister.query.asbitemOCX = this.report.dataAsbitemOCX[0].displayName + ',… + ' + this.report.dataAsbitemOCX.length
break;
}
}else{
this.patientRegister.query.asbitemOCX = ''
}
if(closed){
this.report.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: 5px;
margin-right: 5px;
}
.disTotal {
margin-left: 10px;
}
::v-deep .el-input__inner {
/*text-align: center;*/
padding-left: 2px;
padding-right: 15px;
}
::v-deep .el-input__icon {
width: 15px;
/* 输入框下拉箭头或清除图标 默认 25 */
}
/* 表格 表头 列间距控制 */
::v-deep .el-table th.el-table__cell>.cell {
text-align: center;
/* 表格 表头 对齐方式,默认 left */
padding-right: 2px;
/* 表格 表头 列间距控制,默认 10px */
padding-left: 2px;
/* 表格 表头 列间距控制,默认 10px */
}
/* 表格 表体 首列左间距控制 */
::v-deep .el-table--border .el-table__cell:first-child .cell {
padding-left: 2px;
/* 表格 表体 首列左间距控制,默认 10px */
}
/* 表格 行列间距控制 ,默认 10 px*/
::v-deep .el-table__cell {
padding: 2px 2px 2px 2px;
/* 上,右,下,左 */
}
::v-deep .cell {
padding-left: 2px;
padding-right: 2px;
}
::v-deep .el-icon-date:before {
content: ""
}</style>