|
@@ -1,7 +1,15 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div>
|
|
<div>
|
|
|
- <el-select class="form-input" v-model="cusareaName" filterable style="width: 100%;padding:0">
|
|
|
|
|
- <el-option style="height: auto; padding:0;font-weight:normal" :value="node.cusareaName">
|
|
|
|
|
|
|
+ <el-select
|
|
|
|
|
+ class="form-input"
|
|
|
|
|
+ v-model="cusareaName"
|
|
|
|
|
+ filterable
|
|
|
|
|
+ style="width: 100%; padding: 0"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-option
|
|
|
|
|
+ style="height: auto; padding: 0; font-weight: normal"
|
|
|
|
|
+ :value="node.cusareaName"
|
|
|
|
|
+ >
|
|
|
<el-tree
|
|
<el-tree
|
|
|
:data="treeData"
|
|
:data="treeData"
|
|
|
:expand-on-click-node="false"
|
|
:expand-on-click-node="false"
|
|
@@ -12,7 +20,8 @@
|
|
|
@check="handleClick"
|
|
@check="handleClick"
|
|
|
@node-click="handleNodeClick"
|
|
@node-click="handleNodeClick"
|
|
|
:check-on-click-node="true"
|
|
:check-on-click-node="true"
|
|
|
- :props="defaultProps">
|
|
|
|
|
|
|
+ :props="defaultProps"
|
|
|
|
|
+ >
|
|
|
</el-tree>
|
|
</el-tree>
|
|
|
</el-option>
|
|
</el-option>
|
|
|
</el-select>
|
|
</el-select>
|
|
@@ -41,8 +50,8 @@ export default {
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- defaultProps:{
|
|
|
|
|
- children: 'children',
|
|
|
|
|
|
|
+ defaultProps: {
|
|
|
|
|
+ children: 'child',
|
|
|
label: 'cusareaName',
|
|
label: 'cusareaName',
|
|
|
value: 'code'
|
|
value: 'code'
|
|
|
},
|
|
},
|
|
@@ -52,25 +61,25 @@ export default {
|
|
|
cusareaName: this.checkVal,
|
|
cusareaName: this.checkVal,
|
|
|
checkList: [],
|
|
checkList: [],
|
|
|
defaultChecked: []
|
|
defaultChecked: []
|
|
|
- }
|
|
|
|
|
|
|
+ };
|
|
|
},
|
|
},
|
|
|
watch: {
|
|
watch: {
|
|
|
checkVal: {
|
|
checkVal: {
|
|
|
handler(val) {
|
|
handler(val) {
|
|
|
- this.node.cusareaName = val
|
|
|
|
|
|
|
+ this.node.cusareaName = val;
|
|
|
},
|
|
},
|
|
|
- deep: true,
|
|
|
|
|
|
|
+ deep: true
|
|
|
},
|
|
},
|
|
|
checkedList: {
|
|
checkedList: {
|
|
|
handler(val) {
|
|
handler(val) {
|
|
|
- this.defaultChecked = val ? val.split(',') : []
|
|
|
|
|
|
|
+ this.defaultChecked = val ? val.split(',') : [];
|
|
|
},
|
|
},
|
|
|
deep: true,
|
|
deep: true,
|
|
|
immediate: true
|
|
immediate: true
|
|
|
},
|
|
},
|
|
|
checkVal: {
|
|
checkVal: {
|
|
|
handler(val) {
|
|
handler(val) {
|
|
|
- this.cusareaName = val
|
|
|
|
|
|
|
+ this.cusareaName = val;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
@@ -78,24 +87,23 @@ export default {
|
|
|
//点击节点
|
|
//点击节点
|
|
|
handleNodeClick(data) {
|
|
handleNodeClick(data) {
|
|
|
this.node = data;
|
|
this.node = data;
|
|
|
- this.$emit('handlerClick', data)
|
|
|
|
|
|
|
+ this.$emit('handlerClick', data);
|
|
|
},
|
|
},
|
|
|
//节点选中状态变化
|
|
//节点选中状态变化
|
|
|
handleClick(val) {
|
|
handleClick(val) {
|
|
|
- this.checkList = this.$refs.treeForm.getCheckedKeys()
|
|
|
|
|
- const checkNode = this.$refs.treeForm.getCheckedNodes()
|
|
|
|
|
- this.cusareaName = val?.cusareaName
|
|
|
|
|
- this.$emit('getCheckTree', this.checkList)
|
|
|
|
|
- this.$emit('getCheckTreeNode', checkNode)
|
|
|
|
|
|
|
+ this.checkList = this.$refs.treeForm.getCheckedKeys();
|
|
|
|
|
+ const checkNode = this.$refs.treeForm.getCheckedNodes();
|
|
|
|
|
+ this.cusareaName = val?.cusareaName;
|
|
|
|
|
+ this.$emit('getCheckTree', this.checkList);
|
|
|
|
|
+ this.$emit('getCheckTreeNode', checkNode);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
::v-deep .el-select-dropdown__item {
|
|
::v-deep .el-select-dropdown__item {
|
|
|
- padding: 0 !important
|
|
|
|
|
|
|
+ padding: 0 !important;
|
|
|
}
|
|
}
|
|
|
.tree-container {
|
|
.tree-container {
|
|
|
-
|
|
|
|
|
}
|
|
}
|
|
|
-</style>
|
|
|
|
|
|
|
+</style>
|