tntd 1.4.20 → 1.4.22
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/Handle/README.md +0 -20
- package/components/Handle/index.js +44 -7
- package/components/locale.js +8 -2
- package/dist/1.tntd.js +1 -1
- package/dist/stats.json +24430 -24390
- package/dist/tntd.css +1 -1
- package/dist/tntd.js +13 -8
- package/es/ArrayInput/icon.js +5 -5
- package/es/ArrayInput/index.js +108 -76
- package/es/AuthContext.js +1 -1
- package/es/Columns/index.js +38 -31
- package/es/DevelopmentLogin/LoginModal.js +45 -32
- package/es/DevelopmentLogin/index.js +17 -13
- package/es/Ellipsis/Svg/CopySVG.js +13 -13
- package/es/Ellipsis/Svg/TickSVG.js +8 -8
- package/es/Ellipsis/index.js +69 -58
- package/es/Handle/README.md +0 -20
- package/es/Handle/index.js +100 -33
- package/es/Icon/fonts/iconfont.js +12 -7
- package/es/Icon/index.js +13 -10
- package/es/Img/Contain.js +29 -24
- package/es/Img/Cover.js +54 -40
- package/es/Img/index.js +45 -36
- package/es/Layout/ActionsContext.js +2 -3
- package/es/Layout/AppList.js +92 -37
- package/es/Layout/Application.js +72 -26
- package/es/Layout/Avatar.js +66 -29
- package/es/Layout/CompatibleLanguage.js +94 -39
- package/es/Layout/EnterpriseLayout/Avatar.js +76 -38
- package/es/Layout/EnterpriseLayout/Language.js +32 -14
- package/es/Layout/EnterpriseLayout/Theme.js +34 -16
- package/es/Layout/EnterpriseLayout/index.js +16 -14
- package/es/Layout/GlobalNavigation/NavigationPopup.js +170 -59
- package/es/Layout/GlobalNavigation/index.js +54 -20
- package/es/Layout/Header.js +46 -25
- package/es/Layout/HeaderActions.js +56 -42
- package/es/Layout/HeaderNavs.js +47 -20
- package/es/Layout/HeaderTabs.js +102 -49
- package/es/Layout/Iconfont.js +1 -1
- package/es/Layout/Language.js +32 -14
- package/es/Layout/Layout.js +108 -86
- package/es/Layout/Logo.js +32 -16
- package/es/Layout/OrgAppList.js +107 -62
- package/es/Layout/SideMenu.js +124 -63
- package/es/Layout/Theme.js +61 -23
- package/es/Layout/checkAuth.js +29 -0
- package/es/Layout/index.js +34 -26
- package/es/Layout/paaslayout/CompactSideMenu.js +74 -35
- package/es/Layout/paaslayout/Header.js +45 -22
- package/es/Layout/paaslayout/Logo.js +13 -3
- package/es/Layout/paaslayout/SideMenu.js +78 -39
- package/es/Layout/paaslayout/index.js +102 -75
- package/es/Layout/storage.js +9 -10
- package/es/Layout/utils.js +136 -0
- package/es/LoadingButton/index.js +24 -15
- package/es/Modal/index.js +46 -38
- package/es/Page/Box.js +41 -34
- package/es/Page/index.js +67 -52
- package/es/Page/utils.js +5 -0
- package/es/QueryForm/Field/Checkbox.js +9 -5
- package/es/QueryForm/Field/Select.js +41 -31
- package/es/QueryForm/Field/SelectInput.js +41 -26
- package/es/QueryForm/Field/fieldsMap.js +1 -0
- package/es/QueryForm/Field/index.js +71 -41
- package/es/QueryForm/createActions.js +7 -6
- package/es/QueryForm/index.js +135 -76
- package/es/QueryListScene/List.js +128 -74
- package/es/QueryListScene/QueryForm.js +81 -46
- package/es/QueryListScene/QueryListScene.js +40 -25
- package/es/QueryListScene/Title.js +3 -3
- package/es/QueryListScene/Toolbar.js +12 -11
- package/es/Select/DropDownWrap.js +50 -29
- package/es/Select/index.js +231 -135
- package/es/Table/ResizableTable/index.js +40 -26
- package/es/Table/index.js +16 -18
- package/es/Title/index.js +23 -21
- package/es/locale.js +11 -3
- package/es/utils/checkAuth.js +5 -3
- package/es/utils/findMenuInfoByPath.js +4 -0
- package/es/utils/index.js +23 -12
- package/lib/ArrayInput/icon.js +6 -6
- package/lib/ArrayInput/index.js +127 -78
- package/lib/AuthContext.js +4 -1
- package/lib/Columns/index.js +47 -31
- package/lib/DevelopmentLogin/LoginModal.js +58 -32
- package/lib/DevelopmentLogin/index.js +27 -16
- package/lib/Ellipsis/Svg/CopySVG.js +15 -13
- package/lib/Ellipsis/Svg/TickSVG.js +10 -8
- package/lib/Ellipsis/index.js +80 -57
- package/lib/Handle/README.md +0 -20
- package/lib/Handle/index.js +119 -33
- package/lib/Icon/fonts/iconfont.js +12 -7
- package/lib/Icon/index.js +20 -11
- package/lib/Img/Contain.js +34 -24
- package/lib/Img/Cover.js +65 -42
- package/lib/Img/index.js +51 -36
- package/lib/Layout/ActionsContext.js +4 -1
- package/lib/Layout/AppList.js +118 -40
- package/lib/Layout/Application.js +86 -26
- package/lib/Layout/Avatar.js +86 -32
- package/lib/Layout/CompatibleLanguage.js +110 -39
- package/lib/Layout/EnterpriseLayout/Avatar.js +100 -41
- package/lib/Layout/EnterpriseLayout/Header.js +113 -0
- package/lib/Layout/EnterpriseLayout/HeaderActions.js +104 -0
- package/lib/Layout/EnterpriseLayout/Language.js +48 -17
- package/lib/Layout/EnterpriseLayout/Theme.js +44 -16
- package/lib/Layout/EnterpriseLayout/index.js +23 -14
- package/lib/Layout/GlobalNavigation/NavigationPopup.js +186 -59
- package/lib/Layout/GlobalNavigation/index.js +74 -23
- package/lib/Layout/Header.js +63 -28
- package/lib/Layout/HeaderActions.js +74 -45
- package/lib/Layout/HeaderNavs.js +61 -23
- package/lib/Layout/HeaderTabs.js +118 -51
- package/lib/Layout/Iconfont.js +5 -1
- package/lib/Layout/Language.js +48 -17
- package/lib/Layout/Layout.js +128 -88
- package/lib/Layout/Logo.js +43 -19
- package/lib/Layout/OrgAppList.js +127 -64
- package/lib/Layout/SideMenu.js +143 -65
- package/lib/Layout/Theme.js +73 -23
- package/lib/Layout/checkAuth.js +39 -0
- package/lib/Layout/createActions.js +5 -0
- package/lib/Layout/images/index.js +28 -0
- package/lib/Layout/index.js +55 -30
- package/lib/Layout/paaslayout/CompactSideMenu.js +84 -35
- package/lib/Layout/paaslayout/Header.js +55 -22
- package/lib/Layout/paaslayout/Logo.js +19 -3
- package/lib/Layout/paaslayout/SideMenu.js +87 -39
- package/lib/Layout/paaslayout/index.js +122 -77
- package/lib/Layout/storage.js +40 -11
- package/lib/Layout/utils.js +166 -0
- package/lib/LoadingButton/index.js +29 -15
- package/lib/Modal/index.js +53 -38
- package/lib/Page/Box.js +45 -34
- package/lib/Page/index.js +77 -52
- package/lib/Page/utils.js +9 -1
- package/lib/QueryForm/Field/Checkbox.js +13 -5
- package/lib/QueryForm/Field/Select.js +53 -33
- package/lib/QueryForm/Field/SelectInput.js +56 -28
- package/lib/QueryForm/Field/fieldsMap.js +15 -1
- package/lib/QueryForm/Field/index.js +81 -43
- package/lib/QueryForm/createActions.js +12 -6
- package/lib/QueryForm/index.js +157 -78
- package/lib/QueryForm/useForm.js +5 -0
- package/lib/QueryListScene/List.js +140 -76
- package/lib/QueryListScene/QueryForm.js +86 -46
- package/lib/QueryListScene/QueryListScene.js +46 -25
- package/lib/QueryListScene/Title.js +7 -3
- package/lib/QueryListScene/Toolbar.js +16 -11
- package/lib/QueryListScene/createActions.js +5 -0
- package/lib/QueryListScene/index.js +10 -0
- package/lib/QueryListScene/useActions.js +5 -0
- package/lib/Select/DropDownWrap.js +56 -31
- package/lib/Select/index.js +241 -135
- package/lib/Table/ResizableTable/index.js +48 -26
- package/lib/Table/index.js +28 -17
- package/lib/Title/index.js +28 -21
- package/lib/index.js +56 -35
- package/lib/locale.js +19 -4
- package/lib/utils/checkAuth.js +9 -4
- package/lib/utils/findMenuInfoByPath.js +8 -1
- package/lib/utils/index.js +42 -15
- package/package.json +2 -2
|
@@ -1,11 +1,83 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance
|
|
4
|
-
|
|
5
|
-
function
|
|
6
|
-
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
|
|
2
|
+
|
|
3
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
|
|
4
|
+
|
|
5
|
+
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; }
|
|
6
|
+
|
|
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
|
+
|
|
8
79
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
80
|
+
|
|
9
81
|
import { useState, useEffect } from 'react';
|
|
10
82
|
import cn from 'classnames';
|
|
11
83
|
import styled from 'styled-components';
|
|
@@ -13,7 +85,7 @@ import { debounce } from 'lodash';
|
|
|
13
85
|
import { traverseTree, hasLevel3 } from '../../utils';
|
|
14
86
|
import Icon from '../Iconfont';
|
|
15
87
|
import { getText } from '../../locale';
|
|
16
|
-
var SearchArea = styled.div(_templateObject
|
|
88
|
+
var SearchArea = styled.div(_templateObject(), function (props) {
|
|
17
89
|
return props.theme.secondaryTextColor;
|
|
18
90
|
}, function (props) {
|
|
19
91
|
return props.theme.primaryColor;
|
|
@@ -22,7 +94,7 @@ var SearchArea = styled.div(_templateObject || (_templateObject = _taggedTemplat
|
|
|
22
94
|
}, function (props) {
|
|
23
95
|
return props.theme.borderColor;
|
|
24
96
|
});
|
|
25
|
-
var ApplicationTabs = styled.ul(_templateObject2
|
|
97
|
+
var ApplicationTabs = styled.ul(_templateObject2(), function (props) {
|
|
26
98
|
return props.theme.borderColor;
|
|
27
99
|
}, function (props) {
|
|
28
100
|
return props.theme.primaryTextColor;
|
|
@@ -31,74 +103,85 @@ var ApplicationTabs = styled.ul(_templateObject2 || (_templateObject2 = _taggedT
|
|
|
31
103
|
}, function (props) {
|
|
32
104
|
return props.theme.primaryColor;
|
|
33
105
|
});
|
|
34
|
-
var GroupMenus = styled.div(_templateObject3
|
|
106
|
+
var GroupMenus = styled.div(_templateObject3(), function (props) {
|
|
35
107
|
return props.isLevel3 ? 'calc(100% - 80px)' : 'calc(100% - 50px)';
|
|
36
108
|
});
|
|
37
|
-
var GroupMenuItem = styled.div(_templateObject4
|
|
38
|
-
var MenuList = styled.ul(_templateObject5
|
|
39
|
-
var MenuItem = styled.li(_templateObject6
|
|
109
|
+
var GroupMenuItem = styled.div(_templateObject4());
|
|
110
|
+
var MenuList = styled.ul(_templateObject5());
|
|
111
|
+
var MenuItem = styled.li(_templateObject6(), function (props) {
|
|
40
112
|
return props.theme.secondaryTextColor;
|
|
41
113
|
}, function (props) {
|
|
42
114
|
return props.theme.secondaryColor;
|
|
43
115
|
}, function (props) {
|
|
44
116
|
return props.theme.primaryColor;
|
|
45
117
|
});
|
|
46
|
-
var ListBox = styled.ul(_templateObject7
|
|
118
|
+
var ListBox = styled.ul(_templateObject7(), function (props) {
|
|
47
119
|
return props.theme.primaryTextColor;
|
|
48
120
|
}, function (props) {
|
|
49
121
|
return props.theme.secondaryColor;
|
|
50
122
|
}, function (props) {
|
|
51
123
|
return props.theme.lightBgColor;
|
|
52
124
|
});
|
|
125
|
+
|
|
53
126
|
var SearchList = function SearchList(_ref) {
|
|
54
127
|
var items = _ref.items,
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
return
|
|
128
|
+
onSelectMenu = _ref.onSelectMenu,
|
|
129
|
+
theme = _ref.theme;
|
|
130
|
+
return React.createElement(ListBox, {
|
|
58
131
|
theme: theme
|
|
59
132
|
}, items == null ? void 0 : items.map(function (item) {
|
|
60
|
-
return
|
|
133
|
+
return React.createElement("li", {
|
|
61
134
|
onClick: function onClick() {
|
|
62
135
|
return onSelectMenu(item);
|
|
63
136
|
}
|
|
64
137
|
}, item == null ? void 0 : item.menuName);
|
|
65
138
|
}));
|
|
66
139
|
};
|
|
140
|
+
|
|
67
141
|
export default (function (_ref2) {
|
|
68
142
|
var theme = _ref2.theme,
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
143
|
+
_ref2$menus = _ref2.menus,
|
|
144
|
+
menus = _ref2$menus === void 0 ? [] : _ref2$menus,
|
|
145
|
+
close = _ref2.close,
|
|
146
|
+
actions = _ref2.actions,
|
|
147
|
+
popupRef = _ref2.popupRef,
|
|
148
|
+
containerRef = _ref2.containerRef;
|
|
149
|
+
|
|
75
150
|
var _useState = useState(false),
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
151
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
152
|
+
active = _useState2[0],
|
|
153
|
+
setActive = _useState2[1];
|
|
154
|
+
|
|
79
155
|
var _useState3 = useState(),
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
156
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
157
|
+
searchValue = _useState4[0],
|
|
158
|
+
setSearchValue = _useState4[1];
|
|
159
|
+
|
|
83
160
|
var language = actions == null ? void 0 : actions.getLanguage();
|
|
84
161
|
var isLevel3 = hasLevel3(menus);
|
|
162
|
+
|
|
85
163
|
var _useState5 = useState(isLevel3 ? menus == null ? void 0 : menus[0] : null),
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
164
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
165
|
+
activeTopMenu = _useState6[0],
|
|
166
|
+
setActiveTopMenu = _useState6[1];
|
|
167
|
+
|
|
89
168
|
var selectedMenuKey = actions.getSelectedMenuKey();
|
|
169
|
+
|
|
90
170
|
var calcGroupMenus = function calcGroupMenus(menus) {
|
|
91
171
|
var _menus, _menus2;
|
|
172
|
+
|
|
92
173
|
menus = (_menus = menus) == null ? void 0 : _menus.reduce(function (acc, cur) {
|
|
93
174
|
var _cur$children;
|
|
175
|
+
|
|
94
176
|
// 分组
|
|
95
|
-
if (cur
|
|
177
|
+
if (cur == null ? void 0 : (_cur$children = cur.children) == null ? void 0 : _cur$children.length) {
|
|
96
178
|
acc.push(cur);
|
|
97
179
|
} else {
|
|
98
180
|
var defaultGroup = acc.find(function (_ref3) {
|
|
99
181
|
var isDefaultGroup = _ref3.isDefaultGroup;
|
|
100
182
|
return isDefaultGroup;
|
|
101
183
|
});
|
|
184
|
+
|
|
102
185
|
if (!defaultGroup) {
|
|
103
186
|
acc.unshift({
|
|
104
187
|
isDefaultGroup: true,
|
|
@@ -108,37 +191,47 @@ export default (function (_ref2) {
|
|
|
108
191
|
defaultGroup.children.push(cur);
|
|
109
192
|
}
|
|
110
193
|
}
|
|
194
|
+
|
|
111
195
|
return acc;
|
|
112
196
|
}, []);
|
|
113
197
|
return (_menus2 = menus) == null ? void 0 : _menus2.reduce(function (acc, cur) {
|
|
114
198
|
var column = Math.max(1, ~~((containerRef.current.clientWidth - 32) / 210));
|
|
199
|
+
|
|
115
200
|
if (!acc.length) {
|
|
116
201
|
acc.push([cur]);
|
|
117
202
|
} else {
|
|
118
203
|
var calcGroupHeight = function calcGroupHeight(group) {
|
|
119
204
|
var _group$children;
|
|
205
|
+
|
|
120
206
|
return 46 + ((group == null ? void 0 : (_group$children = group.children) == null ? void 0 : _group$children.length) || 0) * 30;
|
|
121
207
|
};
|
|
208
|
+
|
|
122
209
|
var calcColumnHeight = function calcColumnHeight(columnGroups) {
|
|
123
210
|
return columnGroups == null ? void 0 : columnGroups.reduce(function (acc, cur) {
|
|
124
211
|
acc += calcGroupHeight(cur);
|
|
125
212
|
return acc;
|
|
126
213
|
}, 0);
|
|
127
214
|
};
|
|
215
|
+
|
|
128
216
|
var currentColumnHeight = calcColumnHeight(acc[acc.length - 1]);
|
|
129
217
|
var nextGroupHeight = calcGroupHeight(cur);
|
|
218
|
+
|
|
130
219
|
var findMinHeightGroup = function findMinHeightGroup(groups) {
|
|
131
220
|
var minHeight = Infinity;
|
|
132
221
|
var index = 0;
|
|
222
|
+
|
|
133
223
|
for (var i = 0; i < groups.length; i++) {
|
|
134
224
|
var height = calcColumnHeight(groups[i]);
|
|
225
|
+
|
|
135
226
|
if (height < minHeight) {
|
|
136
227
|
index = i;
|
|
137
228
|
minHeight = height;
|
|
138
229
|
}
|
|
139
230
|
}
|
|
231
|
+
|
|
140
232
|
return groups[index];
|
|
141
233
|
};
|
|
234
|
+
|
|
142
235
|
if (acc.length >= column) {
|
|
143
236
|
var minHeightGroup = findMinHeightGroup(acc);
|
|
144
237
|
minHeightGroup == null ? void 0 : minHeightGroup.push(cur);
|
|
@@ -147,18 +240,23 @@ export default (function (_ref2) {
|
|
|
147
240
|
acc.push([cur]);
|
|
148
241
|
} else {
|
|
149
242
|
var _acc;
|
|
243
|
+
|
|
150
244
|
(_acc = acc[(acc == null ? void 0 : acc.length) - 1]) == null ? void 0 : _acc.push(cur);
|
|
151
245
|
}
|
|
152
246
|
}
|
|
153
247
|
}
|
|
248
|
+
|
|
154
249
|
return acc;
|
|
155
250
|
}, []);
|
|
156
251
|
};
|
|
252
|
+
|
|
157
253
|
var groupMenus = calcGroupMenus((activeTopMenu == null ? void 0 : activeTopMenu.children) || menus);
|
|
254
|
+
|
|
158
255
|
var _useState7 = useState([]),
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
256
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
257
|
+
searchedMenus = _useState8[0],
|
|
258
|
+
setSearchedMenus = _useState8[1];
|
|
259
|
+
|
|
162
260
|
var onMenuClick = function onMenuClick(menu) {
|
|
163
261
|
actions.emit('menuSelect', {
|
|
164
262
|
key: menu.code,
|
|
@@ -168,67 +266,80 @@ export default (function (_ref2) {
|
|
|
168
266
|
setSearchedMenus([]);
|
|
169
267
|
close();
|
|
170
268
|
};
|
|
269
|
+
|
|
171
270
|
var debounceSearch = debounce(function (evt) {
|
|
172
271
|
var _evt$target$value;
|
|
272
|
+
|
|
173
273
|
var value = (_evt$target$value = evt.target.value) == null ? void 0 : _evt$target$value.trim();
|
|
174
274
|
var matchedMenus = [];
|
|
275
|
+
|
|
175
276
|
if (value) {
|
|
176
277
|
traverseTree(menus, function (node) {
|
|
177
278
|
var _node$menuName;
|
|
178
|
-
|
|
279
|
+
|
|
280
|
+
if (node.path && (node == null ? void 0 : (_node$menuName = node.menuName) == null ? void 0 : _node$menuName.includes(value))) {
|
|
179
281
|
matchedMenus.push(node);
|
|
180
282
|
}
|
|
181
283
|
});
|
|
182
284
|
}
|
|
285
|
+
|
|
183
286
|
setSearchedMenus(matchedMenus);
|
|
184
287
|
}, 100);
|
|
288
|
+
|
|
185
289
|
var onSearchChange = function onSearchChange(evt) {
|
|
186
290
|
evt.persist();
|
|
187
291
|
setSearchValue(evt.target.value);
|
|
188
292
|
debounceSearch(evt);
|
|
189
293
|
};
|
|
294
|
+
|
|
190
295
|
var onSelectAppTab = function onSelectAppTab(menu) {
|
|
191
296
|
setActiveTopMenu(menu);
|
|
192
297
|
};
|
|
298
|
+
|
|
193
299
|
useEffect(function () {
|
|
194
300
|
var clickOutside = function clickOutside(evt) {
|
|
195
301
|
var clientX = evt.clientX,
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
302
|
+
clientY = evt.clientY,
|
|
303
|
+
pageX = evt.pageX,
|
|
304
|
+
pageY = evt.pageY;
|
|
305
|
+
|
|
199
306
|
var isOutside = function isOutside(evt, popup) {
|
|
200
|
-
if (popup
|
|
201
|
-
return !(popup
|
|
307
|
+
if (popup == null ? void 0 : popup.contains) {
|
|
308
|
+
return !(popup == null ? void 0 : popup.contains(evt.target));
|
|
202
309
|
}
|
|
310
|
+
|
|
203
311
|
var _popup$getBoundingCli = popup.getBoundingClientRect(),
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
312
|
+
x = _popup$getBoundingCli.x,
|
|
313
|
+
y = _popup$getBoundingCli.y,
|
|
314
|
+
height = _popup$getBoundingCli.height,
|
|
315
|
+
width = _popup$getBoundingCli.width;
|
|
316
|
+
|
|
208
317
|
console.log('clickOutside...', [x, y], [clientX, clientY], [pageX, pageY]);
|
|
209
318
|
x += window.scrollX;
|
|
210
319
|
y += window.scrollY;
|
|
211
320
|
return pageX < x || pageX > x + width || pageY < y || pageY > y + height;
|
|
212
321
|
};
|
|
322
|
+
|
|
213
323
|
if (isOutside(evt, popupRef.current)) {
|
|
214
324
|
setSearchValue('');
|
|
215
325
|
setSearchedMenus([]);
|
|
216
326
|
close();
|
|
217
327
|
}
|
|
218
328
|
};
|
|
329
|
+
|
|
219
330
|
document.addEventListener('click', clickOutside);
|
|
220
331
|
return function () {
|
|
221
332
|
return document.removeEventListener('click', clickOutside);
|
|
222
333
|
};
|
|
223
334
|
}, []);
|
|
224
|
-
return
|
|
335
|
+
return React.createElement(React.Fragment, null, React.createElement(SearchArea, {
|
|
225
336
|
theme: theme,
|
|
226
337
|
className: cn({
|
|
227
338
|
active: active
|
|
228
339
|
})
|
|
229
|
-
},
|
|
340
|
+
}, React.createElement(Icon, {
|
|
230
341
|
type: "search"
|
|
231
|
-
}),
|
|
342
|
+
}), React.createElement("input", {
|
|
232
343
|
placeholder: actions == null ? void 0 : actions.getText('menuSearch'),
|
|
233
344
|
value: searchValue,
|
|
234
345
|
onChange: onSearchChange,
|
|
@@ -238,17 +349,17 @@ export default (function (_ref2) {
|
|
|
238
349
|
onBlur: function onBlur() {
|
|
239
350
|
return setActive(false);
|
|
240
351
|
}
|
|
241
|
-
}),
|
|
352
|
+
}), React.createElement(Icon, {
|
|
242
353
|
type: "close",
|
|
243
354
|
onClick: close
|
|
244
|
-
}), (searchedMenus == null ? void 0 : searchedMenus.length) > 0 &&
|
|
355
|
+
}), (searchedMenus == null ? void 0 : searchedMenus.length) > 0 && React.createElement(SearchList, {
|
|
245
356
|
items: searchedMenus,
|
|
246
357
|
theme: theme,
|
|
247
358
|
onSelectMenu: onMenuClick
|
|
248
|
-
})), isLevel3 &&
|
|
359
|
+
})), isLevel3 && React.createElement(ApplicationTabs, {
|
|
249
360
|
theme: theme
|
|
250
361
|
}, menus == null ? void 0 : menus.map(function (menu) {
|
|
251
|
-
return
|
|
362
|
+
return React.createElement("li", {
|
|
252
363
|
className: cn({
|
|
253
364
|
active: menu.code === (activeTopMenu == null ? void 0 : activeTopMenu.code)
|
|
254
365
|
}),
|
|
@@ -256,15 +367,15 @@ export default (function (_ref2) {
|
|
|
256
367
|
return onSelectAppTab(menu);
|
|
257
368
|
}
|
|
258
369
|
}, menu == null ? void 0 : menu[language === 'cn' ? 'groupName' : 'enName']);
|
|
259
|
-
})),
|
|
370
|
+
})), React.createElement(GroupMenus, {
|
|
260
371
|
theme: theme,
|
|
261
372
|
isLevel3: isLevel3
|
|
262
373
|
}, groupMenus == null ? void 0 : groupMenus.map(function (groups) {
|
|
263
|
-
return
|
|
264
|
-
return
|
|
374
|
+
return React.createElement("div", null, groups == null ? void 0 : groups.map(function (group) {
|
|
375
|
+
return React.createElement(GroupMenuItem, {
|
|
265
376
|
theme: theme
|
|
266
|
-
},
|
|
267
|
-
return
|
|
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, {
|
|
268
379
|
key: menu.code,
|
|
269
380
|
className: cn({
|
|
270
381
|
active: selectedMenuKey === menu.code
|
|
@@ -273,7 +384,7 @@ export default (function (_ref2) {
|
|
|
273
384
|
onClick: function onClick() {
|
|
274
385
|
return onMenuClick(menu);
|
|
275
386
|
}
|
|
276
|
-
},
|
|
387
|
+
}, React.createElement("a", {
|
|
277
388
|
href: menu.path,
|
|
278
389
|
onClick: function onClick(evt) {
|
|
279
390
|
return evt.preventDefault();
|
|
@@ -1,15 +1,41 @@
|
|
|
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
|
-
|
|
1
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
|
|
2
|
+
|
|
3
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
|
|
4
|
+
|
|
5
|
+
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
|
|
6
|
+
|
|
7
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
|
|
8
|
+
|
|
9
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
|
|
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
|
+
|
|
11
15
|
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
|
+
|
|
12
37
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
38
|
+
|
|
13
39
|
import { useState, useEffect, useRef, useContext } from 'react';
|
|
14
40
|
import ReactDOM from 'react-dom';
|
|
15
41
|
import cn from 'classnames';
|
|
@@ -19,7 +45,7 @@ import ActionsContext from '../ActionsContext';
|
|
|
19
45
|
import { hasLevel3 } from '../../utils';
|
|
20
46
|
import Icon from '../Iconfont';
|
|
21
47
|
import NavigationPopup from './NavigationPopup';
|
|
22
|
-
var Navigation = styled.li(_templateObject
|
|
48
|
+
var Navigation = styled.li(_templateObject(), function (_ref) {
|
|
23
49
|
var theme = _ref.theme;
|
|
24
50
|
return theme.primaryColor;
|
|
25
51
|
}, function (_ref2) {
|
|
@@ -35,12 +61,14 @@ var Navigation = styled.li(_templateObject || (_templateObject = _taggedTemplate
|
|
|
35
61
|
var size = _ref5.theme.size;
|
|
36
62
|
return size === 'large' ? '-3px' : '-2px';
|
|
37
63
|
});
|
|
64
|
+
|
|
38
65
|
var createPopupContainer = function createPopupContainer() {
|
|
39
66
|
var div = document.createElement('div');
|
|
40
67
|
div.setAttribute('class', 'tnt-navigation-popup');
|
|
41
68
|
return div;
|
|
42
69
|
};
|
|
43
|
-
|
|
70
|
+
|
|
71
|
+
var GlobalStyle = createGlobalStyle(_templateObject2(), function (props) {
|
|
44
72
|
return props.theme.size === 'large' ? '60px' : '50px';
|
|
45
73
|
}, function (props) {
|
|
46
74
|
return props.hasLevel3 ? '560px' : '530px';
|
|
@@ -49,25 +77,30 @@ export default withTheme(function (props) {
|
|
|
49
77
|
var actions = useContext(ActionsContext);
|
|
50
78
|
var getText = actions.getText;
|
|
51
79
|
var headerRef = props.headerRef,
|
|
52
|
-
|
|
80
|
+
menus = props.menus;
|
|
81
|
+
|
|
53
82
|
var _useState = useState(false),
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
83
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
84
|
+
visible = _useState2[0],
|
|
85
|
+
setVisible = _useState2[1];
|
|
86
|
+
|
|
57
87
|
var popupRef = useRef();
|
|
58
88
|
useEffect(function () {
|
|
59
89
|
var _headerRef$current;
|
|
90
|
+
|
|
60
91
|
popupRef.current = createPopupContainer();
|
|
61
92
|
headerRef == null ? void 0 : (_headerRef$current = headerRef.current) == null ? void 0 : _headerRef$current.appendChild(popupRef.current);
|
|
62
93
|
return function () {
|
|
63
94
|
var _headerRef$current2;
|
|
95
|
+
|
|
64
96
|
headerRef == null ? void 0 : (_headerRef$current2 = headerRef.current) == null ? void 0 : _headerRef$current2.removeChild(popupRef.current);
|
|
65
97
|
};
|
|
66
98
|
}, []);
|
|
67
99
|
useEffect(function () {
|
|
68
100
|
var classNames = popupRef.current.getAttribute('class').split(' ');
|
|
101
|
+
|
|
69
102
|
if (visible) {
|
|
70
|
-
ReactDOM.render(
|
|
103
|
+
ReactDOM.render(React.createElement(NavigationPopup, {
|
|
71
104
|
actions: actions,
|
|
72
105
|
theme: props.theme,
|
|
73
106
|
menus: menus,
|
|
@@ -84,9 +117,10 @@ export default withTheme(function (props) {
|
|
|
84
117
|
popupRef.current.setAttribute('class', uniq([].concat(_toConsumableArray(classNames), ['hide'])).join(' '));
|
|
85
118
|
}
|
|
86
119
|
}, [visible]);
|
|
87
|
-
return
|
|
120
|
+
return React.createElement(Navigation, {
|
|
88
121
|
onClick: function onClick(evt) {
|
|
89
122
|
var _evt$nativeEvent, _evt$nativeEvent2;
|
|
123
|
+
|
|
90
124
|
evt.stopPropagation();
|
|
91
125
|
(_evt$nativeEvent = evt.nativeEvent) == null ? void 0 : _evt$nativeEvent.stopImmediatePropagation();
|
|
92
126
|
(_evt$nativeEvent2 = evt.nativeEvent) == null ? void 0 : _evt$nativeEvent2.stopPropagation();
|
|
@@ -95,9 +129,9 @@ export default withTheme(function (props) {
|
|
|
95
129
|
className: cn({
|
|
96
130
|
active: visible
|
|
97
131
|
})
|
|
98
|
-
},
|
|
132
|
+
}, React.createElement(Icon, {
|
|
99
133
|
type: "unordered-list"
|
|
100
|
-
}),
|
|
134
|
+
}), React.createElement("span", null, getText('globalNavigation')), React.createElement(GlobalStyle, {
|
|
101
135
|
hasLevel3: hasLevel3(menus)
|
|
102
136
|
}));
|
|
103
137
|
});
|