aldehyde 0.2.197 → 0.2.199

package/src/aldehyde/tree/tmpl-tree.tsx

@@ -1,678 +1,678 @@
-import React from "react";
-import {
-  Button,
-  Card,
-  Col,
-  Input,
-  Popconfirm,
-  Popover,
-  Row,
-  Space,
-  Tooltip,
-  Tree,
-  Typography,
-} from "antd";
-import {
-  AlignLeftOutlined,
-  DeleteOutlined,
-  EditOutlined,
-  PlusOutlined,
-  PlusSquareOutlined,
-  ReloadOutlined,
-} from "@ant-design/icons";
-// import './index.css';
-import Scrollbars from "react-custom-scrollbars";
-import { HydrocarbonService } from "../index";
-import TreeUtils, { TtmplNodeConfig } from "./tree-utils";
-import { TreeDataNode } from "./tree-utils";
-import { LocaleContext } from "../locale/LocaleProvider";
-
-const { Text, Title } = Typography;
-
-interface TmplTreeProps {
-  ttmplNodeConfig: TtmplNodeConfig;
-  currentId?: string;
-  doEditSub?: (
-    title: string,
-    ratmplId: string,
-    mainCode: string,
-    code?: string
-  ) => void;
-  doViewSub?: (
-    title: string,
-    ratmplId: string,
-    mainCode: string,
-    code?: string
-  ) => void;
-  doEditRoot?: (title: string, code?: string) => void;
-  doViewRoot?: (title: string, code?: string) => void;
-  doDelete?: (ratmplId: string, code?: string) => void;
-  doAddSub?: (
-    title: string,
-    ratmplId: string,
-    mainCode: string,
-    addTmplId: string
-  ) => void;
-}
-
-interface TmplTreeState {
-  data?: TreeDataNode[];
-  expandedKeys?: string[];
-  loadedKeys?: string[];
-  loading?: boolean;
-  drawMainCode?: string;
-  parentNodeData?: TreeDataNode;
-  currentNodeData?: TreeDataNode;
-  rootAddable?: boolean;
-  searchValue?: string;
-}
-
-class TmplTree extends React.PureComponent<TmplTreeProps, TmplTreeState> {
-  state = {
-    data: [],
-    expandedKeys: [],
-    loadedKeys: [],
-    loading: false,
-    currentEditKey: undefined,
-    parentNodeData: undefined,
-    currentNodeData: undefined,
-    rootAddable: false,
-    searchValue: undefined,
-  };
-
-  static defaultProps = {
-    draggable: false,
-    readOnly: false,
-  };
-  static contextType = LocaleContext;
-  context: React.ContextType<typeof LocaleContext>;
-
-  doDelete = async (node: TreeDataNode) => {
-    let { ttmplNodeConfig } = this.props;
-    let sourceId;
-    if (node.isLeaf) {
-      sourceId = ttmplNodeConfig.leafRatmplId;
-    } else {
-      sourceId = ttmplNodeConfig.branchRatmplId?ttmplNodeConfig.branchRatmplId:ttmplNodeConfig.rootLTmplConfig;
-    }
-    let res = await HydrocarbonService.deleteByCode(null, sourceId, [
-      node.code,
-    ]);
-    if (node.parent) {
-      await this.reloadData(node.parent.code);
-    }else{
-      await this.reloadData(null);
-    }
-  };
-
-  async componentDidMount() {
-    await this.refresh();
-  }
-
-  async componentDidUpdate(prevProps) {
-    let { ttmplNodeConfig: preTtmplNodeConfig } = prevProps;
-    let { ttmplNodeConfig } = this.props;
-
-    if (
-      !ttmplNodeConfig ||
-      (preTtmplNodeConfig && ttmplNodeConfig.id == preTtmplNodeConfig.id)
-    ) {
-      return;
-    }
-    await this.refresh();
-  }
-
-  async refresh() {
-    const { ttmplNodeConfig } = this.props;
-    if (!ttmplNodeConfig) {
-      return;
-    }
-    this.setState({
-      loading: true,
-    });
-    //let loadedKeys = [];
-    let data = await this.loadRootNodeData();
-    this.setState({
-      searchValue: null,
-      data,
-      rootAddable:
-        ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplAdd") > 0,
-      loading: false,
-    });
-  }
-
-  loadRootNodeData = async () => {
-    const { ttmplNodeConfig } = this.props;
-    let data = await TreeUtils.loadRootNodeData(ttmplNodeConfig);
-    return data;
-  };
-
-  async componentWillUnmount() {}
-
-  onExpand = async (
-    expandedKeys,
-    current: { expanded: boolean; node: TreeDataNode }
-  ) => {
-    const { ttmplNodeConfig } = this.props;
-    const { data } = this.state;
-    if (current.expanded) {
-      await TreeUtils.pushSameCodeNodeData([current.node], ttmplNodeConfig);
-    }
-    this.setState({
-      data: [...data],
-      expandedKeys,
-    });
-  };
-
-  onClickNode = (dataNode: TreeDataNode) => {
-    const {
-      doEditRoot,
-      doViewRoot,
-      doViewSub,
-      doEditSub,
-      ttmplNodeConfig,
-    } = this.props;
-    if (dataNode.parent) {
-      //说明是sub
-      if (dataNode.isLeaf) {
-        if (ttmplNodeConfig.leafLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
-          doEditSub(
-            ttmplNodeConfig.leafTitle,
-            ttmplNodeConfig.leafRatmplId,
-            dataNode.parent.code,
-            dataNode.code
-          );
-        } else if (
-          ttmplNodeConfig.leafLTmplConfig.buttons.indexOf("detail") > 0
-        ) {
-          doViewSub(
-            ttmplNodeConfig.leafTitle,
-            ttmplNodeConfig.leafRatmplId,
-            dataNode.parent.code,
-            dataNode.code
-          );
-        }
-      } else {
-        if (
-          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("dtmplEdit") > 0
-        ) {
-          doEditSub(
-            ttmplNodeConfig.branchTitle,
-            ttmplNodeConfig.branchRatmplId,
-            dataNode.parent.code,
-            dataNode.code
-          );
-        } else if (
-          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("detail") > 0
-        ) {
-          doViewSub(
-            ttmplNodeConfig.branchTitle,
-            ttmplNodeConfig.branchRatmplId,
-            dataNode.parent.code,
-            dataNode.code
-          );
-        }
-      }
-    } else {
-      //说明是root
-      //判断是否允许编辑
-      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
-        doEditRoot(ttmplNodeConfig.branchTitle, dataNode.code);
-      } else if (
-        ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("detail") > 0
-      ) {
-        doViewRoot(ttmplNodeConfig.branchTitle, dataNode.code);
-      }
-    }
-  };
-
-  stopPropagation = (e) => {
-    if (e.stopPropagation) {
-      //如果提供了事件对象，则这是一个非IE浏览器
-      e.stopPropagation();
-    } else {
-      //兼容IE的方式来取消事件冒泡
-      window.event.cancelBubble = true;
-    }
-  };
-
-  reloadData = async (branchCode: string) => {
-    const { ttmplNodeConfig } = this.props;
-    const { data, expandedKeys } = this.state;
-    let newData;
-    if (branchCode == null) {
-      //加载根
-      newData = await this.loadRootNodeData();
-      this.mergeRootData(data, newData);
-      this.setState({
-        data: newData,
-      });
-    } else {
-      //重新加载 await
-      //先找到树节点
-      let rdatas = [];
-      this.searchNode(data, branchCode, rdatas);
-      await TreeUtils.pushSameCodeNodeData(rdatas, ttmplNodeConfig);
-      let newExpandeds = [];
-      for (let d of rdatas) {
-        newExpandeds.push(d.key);
-      }
-      this.setState({
-        expandedKeys: [...expandedKeys, ...newExpandeds],
-        data: [...data],
-      });
-    }
-  };
-
-  mergeRootData = (data, newData) => {
-    if (newData && data) {
-      for (let nd of newData) {
-        for (let d of data) {
-          if (nd.code == d.code) {
-            nd.children = d.children;
-            break;
-          }
-        }
-      }
-    }
-  };
-
-  searchNode = (
-    data: TreeDataNode[],
-    brachCode: string,
-    result: TreeDataNode[]
-  ) => {
-    if (!data) {
-      return;
-    }
-    for (let d of data) {
-      if (d.code == brachCode) {
-        result.push(d);
-        break;
-      } else if (d.children.length > 0) {
-        //继续寻找
-        this.searchNode(d.children, brachCode, result);
-      }
-    }
-  };
-
-  getDeleteButton = (sourceId, node: TreeDataNode) => {
-    const { doDelete } = this.props;
-    const { translate } = this.context;
-    return (
-      <div
-        onClick={(e) => {
-          this.stopPropagation(e);
-        }}
-      >
-        <Popconfirm
-          placement="topLeft"
-          title={translate("${确定要删除吗}?")}
-          onConfirm={ async () =>  {
-            await doDelete(sourceId, node.code);
-            if (node.parent) {
-              await this.reloadData(node.parent.code);
-            }else{
-              await this.reloadData(null);
-            }
-          }}
-          okText={translate("${确定}")}
-          cancelText={translate("${取消}")}
-        >
-          <Tooltip>
-            <Button size={"small"} danger={true}>
-              <DeleteOutlined />
-            </Button>
-          </Tooltip>
-        </Popconfirm>
-      </div>
-    );
-  };
-
-  getAddButton = (
-    title: string,
-    icon: any,
-    ratmplId: string,
-    mainCode: any
-  ) => {
-    const { translate } = this.context;
-    const { doAddSub } = this.props;
-    return (
-      <Button
-        onClick={(e) => {
-          this.stopPropagation(e);
-          doAddSub(title, ratmplId, mainCode, null);
-        }}
-        size={"small"}
-      >
-        {icon}
-        {translate("${"+title+"}")}
-      </Button>
-    );
-  };
-
-  packageTitle = (dataNode) => {
-    const {
-      doEditRoot,
-      doViewRoot,
-      doViewSub,
-      doEditSub,
-      ttmplNodeConfig,
-    } = this.props;
-    const { translate } = this.context;
-    let buttons = [];
-    if (dataNode.parent) {
-      //说明是sub
-      if (dataNode.isLeaf) {
-        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplEdit") > 0) {
-          buttons.push(
-            <Button
-              onClick={(e) => {
-                this.stopPropagation(e);
-                doEditSub(
-                  ttmplNodeConfig.leafTitle,
-                  ttmplNodeConfig.leafRatmplId,
-                  dataNode.parent.code,
-                  dataNode.code
-                );
-              }}
-              size={"small"}
-            >
-              <EditOutlined />
-              {translate("${编辑}")}
-            </Button>
-          );
-        }
-        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("detail") > 0) {
-          buttons.push(
-            <Button
-              onClick={(e) => {
-                this.stopPropagation(e);
-                doViewSub(
-                  ttmplNodeConfig.leafTitle,
-                  ttmplNodeConfig.leafRatmplId,
-                  dataNode.parent.code,
-                  dataNode.code
-                );
-              }}
-              size={"small"}
-            >
-              <AlignLeftOutlined />
-              {translate("${查看}")}
-            </Button>
-          );
-        }
-        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("singleDelete") > 0) {
-          buttons.push(
-            this.getDeleteButton(ttmplNodeConfig.leafRatmplId, dataNode)
-          );
-        }
-        //节点上加操作
-        // if(ttmplNodeConfig.leafLTmplConfig?.rowActions.length > 0){
-        //   ttmplNodeConfig.leafLTmplConfig.rowActions.map((action) => {
-        //     buttons.push(
-        //         <Action
-        //             serverKey={null}
-        //             iconType={"icon"}
-        //             key={action.id}
-        //             data={[dataNode.data]}
-        //             actionConfig={action}
-        //             doAction={this.doRowAction}
-        //             buttonSize={"small"}
-        //             serial={1}
-        //         ></Action>
-        //     );
-        //   })
-        // }
-      } else if (ttmplNodeConfig.branchLTmplConfig) {
-        if (
-          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("dtmplEdit") > 0
-        ) {
-          buttons.push(
-            <Button
-              onClick={(e) => {
-                this.stopPropagation(e);
-                doEditSub(
-                  ttmplNodeConfig.branchTitle,
-                  ttmplNodeConfig.branchRatmplId,
-                  dataNode.parent.code,
-                  dataNode.code
-                );
-              }}
-              size={"small"}
-            >
-              <EditOutlined />
-              {translate("${编辑}")}
-            </Button>
-          );
-        }
-        if (ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("detail") > 0) {
-          buttons.push(
-            <Button
-              onClick={(e) => {
-                this.stopPropagation(e);
-                doViewSub(
-                  ttmplNodeConfig.branchTitle,
-                  ttmplNodeConfig.branchRatmplId,
-                  dataNode.parent.code,
-                  dataNode.code
-                );
-              }}
-              size={"small"}
-            >
-              <AlignLeftOutlined />
-              {translate("${查看}")}
-            </Button>
-          );
-        }
-
-        if (
-          ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("dtmplAdd") > 0
-        ) {
-          buttons.push(
-            this.getAddButton(
-              ttmplNodeConfig.branchTitle,
-              <PlusSquareOutlined />,
-              ttmplNodeConfig.branchRatmplId,
-              dataNode.code
-            )
-          );
-        }
-
-        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplAdd") > 0) {
-          buttons.push(
-            this.getAddButton(
-              ttmplNodeConfig.leafTitle,
-              <PlusOutlined />,
-              ttmplNodeConfig.leafRatmplId,
-              dataNode.code
-            )
-          );
-        }
-        if (
-          ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("singleDelete") > 0
-        ) {
-          buttons.push(
-            this.getDeleteButton(ttmplNodeConfig.branchRatmplId, dataNode)
-          );
-        }
-      }
-    } else {
-      //说明是root
-      //判断是否允许编辑
-      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
-        buttons.push(
-          <Button
-            onClick={(e) => {
-              this.stopPropagation(e);
-              doEditRoot(ttmplNodeConfig.branchTitle, dataNode.code);
-            }}
-            size={"small"}
-          >
-            <EditOutlined style={{ color: "blue" }} />
-            {translate("${编辑}")}
-          </Button>
-        );
-      }
-      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("detail") > 0) {
-        buttons.push(
-          <Button
-            onClick={(e) => {
-              this.stopPropagation(e);
-              doViewRoot(ttmplNodeConfig.branchTitle, dataNode.code);
-            }}
-            size={"small"}
-          >
-            <AlignLeftOutlined />
-            {translate("${查看}")}
-          </Button>
-        );
-      }
-      //debugger
-      if (ttmplNodeConfig.branchLTmplConfig) {
-        if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplAdd") > 0) {
-          buttons.push(
-            this.getAddButton(
-              ttmplNodeConfig.branchTitle,
-              <PlusSquareOutlined />,
-              ttmplNodeConfig.branchRatmplId,
-              dataNode.code
-            )
-          );
-        }
-      }
-      if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplAdd") > 0) {
-        buttons.push(
-          this.getAddButton(
-            ttmplNodeConfig.leafTitle,
-            <PlusOutlined />,
-            ttmplNodeConfig.leafRatmplId,
-            dataNode.code
-          )
-        );
-      }
-
-      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("singleDelete") > 0) {
-        buttons.push(
-          this.getDeleteButton(ttmplNodeConfig.branchRatmplId?ttmplNodeConfig.branchRatmplId:ttmplNodeConfig.rootGtmplId, dataNode)
-        );
-      }
-    }
-
-    if (buttons.length == 0) {
-      return dataNode.title;
-    } else {
-      return (
-        <Popover
-          zIndex={100}
-          content={
-            <>
-              <Space>{buttons}</Space>
-            </>
-          }
-          arrow={false}
-        >
-          {dataNode.title}
-        </Popover>
-      );
-    }
-  };
-
-  render() {
-    const { doEditRoot, ttmplNodeConfig } = this.props;
-    const {
-      data,
-      loading,
-      expandedKeys,
-      rootAddable,
-      searchValue,
-    } = this.state;
-    let treeData = data;
-    const { translate } = this.context;
-    if (searchValue) {
-      treeData = TreeUtils.filterTree(data, searchValue);
-    }
-    return (
-      <>
-        <Row>
-          <Col span={24}>
-            <Card
-              style={{ marginBottom: 0, width: "100%" }}
-              bordered={false}
-              bodyStyle={{ padding: "4px 2px 4px 8px" }}
-            >
-              <Row align="middle">
-                <Col span={8}>
-                  {rootAddable && doEditRoot ? (
-                    <Button
-                      type={"link"}
-                      onClick={() => doEditRoot(ttmplNodeConfig.branchTitle)}
-                    >
-                      {translate("${添加}")}
-                    </Button>
-                  ) : null}
-                </Col>
-                <Col span={16}>
-                  <Input.Search
-                    value={searchValue}
-                    allowClear
-                    placeholder={translate("${输入查找内容}")}
-                    onChange={(e) => {
-                      this.setState({
-                        searchValue: e.target.value,
-                      });
-                    }}
-                    onSearch={(value) => {
-                      this.refresh();
-                    }}
-                    enterButton={<ReloadOutlined />}
-                  />
-                </Col>
-              </Row>
-            </Card>
-          </Col>
-        </Row>
-        <Row>
-          <Col span={24}>
-            <Card
-              bodyStyle={{
-                padding: "4px 4px 4px 16px",
-                height: "80vh",
-                minWidth: "292px",
-              }}
-              loading={loading}
-            >
-              {treeData.length == 0 ? (
-                translate("${没有找到数据}")
-              ) : (
-                <Scrollbars
-                  style={{ height: "80vh" }}
-                  autoHide
-                  autoHideTimeout={1000}
-                >
-                  <Tree
-                    blockNode
-                    showLine={ttmplNodeConfig.showLine}
-                    checkable={false}
-                    expandedKeys={expandedKeys}
-                    onExpand={this.onExpand}
-                    titleRender={(nodeData) => {
-                      return (
-                        <div onClick={() => this.onClickNode(nodeData)}>
-                          {this.packageTitle(nodeData)}
-                        </div>
-                      );
-                    }}
-                    treeData={treeData}
-                  />
-                </Scrollbars>
-              )}
-            </Card>
-          </Col>
-        </Row>
-      </>
-    );
-  }
-}
-
-export default TmplTree;
+import React from "react";
+import {
+  Button,
+  Card,
+  Col,
+  Input,
+  Popconfirm,
+  Popover,
+  Row,
+  Space,
+  Tooltip,
+  Tree,
+  Typography,
+} from "antd";
+import {
+  AlignLeftOutlined,
+  DeleteOutlined,
+  EditOutlined,
+  PlusOutlined,
+  PlusSquareOutlined,
+  ReloadOutlined,
+} from "@ant-design/icons";
+// import './index.css';
+import Scrollbars from "react-custom-scrollbars";
+import { HydrocarbonService } from "../index";
+import TreeUtils, { TtmplNodeConfig } from "./tree-utils";
+import { TreeDataNode } from "./tree-utils";
+import { LocaleContext } from "../locale/LocaleProvider";
+
+const { Text, Title } = Typography;
+
+interface TmplTreeProps {
+  ttmplNodeConfig: TtmplNodeConfig;
+  currentId?: string;
+  doEditSub?: (
+    title: string,
+    ratmplId: string,
+    mainCode: string,
+    code?: string
+  ) => void;
+  doViewSub?: (
+    title: string,
+    ratmplId: string,
+    mainCode: string,
+    code?: string
+  ) => void;
+  doEditRoot?: (title: string, code?: string) => void;
+  doViewRoot?: (title: string, code?: string) => void;
+  doDelete?: (ratmplId: string, code?: string) => void;
+  doAddSub?: (
+    title: string,
+    ratmplId: string,
+    mainCode: string,
+    addTmplId: string
+  ) => void;
+}
+
+interface TmplTreeState {
+  data?: TreeDataNode[];
+  expandedKeys?: string[];
+  loadedKeys?: string[];
+  loading?: boolean;
+  drawMainCode?: string;
+  parentNodeData?: TreeDataNode;
+  currentNodeData?: TreeDataNode;
+  rootAddable?: boolean;
+  searchValue?: string;
+}
+
+class TmplTree extends React.PureComponent<TmplTreeProps, TmplTreeState> {
+  state = {
+    data: [],
+    expandedKeys: [],
+    loadedKeys: [],
+    loading: false,
+    currentEditKey: undefined,
+    parentNodeData: undefined,
+    currentNodeData: undefined,
+    rootAddable: false,
+    searchValue: undefined,
+  };
+
+  static defaultProps = {
+    draggable: false,
+    readOnly: false,
+  };
+  static contextType = LocaleContext;
+  context: React.ContextType<typeof LocaleContext>;
+
+  doDelete = async (node: TreeDataNode) => {
+    let { ttmplNodeConfig } = this.props;
+    let sourceId;
+    if (node.isLeaf) {
+      sourceId = ttmplNodeConfig.leafRatmplId;
+    } else {
+      sourceId = ttmplNodeConfig.branchRatmplId?ttmplNodeConfig.branchRatmplId:ttmplNodeConfig.rootLTmplConfig;
+    }
+    let res = await HydrocarbonService.deleteByCode(null, sourceId, [
+      node.code,
+    ]);
+    if (node.parent) {
+      await this.reloadData(node.parent.code);
+    }else{
+      await this.reloadData(null);
+    }
+  };
+
+  async componentDidMount() {
+    await this.refresh();
+  }
+
+  async componentDidUpdate(prevProps) {
+    let { ttmplNodeConfig: preTtmplNodeConfig } = prevProps;
+    let { ttmplNodeConfig } = this.props;
+
+    if (
+      !ttmplNodeConfig ||
+      (preTtmplNodeConfig && ttmplNodeConfig.id == preTtmplNodeConfig.id)
+    ) {
+      return;
+    }
+    await this.refresh();
+  }
+
+  async refresh() {
+    const { ttmplNodeConfig } = this.props;
+    if (!ttmplNodeConfig) {
+      return;
+    }
+    this.setState({
+      loading: true,
+    });
+    //let loadedKeys = [];
+    let data = await this.loadRootNodeData();
+    this.setState({
+      searchValue: null,
+      data,
+      rootAddable:
+        ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplAdd") > 0,
+      loading: false,
+    });
+  }
+
+  loadRootNodeData = async () => {
+    const { ttmplNodeConfig } = this.props;
+    let data = await TreeUtils.loadRootNodeData(ttmplNodeConfig);
+    return data;
+  };
+
+  async componentWillUnmount() {}
+
+  onExpand = async (
+    expandedKeys,
+    current: { expanded: boolean; node: TreeDataNode }
+  ) => {
+    const { ttmplNodeConfig } = this.props;
+    const { data } = this.state;
+    if (current.expanded) {
+      await TreeUtils.pushSameCodeNodeData([current.node], ttmplNodeConfig);
+    }
+    this.setState({
+      data: [...data],
+      expandedKeys,
+    });
+  };
+
+  onClickNode = (dataNode: TreeDataNode) => {
+    const {
+      doEditRoot,
+      doViewRoot,
+      doViewSub,
+      doEditSub,
+      ttmplNodeConfig,
+    } = this.props;
+    if (dataNode.parent) {
+      //说明是sub
+      if (dataNode.isLeaf) {
+        if (ttmplNodeConfig.leafLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
+          doEditSub(
+            ttmplNodeConfig.leafTitle,
+            ttmplNodeConfig.leafRatmplId,
+            dataNode.parent.code,
+            dataNode.code
+          );
+        } else if (
+          ttmplNodeConfig.leafLTmplConfig.buttons.indexOf("detail") > 0
+        ) {
+          doViewSub(
+            ttmplNodeConfig.leafTitle,
+            ttmplNodeConfig.leafRatmplId,
+            dataNode.parent.code,
+            dataNode.code
+          );
+        }
+      } else {
+        if (
+          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("dtmplEdit") > 0
+        ) {
+          doEditSub(
+            ttmplNodeConfig.branchTitle,
+            ttmplNodeConfig.branchRatmplId,
+            dataNode.parent.code,
+            dataNode.code
+          );
+        } else if (
+          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("detail") > 0
+        ) {
+          doViewSub(
+            ttmplNodeConfig.branchTitle,
+            ttmplNodeConfig.branchRatmplId,
+            dataNode.parent.code,
+            dataNode.code
+          );
+        }
+      }
+    } else {
+      //说明是root
+      //判断是否允许编辑
+      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
+        doEditRoot(ttmplNodeConfig.branchTitle, dataNode.code);
+      } else if (
+        ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("detail") > 0
+      ) {
+        doViewRoot(ttmplNodeConfig.branchTitle, dataNode.code);
+      }
+    }
+  };
+
+  stopPropagation = (e) => {
+    if (e.stopPropagation) {
+      //如果提供了事件对象，则这是一个非IE浏览器
+      e.stopPropagation();
+    } else {
+      //兼容IE的方式来取消事件冒泡
+      window.event.cancelBubble = true;
+    }
+  };
+
+  reloadData = async (branchCode: string) => {
+    const { ttmplNodeConfig } = this.props;
+    const { data, expandedKeys } = this.state;
+    let newData;
+    if (branchCode == null) {
+      //加载根
+      newData = await this.loadRootNodeData();
+      this.mergeRootData(data, newData);
+      this.setState({
+        data: newData,
+      });
+    } else {
+      //重新加载 await
+      //先找到树节点
+      let rdatas = [];
+      this.searchNode(data, branchCode, rdatas);
+      await TreeUtils.pushSameCodeNodeData(rdatas, ttmplNodeConfig);
+      let newExpandeds = [];
+      for (let d of rdatas) {
+        newExpandeds.push(d.key);
+      }
+      this.setState({
+        expandedKeys: [...expandedKeys, ...newExpandeds],
+        data: [...data],
+      });
+    }
+  };
+
+  mergeRootData = (data, newData) => {
+    if (newData && data) {
+      for (let nd of newData) {
+        for (let d of data) {
+          if (nd.code == d.code) {
+            nd.children = d.children;
+            break;
+          }
+        }
+      }
+    }
+  };
+
+  searchNode = (
+    data: TreeDataNode[],
+    brachCode: string,
+    result: TreeDataNode[]
+  ) => {
+    if (!data) {
+      return;
+    }
+    for (let d of data) {
+      if (d.code == brachCode) {
+        result.push(d);
+        break;
+      } else if (d.children.length > 0) {
+        //继续寻找
+        this.searchNode(d.children, brachCode, result);
+      }
+    }
+  };
+
+  getDeleteButton = (sourceId, node: TreeDataNode) => {
+    const { doDelete } = this.props;
+    const { translate } = this.context;
+    return (
+      <div
+        onClick={(e) => {
+          this.stopPropagation(e);
+        }}
+      >
+        <Popconfirm
+          placement="topLeft"
+          title={translate("${确定要删除吗}?")}
+          onConfirm={ async () =>  {
+            await doDelete(sourceId, node.code);
+            if (node.parent) {
+              await this.reloadData(node.parent.code);
+            }else{
+              await this.reloadData(null);
+            }
+          }}
+          okText={translate("${确定}")}
+          cancelText={translate("${取消}")}
+        >
+          <Tooltip>
+            <Button size={"small"} danger={true}>
+              <DeleteOutlined />
+            </Button>
+          </Tooltip>
+        </Popconfirm>
+      </div>
+    );
+  };
+
+  getAddButton = (
+    title: string,
+    icon: any,
+    ratmplId: string,
+    mainCode: any
+  ) => {
+    const { translate } = this.context;
+    const { doAddSub } = this.props;
+    return (
+      <Button
+        onClick={(e) => {
+          this.stopPropagation(e);
+          doAddSub(title, ratmplId, mainCode, null);
+        }}
+        size={"small"}
+      >
+        {icon}
+        {translate("${"+title+"}")}
+      </Button>
+    );
+  };
+
+  packageTitle = (dataNode) => {
+    const {
+      doEditRoot,
+      doViewRoot,
+      doViewSub,
+      doEditSub,
+      ttmplNodeConfig,
+    } = this.props;
+    const { translate } = this.context;
+    let buttons = [];
+    if (dataNode.parent) {
+      //说明是sub
+      if (dataNode.isLeaf) {
+        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplEdit") > 0) {
+          buttons.push(
+            <Button
+              onClick={(e) => {
+                this.stopPropagation(e);
+                doEditSub(
+                  ttmplNodeConfig.leafTitle,
+                  ttmplNodeConfig.leafRatmplId,
+                  dataNode.parent.code,
+                  dataNode.code
+                );
+              }}
+              size={"small"}
+            >
+              <EditOutlined />
+              {translate("${编辑}")}
+            </Button>
+          );
+        }
+        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("detail") > 0) {
+          buttons.push(
+            <Button
+              onClick={(e) => {
+                this.stopPropagation(e);
+                doViewSub(
+                  ttmplNodeConfig.leafTitle,
+                  ttmplNodeConfig.leafRatmplId,
+                  dataNode.parent.code,
+                  dataNode.code
+                );
+              }}
+              size={"small"}
+            >
+              <AlignLeftOutlined />
+              {translate("${查看}")}
+            </Button>
+          );
+        }
+        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("singleDelete") > 0) {
+          buttons.push(
+            this.getDeleteButton(ttmplNodeConfig.leafRatmplId, dataNode)
+          );
+        }
+        //节点上加操作
+        // if(ttmplNodeConfig.leafLTmplConfig?.rowActions.length > 0){
+        //   ttmplNodeConfig.leafLTmplConfig.rowActions.map((action) => {
+        //     buttons.push(
+        //         <Action
+        //             serverKey={null}
+        //             iconType={"icon"}
+        //             key={action.id}
+        //             data={[dataNode.data]}
+        //             actionConfig={action}
+        //             doAction={this.doRowAction}
+        //             buttonSize={"small"}
+        //             serial={1}
+        //         ></Action>
+        //     );
+        //   })
+        // }
+      } else if (ttmplNodeConfig.branchLTmplConfig) {
+        if (
+          ttmplNodeConfig.branchLTmplConfig.buttons.indexOf("dtmplEdit") > 0
+        ) {
+          buttons.push(
+            <Button
+              onClick={(e) => {
+                this.stopPropagation(e);
+                doEditSub(
+                  ttmplNodeConfig.branchTitle,
+                  ttmplNodeConfig.branchRatmplId,
+                  dataNode.parent.code,
+                  dataNode.code
+                );
+              }}
+              size={"small"}
+            >
+              <EditOutlined />
+              {translate("${编辑}")}
+            </Button>
+          );
+        }
+        if (ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("detail") > 0) {
+          buttons.push(
+            <Button
+              onClick={(e) => {
+                this.stopPropagation(e);
+                doViewSub(
+                  ttmplNodeConfig.branchTitle,
+                  ttmplNodeConfig.branchRatmplId,
+                  dataNode.parent.code,
+                  dataNode.code
+                );
+              }}
+              size={"small"}
+            >
+              <AlignLeftOutlined />
+              {translate("${查看}")}
+            </Button>
+          );
+        }
+
+        if (
+          ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("dtmplAdd") > 0
+        ) {
+          buttons.push(
+            this.getAddButton(
+              ttmplNodeConfig.branchTitle,
+              <PlusSquareOutlined />,
+              ttmplNodeConfig.branchRatmplId,
+              dataNode.code
+            )
+          );
+        }
+
+        if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplAdd") > 0) {
+          buttons.push(
+            this.getAddButton(
+              ttmplNodeConfig.leafTitle,
+              <PlusOutlined />,
+              ttmplNodeConfig.leafRatmplId,
+              dataNode.code
+            )
+          );
+        }
+        if (
+          ttmplNodeConfig.branchLTmplConfig?.buttons.indexOf("singleDelete") > 0
+        ) {
+          buttons.push(
+            this.getDeleteButton(ttmplNodeConfig.branchRatmplId, dataNode)
+          );
+        }
+      }
+    } else {
+      //说明是root
+      //判断是否允许编辑
+      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplEdit") > 0) {
+        buttons.push(
+          <Button
+            onClick={(e) => {
+              this.stopPropagation(e);
+              doEditRoot(ttmplNodeConfig.branchTitle, dataNode.code);
+            }}
+            size={"small"}
+          >
+            <EditOutlined style={{ color: "blue" }} />
+            {translate("${编辑}")}
+          </Button>
+        );
+      }
+      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("detail") > 0) {
+        buttons.push(
+          <Button
+            onClick={(e) => {
+              this.stopPropagation(e);
+              doViewRoot(ttmplNodeConfig.branchTitle, dataNode.code);
+            }}
+            size={"small"}
+          >
+            <AlignLeftOutlined />
+            {translate("${查看}")}
+          </Button>
+        );
+      }
+      //debugger
+      if (ttmplNodeConfig.branchLTmplConfig) {
+        if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("dtmplAdd") > 0) {
+          buttons.push(
+            this.getAddButton(
+              ttmplNodeConfig.branchTitle,
+              <PlusSquareOutlined />,
+              ttmplNodeConfig.branchRatmplId,
+              dataNode.code
+            )
+          );
+        }
+      }
+      if (ttmplNodeConfig.leafLTmplConfig?.buttons.indexOf("dtmplAdd") > 0) {
+        buttons.push(
+          this.getAddButton(
+            ttmplNodeConfig.leafTitle,
+            <PlusOutlined />,
+            ttmplNodeConfig.leafRatmplId,
+            dataNode.code
+          )
+        );
+      }
+
+      if (ttmplNodeConfig.rootLTmplConfig.buttons.indexOf("singleDelete") > 0) {
+        buttons.push(
+          this.getDeleteButton(ttmplNodeConfig.branchRatmplId?ttmplNodeConfig.branchRatmplId:ttmplNodeConfig.rootGtmplId, dataNode)
+        );
+      }
+    }
+
+    if (buttons.length == 0) {
+      return dataNode.title;
+    } else {
+      return (
+        <Popover
+          zIndex={100}
+          content={
+            <>
+              <Space>{buttons}</Space>
+            </>
+          }
+          arrow={false}
+        >
+          {dataNode.title}
+        </Popover>
+      );
+    }
+  };
+
+  render() {
+    const { doEditRoot, ttmplNodeConfig } = this.props;
+    const {
+      data,
+      loading,
+      expandedKeys,
+      rootAddable,
+      searchValue,
+    } = this.state;
+    let treeData = data;
+    const { translate } = this.context;
+    if (searchValue) {
+      treeData = TreeUtils.filterTree(data, searchValue);
+    }
+    return (
+      <>
+        <Row>
+          <Col span={24}>
+            <Card
+              style={{ marginBottom: 0, width: "100%" }}
+              bordered={false}
+              bodyStyle={{ padding: "4px 2px 4px 8px" }}
+            >
+              <Row align="middle">
+                <Col span={8}>
+                  {rootAddable && doEditRoot ? (
+                    <Button
+                      type={"link"}
+                      onClick={() => doEditRoot(ttmplNodeConfig.branchTitle)}
+                    >
+                      {translate("${添加}")}
+                    </Button>
+                  ) : null}
+                </Col>
+                <Col span={16}>
+                  <Input.Search
+                    value={searchValue}
+                    allowClear
+                    placeholder={translate("${输入查找内容}")}
+                    onChange={(e) => {
+                      this.setState({
+                        searchValue: e.target.value,
+                      });
+                    }}
+                    onSearch={(value) => {
+                      this.refresh();
+                    }}
+                    enterButton={<ReloadOutlined />}
+                  />
+                </Col>
+              </Row>
+            </Card>
+          </Col>
+        </Row>
+        <Row>
+          <Col span={24}>
+            <Card
+              bodyStyle={{
+                padding: "4px 4px 4px 16px",
+                height: "80vh",
+                minWidth: "292px",
+              }}
+              loading={loading}
+            >
+              {treeData.length == 0 ? (
+                translate("${没有找到数据}")
+              ) : (
+                <Scrollbars
+                  style={{ height: "80vh" }}
+                  autoHide
+                  autoHideTimeout={1000}
+                >
+                  <Tree
+                    blockNode
+                    showLine={ttmplNodeConfig.showLine}
+                    checkable={false}
+                    expandedKeys={expandedKeys}
+                    onExpand={this.onExpand}
+                    titleRender={(nodeData) => {
+                      return (
+                        <div onClick={() => this.onClickNode(nodeData)}>
+                          {this.packageTitle(nodeData)}
+                        </div>
+                      );
+                    }}
+                    treeData={treeData}
+                  />
+                </Scrollbars>
+              )}
+            </Card>
+          </Col>
+        </Row>
+      </>
+    );
+  }
+}
+
+export default TmplTree;