|
@@ -1,6 +1,15 @@
|
|
|
<template>
|
|
|
<el-scrollbar class="el-scrollbar-byself thisColor" style="width: 100%">
|
|
|
- <el-tree class="" :data="tenantsTree" @node-click="treeClick" node-key="value" :props="treedefaultProps" ref="tenantstree">
|
|
|
+ <el-tree
|
|
|
+ :data="tenantsTree"
|
|
|
+ show-checkbox
|
|
|
+ node-key="value"
|
|
|
+ :props="treedefaultProps"
|
|
|
+ check-strictly
|
|
|
+ :default-checked-keys="defaultcheckedkeys"
|
|
|
+ ref="tenantstree"
|
|
|
+ @check="checkChange"
|
|
|
+ >
|
|
|
</el-tree>
|
|
|
</el-scrollbar>
|
|
|
</template>
|
|
@@ -14,6 +23,7 @@ export default {
|
|
|
children: 'children',
|
|
|
label: 'name'
|
|
|
},
|
|
|
+ defaultcheckedkeys: [],
|
|
|
unitPa: {
|
|
|
buildingId: '',
|
|
|
buildingName: '',
|
|
@@ -29,26 +39,23 @@ export default {
|
|
|
mounted() {},
|
|
|
methods: {
|
|
|
submit() {
|
|
|
- debugger;
|
|
|
- if (this.unitPa.type === 'room') {
|
|
|
+ if (this.$refs.tenantstree.getCheckedNodes().length) {
|
|
|
+ let thisRoom = this.$refs.tenantstree.getCheckedNodes()[0];
|
|
|
+ let thisObj = this.$refs.tenantstree.getNode(thisRoom);
|
|
|
+ this.unitPa.type = thisRoom.type;
|
|
|
+ let newValueIds = thisRoom.id.split('-');
|
|
|
+ if (thisRoom.type == 'room') {
|
|
|
+ this.unitPa.buildingName = newValueIds.length == 4 ? thisObj.parent.parent.data.name : thisObj.parent.data.name;
|
|
|
+ this.unitPa.buildingId = newValueIds.length == 4 ? thisObj.parent.parent.data.value : thisObj.parent.data.value;
|
|
|
+ this.unitPa.unitName = newValueIds.length == 4 ? thisObj.parent.data.name : '';
|
|
|
+ this.unitPa.unitId = newValueIds.length == 4 ? thisObj.parent.data.value : '';
|
|
|
+ this.unitPa.houseName = thisRoom.name;
|
|
|
+ this.unitPa.houseId = thisRoom.value;
|
|
|
+ }
|
|
|
this.params.callback && this.params.callback(this.unitPa);
|
|
|
this.$emit('close');
|
|
|
} else {
|
|
|
- this.$message.error('请先选择到房间');
|
|
|
- return;
|
|
|
- }
|
|
|
- },
|
|
|
- treeClick(e) {
|
|
|
- this.unitPa.type = e.type;
|
|
|
- let newValueIds = e.id.split('-');
|
|
|
- let thisObj = this.$refs.tenantstree.getNode(e);
|
|
|
- if (e.type == 'room') {
|
|
|
- this.unitPa.buildingName = newValueIds.length == 4 ? thisObj.parent.parent.data.name : thisObj.parent.data.name;
|
|
|
- this.unitPa.buildingId = newValueIds.length == 4 ? thisObj.parent.parent.data.value : thisObj.parent.data.value;
|
|
|
- this.unitPa.unitName = newValueIds.length == 4 ? thisObj.parent.data.name : '';
|
|
|
- this.unitPa.unitId = newValueIds.length == 4 ? thisObj.parent.data.value : '';
|
|
|
- this.unitPa.houseName = e.name;
|
|
|
- this.unitPa.houseId = e.value;
|
|
|
+ this.$message.error('请选择房间或取消');
|
|
|
}
|
|
|
},
|
|
|
dimension(arr) {
|
|
@@ -63,6 +70,18 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ checkChange(data, checked) {
|
|
|
+ if (checked) {
|
|
|
+ if (this.$refs.tenantstree.getCheckedNodes().length > 1) {
|
|
|
+ this.$message({
|
|
|
+ message: '只能选择一个房间!',
|
|
|
+ type: 'error',
|
|
|
+ showClose: true
|
|
|
+ });
|
|
|
+ this.$refs.tenantstree.setChecked(data, false);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
CheckChinese(val, name) {
|
|
|
var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
|
|
|
let newVal = val;
|
|
@@ -70,16 +89,30 @@ export default {
|
|
|
newVal = val + name;
|
|
|
}
|
|
|
return newVal;
|
|
|
+ },
|
|
|
+ filterTreeData(trData) {
|
|
|
+ trData.map((item, index) => {
|
|
|
+ if (this.isNotEmpty(item.children)) {
|
|
|
+ item.disabled = true;
|
|
|
+ this.filterTreeData(item.children);
|
|
|
+ } else {
|
|
|
+ item.disabled = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ isNotEmpty(arr) {
|
|
|
+ return arr && Array.isArray(arr) && arr.length > 0;
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.dimension(this.params.tenantsTree);
|
|
|
+ this.filterTreeData(this.params.tenantsTree);
|
|
|
this.tenantsTree = this.params.tenantsTree;
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-.thisColor /deep/ .el-tree .is-current {
|
|
|
- color: #56c6ff;
|
|
|
-}
|
|
|
+// .thisColor /deep/ .el-tree .is-current {
|
|
|
+// color: #56c6ff;
|
|
|
+// }
|
|
|
</style>
|