tntd 1.4.4 → 1.4.7

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.
Files changed (88) hide show
  1. package/components/Layout/HeaderActions.js +90 -128
  2. package/components/LoadingButton/index.js +11 -15
  3. package/components/QueryListScene/QueryForm.js +7 -4
  4. package/dist/stats.json +4990 -4990
  5. package/dist/tntd.js +1 -1
  6. package/es/Layout/HeaderActions.js +10 -10
  7. package/es/LoadingButton/index.js +20 -10
  8. package/es/QueryListScene/QueryForm.js +6 -3
  9. package/lib/ArrayInput/icon.js +27 -31
  10. package/lib/ArrayInput/index.js +211 -298
  11. package/lib/AuthContext.js +2 -13
  12. package/lib/Columns/index.js +71 -100
  13. package/lib/DevelopmentLogin/LoginModal.js +79 -141
  14. package/lib/DevelopmentLogin/index.js +28 -55
  15. package/lib/Ellipsis/Svg/CopySVG.js +23 -71
  16. package/lib/Ellipsis/Svg/TickSVG.js +17 -49
  17. package/lib/Ellipsis/index.js +148 -154
  18. package/lib/Handle/index.js +72 -109
  19. package/lib/Icon/fonts/iconfont.js +1 -43
  20. package/lib/Icon/iconList.js +119 -8
  21. package/lib/Icon/index.js +13 -45
  22. package/lib/Img/Contain.js +49 -81
  23. package/lib/Img/Cover.js +88 -136
  24. package/lib/Img/index.js +36 -89
  25. package/lib/Layout/ActionsContext.js +2 -11
  26. package/lib/Layout/AppList.js +262 -256
  27. package/lib/Layout/Application.js +119 -135
  28. package/lib/Layout/Avatar.js +137 -137
  29. package/lib/Layout/CompatibleLanguage.js +214 -195
  30. package/lib/Layout/EnterpriseLayout/Avatar.js +156 -168
  31. package/lib/Layout/EnterpriseLayout/Language.js +75 -100
  32. package/lib/Layout/EnterpriseLayout/Theme.js +96 -94
  33. package/lib/Layout/EnterpriseLayout/index.js +32 -45
  34. package/lib/Layout/GlobalNavigation/NavigationPopup.js +335 -407
  35. package/lib/Layout/GlobalNavigation/index.js +110 -158
  36. package/lib/Layout/Header.js +165 -116
  37. package/lib/Layout/HeaderActions.js +132 -129
  38. package/lib/Layout/HeaderNavs.js +90 -113
  39. package/lib/Layout/HeaderTabs.js +312 -278
  40. package/lib/Layout/Iconfont.js +2 -15
  41. package/lib/Layout/Language.js +63 -102
  42. package/lib/Layout/Layout.js +272 -261
  43. package/lib/Layout/Logo.js +132 -87
  44. package/lib/Layout/OrgAppList.js +440 -319
  45. package/lib/Layout/SideMenu.js +429 -343
  46. package/lib/Layout/Theme.js +95 -124
  47. package/lib/Layout/checkAuth.js +21 -35
  48. package/lib/Layout/createActions.js +38 -51
  49. package/lib/Layout/images/index.js +33 -41
  50. package/lib/Layout/index.js +110 -161
  51. package/lib/Layout/paaslayout/CompactSideMenu.js +200 -178
  52. package/lib/Layout/paaslayout/Header.js +84 -90
  53. package/lib/Layout/paaslayout/Logo.js +27 -32
  54. package/lib/Layout/paaslayout/SideMenu.js +161 -174
  55. package/lib/Layout/paaslayout/index.js +240 -261
  56. package/lib/Layout/storage.js +20 -78
  57. package/lib/Layout/utils.js +93 -143
  58. package/lib/LoadingButton/index.js +25 -57
  59. package/lib/Modal/index.js +83 -108
  60. package/lib/Page/Box.js +56 -81
  61. package/lib/Page/index.js +151 -173
  62. package/lib/Page/utils.js +12 -30
  63. package/lib/QueryForm/Field/Checkbox.js +11 -33
  64. package/lib/QueryForm/Field/Select.js +63 -99
  65. package/lib/QueryForm/Field/SelectInput.js +69 -114
  66. package/lib/QueryForm/Field/fieldsMap.js +30 -52
  67. package/lib/QueryForm/Field/index.js +76 -158
  68. package/lib/QueryForm/createActions.js +50 -65
  69. package/lib/QueryForm/index.js +304 -383
  70. package/lib/QueryForm/useForm.js +6 -17
  71. package/lib/QueryListScene/List.js +290 -366
  72. package/lib/QueryListScene/QueryForm.js +93 -158
  73. package/lib/QueryListScene/QueryListScene.js +33 -87
  74. package/lib/QueryListScene/Title.js +10 -20
  75. package/lib/QueryListScene/Toolbar.js +8 -31
  76. package/lib/QueryListScene/createActions.js +64 -79
  77. package/lib/QueryListScene/index.js +23 -40
  78. package/lib/QueryListScene/useActions.js +6 -17
  79. package/lib/Select/DropDownWrap.js +60 -124
  80. package/lib/Select/index.js +425 -561
  81. package/lib/Table/ResizableTable/index.js +77 -121
  82. package/lib/Table/index.js +19 -51
  83. package/lib/Title/index.js +34 -52
  84. package/lib/index.js +19 -159
  85. package/lib/locale.js +48 -63
  86. package/package.json +1 -1
  87. package/lib/Layout/EnterpriseLayout/Header.js +0 -113
  88. package/lib/Layout/EnterpriseLayout/HeaderActions.js +0 -104
@@ -1,137 +1,121 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = void 0;
7
-
8
- require("antd/lib/popover/style");
9
-
10
- var _popover = _interopRequireDefault(require("antd/lib/popover"));
11
-
12
- var _react = require("react");
13
-
14
- var _styledComponents = _interopRequireDefault(require("styled-components"));
15
-
16
- var _classnames = _interopRequireDefault(require("classnames"));
17
-
18
- var _lodash = require("lodash");
19
-
20
- var _logoIcon = require("@tntx/logo-icon");
21
-
22
- var _Iconfont = _interopRequireDefault(require("./Iconfont"));
23
-
24
- var _images = require("./images");
25
-
26
- var _this = void 0;
27
-
28
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
29
-
30
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
31
-
32
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
33
-
34
- 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; }
35
-
36
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
37
-
38
- function _templateObject4() {
39
- var data = _taggedTemplateLiteral(["\n background-color: #fff;\n border-radius: 4px;\n z-index: 1;\n"]);
40
-
41
- _templateObject4 = function _templateObject4() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject3() {
49
- var data = _taggedTemplateLiteral(["\n position: relative;\n width: 88px;\n padding: 8px 0;\n cursor: pointer;\n display: inline-block;\n text-align: center;\n &:hover, &.active {\n background: #eee;\n }\n &.active:after {\n position: absolute;\n width: 0;\n height: 0;\n border-width: 5px 10px 0 0;\n border-color: #333;\n border-style: solid;\n z-index: 9;\n }\n img {\n width: 44px;\n height: 44px;\n margin-bottom: 6px;\n }\n div {\n line-height: 20px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n }\n"]);
50
-
51
- _templateObject3 = function _templateObject3() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- function _templateObject2() {
59
- var data = _taggedTemplateLiteral(["\n list-style: none;\n width: 264px;\n margin: 0;\n padding: 0;\n"]);
60
-
61
- _templateObject2 = function _templateObject2() {
62
- return data;
63
- };
64
-
65
- return data;
66
- }
67
-
68
- function _templateObject() {
69
- var data = _taggedTemplateLiteral(["\n margin-left: 20px;\n font-size: 20px;\n cursor: pointer;\n .tnt-icon {\n color: #17233d99;\n .tnt-themeS1 & {\n color: rgba(255,255,255,.85);\n }\n }\n"]);
70
-
71
- _templateObject = function _templateObject() {
72
- return data;
73
- };
74
-
75
- return data;
76
- }
77
-
78
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
79
-
80
- var App = _styledComponents["default"].li(_templateObject());
81
-
82
- var AppList = _styledComponents["default"].ul(_templateObject2());
83
-
84
- var AppItem = _styledComponents["default"].li(_templateObject3());
85
-
86
- var AppContentWrapper = _styledComponents["default"].div(_templateObject4());
87
-
88
- var AppContent = function AppContent(props) {
89
- var language = props.language,
90
- apps = props.apps,
91
- onChange = props.onChange;
92
-
93
- var _useState = (0, _react.useState)(props.appKey),
94
- _useState2 = _slicedToArray(_useState, 2),
95
- appKey = _useState2[0],
96
- setAppKey = _useState2[1];
97
-
98
- var changeApp = function changeApp(appKey) {
99
- setAppKey(appKey);
100
- onChange && onChange(appKey);
101
- };
102
-
103
- return React.createElement(AppContentWrapper, null, React.createElement(AppList, null, apps.sort(function (a, b) {
104
- return (0, _lodash.get)(_logoIcon.systemMap, "".concat(a.appKey, ".sort"), 1) - (0, _lodash.get)(_logoIcon.systemMap, "".concat(b.appKey, ".sort"), 1);
105
- }).map(function (_ref) {
106
- var key = _ref.appKey;
107
- return React.createElement(AppItem, {
108
- key: key,
109
- className: (0, _classnames["default"])({
110
- active: appKey === key
111
- }),
112
- onClick: changeApp.bind(_this, key)
113
- }, React.createElement("img", {
114
- src: (0, _lodash.get)(_logoIcon.systemMap, "".concat(key, ".logo"), _images.defaultLogo),
115
- onError: function onError(e) {
116
- e.target.onerror = null;
117
- e.target.src = _images.defaultLogo;
118
- }
119
- }), React.createElement("div", null, (0, _lodash.get)(_logoIcon.systemMap, "".concat(key, ".").concat({
120
- cn: 'name',
121
- en: 'enName'
122
- }[language || 'cn']), key)));
123
- })));
124
- };
125
-
126
- var _default = function _default(props) {
127
- return React.createElement(App, null, React.createElement(_popover["default"], {
128
- placement: "bottomRight",
129
- title: null,
130
- content: React.createElement(AppContent, props),
131
- trigger: "click"
132
- }, React.createElement(_Iconfont["default"], {
133
- type: "application"
134
- })));
1
+ import { useState } from 'react';
2
+ import styled from 'styled-components';
3
+ import cn from 'classnames';
4
+ import { Popover } from 'antd';
5
+ import { get } from 'lodash';
6
+ import { systemMap as applicationsMap } from '@tntx/logo-icon';
7
+ import Iconfont from './Iconfont';
8
+ import { defaultLogo } from './images';
9
+
10
+ const App = styled.li`
11
+ margin-left: 20px;
12
+ font-size: 20px;
13
+ cursor: pointer;
14
+ .tnt-icon {
15
+ color: #17233d99;
16
+ .tnt-themeS1 & {
17
+ color: rgba(255,255,255,.85);
18
+ }
19
+ }
20
+ `;
21
+
22
+ const AppList = styled.ul`
23
+ list-style: none;
24
+ width: 264px;
25
+ margin: 0;
26
+ padding: 0;
27
+ `;
28
+
29
+ const AppItem = styled.li`
30
+ position: relative;
31
+ width: 88px;
32
+ padding: 8px 0;
33
+ cursor: pointer;
34
+ display: inline-block;
35
+ text-align: center;
36
+ &:hover, &.active {
37
+ background: #eee;
38
+ }
39
+ &.active:after {
40
+ position: absolute;
41
+ width: 0;
42
+ height: 0;
43
+ border-width: 5px 10px 0 0;
44
+ border-color: #333;
45
+ border-style: solid;
46
+ z-index: 9;
47
+ }
48
+ img {
49
+ width: 44px;
50
+ height: 44px;
51
+ margin-bottom: 6px;
52
+ }
53
+ div {
54
+ line-height: 20px;
55
+ white-space: nowrap;
56
+ text-overflow: ellipsis;
57
+ overflow: hidden;
58
+ }
59
+ `;
60
+
61
+ const AppContentWrapper = styled.div`
62
+ background-color: #fff;
63
+ border-radius: 4px;
64
+ z-index: 1;
65
+ `;
66
+
67
+ const AppContent = props => {
68
+ const { language, apps, onChange } = props;
69
+ const [appKey, setAppKey] = useState(props.appKey);
70
+ const changeApp = appKey => {
71
+ setAppKey(appKey);
72
+ onChange && onChange(appKey);
73
+ };
74
+
75
+ return (
76
+ <AppContentWrapper>
77
+ <AppList>
78
+ {
79
+ apps.sort(
80
+ (a, b) => get(applicationsMap, `${a.appKey}.sort`, 1) - get(applicationsMap, `${b.appKey}.sort`, 1)
81
+ ).map(({ appKey: key }) => (
82
+ <AppItem
83
+ key={key}
84
+ className={cn({ active: appKey === key })}
85
+ onClick={changeApp.bind(this, key)}
86
+ >
87
+ <img
88
+ src={get(applicationsMap, `${key}.logo`, defaultLogo)}
89
+ onError={e => {
90
+ e.target.onerror = null;
91
+ e.target.src = defaultLogo;
92
+ }}
93
+ />
94
+ <div>
95
+ {
96
+ get(applicationsMap, `${key}.${{
97
+ cn: 'name',
98
+ en: 'enName'
99
+ }[language || 'cn']}`, key)
100
+ }
101
+ </div>
102
+ </AppItem>
103
+ ))
104
+ }
105
+ </AppList>
106
+ </AppContentWrapper>
107
+ );
135
108
  };
136
109
 
137
- exports["default"] = _default;
110
+ export default props => (
111
+ <App>
112
+ <Popover
113
+ placement="bottomRight"
114
+ title={null}
115
+ content={<AppContent {...props} />}
116
+ trigger="click"
117
+ >
118
+ <Iconfont type="application" />
119
+ </Popover>
120
+ </App>
121
+ );
@@ -1,144 +1,144 @@
1
- "use strict";
2
-
3
- function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- require("antd/lib/popover/style");
11
-
12
- var _popover = _interopRequireDefault(require("antd/lib/popover"));
13
-
14
- require("antd/lib/button/style");
15
-
16
- var _button = _interopRequireDefault(require("antd/lib/button"));
17
-
18
- var _react = require("react");
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _deleteAllCookies = _interopRequireDefault(require("delete-all-cookies"));
23
-
24
- var _lodash = require("lodash");
25
-
26
- var _images = _interopRequireDefault(require("./images"));
27
-
28
- var _ActionsContext = _interopRequireDefault(require("./ActionsContext"));
29
-
30
- function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
31
-
32
- function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
33
-
34
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
35
-
36
- function _templateObject3() {
37
- var data = _taggedTemplateLiteral(["\n min-width: 235px;\n z-index: 1;\n background-color: #fff;\n border-radius: 4px;\n\n .isInIframe & {\n display: none;\n }\n \n .user-info-body {\n padding: 30px 20px 20px 24px;\n line-height: 16px;\n .user-info-body-username {\n margin-top: 0px;\n font-size: 16px;\n color: #333;\n font-weight: normal;\n margin-bottom: 10px;\n line-height: 16px;\n }\n .user-info-body-account {\n margin-top: 0px;\n color: #666;\n margin-bottom: 14px;\n line-height: 16px;\n }\n a {\n margin-right: 16px;\n }\n }\n .user-info-footer {\n border-top: 1px solid #ccc;\n background-color: #f5f5f5;\n padding: 8px 20px;\n text-align: right;\n .user-info-footer-signout:hover {\n box-shadow: 0 2px 8px rgba(0, 0, 0, .1);\n border-color: #d9d9d9;\n color: rgba(0, 0, 0, 0.65);\n }\n }\n"]);
38
-
39
- _templateObject3 = function _templateObject3() {
40
- return data;
41
- };
42
-
43
- return data;
44
- }
45
-
46
- function _templateObject2() {
47
- var data = _taggedTemplateLiteral(["\n .tnt-layout-personal-popover {\n .ant-popover-inner-content {\n padding: 0;\n }\n }\n"]);
48
-
49
- _templateObject2 = function _templateObject2() {
50
- return data;
51
- };
52
-
53
- return data;
54
- }
55
-
56
- function _templateObject() {
57
- var data = _taggedTemplateLiteral(["\n margin-right: 0;\n font-size: 0;\n img {\n width: 26px;\n height: 26px;\n border-radius: 50%;\n cursor: pointer;\n .large-size & {\n width: 32px;\n height: 32px;\n }\n }\n"]);
58
-
59
- _templateObject = function _templateObject() {
60
- return data;
61
- };
62
-
63
- return data;
64
- }
65
-
66
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
67
-
68
- var Avatar = _styledComponents["default"].li(_templateObject());
69
-
70
- var GlobalStyle = (0, _styledComponents.createGlobalStyle)(_templateObject2());
71
-
72
- var UserInfoWrapper = _styledComponents["default"].div(_templateObject3());
73
-
74
- var UserInfoContent = function UserInfoContent(props) {
75
- var userInfo = props.userInfo,
76
- onLogout = props.onLogout,
77
- _props$onChangePasswo = props.onChangePassword,
78
- onChangePassword = _props$onChangePasswo === void 0 ? function () {
79
- return true;
80
- } : _props$onChangePasswo,
81
- _props$onPersonalSett = props.onPersonalSetting,
82
- onPersonalSetting = _props$onPersonalSett === void 0 ? function () {
83
- return true;
84
- } : _props$onPersonalSett;
85
-
86
- var _useContext = (0, _react.useContext)(_ActionsContext["default"]),
87
- getText = _useContext.getText;
88
-
89
- return React.createElement(UserInfoWrapper, {
90
- className: "user-info-setting-wrap"
91
- }, React.createElement("div", {
92
- className: "user-info-body"
93
- }, React.createElement("p", {
94
- className: "user-info-body-username"
95
- }, userInfo.userName || '暂无昵称'), React.createElement("p", {
96
- className: "user-info-body-account"
97
- }, userInfo.account), React.createElement("a", {
98
- onClick: onPersonalSetting,
99
- href: "/bridge/userCenter?currentTab=1"
100
- }, getText('personalSettings')), React.createElement("a", {
101
- onClick: onChangePassword,
102
- href: "/bridge/userCenter?currentTab=2"
103
- }, getText('changePwd'))), React.createElement("div", {
104
- className: "user-info-footer"
105
- }, React.createElement(_button["default"], {
106
- className: "user-info-footer-signout",
107
- onClick: function onClick() {
108
- if (onLogout) {
109
- onLogout();
110
- (0, _deleteAllCookies["default"])(window)();
111
- } else {
112
- (0, _deleteAllCookies["default"])(window)();
113
- window.location.href = "/user/login?callbackUrl=".concat(window.encodeURI(location.href));
114
- }
1
+ import { useContext } from 'react';
2
+ import styled, { createGlobalStyle } from 'styled-components';
3
+ import { Popover, Button } from 'antd';
4
+ import deleteAllCookiesFactory from 'delete-all-cookies';
5
+ import { get } from 'lodash';
6
+ import images from './images';
7
+ import ActionsContext from './ActionsContext';
8
+
9
+ const Avatar = styled.li`
10
+ margin-right: 0;
11
+ font-size: 0;
12
+ img {
13
+ width: 26px;
14
+ height: 26px;
15
+ border-radius: 50%;
16
+ cursor: pointer;
17
+ .large-size & {
18
+ width: 32px;
19
+ height: 32px;
20
+ }
115
21
  }
116
- }, React.createElement("a", null, getText('signOut')))));
117
- };
22
+ `;
118
23
 
119
- var _default = function _default(props) {
120
- var _images$empty2;
24
+ const GlobalStyle = createGlobalStyle`
25
+ .tnt-layout-personal-popover {
26
+ .ant-popover-inner-content {
27
+ padding: 0;
28
+ }
29
+ }
30
+ `;
121
31
 
122
- var _props$userInfo = props.userInfo,
123
- userInfo = _props$userInfo === void 0 ? {} : _props$userInfo;
124
- var avatar = userInfo.avatar;
125
- return React.createElement(Avatar, null, React.createElement(_popover["default"], {
126
- popupClassName: "tnt-layout-personal-popover",
127
- placement: "bottomRight",
128
- title: null,
129
- content: React.createElement(UserInfoContent, props),
130
- trigger: "click"
131
- }, avatar ? React.createElement("img", {
132
- src: avatar.indexOf('base64') > 0 ? avatar : (0, _lodash.get)(_images["default"][avatar], 'default', _images["default"][avatar]),
133
- onError: function onError(e) {
134
- var _images$empty;
32
+ const UserInfoWrapper = styled.div`
33
+ min-width: 235px;
34
+ z-index: 1;
35
+ background-color: #fff;
36
+ border-radius: 4px;
135
37
 
136
- e.target.onerror = null;
137
- e.target.src = ((_images$empty = _images["default"].empty) == null ? void 0 : _images$empty["default"]) || _images["default"].empty;
38
+ .isInIframe & {
39
+ display: none;
40
+ }
41
+
42
+ .user-info-body {
43
+ padding: 30px 20px 20px 24px;
44
+ line-height: 16px;
45
+ .user-info-body-username {
46
+ margin-top: 0px;
47
+ font-size: 16px;
48
+ color: #333;
49
+ font-weight: normal;
50
+ margin-bottom: 10px;
51
+ line-height: 16px;
52
+ }
53
+ .user-info-body-account {
54
+ margin-top: 0px;
55
+ color: #666;
56
+ margin-bottom: 14px;
57
+ line-height: 16px;
58
+ }
59
+ a {
60
+ margin-right: 16px;
61
+ }
138
62
  }
139
- }) : React.createElement("img", {
140
- src: ((_images$empty2 = _images["default"].empty) == null ? void 0 : _images$empty2["default"]) || _images["default"].empty
141
- })), React.createElement(GlobalStyle, null));
63
+ .user-info-footer {
64
+ border-top: 1px solid #ccc;
65
+ background-color: #f5f5f5;
66
+ padding: 8px 20px;
67
+ text-align: right;
68
+ .user-info-footer-signout:hover {
69
+ box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
70
+ border-color: #d9d9d9;
71
+ color: rgba(0, 0, 0, 0.65);
72
+ }
73
+ }
74
+ `;
75
+
76
+ const UserInfoContent = props => {
77
+ const { userInfo, onLogout, onChangePassword = () => true, onPersonalSetting = () => true } = props;
78
+ const { getText } = useContext(ActionsContext);
79
+
80
+ return (
81
+ <UserInfoWrapper className="user-info-setting-wrap">
82
+ <div className="user-info-body">
83
+ <p className="user-info-body-username">
84
+ {userInfo.userName || '暂无昵称'}
85
+ </p>
86
+ <p className="user-info-body-account">
87
+ {userInfo.account}
88
+ </p>
89
+ <a onClick={onPersonalSetting} href="/bridge/userCenter?currentTab=1">{getText('personalSettings')}</a>
90
+ <a onClick={onChangePassword} href="/bridge/userCenter?currentTab=2">{getText('changePwd')}</a>
91
+ </div>
92
+ <div className="user-info-footer">
93
+ <Button
94
+ className="user-info-footer-signout"
95
+ onClick={() => {
96
+ if (onLogout) {
97
+ onLogout();
98
+ deleteAllCookiesFactory(window)();
99
+ } else {
100
+ deleteAllCookiesFactory(window)();
101
+ window.location.href = `/user/login?callbackUrl=${window.encodeURI(location.href)}`;
102
+ }
103
+ }}
104
+ >
105
+ <a>{getText('signOut')}</a>
106
+ </Button>
107
+ </div>
108
+ </UserInfoWrapper>
109
+ );
142
110
  };
143
111
 
144
- exports["default"] = _default;
112
+ export default props => {
113
+ const {
114
+ userInfo = {}
115
+ } = props;
116
+ const { avatar } = userInfo;
117
+
118
+ return (
119
+ <Avatar>
120
+ <Popover
121
+ popupClassName="tnt-layout-personal-popover"
122
+ placement="bottomRight"
123
+ title={null}
124
+ content={<UserInfoContent {...props} />}
125
+ trigger="click"
126
+ >
127
+ {
128
+ avatar ? (
129
+ <img
130
+ src={avatar.indexOf('base64') > 0 ? avatar : get(images[avatar], 'default', images[avatar])}
131
+ onError={e => {
132
+ e.target.onerror = null;
133
+ e.target.src = images.empty?.default || images.empty;
134
+ }}
135
+ />
136
+ ) : (
137
+ <img src={images.empty?.default || images.empty} />
138
+ )
139
+ }
140
+ </Popover>
141
+ <GlobalStyle />
142
+ </Avatar>
143
+ );
144
+ };