@lm_fe/pages 0.1.201 → 0.2.2

package/dist/a_chunks/.root2.js

@@ -1,76 +1,104 @@
-import React from 'react';
-import classnames from 'classnames';
-import { CloseOutlined } from '@ant-design/icons';
-import { s as styleInject } from './index.js';
-import 'antd/es/row/style';
-import 'antd/es/row';
-import 'antd/es/col/style';
-import 'antd/es/col';
-import 'antd/es/list/style';
-import 'antd/es/list';
-import 'antd/es/tooltip/style';
-import 'antd/es/tooltip';
-import 'lodash/get';
-import 'antd/es/button/style';
-import 'antd/es/button';
-import 'antd/es/spin/style';
-import 'antd/es/spin';
-import '@lm_fe/components_m';
-import '@lm_fe/utils';
+import { b as __awaiter, c as __generator } from './index.js';
+import { Layout, Menu } from 'antd';
+import { debounce, get } from 'lodash';
+import React, { useState, useEffect } from 'react';
+import 'react-perfect-scrollbar/dist/css/styles.css';
+import { use_provoke } from '@lm_fe/provoke';
+import PerfectScrollbar from 'react-perfect-scrollbar';
+import { u as use_perm_tree, f as findIdsByChildId } from './utils.js';
 import '@lm_fe/components';
-import 'antd/es/form/style';
-import 'antd/es/form';
-import 'antd/es/result/style';
-import 'antd/es/result';
-import 'antd/es/menu/style';
-import 'antd/es/menu';
-import '@lm_fe/service';
-import 'antd/es/message/style';
-import 'antd/es/message';
-import 'antd/es/space/style';
-import 'antd/es/space';
+import '@lm_fe/utils';
+import 'classnames';
+import '@lm_fe/components_m';
 import '@lm_fe/env';
-import 'lodash/keys';
-import 'antd/es/divider/style';
-import 'antd/es/divider';
-var css_248z = ".index-module_my-tab-btn__TaDAm {\n  position: relative;\n  height: 36px;\n  padding: 4px 8px;\n  background-color: #fff;\n  color: #666;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  transition: all 0.4s;\n}\n.index-module_my-tab-btn__TaDAm:before {\n  content: '';\n  position: absolute;\n  top: 13px;\n  right: 0;\n  width: 1px;\n  height: 10px;\n  background-color: #ddd;\n}\n.index-module_my-tab-btn__TaDAm::after {\n  content: '';\n  display: inline-block !important;\n  position: absolute;\n  left: 0px;\n  bottom: 0;\n  width: 0;\n  height: 2px;\n  background-color: #0e318d;\n  left: 50%;\n}\n.index-module_my-tab-btn__TaDAm:hover {\n  color: #0e318d;\n  background-color: #eceef5;\n  cursor: pointer;\n}\n.index-module_my-tab-btn__TaDAm:hover .index-module_my-tab-btn-close__Ucy57 {\n  visibility: visible;\n}\n.index-module_my-tab-btn-icon-active__mwKzA,\n.index-module_my-tab-btn-active__eiK94 {\n  position: relative;\n  background-color: #dfe2eb;\n  color: #0e318d;\n}\n.index-module_my-tab-btn-icon-active__mwKzA:before,\n.index-module_my-tab-btn-active__eiK94:before {\n  background: transparent;\n}\n.index-module_my-tab-btn-icon-active__mwKzA::after,\n.index-module_my-tab-btn-active__eiK94::after {\n  transition: all 0.2s ease-out;\n  left: 0px;\n  width: calc(100%);\n}\n.index-module_my-tab-btn-icon-active__mwKzA .index-module_my-tab-btn-close__Ucy57,\n.index-module_my-tab-btn-active__eiK94 .index-module_my-tab-btn-close__Ucy57 {\n  visibility: visible;\n  transform: rotate(180deg);\n  transition: all 0.2s ease-out;\n}\n.index-module_my-tab-btn-icon-active__mwKzA .index-module_my-tab-btn-close__Ucy57 .anticon,\n.index-module_my-tab-btn-active__eiK94 .index-module_my-tab-btn-close__Ucy57 .anticon {\n  color: #666;\n}\n.index-module_my-tab-btn-title__TouVP {\n  padding: 0 20px 0 12px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  word-break: break-all;\n  text-align: center;\n  font-size: 14px;\n}\n.index-module_my-tab-btn-close__Ucy57 {\n  width: 18px;\n  height: 18px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 2px;\n  visibility: hidden;\n  position: absolute;\n  top: 9px;\n  right: 6px;\n}\n.index-module_my-tab-btn-close__Ucy57 .anticon {\n  font-size: 10px;\n  color: #999;\n}\n.index-module_my-tab-btn-close__Ucy57:hover {\n  background-color: #fff;\n}\n.index-module_my-tab-btn-close__Ucy57:hover .anticon {\n  color: #222;\n}\n";
-var styles = {
-  "my-tab-btn": "index-module_my-tab-btn__TaDAm",
-  "my-tab-btn-close": "index-module_my-tab-btn-close__Ucy57",
-  "my-tab-btn-icon-active": "index-module_my-tab-btn-icon-active__mwKzA",
-  "my-tab-btn-active": "index-module_my-tab-btn-active__eiK94",
-  "my-tab-btn-title": "index-module_my-tab-btn-title__TouVP"
-};
-styleInject(css_248z);
-function Layout_TabButton_Inner(props) {
-  var _a;
-  var _b = props.isActive,
-    isActive = _b === void 0 ? false : _b,
-    _c = props.closable,
-    closable = _c === void 0 ? true : _c,
-    title = props.title,
-    onClick = props.onClick,
-    onClose = props.onClose,
-    tabKey = props.tabKey;
-  var handleClickTab = function handleClickTab() {
-    onClick && onClick(tabKey);
-  };
-  var handleCloseTab = function handleCloseTab(e) {
-    e.stopPropagation();
-    onClose && onClose(tabKey);
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    id: tabKey,
-    className: classnames(styles['my-tab-btn'], (_a = {}, _a[styles['my-tab-btn-active']] = isActive, _a)),
-    onClick: handleClickTab
-  }, /*#__PURE__*/React.createElement("div", {
-    title: title,
-    className: styles['my-tab-btn-title']
-  }, title), closable && /*#__PURE__*/React.createElement("div", {
-    onClick: handleCloseTab,
-    className: styles['my-tab-btn-close'],
-    title: "\u5173\u95ED"
-  }, /*#__PURE__*/React.createElement(CloseOutlined, null)));
+import '@lm_fe/service';
+var collapsedWidth = 50;
+var width = 232;
+function Layout_Sider_Inner(props) {
+  var collapsed = use_provoke(function (s) {
+    return s.sys_layout;
+  }).collapsed;
+  var _a = use_perm_tree(),
+    permissions_tree = _a.permissions_tree,
+    permissions = _a.permissions;
+  var _b = useState(''),
+    activeKey = _b[0],
+    setActiveKey = _b[1];
+  var _c = useState([]),
+    openKeys = _c[0],
+    setOpenKeys = _c[1];
+  var pathname = props.location.pathname;
+  var _d = useState(false),
+    cc = _d[0];
+  _d[1];
+  var history = props.history,
+    updateTabs = props.updateTabs,
+    location = props.location;
+  useEffect(function () {
+    var ids = findIdsByChildId(permissions_tree !== null && permissions_tree !== void 0 ? permissions_tree : [], pathname);
+    setOpenKeys(ids);
+    setActiveKey(pathname);
+    return function () {};
+  }, [pathname]);
+  function handleMenuClick(e) {
+    return __awaiter(this, void 0, void 0, function () {
+      var key, keyPath, menu;
+      return __generator(this, function (_a) {
+        e.item, key = e.key, keyPath = e.keyPath;
+        if (key && key.indexOf('http') !== -1) {
+          window.open(key);
+          return [2];
+        }
+        menu = permissions[key];
+        console.log('click', {
+          e: e,
+          key: key,
+          menu: menu
+        });
+        updateTabs({
+          title: get(menu, 'name'),
+          key: get(menu, 'key'),
+          path: get(menu, 'key'),
+          search: get(location, 'search'),
+          closable: true
+        });
+        history.push(menu.key);
+        setOpenKeys(keyPath);
+        setActiveKey(key);
+        return [2];
+      });
+    });
+  }
+  function handleOpenChange(keys) {
+    setOpenKeys(keys);
+  }
+  var handleSync = debounce(function (ps) {
+    ps.update();
+  }, 600);
+  if (collapsed) return null;
+  return /*#__PURE__*/React.createElement(Layout.Sider, {
+    theme: "light",
+    collapsed: collapsed,
+    trigger: null,
+    collapsedWidth: 1
+  }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PerfectScrollbar, {
+    style: {
+      height: 'calc(100vh - 64px)',
+      overflowY: cc ? 'hidden' : 'auto'
+    },
+    options: {
+      suppressScrollX: true
+    },
+    onSync: handleSync
+  }, /*#__PURE__*/React.createElement(Menu, {
+    theme: "light",
+    mode: "inline",
+    inlineIndent: 18,
+    selectedKeys: [activeKey],
+    openKeys: openKeys,
+    onClick: handleMenuClick,
+    onOpenChange: handleOpenChange,
+    items: permissions_tree
+  })), /*#__PURE__*/React.createElement("footer", null, /*#__PURE__*/React.createElement("div", null))));
 }
-export { Layout_TabButton_Inner as default };
-//# sourceMappingURL=.root2.js.map
+export { collapsedWidth, Layout_Sider_Inner as default, width };