diff --git a/spug_web/src/pages/host/Group.js b/spug_web/src/pages/host/Group.js index ccf6a48..b29ddbf 100644 --- a/spug_web/src/pages/host/Group.js +++ b/spug_web/src/pages/host/Group.js @@ -124,7 +124,7 @@ export default observer(function () { } else { return ( - {nodeData.title}{nodeData.host_ids && nodeData.host_ids.length ? `(${nodeData.host_ids.length})` : null} + {nodeData.title}{nodeData.all_host_ids && nodeData.all_host_ids.length ? `(${nodeData.all_host_ids.length})` : null} ) } @@ -144,7 +144,7 @@ export default observer(function () { className={styles.dragBox} autoExpandParent draggable={draggable} - treeData={store.allTreeData} + treeData={store.treeData} titleRender={treeRender} expandedKeys={expands} selectedKeys={[store.group.key]} diff --git a/spug_web/src/pages/host/Selector.js b/spug_web/src/pages/host/Selector.js index 9882a7d..57a6610 100644 --- a/spug_web/src/pages/host/Selector.js +++ b/spug_web/src/pages/host/Selector.js @@ -11,18 +11,18 @@ export default observer(function (props) { const [selectedRowKeys, setSelectedRowKeys] = useState([]); useEffect(() => { - if (!store.selfTreeData.length) { + if (!store.treeData.length) { store.fetchRecords() store.fetchGroups() - .then(() => setGroup(store.selfTreeData[0])) + .then(() => setGroup(store.treeData[0])) } else { - setGroup(store.selfTreeData[0]) + setGroup(store.treeData[0]) } }, []) useEffect(() => { if (group.key) { - const records = store.records.filter(x => group.host_ids.includes(x.id)); + const records = store.records.filter(x => group.self_host_ids.includes(x.id)); setDataSource(records) } }, [group]) @@ -30,7 +30,7 @@ export default observer(function (props) { function treeRender(nodeData) { return ( - {nodeData.title}{nodeData.host_ids && nodeData.host_ids.length ? `(${nodeData.host_ids.length})` : null} + {nodeData.title}{nodeData.self_host_ids && nodeData.self_host_ids.length ? `(${nodeData.self_host_ids.length})` : null} ) } @@ -66,7 +66,7 @@ export default observer(function (props) { setGroup(node)} /> diff --git a/spug_web/src/pages/host/store.js b/spug_web/src/pages/host/store.js index 281ee8d..7d38041 100644 --- a/spug_web/src/pages/host/store.js +++ b/spug_web/src/pages/host/store.js @@ -3,10 +3,9 @@ * Copyright (c) * Released under the AGPL-3.0 License. */ -import { observable, computed } from 'mobx'; +import { observable, computed, autorun } from 'mobx'; import { message } from 'antd'; import http from 'libs/http'; -import lds from 'lodash'; class Store { @observable records = []; @@ -26,6 +25,14 @@ class Store { @observable f_name; @observable f_host; + constructor() { + autorun(() => { + for (let item of this.treeData) { + this._updateCounter(item) + } + }) + } + @computed get counter() { const counter = {}; for (let host of this.records) { @@ -40,25 +47,9 @@ class Store { return counter } - @computed get selfTreeData() { - const treeData = lds.cloneDeep(this.treeData); - for (let item of treeData) { - this._updateCounter(item, true) - } - return treeData - } - - @computed get allTreeData() { - const treeData = lds.cloneDeep(this.treeData); - for (let item of treeData) { - this._updateCounter(item, false) - } - return treeData - } - @computed get dataSource() { let records = []; - if (this.group.host_ids) records = this.records.filter(x => this.group.host_ids.includes(x.id)); + if (this.group.all_host_ids) records = this.records.filter(x => this.group.all_host_ids.includes(x.id)); if (this.f_name) records = records.filter(x => x.name.toLowerCase().includes(this.f_name.toLowerCase())); if (this.f_host) records = records.filter(x => x.hostname.toLowerCase().includes(this.f_host.toLowerCase())); return records @@ -111,14 +102,14 @@ class Store { this.selectorVisible = true; } - _updateCounter = (item, isSelf) => { - let host_ids = this.counter[item.key] || []; + _updateCounter = (item) => { + item.all_host_ids = item.self_host_ids = this.counter[item.key] || []; for (let child of item.children) { - const ids = this._updateCounter(child, isSelf) - if (!isSelf) host_ids = host_ids.concat(ids) + const ids = this._updateCounter(child) + item.all_host_ids = item.all_host_ids.concat(ids) } - item.host_ids = Array.from(new Set(host_ids)); - return item.host_ids + item.all_host_ids = Array.from(new Set(item.all_host_ids)); + return item.all_host_ids } }