tntd 2.8.0-beta.3 → 3.0.0-beta.1

package/es/tntd-layout/OrgAppList.js

@@ -1,19 +1,15 @@
-import _get from "lodash/get";
 import React, { useState, useEffect } from 'react';
 import styled, { withTheme, createGlobalStyle } from 'styled-components';
+import { get } from 'lodash';
 import Input from '../input';
 import Select from '../select';
 import TreeSelect from '../tree-select';
-import { getCurrentAppStore, setCurrentAppStore, getCurrentOrgStore, setCurrentOrgStore, getCurrentOrgTreeStore, setCurrentOrgTreeStore } from './storage';
+import { getCurrentAppStore, setCurrentAppStore, getCurrentOrgStore, setCurrentOrgStore, getCurrentOrgTreeStore, setCurrentOrgTreeStore, } from './storage';
 import { traverseTree } from '../utils';
-const {
-  Group: InputGroup
-} = Input;
-const {
-  Option
-} = Select;
+const { Group: InputGroup } = Input;
+const { Option } = Select;
 // 机构+应用UI
-const OrgAppsInputGroup = styled(InputGroup)`
+const OrgAppsInputGroup = styled(InputGroup) `
   display: inline-block !important;
   width: auto !important;
   min-width: 260px;
@@ -67,7 +63,7 @@ const OrgAppsInputGroup = styled(InputGroup)`
 
     // 删除色系差异
     // .tnt-themeS3.hasHeaderTabs &{
-    //     background: ${props => `${props.theme.blueBgColor} !important`}; //#1D4295 !important;
+    //     background: ${(props) => `${props.theme.blueBgColor} !important`}; //#1D4295 !important;
     //     color: rgba(255,255,255,0.8);
     //     border-color: rgba(255,255,255,0.5);
     // }
@@ -91,7 +87,7 @@ const OrgAppsInputGroup = styled(InputGroup)`
   }
 `;
 // 只展示机构
-const AppTreeSelect = styled(TreeSelect)`
+const AppTreeSelect = styled(TreeSelect) `
   min-width: 160px;
   height: 28px;
   line-height: 28;
@@ -131,7 +127,7 @@ const AppTreeSelect = styled(TreeSelect)`
     // }
 
     // .tnt-themeS3.hasHeaderTabs &{
-    //     background: ${props => `${props.theme.blueBgColor} !important`}; //#1D4295
+    //     background: ${(props) => `${props.theme.blueBgColor} !important`}; //#1D4295
     //     color: rgba(255,255,255,0.8);
     //     border-color: rgba(255,255,255,0.5);
     // }
@@ -153,7 +149,7 @@ const AppTreeSelect = styled(TreeSelect)`
     margin-left: 20px;
   }
 `;
-const GlobalStyle = createGlobalStyle`
+const GlobalStyle = createGlobalStyle `
     .org-tree-select {
         &.ant-select-tree-dropdown .ant-select-dropdown-search{
             padding: 10px;
@@ -240,206 +236,141 @@ const GlobalStyle = createGlobalStyle`
         }
     }
 `;
-export default withTheme(props => {
-  const {
-    orgAppShow,
-    selectedOrgKey,
-    orgList,
-    orgTreeConfig,
-    onOrgChange,
-    selectedAppKey,
-    orgAppList = [],
-    onAppChange,
-    headerTabs
-  } = props;
-  const orgListFormatData = traverseTree([orgList], item => {
-    item.title = item.name;
-    item.value = item.uuid;
-    item.key = item.uuid;
-  });
-  // 初始化数据函数
-  const getInitialSelected = (selectedKey, currentStore, dataList, type) => {
-    const findByKey = selectedKey => {
-      let find;
-      traverseTree(dataList, item => {
-        if (item.key === selectedKey) {
-          find = item;
-          return false;
-        }
-      });
-      return find;
-    };
-    const current = findByKey(selectedKey || _get(currentStore, 'key'));
-    if (type) {
-      return current;
-    }
-    return current || dataList[0];
-  };
-  // 初始化数据函数机构树
-  const getInitialSelectedTree = (selecteds, dataList) => {
-    if (selecteds.length) {
-      return selecteds;
-    } else {
-      const temp = dataList.map(res => {
-        return {
-          label: res.title,
-          value: res.uuid
-        };
-      });
-      setCurrentOrgTreeStore(temp);
-      return temp;
-    }
-  };
-  // 初始化值
-  // 机构
-  const [selectedOrg, setSelectedOrg] = useState(getInitialSelected(selectedOrgKey, getCurrentOrgStore(), orgListFormatData));
-  // 机构树
-  const [selectedOrgTree, setSelectedOrgTree] = useState(getInitialSelectedTree(getCurrentOrgTreeStore(), orgListFormatData));
-  // 应用
-  const [selectedApp, setSelectedApp] = useState(getInitialSelected(selectedAppKey, getCurrentAppStore(), orgAppList, 'default'));
-  // org变化事件
-  const changeOrg = (org = {}) => {
-    setSelectedOrg(org);
-    setCurrentOrgStore({
-      name: org === null || org === void 0 ? void 0 : org.name,
-      key: org === null || org === void 0 ? void 0 : org.key,
-      code: org === null || org === void 0 ? void 0 : org.code
+export default withTheme((props) => {
+    const { orgAppShow, selectedOrgKey, orgList, orgTreeConfig, onOrgChange, selectedAppKey, orgAppList = [], onAppChange, headerTabs, } = props;
+    const orgListFormatData = traverseTree([orgList], (item) => {
+        item.title = item.name;
+        item.value = item.uuid;
+        item.key = item.uuid;
     });
-    onOrgChange && onOrgChange(org);
-  };
-  const changeOrgTree = (val = []) => {
-    if (!val.length) {
-      val = orgListFormatData.map(res => {
-        return {
-          label: res.title,
-          value: res.uuid
+    // 初始化数据函数
+    const getInitialSelected = (selectedKey, currentStore, dataList, type) => {
+        const findByKey = (selectedKey) => {
+            let find;
+            traverseTree(dataList, (item) => {
+                if (item.key === selectedKey) {
+                    find = item;
+                    return false;
+                }
+            });
+            return find;
         };
-      });
-    }
-    setSelectedOrgTree(val);
-    setCurrentOrgTreeStore(val);
-    onOrgChange && onOrgChange(val);
-  };
-  // app变化事件
-  const changeApp = app => {
-    setSelectedApp(app);
-    setCurrentAppStore(app);
-    onAppChange && onAppChange(app);
-  };
-  useEffect(() => {
-    // 监听org机构
-    const newOrg = getInitialSelected(selectedOrgKey, getCurrentOrgStore(), orgListFormatData);
-    if ((newOrg === null || newOrg === void 0 ? void 0 : newOrg.key) !== (selectedOrg === null || selectedOrg === void 0 ? void 0 : selectedOrg.key)) {
-      changeOrg(newOrg);
-    }
-    // 监听应用
-    const newApp = getInitialSelected(selectedAppKey, getCurrentAppStore(), orgAppList);
-    if ((newApp === null || newApp === void 0 ? void 0 : newApp.key) !== (selectedApp === null || selectedApp === void 0 ? void 0 : selectedApp.key)) {
-      changeApp(newApp);
-    }
-  }, [orgList, selectedOrgKey, selectedAppKey, orgAppList]);
-  // 如果是多签页的模式 则居右对齐
-  let [treeSelectPosition, selectPosition] = [{}, {}];
-  if (headerTabs) {
-    treeSelectPosition = {
-      dropdownPopupAlign: {
-        points: ['tr', 'br']
-      }
+        const current = findByKey(selectedKey || get(currentStore, 'key'));
+        if (type) {
+            return current;
+        }
+        return current || dataList[0];
     };
-    selectPosition = {
-      dropdownAlign: {
-        points: ['tr', 'br']
-      }
+    // 初始化数据函数机构树
+    const getInitialSelectedTree = (selecteds, dataList) => {
+        if (selecteds.length) {
+            return selecteds;
+        }
+        else {
+            const temp = dataList.map((res) => {
+                return {
+                    label: res.title,
+                    value: res.uuid,
+                };
+            });
+            setCurrentOrgTreeStore(temp);
+            return temp;
+        }
     };
-  }
-  let orgTreeConfigProp = {};
-  if (orgTreeConfig) {
-    orgTreeConfigProp = Object.assign({
-      dropdownClassName: 'org-tree-check-select',
-      treeCheckable: true,
-      treeCheckStrictly: true,
-      onChange: val => {
-        changeOrgTree(val);
-      },
-      value: selectedOrgTree
-    }, orgTreeConfig);
-  } else {
-    orgTreeConfigProp = {
-      dropdownClassName: 'org-tree-select',
-      onChange: orgKey => {
-        let findItem;
-        traverseTree(orgListFormatData, node => {
-          if (node.key === orgKey) {
-            findItem = node;
-            return false;
-          }
+    // 初始化值
+    // 机构
+    const [selectedOrg, setSelectedOrg] = useState(getInitialSelected(selectedOrgKey, getCurrentOrgStore(), orgListFormatData));
+    // 机构树
+    const [selectedOrgTree, setSelectedOrgTree] = useState(getInitialSelectedTree(getCurrentOrgTreeStore(), orgListFormatData));
+    // 应用
+    const [selectedApp, setSelectedApp] = useState(getInitialSelected(selectedAppKey, getCurrentAppStore(), orgAppList, 'default'));
+    // org变化事件
+    const changeOrg = (org = {}) => {
+        setSelectedOrg(org);
+        setCurrentOrgStore({
+            name: org === null || org === void 0 ? void 0 : org.name,
+            key: org === null || org === void 0 ? void 0 : org.key,
+            code: org === null || org === void 0 ? void 0 : org.code,
         });
-        changeOrg(findItem);
-      },
-      value: _get(selectedOrg, 'key')
+        onOrgChange && onOrgChange(org);
     };
-  }
-  if (!orgAppShow) {
-    return React.createElement(React.Fragment, null, React.createElement(AppTreeSelect, Object.assign({
-      placeholder: "\u9009\u62E9\u673A\u6784",
-      searchPlaceholder: "\u673A\u6784\u540D\u79F0",
-      treeNodeFilterProp: "title",
-      showSearch: true,
-      treeData: orgListFormatData,
-      treeDefaultExpandAll: true
-    }, treeSelectPosition, {
-      style: {
-        width: 160,
-        height: 28,
-        lineHeight: 28
-      },
-      dropdownStyle: {
-        maxHeight: 300,
-        overflow: 'auto',
-        width: 320
-      }
-    }, orgTreeConfigProp)), React.createElement(GlobalStyle, null));
-  }
-  return React.createElement(OrgAppsInputGroup, {
-    compact: true
-  }, React.createElement(TreeSelect, Object.assign({
-    placeholder: "\u9009\u62E9\u673A\u6784",
-    searchPlaceholder: "\u673A\u6784\u540D\u79F0",
-    treeNodeFilterProp: "title",
-    showSearch: true,
-    treeData: orgListFormatData,
-    treeDefaultExpandAll: true,
-    style: {
-      width: 130,
-      height: 28,
-      lineHeight: 28
-    },
-    dropdownStyle: {
-      maxHeight: 300,
-      overflow: 'auto',
-      width: 320
+    const changeOrgTree = (val = []) => {
+        if (!val.length) {
+            val = orgListFormatData.map((res) => {
+                return {
+                    label: res.title,
+                    value: res.uuid,
+                };
+            });
+        }
+        setSelectedOrgTree(val);
+        setCurrentOrgTreeStore(val);
+        onOrgChange && onOrgChange(val);
+    };
+    // app变化事件
+    const changeApp = (app) => {
+        setSelectedApp(app);
+        setCurrentAppStore(app);
+        onAppChange && onAppChange(app);
+    };
+    useEffect(() => {
+        // 监听org机构
+        const newOrg = getInitialSelected(selectedOrgKey, getCurrentOrgStore(), orgListFormatData);
+        if ((newOrg === null || newOrg === void 0 ? void 0 : newOrg.key) !== (selectedOrg === null || selectedOrg === void 0 ? void 0 : selectedOrg.key)) {
+            changeOrg(newOrg);
+        }
+        // 监听应用
+        const newApp = getInitialSelected(selectedAppKey, getCurrentAppStore(), orgAppList);
+        if ((newApp === null || newApp === void 0 ? void 0 : newApp.key) !== (selectedApp === null || selectedApp === void 0 ? void 0 : selectedApp.key)) {
+            changeApp(newApp);
+        }
+    }, [orgList, selectedOrgKey, selectedAppKey, orgAppList]);
+    // 如果是多签页的模式 则居右对齐
+    let [treeSelectPosition, selectPosition] = [{}, {}];
+    if (headerTabs) {
+        treeSelectPosition = {
+            dropdownPopupAlign: {
+                points: ['tr', 'br'],
+            },
+        };
+        selectPosition = {
+            dropdownAlign: {
+                points: ['tr', 'br'],
+            },
+        };
+    }
+    let orgTreeConfigProp = {};
+    if (orgTreeConfig) {
+        orgTreeConfigProp = Object.assign({ dropdownClassName: 'org-tree-check-select', treeCheckable: true, treeCheckStrictly: true, onChange: (val) => {
+                changeOrgTree(val);
+            }, value: selectedOrgTree }, orgTreeConfig);
+    }
+    else {
+        orgTreeConfigProp = {
+            dropdownClassName: 'org-tree-select',
+            onChange: (orgKey) => {
+                let findItem;
+                traverseTree(orgListFormatData, (node) => {
+                    if (node.key === orgKey) {
+                        findItem = node;
+                        return false;
+                    }
+                });
+                changeOrg(findItem);
+            },
+            value: get(selectedOrg, 'key'),
+        };
     }
-  }, orgTreeConfigProp)), React.createElement(GlobalStyle, null), React.createElement(Select, {
-    placeholder: "\u8BF7\u9009\u62E9",
-    showSearch: true,
-    optionFilterProp: "children",
-    onChange: appKey => {
-      changeApp(orgAppList.find(({
-        key
-      }) => key === appKey));
-    },
-    value: _get(selectedApp, 'key'),
-    style: {
-      width: 130,
-      height: 28,
-      lineHeight: 28
+    if (!orgAppShow) {
+        return (React.createElement(React.Fragment, null,
+            React.createElement(AppTreeSelect, Object.assign({ placeholder: "\u9009\u62E9\u673A\u6784", searchPlaceholder: "\u673A\u6784\u540D\u79F0", treeNodeFilterProp: "title", showSearch: true, treeData: orgListFormatData, treeDefaultExpandAll: true }, treeSelectPosition, { style: { width: 160, height: 28, lineHeight: 28 }, dropdownStyle: { maxHeight: 300, overflow: 'auto', width: 320 } }, orgTreeConfigProp)),
+            React.createElement(GlobalStyle, null)));
     }
-  }, orgAppList.map(({
-    key,
-    name
-  }) => React.createElement(Option, {
-    key: key,
-    value: key,
-    title: name
-  }, name))));
-});
+    return (React.createElement(OrgAppsInputGroup, { compact: true },
+        React.createElement(TreeSelect, Object.assign({ placeholder: "\u9009\u62E9\u673A\u6784", searchPlaceholder: "\u673A\u6784\u540D\u79F0", treeNodeFilterProp: "title", showSearch: true, treeData: orgListFormatData, treeDefaultExpandAll: true, style: { width: 130, height: 28, lineHeight: 28 }, dropdownStyle: { maxHeight: 300, overflow: 'auto', width: 320 } }, orgTreeConfigProp)),
+        React.createElement(GlobalStyle, null),
+        React.createElement(Select, { placeholder: "\u8BF7\u9009\u62E9", showSearch: true, optionFilterProp: "children", onChange: (appKey) => {
+                changeApp(orgAppList.find(({ key }) => key === appKey));
+            }, value: get(selectedApp, 'key'), style: { width: 130, height: 28, lineHeight: 28 } }, orgAppList.map(({ key, name }) => (React.createElement(Option, { key: key, value: key, title: name }, name))))));
+});
+//# sourceMappingURL=OrgAppList.js.map