tntd 1.4.18 → 1.4.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Ellipsis/index.js +1 -1
- package/components/Layout/Avatar.js +4 -4
- package/components/Layout/EnterpriseLayout/Avatar.js +10 -7
- package/components/Layout/EnterpriseLayout/Language.js +5 -3
- package/components/Layout/EnterpriseLayout/Theme.js +6 -7
- package/components/Layout/EnterpriseLayout/index.js +1 -1
- package/components/Layout/HeaderActions.js +13 -10
- package/components/Layout/HeaderTabs.js +13 -14
- package/components/Layout/Layout.js +2 -0
- package/components/Layout/index.js +2 -1
- package/components/Layout/storage.js +12 -2
- package/components/Page/index.js +2 -2
- package/components/locale.js +7 -2
- package/dist/1.tntd.js +1 -12
- package/dist/stats.json +28426 -28000
- package/dist/tntd.css +1 -1
- package/dist/tntd.js +13 -7
- package/es/ArrayInput/icon.js +5 -5
- package/es/ArrayInput/index.js +76 -108
- package/es/AuthContext.js +1 -1
- package/es/Columns/index.js +31 -38
- package/es/DevelopmentLogin/LoginModal.js +32 -45
- package/es/DevelopmentLogin/index.js +13 -17
- package/es/Ellipsis/Svg/CopySVG.js +13 -13
- package/es/Ellipsis/Svg/TickSVG.js +8 -8
- package/es/Ellipsis/index.js +59 -70
- package/es/Handle/index.js +25 -35
- package/es/Icon/fonts/iconfont.js +7 -12
- package/es/Icon/index.js +10 -13
- package/es/Img/Contain.js +24 -29
- package/es/Img/Cover.js +40 -54
- package/es/Img/index.js +36 -45
- package/es/Layout/ActionsContext.js +3 -2
- package/es/Layout/AppList.js +37 -92
- package/es/Layout/Application.js +26 -72
- package/es/Layout/Avatar.js +32 -69
- package/es/Layout/CompatibleLanguage.js +39 -94
- package/es/Layout/EnterpriseLayout/Avatar.js +49 -79
- package/es/Layout/EnterpriseLayout/Language.js +19 -34
- package/es/Layout/EnterpriseLayout/Theme.js +23 -37
- package/es/Layout/EnterpriseLayout/index.js +14 -16
- package/es/Layout/GlobalNavigation/NavigationPopup.js +59 -170
- package/es/Layout/GlobalNavigation/index.js +20 -54
- package/es/Layout/Header.js +25 -46
- package/es/Layout/HeaderActions.js +52 -63
- package/es/Layout/HeaderNavs.js +20 -47
- package/es/Layout/HeaderTabs.js +61 -115
- package/es/Layout/Iconfont.js +1 -1
- package/es/Layout/Language.js +14 -32
- package/es/Layout/Layout.js +88 -108
- package/es/Layout/Logo.js +16 -32
- package/es/Layout/OrgAppList.js +62 -107
- package/es/Layout/SideMenu.js +63 -124
- package/es/Layout/Theme.js +23 -61
- package/es/Layout/index.js +29 -36
- package/es/Layout/paaslayout/CompactSideMenu.js +35 -74
- package/es/Layout/paaslayout/Header.js +22 -45
- package/es/Layout/paaslayout/Logo.js +3 -13
- package/es/Layout/paaslayout/SideMenu.js +39 -78
- package/es/Layout/paaslayout/index.js +75 -102
- package/es/Layout/storage.js +26 -9
- package/es/LoadingButton/index.js +15 -24
- package/es/Modal/index.js +38 -46
- package/es/Page/Box.js +34 -41
- package/es/Page/index.js +54 -68
- package/es/Page/utils.js +0 -5
- package/es/QueryForm/Field/Checkbox.js +5 -9
- package/es/QueryForm/Field/Select.js +31 -41
- package/es/QueryForm/Field/SelectInput.js +26 -41
- package/es/QueryForm/Field/fieldsMap.js +0 -1
- package/es/QueryForm/Field/index.js +41 -71
- package/es/QueryForm/createActions.js +6 -7
- package/es/QueryForm/index.js +76 -135
- package/es/QueryListScene/List.js +74 -128
- package/es/QueryListScene/QueryForm.js +46 -81
- package/es/QueryListScene/QueryListScene.js +25 -40
- package/es/QueryListScene/Title.js +3 -3
- package/es/QueryListScene/Toolbar.js +11 -12
- package/es/Select/DropDownWrap.js +29 -50
- package/es/Select/index.js +135 -231
- package/es/Table/ResizableTable/index.js +26 -40
- package/es/Table/index.js +18 -16
- package/es/Title/index.js +21 -23
- package/es/locale.js +9 -7
- package/es/utils/checkAuth.js +3 -5
- package/es/utils/findMenuInfoByPath.js +0 -4
- package/es/utils/index.js +12 -23
- package/lib/ArrayInput/icon.js +6 -6
- package/lib/ArrayInput/index.js +78 -127
- package/lib/AuthContext.js +1 -4
- package/lib/Columns/index.js +31 -47
- package/lib/DevelopmentLogin/LoginModal.js +32 -58
- package/lib/DevelopmentLogin/index.js +16 -27
- package/lib/Ellipsis/Svg/CopySVG.js +13 -15
- package/lib/Ellipsis/Svg/TickSVG.js +8 -10
- package/lib/Ellipsis/index.js +58 -81
- package/lib/Handle/index.js +25 -47
- package/lib/Icon/fonts/iconfont.js +7 -12
- package/lib/Icon/index.js +11 -20
- package/lib/Img/Contain.js +24 -34
- package/lib/Img/Cover.js +42 -65
- package/lib/Img/index.js +36 -51
- package/lib/Layout/ActionsContext.js +1 -4
- package/lib/Layout/AppList.js +40 -118
- package/lib/Layout/Application.js +26 -86
- package/lib/Layout/Avatar.js +35 -89
- package/lib/Layout/CompatibleLanguage.js +39 -110
- package/lib/Layout/EnterpriseLayout/Avatar.js +52 -101
- package/lib/Layout/EnterpriseLayout/Language.js +21 -49
- package/lib/Layout/EnterpriseLayout/Theme.js +22 -46
- package/lib/Layout/EnterpriseLayout/index.js +14 -23
- package/lib/Layout/GlobalNavigation/NavigationPopup.js +59 -186
- package/lib/Layout/GlobalNavigation/index.js +23 -74
- package/lib/Layout/Header.js +28 -63
- package/lib/Layout/HeaderActions.js +48 -74
- package/lib/Layout/HeaderNavs.js +23 -61
- package/lib/Layout/HeaderTabs.js +58 -126
- package/lib/Layout/Iconfont.js +1 -5
- package/lib/Layout/Language.js +17 -48
- package/lib/Layout/Layout.js +90 -128
- package/lib/Layout/Logo.js +19 -43
- package/lib/Layout/OrgAppList.js +64 -127
- package/lib/Layout/SideMenu.js +65 -143
- package/lib/Layout/Theme.js +23 -73
- package/lib/Layout/createActions.js +0 -5
- package/lib/Layout/images/index.js +0 -28
- package/lib/Layout/index.js +33 -57
- package/lib/Layout/paaslayout/CompactSideMenu.js +35 -84
- package/lib/Layout/paaslayout/Header.js +22 -55
- package/lib/Layout/paaslayout/Logo.js +3 -19
- package/lib/Layout/paaslayout/SideMenu.js +39 -87
- package/lib/Layout/paaslayout/index.js +77 -122
- package/lib/Layout/storage.js +29 -35
- package/lib/LoadingButton/index.js +15 -29
- package/lib/Modal/index.js +38 -53
- package/lib/Page/Box.js +34 -45
- package/lib/Page/index.js +54 -78
- package/lib/Page/utils.js +1 -9
- package/lib/QueryForm/Field/Checkbox.js +5 -13
- package/lib/QueryForm/Field/Select.js +33 -53
- package/lib/QueryForm/Field/SelectInput.js +28 -56
- package/lib/QueryForm/Field/fieldsMap.js +1 -15
- package/lib/QueryForm/Field/index.js +43 -81
- package/lib/QueryForm/createActions.js +6 -12
- package/lib/QueryForm/index.js +78 -157
- package/lib/QueryForm/useForm.js +0 -5
- package/lib/QueryListScene/List.js +76 -140
- package/lib/QueryListScene/QueryForm.js +46 -86
- package/lib/QueryListScene/QueryListScene.js +25 -46
- package/lib/QueryListScene/Title.js +3 -7
- package/lib/QueryListScene/Toolbar.js +11 -16
- package/lib/QueryListScene/createActions.js +0 -5
- package/lib/QueryListScene/index.js +0 -10
- package/lib/QueryListScene/useActions.js +0 -5
- package/lib/Select/DropDownWrap.js +31 -56
- package/lib/Select/index.js +135 -241
- package/lib/Table/ResizableTable/index.js +26 -48
- package/lib/Table/index.js +17 -28
- package/lib/Title/index.js +21 -28
- package/lib/index.js +35 -56
- package/lib/locale.js +11 -12
- package/lib/utils/checkAuth.js +4 -9
- package/lib/utils/findMenuInfoByPath.js +1 -8
- package/lib/utils/index.js +15 -42
- package/package.json +2 -2
- package/es/Layout/checkAuth.js +0 -29
- package/es/Layout/utils.js +0 -136
- package/lib/Layout/EnterpriseLayout/Header.js +0 -113
- package/lib/Layout/EnterpriseLayout/HeaderActions.js +0 -104
- package/lib/Layout/checkAuth.js +0 -39
- package/lib/Layout/utils.js +0 -166
|
@@ -1,31 +1,29 @@
|
|
|
1
|
-
function
|
|
2
|
-
|
|
3
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
7
|
-
function
|
|
8
|
-
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
9
8
|
import { withTheme } from 'styled-components';
|
|
10
9
|
import Layout from '../Layout';
|
|
11
10
|
import Avatar from './Avatar';
|
|
12
11
|
import { getThemeStore } from '../storage';
|
|
13
12
|
export default withTheme(function (props) {
|
|
14
13
|
var _props$userInfo = props.userInfo,
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
userInfo = _props$userInfo === void 0 ? {} : _props$userInfo,
|
|
15
|
+
_props$extendMap = props.extendMap,
|
|
16
|
+
extendMap = _props$extendMap === void 0 ? {} : _props$extendMap;
|
|
18
17
|
|
|
18
|
+
// 企业级的默认蓝色主题
|
|
19
19
|
var theme = getThemeStore() || (extendMap == null ? void 0 : extendMap.defaultTheme) || userInfo.theme || 'themeS3';
|
|
20
20
|
theme = theme === 'default' ? 'themeS3' : theme;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
userInfo: _objectSpread({}, userInfo, {
|
|
21
|
+
var newProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
22
|
+
userInfo: _objectSpread(_objectSpread({}, userInfo), {}, {
|
|
24
23
|
theme: theme
|
|
25
24
|
})
|
|
26
25
|
});
|
|
27
|
-
|
|
28
|
-
return React.createElement(Layout, _extends({}, newProps, {
|
|
26
|
+
return /*#__PURE__*/React.createElement(Layout, _extends({}, newProps, {
|
|
29
27
|
AvatarCustom: Avatar
|
|
30
28
|
}));
|
|
31
29
|
});
|
|
@@ -1,83 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
1
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
2
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
3
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
5
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
6
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
7
7
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
-
|
|
9
|
-
function _templateObject7() {
|
|
10
|
-
var data = _taggedTemplateLiteral(["\n background: #fff;\n max-height: 320px;\n overflow-y: auto;\n margin: 0;\n padding: 6px 0;\n list-style: none;\n font-size: 13px;\n position: absolute;\n top: 29px;\n width: 100%;\n box-shadow: 0 3px 6px -4px rgba(0,0,0,.12), 0 6px 16px 0 rgba(0,0,0,.08), 0 9px 28px 8px rgba(0,0,0,.05);\n li {\n cursor: pointer;\n line-height: 32px;\n padding: 0 10px;\n color: ", ";\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n }\n"]);
|
|
11
|
-
|
|
12
|
-
_templateObject7 = function _templateObject7() {
|
|
13
|
-
return data;
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
return data;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
function _templateObject6() {
|
|
20
|
-
var data = _taggedTemplateLiteral(["\n display: block;\n line-height: 30px;\n font-size: 12px;\n cursor: pointer;\n a {\n color: ", ";\n &:hover {\n color: ", " !important;\n }\n }\n &.active a {\n color: ", ";\n }\n"]);
|
|
21
|
-
|
|
22
|
-
_templateObject6 = function _templateObject6() {
|
|
23
|
-
return data;
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
return data;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
function _templateObject5() {
|
|
30
|
-
var data = _taggedTemplateLiteral(["\n list-style: none;\n padding: 0;\n margin: 0;\n"]);
|
|
31
|
-
|
|
32
|
-
_templateObject5 = function _templateObject5() {
|
|
33
|
-
return data;
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
return data;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
function _templateObject4() {
|
|
40
|
-
var data = _taggedTemplateLiteral(["\n margin-bottom: 20px;\n & > h5 {\n line-height: 20px;\n margin: 0;\n margin-bottom: 6px;\n }\n"]);
|
|
41
|
-
|
|
42
|
-
_templateObject4 = function _templateObject4() {
|
|
43
|
-
return data;
|
|
44
|
-
};
|
|
45
|
-
|
|
46
|
-
return data;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
function _templateObject3() {
|
|
50
|
-
var data = _taggedTemplateLiteral(["\n height: ", ";\n overflow: auto;\n & > div {\n width: 200px;\n margin-right: 10px;\n display: inline-block;\n vertical-align: top;\n }\n"]);
|
|
51
|
-
|
|
52
|
-
_templateObject3 = function _templateObject3() {
|
|
53
|
-
return data;
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
return data;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
function _templateObject2() {
|
|
60
|
-
var data = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n color: ", ";\n line-height: 32px;\n margin: 0 0 16px;\n padding: 0;\n display: inline-block;\n\n & > li {\n padding: 0 20px;\n display: inline-block;\n cursor: pointer;\n &:not(:last-child) {\n border-right: 1px solid ", ";\n }\n &.active {\n background-color: ", ";\n color: #fff;\n }\n }\n"]);
|
|
61
|
-
|
|
62
|
-
_templateObject2 = function _templateObject2() {
|
|
63
|
-
return data;
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
return data;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
function _templateObject() {
|
|
70
|
-
var data = _taggedTemplateLiteral(["\n position: relative;\n font-size: 14px;\n margin-bottom: 20px;\n color: ", ";\n &.active {\n color: ", ";\n input {\n border-color: ", ";\n }\n }\n .tnt-icon {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n line-height: 1em;\n &[type=\"close\"] {\n right: 0;\n top: 0;\n font-size: 18px;\n cursor: pointer;\n }\n }\n input {\n border-width: 0 0 1px;\n border-style: solid;\n border-color: ", ";\n width: 100%;\n padding: 4px 20px;\n line-height: 20px;\n background-color: transparent;\n outline: none;\n }\n"]);
|
|
71
|
-
|
|
72
|
-
_templateObject = function _templateObject() {
|
|
73
|
-
return data;
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
return data;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
8
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
80
|
-
|
|
81
9
|
import { useState, useEffect } from 'react';
|
|
82
10
|
import cn from 'classnames';
|
|
83
11
|
import styled from 'styled-components';
|
|
@@ -85,7 +13,7 @@ import { debounce } from 'lodash';
|
|
|
85
13
|
import { traverseTree, hasLevel3 } from '../../utils';
|
|
86
14
|
import Icon from '../Iconfont';
|
|
87
15
|
import { getText } from '../../locale';
|
|
88
|
-
var SearchArea = styled.div(_templateObject(), function (props) {
|
|
16
|
+
var SearchArea = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n font-size: 14px;\n margin-bottom: 20px;\n color: ", ";\n &.active {\n color: ", ";\n input {\n border-color: ", ";\n }\n }\n .tnt-icon {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n line-height: 1em;\n &[type=\"close\"] {\n right: 0;\n top: 0;\n font-size: 18px;\n cursor: pointer;\n }\n }\n input {\n border-width: 0 0 1px;\n border-style: solid;\n border-color: ", ";\n width: 100%;\n padding: 4px 20px;\n line-height: 20px;\n background-color: transparent;\n outline: none;\n }\n"])), function (props) {
|
|
89
17
|
return props.theme.secondaryTextColor;
|
|
90
18
|
}, function (props) {
|
|
91
19
|
return props.theme.primaryColor;
|
|
@@ -94,7 +22,7 @@ var SearchArea = styled.div(_templateObject(), function (props) {
|
|
|
94
22
|
}, function (props) {
|
|
95
23
|
return props.theme.borderColor;
|
|
96
24
|
});
|
|
97
|
-
var ApplicationTabs = styled.ul(_templateObject2(), function (props) {
|
|
25
|
+
var ApplicationTabs = styled.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n color: ", ";\n line-height: 32px;\n margin: 0 0 16px;\n padding: 0;\n display: inline-block;\n\n & > li {\n padding: 0 20px;\n display: inline-block;\n cursor: pointer;\n &:not(:last-child) {\n border-right: 1px solid ", ";\n }\n &.active {\n background-color: ", ";\n color: #fff;\n }\n }\n"])), function (props) {
|
|
98
26
|
return props.theme.borderColor;
|
|
99
27
|
}, function (props) {
|
|
100
28
|
return props.theme.primaryTextColor;
|
|
@@ -103,85 +31,74 @@ var ApplicationTabs = styled.ul(_templateObject2(), function (props) {
|
|
|
103
31
|
}, function (props) {
|
|
104
32
|
return props.theme.primaryColor;
|
|
105
33
|
});
|
|
106
|
-
var GroupMenus = styled.div(_templateObject3(), function (props) {
|
|
34
|
+
var GroupMenus = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n height: ", ";\n overflow: auto;\n & > div {\n width: 200px;\n margin-right: 10px;\n display: inline-block;\n vertical-align: top;\n }\n"])), function (props) {
|
|
107
35
|
return props.isLevel3 ? 'calc(100% - 80px)' : 'calc(100% - 50px)';
|
|
108
36
|
});
|
|
109
|
-
var GroupMenuItem = styled.div(_templateObject4());
|
|
110
|
-
var MenuList = styled.ul(_templateObject5());
|
|
111
|
-
var MenuItem = styled.li(_templateObject6(), function (props) {
|
|
37
|
+
var GroupMenuItem = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin-bottom: 20px;\n & > h5 {\n line-height: 20px;\n margin: 0;\n margin-bottom: 6px;\n }\n"])));
|
|
38
|
+
var MenuList = styled.ul(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n list-style: none;\n padding: 0;\n margin: 0;\n"])));
|
|
39
|
+
var MenuItem = styled.li(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: block;\n line-height: 30px;\n font-size: 12px;\n cursor: pointer;\n a {\n color: ", ";\n &:hover {\n color: ", " !important;\n }\n }\n &.active a {\n color: ", ";\n }\n"])), function (props) {
|
|
112
40
|
return props.theme.secondaryTextColor;
|
|
113
41
|
}, function (props) {
|
|
114
42
|
return props.theme.secondaryColor;
|
|
115
43
|
}, function (props) {
|
|
116
44
|
return props.theme.primaryColor;
|
|
117
45
|
});
|
|
118
|
-
var ListBox = styled.ul(_templateObject7(), function (props) {
|
|
46
|
+
var ListBox = styled.ul(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n background: #fff;\n max-height: 320px;\n overflow-y: auto;\n margin: 0;\n padding: 6px 0;\n list-style: none;\n font-size: 13px;\n position: absolute;\n top: 29px;\n width: 100%;\n box-shadow: 0 3px 6px -4px rgba(0,0,0,.12), 0 6px 16px 0 rgba(0,0,0,.08), 0 9px 28px 8px rgba(0,0,0,.05);\n li {\n cursor: pointer;\n line-height: 32px;\n padding: 0 10px;\n color: ", ";\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n }\n"])), function (props) {
|
|
119
47
|
return props.theme.primaryTextColor;
|
|
120
48
|
}, function (props) {
|
|
121
49
|
return props.theme.secondaryColor;
|
|
122
50
|
}, function (props) {
|
|
123
51
|
return props.theme.lightBgColor;
|
|
124
52
|
});
|
|
125
|
-
|
|
126
53
|
var SearchList = function SearchList(_ref) {
|
|
127
54
|
var items = _ref.items,
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
return React.createElement(ListBox, {
|
|
55
|
+
onSelectMenu = _ref.onSelectMenu,
|
|
56
|
+
theme = _ref.theme;
|
|
57
|
+
return /*#__PURE__*/React.createElement(ListBox, {
|
|
131
58
|
theme: theme
|
|
132
59
|
}, items == null ? void 0 : items.map(function (item) {
|
|
133
|
-
return React.createElement("li", {
|
|
60
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
134
61
|
onClick: function onClick() {
|
|
135
62
|
return onSelectMenu(item);
|
|
136
63
|
}
|
|
137
64
|
}, item == null ? void 0 : item.menuName);
|
|
138
65
|
}));
|
|
139
66
|
};
|
|
140
|
-
|
|
141
67
|
export default (function (_ref2) {
|
|
142
68
|
var theme = _ref2.theme,
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
69
|
+
_ref2$menus = _ref2.menus,
|
|
70
|
+
menus = _ref2$menus === void 0 ? [] : _ref2$menus,
|
|
71
|
+
close = _ref2.close,
|
|
72
|
+
actions = _ref2.actions,
|
|
73
|
+
popupRef = _ref2.popupRef,
|
|
74
|
+
containerRef = _ref2.containerRef;
|
|
150
75
|
var _useState = useState(false),
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
76
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
77
|
+
active = _useState2[0],
|
|
78
|
+
setActive = _useState2[1];
|
|
155
79
|
var _useState3 = useState(),
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
80
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
81
|
+
searchValue = _useState4[0],
|
|
82
|
+
setSearchValue = _useState4[1];
|
|
160
83
|
var language = actions == null ? void 0 : actions.getLanguage();
|
|
161
84
|
var isLevel3 = hasLevel3(menus);
|
|
162
|
-
|
|
163
85
|
var _useState5 = useState(isLevel3 ? menus == null ? void 0 : menus[0] : null),
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
86
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
87
|
+
activeTopMenu = _useState6[0],
|
|
88
|
+
setActiveTopMenu = _useState6[1];
|
|
168
89
|
var selectedMenuKey = actions.getSelectedMenuKey();
|
|
169
|
-
|
|
170
90
|
var calcGroupMenus = function calcGroupMenus(menus) {
|
|
171
91
|
var _menus, _menus2;
|
|
172
|
-
|
|
173
92
|
menus = (_menus = menus) == null ? void 0 : _menus.reduce(function (acc, cur) {
|
|
174
93
|
var _cur$children;
|
|
175
|
-
|
|
176
94
|
// 分组
|
|
177
|
-
if (cur
|
|
95
|
+
if (cur != null && (_cur$children = cur.children) != null && _cur$children.length) {
|
|
178
96
|
acc.push(cur);
|
|
179
97
|
} else {
|
|
180
98
|
var defaultGroup = acc.find(function (_ref3) {
|
|
181
99
|
var isDefaultGroup = _ref3.isDefaultGroup;
|
|
182
100
|
return isDefaultGroup;
|
|
183
101
|
});
|
|
184
|
-
|
|
185
102
|
if (!defaultGroup) {
|
|
186
103
|
acc.unshift({
|
|
187
104
|
isDefaultGroup: true,
|
|
@@ -191,47 +108,37 @@ export default (function (_ref2) {
|
|
|
191
108
|
defaultGroup.children.push(cur);
|
|
192
109
|
}
|
|
193
110
|
}
|
|
194
|
-
|
|
195
111
|
return acc;
|
|
196
112
|
}, []);
|
|
197
113
|
return (_menus2 = menus) == null ? void 0 : _menus2.reduce(function (acc, cur) {
|
|
198
114
|
var column = Math.max(1, ~~((containerRef.current.clientWidth - 32) / 210));
|
|
199
|
-
|
|
200
115
|
if (!acc.length) {
|
|
201
116
|
acc.push([cur]);
|
|
202
117
|
} else {
|
|
203
118
|
var calcGroupHeight = function calcGroupHeight(group) {
|
|
204
119
|
var _group$children;
|
|
205
|
-
|
|
206
120
|
return 46 + ((group == null ? void 0 : (_group$children = group.children) == null ? void 0 : _group$children.length) || 0) * 30;
|
|
207
121
|
};
|
|
208
|
-
|
|
209
122
|
var calcColumnHeight = function calcColumnHeight(columnGroups) {
|
|
210
123
|
return columnGroups == null ? void 0 : columnGroups.reduce(function (acc, cur) {
|
|
211
124
|
acc += calcGroupHeight(cur);
|
|
212
125
|
return acc;
|
|
213
126
|
}, 0);
|
|
214
127
|
};
|
|
215
|
-
|
|
216
128
|
var currentColumnHeight = calcColumnHeight(acc[acc.length - 1]);
|
|
217
129
|
var nextGroupHeight = calcGroupHeight(cur);
|
|
218
|
-
|
|
219
130
|
var findMinHeightGroup = function findMinHeightGroup(groups) {
|
|
220
131
|
var minHeight = Infinity;
|
|
221
132
|
var index = 0;
|
|
222
|
-
|
|
223
133
|
for (var i = 0; i < groups.length; i++) {
|
|
224
134
|
var height = calcColumnHeight(groups[i]);
|
|
225
|
-
|
|
226
135
|
if (height < minHeight) {
|
|
227
136
|
index = i;
|
|
228
137
|
minHeight = height;
|
|
229
138
|
}
|
|
230
139
|
}
|
|
231
|
-
|
|
232
140
|
return groups[index];
|
|
233
141
|
};
|
|
234
|
-
|
|
235
142
|
if (acc.length >= column) {
|
|
236
143
|
var minHeightGroup = findMinHeightGroup(acc);
|
|
237
144
|
minHeightGroup == null ? void 0 : minHeightGroup.push(cur);
|
|
@@ -240,23 +147,18 @@ export default (function (_ref2) {
|
|
|
240
147
|
acc.push([cur]);
|
|
241
148
|
} else {
|
|
242
149
|
var _acc;
|
|
243
|
-
|
|
244
150
|
(_acc = acc[(acc == null ? void 0 : acc.length) - 1]) == null ? void 0 : _acc.push(cur);
|
|
245
151
|
}
|
|
246
152
|
}
|
|
247
153
|
}
|
|
248
|
-
|
|
249
154
|
return acc;
|
|
250
155
|
}, []);
|
|
251
156
|
};
|
|
252
|
-
|
|
253
157
|
var groupMenus = calcGroupMenus((activeTopMenu == null ? void 0 : activeTopMenu.children) || menus);
|
|
254
|
-
|
|
255
158
|
var _useState7 = useState([]),
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
159
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
160
|
+
searchedMenus = _useState8[0],
|
|
161
|
+
setSearchedMenus = _useState8[1];
|
|
260
162
|
var onMenuClick = function onMenuClick(menu) {
|
|
261
163
|
actions.emit('menuSelect', {
|
|
262
164
|
key: menu.code,
|
|
@@ -266,80 +168,67 @@ export default (function (_ref2) {
|
|
|
266
168
|
setSearchedMenus([]);
|
|
267
169
|
close();
|
|
268
170
|
};
|
|
269
|
-
|
|
270
171
|
var debounceSearch = debounce(function (evt) {
|
|
271
172
|
var _evt$target$value;
|
|
272
|
-
|
|
273
173
|
var value = (_evt$target$value = evt.target.value) == null ? void 0 : _evt$target$value.trim();
|
|
274
174
|
var matchedMenus = [];
|
|
275
|
-
|
|
276
175
|
if (value) {
|
|
277
176
|
traverseTree(menus, function (node) {
|
|
278
177
|
var _node$menuName;
|
|
279
|
-
|
|
280
|
-
if (node.path && (node == null ? void 0 : (_node$menuName = node.menuName) == null ? void 0 : _node$menuName.includes(value))) {
|
|
178
|
+
if (node.path && node != null && (_node$menuName = node.menuName) != null && _node$menuName.includes(value)) {
|
|
281
179
|
matchedMenus.push(node);
|
|
282
180
|
}
|
|
283
181
|
});
|
|
284
182
|
}
|
|
285
|
-
|
|
286
183
|
setSearchedMenus(matchedMenus);
|
|
287
184
|
}, 100);
|
|
288
|
-
|
|
289
185
|
var onSearchChange = function onSearchChange(evt) {
|
|
290
186
|
evt.persist();
|
|
291
187
|
setSearchValue(evt.target.value);
|
|
292
188
|
debounceSearch(evt);
|
|
293
189
|
};
|
|
294
|
-
|
|
295
190
|
var onSelectAppTab = function onSelectAppTab(menu) {
|
|
296
191
|
setActiveTopMenu(menu);
|
|
297
192
|
};
|
|
298
|
-
|
|
299
193
|
useEffect(function () {
|
|
300
194
|
var clickOutside = function clickOutside(evt) {
|
|
301
195
|
var clientX = evt.clientX,
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
196
|
+
clientY = evt.clientY,
|
|
197
|
+
pageX = evt.pageX,
|
|
198
|
+
pageY = evt.pageY;
|
|
306
199
|
var isOutside = function isOutside(evt, popup) {
|
|
307
|
-
if (popup
|
|
308
|
-
return !(popup
|
|
200
|
+
if (popup != null && popup.contains) {
|
|
201
|
+
return !(popup != null && popup.contains(evt.target));
|
|
309
202
|
}
|
|
310
|
-
|
|
311
203
|
var _popup$getBoundingCli = popup.getBoundingClientRect(),
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
204
|
+
x = _popup$getBoundingCli.x,
|
|
205
|
+
y = _popup$getBoundingCli.y,
|
|
206
|
+
height = _popup$getBoundingCli.height,
|
|
207
|
+
width = _popup$getBoundingCli.width;
|
|
317
208
|
console.log('clickOutside...', [x, y], [clientX, clientY], [pageX, pageY]);
|
|
318
209
|
x += window.scrollX;
|
|
319
210
|
y += window.scrollY;
|
|
320
211
|
return pageX < x || pageX > x + width || pageY < y || pageY > y + height;
|
|
321
212
|
};
|
|
322
|
-
|
|
323
213
|
if (isOutside(evt, popupRef.current)) {
|
|
324
214
|
setSearchValue('');
|
|
325
215
|
setSearchedMenus([]);
|
|
326
216
|
close();
|
|
327
217
|
}
|
|
328
218
|
};
|
|
329
|
-
|
|
330
219
|
document.addEventListener('click', clickOutside);
|
|
331
220
|
return function () {
|
|
332
221
|
return document.removeEventListener('click', clickOutside);
|
|
333
222
|
};
|
|
334
223
|
}, []);
|
|
335
|
-
return React.createElement(React.Fragment, null, React.createElement(SearchArea, {
|
|
224
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SearchArea, {
|
|
336
225
|
theme: theme,
|
|
337
226
|
className: cn({
|
|
338
227
|
active: active
|
|
339
228
|
})
|
|
340
|
-
}, React.createElement(Icon, {
|
|
229
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
341
230
|
type: "search"
|
|
342
|
-
}), React.createElement("input", {
|
|
231
|
+
}), /*#__PURE__*/React.createElement("input", {
|
|
343
232
|
placeholder: actions == null ? void 0 : actions.getText('menuSearch'),
|
|
344
233
|
value: searchValue,
|
|
345
234
|
onChange: onSearchChange,
|
|
@@ -349,17 +238,17 @@ export default (function (_ref2) {
|
|
|
349
238
|
onBlur: function onBlur() {
|
|
350
239
|
return setActive(false);
|
|
351
240
|
}
|
|
352
|
-
}), React.createElement(Icon, {
|
|
241
|
+
}), /*#__PURE__*/React.createElement(Icon, {
|
|
353
242
|
type: "close",
|
|
354
243
|
onClick: close
|
|
355
|
-
}), (searchedMenus == null ? void 0 : searchedMenus.length) > 0 && React.createElement(SearchList, {
|
|
244
|
+
}), (searchedMenus == null ? void 0 : searchedMenus.length) > 0 && /*#__PURE__*/React.createElement(SearchList, {
|
|
356
245
|
items: searchedMenus,
|
|
357
246
|
theme: theme,
|
|
358
247
|
onSelectMenu: onMenuClick
|
|
359
|
-
})), isLevel3 && React.createElement(ApplicationTabs, {
|
|
248
|
+
})), isLevel3 && /*#__PURE__*/React.createElement(ApplicationTabs, {
|
|
360
249
|
theme: theme
|
|
361
250
|
}, menus == null ? void 0 : menus.map(function (menu) {
|
|
362
|
-
return React.createElement("li", {
|
|
251
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
363
252
|
className: cn({
|
|
364
253
|
active: menu.code === (activeTopMenu == null ? void 0 : activeTopMenu.code)
|
|
365
254
|
}),
|
|
@@ -367,15 +256,15 @@ export default (function (_ref2) {
|
|
|
367
256
|
return onSelectAppTab(menu);
|
|
368
257
|
}
|
|
369
258
|
}, menu == null ? void 0 : menu[language === 'cn' ? 'groupName' : 'enName']);
|
|
370
|
-
})), React.createElement(GroupMenus, {
|
|
259
|
+
})), /*#__PURE__*/React.createElement(GroupMenus, {
|
|
371
260
|
theme: theme,
|
|
372
261
|
isLevel3: isLevel3
|
|
373
262
|
}, groupMenus == null ? void 0 : groupMenus.map(function (groups) {
|
|
374
|
-
return React.createElement("div", null, groups == null ? void 0 : groups.map(function (group) {
|
|
375
|
-
return React.createElement(GroupMenuItem, {
|
|
263
|
+
return /*#__PURE__*/React.createElement("div", null, groups == null ? void 0 : groups.map(function (group) {
|
|
264
|
+
return /*#__PURE__*/React.createElement(GroupMenuItem, {
|
|
376
265
|
theme: theme
|
|
377
|
-
}, React.createElement("h5", null, group == null ? void 0 : group[language === 'cn' ? 'groupName' : 'enName']), React.createElement(MenuList, null, (group.children || []).map(function (menu) {
|
|
378
|
-
return React.createElement(MenuItem, {
|
|
266
|
+
}, /*#__PURE__*/React.createElement("h5", null, group == null ? void 0 : group[language === 'cn' ? 'groupName' : 'enName']), /*#__PURE__*/React.createElement(MenuList, null, (group.children || []).map(function (menu) {
|
|
267
|
+
return /*#__PURE__*/React.createElement(MenuItem, {
|
|
379
268
|
key: menu.code,
|
|
380
269
|
className: cn({
|
|
381
270
|
active: selectedMenuKey === menu.code
|
|
@@ -384,7 +273,7 @@ export default (function (_ref2) {
|
|
|
384
273
|
onClick: function onClick() {
|
|
385
274
|
return onMenuClick(menu);
|
|
386
275
|
}
|
|
387
|
-
}, React.createElement("a", {
|
|
276
|
+
}, /*#__PURE__*/React.createElement("a", {
|
|
388
277
|
href: menu.path,
|
|
389
278
|
onClick: function onClick(evt) {
|
|
390
279
|
return evt.preventDefault();
|
|
@@ -1,41 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
7
|
-
function
|
|
8
|
-
|
|
9
|
-
function
|
|
10
|
-
|
|
11
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
|
|
12
|
-
|
|
13
|
-
function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
14
|
-
|
|
1
|
+
var _templateObject, _templateObject2;
|
|
2
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
7
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
8
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
9
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
10
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
15
11
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
16
|
-
|
|
17
|
-
function _templateObject2() {
|
|
18
|
-
var data = _taggedTemplateLiteral(["\n .tnt-navigation-popup {\n position: absolute;\n left: 0;\n top: ", ";\n width: 100%;\n height: ", ";\n background: #FFF;\n box-shadow: 0 10px 10px -8px rgba(0,0,0,.1) inset,\n 0 10px 10px -8px rgba(0,0,0,.1);\n transition: all .15s ease-in-out;\n overflow: hidden;\n padding: 20px 16px;\n box-sizing: border-box;\n &.hide {\n height: 0;\n padding: 0;\n }\n }\n"]);
|
|
19
|
-
|
|
20
|
-
_templateObject2 = function _templateObject2() {
|
|
21
|
-
return data;
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
return data;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
function _templateObject() {
|
|
28
|
-
var data = _taggedTemplateLiteral(["\n &.active {\n color: ", " !important;\n }\n font-size: ", ";\n .tnt-icon {\n font-size: ", ";\n margin-right: 4px;\n }\n span {\n position: relative;\n font-size: ", ";\n top: ", ";\n font-family: auto;\n .tnt-themeS1 & {\n /* color: rgba(255,255,255,.85); */\n }\n }\n .isInIframe & {\n display: none;\n }\n"]);
|
|
29
|
-
|
|
30
|
-
_templateObject = function _templateObject() {
|
|
31
|
-
return data;
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
return data;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
12
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
38
|
-
|
|
39
13
|
import { useState, useEffect, useRef, useContext } from 'react';
|
|
40
14
|
import ReactDOM from 'react-dom';
|
|
41
15
|
import cn from 'classnames';
|
|
@@ -45,7 +19,7 @@ import ActionsContext from '../ActionsContext';
|
|
|
45
19
|
import { hasLevel3 } from '../../utils';
|
|
46
20
|
import Icon from '../Iconfont';
|
|
47
21
|
import NavigationPopup from './NavigationPopup';
|
|
48
|
-
var Navigation = styled.li(_templateObject(), function (_ref) {
|
|
22
|
+
var Navigation = styled.li(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n &.active {\n color: ", " !important;\n }\n font-size: ", ";\n .tnt-icon {\n font-size: ", ";\n margin-right: 4px;\n }\n span {\n position: relative;\n font-size: ", ";\n top: ", ";\n font-family: auto;\n .tnt-themeS1 & {\n /* color: rgba(255,255,255,.85); */\n }\n }\n .isInIframe & {\n display: none;\n }\n"])), function (_ref) {
|
|
49
23
|
var theme = _ref.theme;
|
|
50
24
|
return theme.primaryColor;
|
|
51
25
|
}, function (_ref2) {
|
|
@@ -61,14 +35,12 @@ var Navigation = styled.li(_templateObject(), function (_ref) {
|
|
|
61
35
|
var size = _ref5.theme.size;
|
|
62
36
|
return size === 'large' ? '-3px' : '-2px';
|
|
63
37
|
});
|
|
64
|
-
|
|
65
38
|
var createPopupContainer = function createPopupContainer() {
|
|
66
39
|
var div = document.createElement('div');
|
|
67
40
|
div.setAttribute('class', 'tnt-navigation-popup');
|
|
68
41
|
return div;
|
|
69
42
|
};
|
|
70
|
-
|
|
71
|
-
var GlobalStyle = createGlobalStyle(_templateObject2(), function (props) {
|
|
43
|
+
var GlobalStyle = createGlobalStyle(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n .tnt-navigation-popup {\n position: absolute;\n left: 0;\n top: ", ";\n width: 100%;\n height: ", ";\n background: #FFF;\n box-shadow: 0 10px 10px -8px rgba(0,0,0,.1) inset,\n 0 10px 10px -8px rgba(0,0,0,.1);\n transition: all .15s ease-in-out;\n overflow: hidden;\n padding: 20px 16px;\n box-sizing: border-box;\n &.hide {\n height: 0;\n padding: 0;\n }\n }\n"])), function (props) {
|
|
72
44
|
return props.theme.size === 'large' ? '60px' : '50px';
|
|
73
45
|
}, function (props) {
|
|
74
46
|
return props.hasLevel3 ? '560px' : '530px';
|
|
@@ -77,30 +49,25 @@ export default withTheme(function (props) {
|
|
|
77
49
|
var actions = useContext(ActionsContext);
|
|
78
50
|
var getText = actions.getText;
|
|
79
51
|
var headerRef = props.headerRef,
|
|
80
|
-
|
|
81
|
-
|
|
52
|
+
menus = props.menus;
|
|
82
53
|
var _useState = useState(false),
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
54
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
55
|
+
visible = _useState2[0],
|
|
56
|
+
setVisible = _useState2[1];
|
|
87
57
|
var popupRef = useRef();
|
|
88
58
|
useEffect(function () {
|
|
89
59
|
var _headerRef$current;
|
|
90
|
-
|
|
91
60
|
popupRef.current = createPopupContainer();
|
|
92
61
|
headerRef == null ? void 0 : (_headerRef$current = headerRef.current) == null ? void 0 : _headerRef$current.appendChild(popupRef.current);
|
|
93
62
|
return function () {
|
|
94
63
|
var _headerRef$current2;
|
|
95
|
-
|
|
96
64
|
headerRef == null ? void 0 : (_headerRef$current2 = headerRef.current) == null ? void 0 : _headerRef$current2.removeChild(popupRef.current);
|
|
97
65
|
};
|
|
98
66
|
}, []);
|
|
99
67
|
useEffect(function () {
|
|
100
68
|
var classNames = popupRef.current.getAttribute('class').split(' ');
|
|
101
|
-
|
|
102
69
|
if (visible) {
|
|
103
|
-
ReactDOM.render(React.createElement(NavigationPopup, {
|
|
70
|
+
ReactDOM.render( /*#__PURE__*/React.createElement(NavigationPopup, {
|
|
104
71
|
actions: actions,
|
|
105
72
|
theme: props.theme,
|
|
106
73
|
menus: menus,
|
|
@@ -117,10 +84,9 @@ export default withTheme(function (props) {
|
|
|
117
84
|
popupRef.current.setAttribute('class', uniq([].concat(_toConsumableArray(classNames), ['hide'])).join(' '));
|
|
118
85
|
}
|
|
119
86
|
}, [visible]);
|
|
120
|
-
return React.createElement(Navigation, {
|
|
87
|
+
return /*#__PURE__*/React.createElement(Navigation, {
|
|
121
88
|
onClick: function onClick(evt) {
|
|
122
89
|
var _evt$nativeEvent, _evt$nativeEvent2;
|
|
123
|
-
|
|
124
90
|
evt.stopPropagation();
|
|
125
91
|
(_evt$nativeEvent = evt.nativeEvent) == null ? void 0 : _evt$nativeEvent.stopImmediatePropagation();
|
|
126
92
|
(_evt$nativeEvent2 = evt.nativeEvent) == null ? void 0 : _evt$nativeEvent2.stopPropagation();
|
|
@@ -129,9 +95,9 @@ export default withTheme(function (props) {
|
|
|
129
95
|
className: cn({
|
|
130
96
|
active: visible
|
|
131
97
|
})
|
|
132
|
-
}, React.createElement(Icon, {
|
|
98
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
133
99
|
type: "unordered-list"
|
|
134
|
-
}), React.createElement("span", null, getText('globalNavigation')), React.createElement(GlobalStyle, {
|
|
100
|
+
}), /*#__PURE__*/React.createElement("span", null, getText('globalNavigation')), /*#__PURE__*/React.createElement(GlobalStyle, {
|
|
135
101
|
hasLevel3: hasLevel3(menus)
|
|
136
102
|
}));
|
|
137
103
|
});
|