feat: 科室医保分类功能

dev_ksck2.0
chenhc 1 year ago
parent 752f8c5eb0
commit 280aeea409

@ -0,0 +1,15 @@
import axios from "@/utils/request";
export function deptCategoryTreeselect(deptCode) {
return axios({
url: `/deptCategoryTreeselect/${deptCode}`,
method: "GET"
});
}
export function deptCategoryList(deptCode) {
return axios({
url: `/deptCategoryList/${deptCode}`,
method: "GET"
});
}

@ -0,0 +1,240 @@
<template>
<div>
<el-card>
<el-form :model="query" v-if="showSearch" label-width="auto">
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="所属科室">
<deptSelect :value.sync="query.deptCode"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="top-right-btn">
<el-button-group>
<el-button icon="el-icon-view" type="primary" @click="showSearch = !showSearch">显示/隐藏搜索栏</el-button>
<el-button
type="primary"
icon="el-icon-refresh"
@click="onReset"
>重置
</el-button>
<el-button type="primary" icon="el-icon-search" @click="search"
>查询
</el-button>
<el-button type="primary" icon="el-icon-plus" @click="add"
>添加
</el-button>
</el-button-group>
</div>
</el-card>
<el-card>
<el-row>
<el-col :span="24">
<el-table
:data="dataList"
border
width="100%"
:header-cell-style="{ 'text-align': 'center' }"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
:row-key="(record) => record.categoryId"
:row-style="{height: '10'}"
>
<el-table-column
label="分类ID"
prop="categoryId"
align="center"
></el-table-column>
<el-table-column label="父级分类ID" align="center">
<template slot-scope="scope">
{{ scope.row.parentCategoryId == null ? '-' : scope.row.parentCategoryId }}
</template>
</el-table-column>
<el-table-column
label="分类名称"
prop="categoryName"
align="center"
></el-table-column>
<el-table-column
label="分类级别"
prop="level"
align="center"
></el-table-column>
<el-table-column
label="分类描述"
prop="description"
align="center"
></el-table-column>
<el-table-column
label="操作"
align="center"
>
<el-button-group style="margin-bottom: 8px; margin-top: 8px;">
<el-button type="danger" @click.native="del(scope.row)" :loading="loading">删除</el-button>
</el-button-group>
</el-table-column>
</el-table>
</el-col>
</el-row>
</el-card>
<el-dialog
title="添加科室医保分类绑定"
:close-on-click-modal="false"
:close-on-press-escape="false"
:visible.sync="selectDialog"
width="65%"
append-to-body
v-if="selectDialog"
>
<el-form :model="addData" label-width="auto">
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="所属科室">
<deptSelect :value.sync="addData.deptCode" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="医保分类绑定">
<el-checkbox v-model="categoryExpand" @change="handleCheckedTreeExpand($event, 'deptCategory')">/</el-checkbox>
<el-checkbox v-model="categoryNodeAll" @change="handleCheckedTreeNodeAll($event, 'deptCategory')">/</el-checkbox>
<el-tree
props="categoryOptions"
class="tree-border"
:data="categoryOptions"
show-checkbox
ref="deptCategory"
node-key="id"
empty-text="加载中,请稍候"
:props="defaultProps"
></el-tree>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script>
import { deptCategoryTreeselect , deptCategoryList} from '@/api/basic/consume/materialCategory'
export default {
name: 'materialCategory',
data() {
return {
data: [],
showSearch:true,
query:{
deptCode: this.$store.getters.locDeptCode,
},
addData:{
deptCode: null,
},
selectDialog:false,
categoryExpand:false,
categoryNodeAll:false,
categoryOptions:[],
defaultProps: {
children: "children",
label: "label"
},
}
},
methods: {
handleUpdate() {
let deptCode = this.addData.deptCode
const deptCategory = this.getDeptCategoryTreeselect(deptCode)
this.$nextTick(() => {
deptCategory.then(res => {
let checkedKeys = res.data.checkedKeys
checkedKeys.forEach((v) => {
this.$nextTick(() => {
this.$refs.deptCategory.setChecked(v, true, false)
})
})
})
})
},
/** 根据deptCode查询菜单树结构 */
getDeptCategoryTreeselect(deptCode) {
return deptCategoryTreeselect(deptCode).then(response => {
this.categoryOptions = response.data.categorys;
return response;
});
},
// /
handleCheckedTreeExpand(value, type) {
if (type == 'deptCategory') {
let treeList = this.categoryOptions;
for (let i = 0; i < treeList.length; i++) {
this.$refs.deptCategory.store.nodesMap[treeList[i].id].expanded = value;
}
}
},
// /
handleCheckedTreeNodeAll(value, type) {
if (type == 'deptCategory') {
this.$refs.deptCategory.setCheckedNodes(value ? this.categoryOptions : []);
}
},
//
getTrees(list, parentCategoryId = 0) {
let parentObj = {}
list.forEach((o) => {
parentObj[o.categoryId] = o
})
if (!parentCategoryId) {
return list
.filter((o) => !parentObj[o.parentCategoryId])
.map((o) => ((o.children = this.getTrees(list, o.categoryId)), o))
} else {
return list
.filter((o) => o.parentCategoryId == parentCategoryId)
.map((o) => ((o.children = this.getTrees(list, o.categoryId)), o))
}
},
//
async getData(deptCode) {
deptCategoryList(deptCode).then(response => {
var data = response.data;
if ( data == null || data == [] ){
this.dataList = []
return;
}else {
this.dataList = this.getTrees(data)
this.$forceUpdate();
}
});
},
search(){
this.getData(this.query.deptCode)
},
add(){
this.addData.deptCode = this.query.deptCode
this.handleUpdate()
this.selectDialog = !this.selectDialog
},
del(row){
console.log(row)
}
},
mounted() {
this.getData(this.$store.getters.locDeptCode)
},
created() {
}
}
</script>
<style scoped>
</style>
Loading…
Cancel
Save