diff --git a/render-process/Editor/index.tsx b/render-process/Editor/index.tsx index 364241e..5eb7307 100644 --- a/render-process/Editor/index.tsx +++ b/render-process/Editor/index.tsx @@ -25,7 +25,6 @@ export interface EditorProps { interface EditorState { curNodeId?: string; treeModel?: BehaviorTreeModel; - settings?: Settings; } export default class Editor extends React.Component { @@ -38,10 +37,19 @@ export default class Editor extends React.Component { private autoId: number; private undoStack: BehaviorNodeModel[] = []; private redoStack: BehaviorNodeModel[] = []; + private treeModel: BehaviorTreeModel; + private settings: Settings; + private data: GraphNodeModel; constructor(props: EditorProps) { super(props); this.ref = React.createRef(); + + this.settings = Utils.getRemoteSettings(); + const str = fs.readFileSync(this.props.filepath, "utf8"); + let tree: BehaviorTreeModel = JSON.parse(str); + this.data = Utils.createTreeData(tree.root, this.settings); + this.autoId = Utils.refreshNodeId(this.data); } componentDidMount() { @@ -255,20 +263,14 @@ export default class Editor extends React.Component { this.changeWithoutAnim(); }); - const settings = Utils.getRemoteSettings(); - - const str = fs.readFileSync(this.props.filepath, "utf8"); - let tree: BehaviorTreeModel = JSON.parse(str); - const data = Utils.createTreeData(tree.root, settings); - this.autoId = Utils.refreshNodeId(data); - graph.data(data); + graph.data(this.data); graph.render(); graph.fitCenter(); graph.set("animate", true); this.graph = graph; - this.setState({ treeModel: tree, settings }); + this.forceUpdate(); } onSelectNode(curNodeId: string | null) { @@ -286,7 +288,7 @@ export default class Editor extends React.Component { createNode(name: string) { console.log("editor create node", name); - const { curNodeId, settings } = this.state; + const { curNodeId } = this.state; if (!curNodeId) { message.warn("未选中节点"); return; @@ -300,7 +302,7 @@ export default class Editor extends React.Component { if (!curNodeData.children) { curNodeData.children = []; } - curNodeData.children.push(Utils.createTreeData(newNodeData, settings)); + curNodeData.children.push(Utils.createTreeData(newNodeData, this.settings)); this.changeWithoutAnim(); } @@ -369,7 +371,7 @@ export default class Editor extends React.Component { return; } this.pushUndoStack(); - const data = Utils.createTreeData(JSON.parse(str), this.state.settings); + const data = Utils.createTreeData(JSON.parse(str), this.settings); this.autoId = Utils.refreshNodeId(data, this.autoId); this.onSelectNode(null); if (!curNodeData.children) { @@ -386,7 +388,7 @@ export default class Editor extends React.Component { useStackData(data: BehaviorNodeModel) { this.graph.set("animate", false); - this.graph.changeData(Utils.createTreeData(data, this.state.settings)); + this.graph.changeData(Utils.createTreeData(data, this.settings)); this.graph.layout(true); this.graph.set("animate", true); } @@ -423,7 +425,7 @@ export default class Editor extends React.Component { } render() { - const { curNodeId, treeModel, settings } = this.state; + const { curNodeId, treeModel } = this.state; var curNode: any; if (curNodeId) { curNode = this.graph.findDataById(curNodeId); @@ -437,11 +439,11 @@ export default class Editor extends React.Component { {curNode ? ( { if (forceUpdate) { const data: any = this.graph.findDataById(id); - data.conf = settings.getNodeConf(data.name); + data.conf = this.settings.getNodeConf(data.name); data.size = Utils.calcTreeNodeSize(data); this.changeWithoutAnim(); } diff --git a/render-process/TreeTabs.tsx b/render-process/TreeTabs.tsx index cff3d59..36cb54b 100644 --- a/render-process/TreeTabs.tsx +++ b/render-process/TreeTabs.tsx @@ -11,7 +11,7 @@ import { BehaviorTreeModel } from "../common/BehaviorTreeModel"; const { TabPane } = Tabs; interface TreeTabsProps { - onTabSelected:(path:string)=>void; + onTabSelected: (path: string) => void; } interface TreeTabsState { @@ -76,11 +76,17 @@ export default class TreeTabs extends Component { }); } + componentDidUpdate() { + setTimeout(() => { + this.props.onTabSelected(this.state.curPath); + }, 100); + } + getOpenTreesModel() { const trees: BehaviorTreeModel[] = [] for (let k in this.editors) { let editor = this.editors[k]; - if(editor) { + if (editor) { trees.push(editor.save()); } } @@ -99,13 +105,9 @@ export default class TreeTabs extends Component { if (this.state.filepaths.indexOf(path) < 0) { const filepaths = this.state.filepaths; filepaths.push(path); - this.setState({ filepaths, curPath: path },()=>{ - this.props.onTabSelected(path); - }); + this.setState({ filepaths, curPath: path }); } else { - this.setState({ curPath: path },()=>{ - this.props.onTabSelected(path); - }); + this.setState({ curPath: path }); } } @@ -113,10 +115,10 @@ export default class TreeTabs extends Component { const index = this.state.filepaths.indexOf(path); if (index >= 0) { const filepaths = this.state.filepaths; - filepaths.splice(index,1); + filepaths.splice(index, 1); const length = filepaths.length; - this.setState({ filepaths, curPath: length>0?filepaths[length-1]:null }); - } + this.setState({ filepaths, curPath: length > 0 ? filepaths[length - 1] : null }); + } } render() { @@ -134,9 +136,7 @@ export default class TreeTabs extends Component { defaultActiveKey={curPath} activeKey={curPath} onChange={(activeKey) => { - this.setState({ curPath: activeKey },()=>{ - this.props.onTabSelected(activeKey); - }); + this.setState({ curPath: activeKey }); }} onEdit={(targetKey, action) => { if (action == "remove") {