tntd 1.3.57 → 1.3.62
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/babel.config.js +2 -2
- package/components/Layout/Application.js +1 -1
- package/components/QueryForm/Field/index.js +2 -1
- package/components/QueryListScene/List.js +17 -13
- package/lib/0645cf743e4e44ca9da321d689897f07.png +0 -0
- package/lib/09db77de0c24fa0f45f8a5cf299a3d11.png +0 -0
- package/lib/1d0b52448de217857b270af807e9360d.png +0 -0
- package/lib/25d78d77c9c2f0d403e5d899ceb5b1ef.png +0 -0
- package/lib/27fa44ff0c98e1594d79b73045aabedf.png +0 -0
- package/lib/2c95075adb68d6131b59cae9fa554ec2.png +0 -0
- package/lib/377c871d922a25c773a9e7c2f42ed7c0.png +0 -0
- package/lib/3d901589b40bd56ff1fde2bbb700bfe1.png +0 -0
- package/lib/4abe481e130d7be0574e45573de8beb7.png +0 -0
- package/lib/95ee2260a509cd630d89c5367ed1973b.png +0 -0
- package/lib/ArrayInput/icon.js +31 -27
- package/lib/ArrayInput/index.js +298 -211
- package/lib/AuthContext.js +13 -2
- package/lib/BlockHeader/README.md +83 -0
- package/lib/BlockHeader/fonts/OswaldLight.ttf +0 -0
- package/lib/BlockHeader/index.js +42 -0
- package/lib/BlockHeader/index.less +141 -0
- package/lib/Columns/index.js +100 -71
- package/lib/DevelopmentLogin/LoginModal.js +141 -79
- package/lib/DevelopmentLogin/index.js +55 -28
- package/lib/Ellipsis/Svg/CopySVG.js +71 -23
- package/lib/Ellipsis/Svg/TickSVG.js +49 -17
- package/lib/Ellipsis/index.js +155 -149
- package/lib/Handle/index.js +109 -72
- package/lib/Icon/fonts/iconfont.js +43 -1
- package/lib/Icon/iconList.js +8 -119
- package/lib/Icon/index.js +45 -13
- package/lib/Img/Contain.js +81 -49
- package/lib/Img/Cover.js +136 -88
- package/lib/Img/index.js +89 -36
- package/lib/Layout/ActionsContext.js +11 -2
- package/lib/Layout/AppList.js +256 -262
- package/lib/Layout/Application.js +135 -119
- package/lib/Layout/Avatar.js +137 -137
- package/lib/Layout/CompatibleLanguage.js +195 -214
- package/lib/Layout/EnterpriseLayout/Avatar.js +168 -156
- package/lib/Layout/EnterpriseLayout/Language.js +100 -75
- package/lib/Layout/EnterpriseLayout/Theme.js +94 -96
- package/lib/Layout/EnterpriseLayout/index.js +45 -32
- package/lib/Layout/GlobalNavigation/NavigationPopup.js +407 -335
- package/lib/Layout/GlobalNavigation/index.js +158 -110
- package/lib/Layout/Header.js +116 -165
- package/lib/Layout/HeaderActions.js +129 -170
- package/lib/Layout/HeaderNavs.js +113 -90
- package/lib/Layout/HeaderTabs.js +278 -312
- package/lib/Layout/Iconfont.js +15 -2
- package/lib/Layout/Language.js +102 -63
- package/lib/Layout/Layout.js +261 -272
- package/lib/Layout/Logo.js +87 -132
- package/lib/Layout/OrgAppList.js +319 -440
- package/lib/Layout/SideMenu.js +343 -429
- package/lib/Layout/Theme.js +124 -95
- package/lib/Layout/checkAuth.js +35 -21
- package/lib/Layout/createActions.js +51 -38
- package/lib/Layout/images/index.js +41 -33
- package/lib/Layout/index.js +161 -110
- package/lib/Layout/locale.js +53 -0
- package/lib/Layout/paaslayout/CompactSideMenu.js +178 -200
- package/lib/Layout/paaslayout/Header.js +90 -84
- package/lib/Layout/paaslayout/Logo.js +32 -27
- package/lib/Layout/paaslayout/SideMenu.js +174 -161
- package/lib/Layout/paaslayout/index.js +261 -240
- package/lib/Layout/paaslayout/index.less +75 -0
- package/lib/Layout/storage.js +78 -20
- package/lib/Layout/utils.js +143 -93
- package/lib/LoadingButton/index.js +57 -29
- package/lib/Modal/index.js +108 -83
- package/lib/Page/Box.js +81 -56
- package/lib/Page/index.js +173 -151
- package/lib/Page/utils.js +30 -12
- package/lib/QueryForm/Field/Checkbox.js +33 -11
- package/lib/QueryForm/Field/Select.js +99 -63
- package/lib/QueryForm/Field/SelectInput.js +114 -69
- package/lib/QueryForm/Field/fieldsMap.js +52 -30
- package/lib/QueryForm/Field/index.js +158 -75
- package/lib/QueryForm/createActions.js +65 -50
- package/lib/QueryForm/index.js +382 -303
- package/lib/QueryForm/useForm.js +17 -6
- package/lib/QueryListScene/Field/SelectInput.js +115 -0
- package/lib/QueryListScene/Field/fieldsMap.js +52 -0
- package/lib/QueryListScene/Field/index.js +159 -0
- package/lib/QueryListScene/Field/select.js +100 -0
- package/lib/QueryListScene/List.js +362 -285
- package/lib/QueryListScene/QueryForm/index.js +423 -0
- package/lib/QueryListScene/QueryForm/index.less +141 -0
- package/lib/QueryListScene/QueryForm.js +159 -91
- package/lib/QueryListScene/QueryListScene.js +87 -33
- package/lib/QueryListScene/Title.js +20 -10
- package/lib/QueryListScene/Toolbar.js +31 -8
- package/lib/QueryListScene/createActions.js +79 -64
- package/lib/QueryListScene/index.js +40 -23
- package/lib/QueryListScene/useActions.js +17 -6
- package/lib/Select/DropDownWrap.js +124 -60
- package/lib/Select/index.js +563 -426
- package/lib/Table/ResizableTable/index.js +121 -77
- package/lib/Table/index.js +51 -19
- package/lib/Title/index.js +52 -34
- package/lib/b9dd5ff3622296fbee51ed68f4bca1bf.png +0 -0
- package/lib/bd2921989f9296089ba58efb7a76f3ef.png +0 -0
- package/lib/index.html +6 -0
- package/lib/index.js +159 -19
- package/lib/locale.js +63 -48
- package/lib/main.css +16420 -0
- package/lib/tntd.js +2 -0
- package/lib/tntd.js.LICENSE.txt +36 -0
- package/package.json +1 -1
package/lib/Icon/iconList.js
CHANGED
|
@@ -1,119 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
'shoucang',
|
|
10
|
-
'deal-type',
|
|
11
|
-
'pm',
|
|
12
|
-
'shoukuan',
|
|
13
|
-
'zhibiao',
|
|
14
|
-
'puzzle',
|
|
15
|
-
'user-group',
|
|
16
|
-
'yuce',
|
|
17
|
-
'jianmo',
|
|
18
|
-
'zhuanzhang',
|
|
19
|
-
'yunwei',
|
|
20
|
-
'baozhang',
|
|
21
|
-
'jizhang',
|
|
22
|
-
'tongji',
|
|
23
|
-
'pingfen',
|
|
24
|
-
'limit',
|
|
25
|
-
'spider',
|
|
26
|
-
'loan',
|
|
27
|
-
'access',
|
|
28
|
-
'role',
|
|
29
|
-
'org',
|
|
30
|
-
'celve',
|
|
31
|
-
'book',
|
|
32
|
-
'tag',
|
|
33
|
-
'shixufenxipeizhi',
|
|
34
|
-
'all-cases',
|
|
35
|
-
'xianeguanli',
|
|
36
|
-
'api',
|
|
37
|
-
'network',
|
|
38
|
-
'analysis',
|
|
39
|
-
'calendar',
|
|
40
|
-
'backup',
|
|
41
|
-
'all',
|
|
42
|
-
'attachment',
|
|
43
|
-
'chart-line',
|
|
44
|
-
'branches',
|
|
45
|
-
'chart-area',
|
|
46
|
-
'clock',
|
|
47
|
-
'check',
|
|
48
|
-
'charging-setting',
|
|
49
|
-
'chart-pie-alt',
|
|
50
|
-
'dashboard',
|
|
51
|
-
'datebase',
|
|
52
|
-
'check-reply',
|
|
53
|
-
'datacenter',
|
|
54
|
-
'connection',
|
|
55
|
-
'download',
|
|
56
|
-
'date-set',
|
|
57
|
-
'event',
|
|
58
|
-
'event-wait',
|
|
59
|
-
'fieldanalysis',
|
|
60
|
-
'exchange',
|
|
61
|
-
'knowledge',
|
|
62
|
-
'key',
|
|
63
|
-
'log',
|
|
64
|
-
'list',
|
|
65
|
-
'menu',
|
|
66
|
-
'index',
|
|
67
|
-
'project',
|
|
68
|
-
'monitorin',
|
|
69
|
-
'pointmap',
|
|
70
|
-
'ranking',
|
|
71
|
-
'model',
|
|
72
|
-
'plan',
|
|
73
|
-
'task',
|
|
74
|
-
'wait',
|
|
75
|
-
'upload',
|
|
76
|
-
'question-list',
|
|
77
|
-
'read',
|
|
78
|
-
'setting',
|
|
79
|
-
'reply',
|
|
80
|
-
'jinjianguanli',
|
|
81
|
-
'change-theme',
|
|
82
|
-
'application',
|
|
83
|
-
'flag-en',
|
|
84
|
-
'flag-cn',
|
|
85
|
-
'down',
|
|
86
|
-
'up',
|
|
87
|
-
'workflow',
|
|
88
|
-
'sync',
|
|
89
|
-
'folder',
|
|
90
|
-
'database',
|
|
91
|
-
'circle',
|
|
92
|
-
'edit',
|
|
93
|
-
'edit-color',
|
|
94
|
-
'box',
|
|
95
|
-
'layer',
|
|
96
|
-
'box-color',
|
|
97
|
-
'home-color',
|
|
98
|
-
'record',
|
|
99
|
-
'monitor',
|
|
100
|
-
'time-color',
|
|
101
|
-
'user',
|
|
102
|
-
'function-color',
|
|
103
|
-
'record-color',
|
|
104
|
-
'warning-color',
|
|
105
|
-
'layer-color',
|
|
106
|
-
'template',
|
|
107
|
-
'template-color',
|
|
108
|
-
'monitor-color',
|
|
109
|
-
'search',
|
|
110
|
-
'user-color',
|
|
111
|
-
'function',
|
|
112
|
-
'warning',
|
|
113
|
-
'search-color',
|
|
114
|
-
'home',
|
|
115
|
-
'time',
|
|
116
|
-
'application',
|
|
117
|
-
'plus',
|
|
118
|
-
'minus'
|
|
119
|
-
];
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _default = ['system', 'entry', 'permission', 'graph', 'guanjia', 'case', 'celve1', 'shoucang', 'deal-type', 'pm', 'shoukuan', 'zhibiao', 'puzzle', 'user-group', 'yuce', 'jianmo', 'zhuanzhang', 'yunwei', 'baozhang', 'jizhang', 'tongji', 'pingfen', 'limit', 'spider', 'loan', 'access', 'role', 'org', 'celve', 'book', 'tag', 'shixufenxipeizhi', 'all-cases', 'xianeguanli', 'api', 'network', 'analysis', 'calendar', 'backup', 'all', 'attachment', 'chart-line', 'branches', 'chart-area', 'clock', 'check', 'charging-setting', 'chart-pie-alt', 'dashboard', 'datebase', 'check-reply', 'datacenter', 'connection', 'download', 'date-set', 'event', 'event-wait', 'fieldanalysis', 'exchange', 'knowledge', 'key', 'log', 'list', 'menu', 'index', 'project', 'monitorin', 'pointmap', 'ranking', 'model', 'plan', 'task', 'wait', 'upload', 'question-list', 'read', 'setting', 'reply', 'jinjianguanli', 'change-theme', 'application', 'flag-en', 'flag-cn', 'down', 'up', 'workflow', 'sync', 'folder', 'database', 'circle', 'edit', 'edit-color', 'box', 'layer', 'box-color', 'home-color', 'record', 'monitor', 'time-color', 'user', 'function-color', 'record-color', 'warning-color', 'layer-color', 'template', 'template-color', 'monitor-color', 'search', 'user-color', 'function', 'warning', 'search-color', 'home', 'time', 'application', 'plus', 'minus'];
|
|
8
|
+
exports["default"] = _default;
|
package/lib/Icon/index.js
CHANGED
|
@@ -1,14 +1,46 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "iconList", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _iconList["default"];
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
exports["default"] = void 0;
|
|
13
|
+
|
|
14
|
+
require("./fonts/iconfont");
|
|
15
|
+
|
|
16
|
+
require("./index.less");
|
|
17
|
+
|
|
18
|
+
var _iconList = _interopRequireDefault(require("./iconList"));
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
|
+
|
|
22
|
+
function _extends() { _extends = Object.assign || 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); }
|
|
23
|
+
|
|
24
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
25
|
+
|
|
26
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
27
|
+
|
|
28
|
+
var _default = function _default(_ref) {
|
|
29
|
+
var type = _ref.type,
|
|
30
|
+
_ref$prefix = _ref.prefix,
|
|
31
|
+
prefix = _ref$prefix === void 0 ? 'tnt-' : _ref$prefix,
|
|
32
|
+
_ref$className = _ref.className,
|
|
33
|
+
className = _ref$className === void 0 ? '' : _ref$className,
|
|
34
|
+
props = _objectWithoutProperties(_ref, ["type", "prefix", "className"]);
|
|
35
|
+
|
|
36
|
+
return React.createElement("i", _extends({
|
|
37
|
+
className: "tnt-icon ".concat(className),
|
|
38
|
+
type: type
|
|
39
|
+
}, props), React.createElement("svg", {
|
|
40
|
+
"aria-hidden": "true"
|
|
41
|
+
}, React.createElement("use", {
|
|
42
|
+
xlinkHref: "#".concat(prefix).concat(type)
|
|
43
|
+
})));
|
|
14
44
|
};
|
|
45
|
+
|
|
46
|
+
exports["default"] = _default;
|
package/lib/Img/Contain.js
CHANGED
|
@@ -1,50 +1,82 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
|
+
|
|
14
|
+
function _extends() { _extends = Object.assign || 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); }
|
|
15
|
+
|
|
16
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
|
17
|
+
|
|
18
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
19
|
+
|
|
20
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
21
|
+
|
|
22
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
23
|
+
|
|
24
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
25
|
+
|
|
26
|
+
var _default = function _default(props) {
|
|
27
|
+
var alt = props.alt,
|
|
28
|
+
title = props.title,
|
|
29
|
+
src = props.src,
|
|
30
|
+
width = props.width,
|
|
31
|
+
height = props.height,
|
|
32
|
+
_props$style = props.style,
|
|
33
|
+
style = _props$style === void 0 ? {} : _props$style,
|
|
34
|
+
className = props.className,
|
|
35
|
+
onError = props.onError,
|
|
36
|
+
shape = props.shape,
|
|
37
|
+
errorImgSrc = props.errorImgSrc,
|
|
38
|
+
type = props.type,
|
|
39
|
+
others = _objectWithoutProperties(props, ["alt", "title", "src", "width", "height", "style", "className", "onError", "shape", "errorImgSrc", "type"]);
|
|
40
|
+
|
|
41
|
+
var styles = _objectSpread({}, style, {
|
|
42
|
+
display: 'inline-block',
|
|
43
|
+
width: width,
|
|
44
|
+
height: height,
|
|
45
|
+
overflow: 'hidden'
|
|
46
|
+
});
|
|
47
|
+
|
|
48
|
+
if (shape === 'rounded') {
|
|
49
|
+
styles.borderRadius = '5px';
|
|
50
|
+
} else if (shape === 'circle') {
|
|
51
|
+
styles.borderRadius = '50%';
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
var centerStyles = {
|
|
55
|
+
width: width,
|
|
56
|
+
height: height,
|
|
57
|
+
display: 'table-cell',
|
|
58
|
+
verticalAlign: 'middle',
|
|
59
|
+
textAlign: 'center'
|
|
60
|
+
};
|
|
61
|
+
var imgStyles = {
|
|
62
|
+
width: 'auto',
|
|
63
|
+
height: 'auto',
|
|
64
|
+
maxWidth: width,
|
|
65
|
+
maxHeight: height
|
|
66
|
+
};
|
|
67
|
+
var cls = (0, _classnames["default"])('tntd-img', shape, className);
|
|
68
|
+
return _react["default"].createElement("div", _extends({
|
|
69
|
+
className: cls,
|
|
70
|
+
style: styles
|
|
71
|
+
}, others), _react["default"].createElement("div", {
|
|
72
|
+
style: centerStyles
|
|
73
|
+
}, _react["default"].createElement("img", {
|
|
74
|
+
style: imgStyles,
|
|
75
|
+
onError: onError,
|
|
76
|
+
src: src,
|
|
77
|
+
alt: alt,
|
|
78
|
+
title: title
|
|
79
|
+
})));
|
|
50
80
|
};
|
|
81
|
+
|
|
82
|
+
exports["default"] = _default;
|
package/lib/Img/Cover.js
CHANGED
|
@@ -1,96 +1,144 @@
|
|
|
1
|
-
|
|
2
|
-
import { useEffect, useState, useRef } from 'react';
|
|
3
|
-
import classnames from 'classnames';
|
|
4
|
-
|
|
5
|
-
export default props => {
|
|
6
|
-
const { alt, title, src, width, height, style = {}, className, onError, shape, errorImgSrc, type, ...others } = props;
|
|
7
|
-
const imgRef = useRef();
|
|
8
|
-
const [imgStyles, setImgStyles] = useState({
|
|
9
|
-
display: 'block',
|
|
10
|
-
maxWidth: 'none',
|
|
11
|
-
width: 'auto',
|
|
12
|
-
height: 'auto',
|
|
13
|
-
// transition: 'opacity 0.2s ease',
|
|
14
|
-
opacity: 0,
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
const getStyles = (wrapWidth, wrapHeight, imgWidth, imgHeight) => {
|
|
18
|
-
// 进行等比运算
|
|
19
|
-
const wrapRatio = wrapWidth / wrapHeight;
|
|
20
|
-
const imgRatio = imgWidth / imgHeight;
|
|
21
|
-
|
|
22
|
-
let finalWidth = 0;
|
|
23
|
-
let finalHeight = 0;
|
|
24
|
-
let finalMarginTop = 0;
|
|
25
|
-
let finalMarginLeft = 0;
|
|
26
|
-
|
|
27
|
-
if (wrapRatio > imgRatio) {
|
|
28
|
-
// 父框宽度更大,以父框的宽度为准,拉伸图片上移
|
|
29
|
-
finalWidth = wrapWidth;
|
|
30
|
-
finalHeight = finalWidth / imgRatio;
|
|
31
|
-
finalMarginTop = ((finalHeight - wrapHeight) / 2) * -1;
|
|
32
|
-
} else {
|
|
33
|
-
// 父框高度更大,以父框高度为准,拉伸图片左移动
|
|
34
|
-
finalHeight = wrapHeight;
|
|
35
|
-
finalWidth = finalHeight * imgRatio;
|
|
36
|
-
finalMarginLeft = ((finalWidth - wrapWidth) / 2) * -1;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
return {
|
|
40
|
-
height: finalHeight,
|
|
41
|
-
width: finalWidth,
|
|
42
|
-
marginLeft: finalMarginLeft,
|
|
43
|
-
marginTop: finalMarginTop,
|
|
44
|
-
};
|
|
45
|
-
};
|
|
1
|
+
"use strict";
|
|
46
2
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
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
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
+
|
|
16
|
+
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
|
|
17
|
+
|
|
18
|
+
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; }
|
|
19
|
+
|
|
20
|
+
function _extends() { _extends = Object.assign || 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); }
|
|
21
|
+
|
|
22
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
|
23
|
+
|
|
24
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
25
|
+
|
|
26
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
27
|
+
|
|
28
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
|
|
29
|
+
|
|
30
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
|
|
60
31
|
|
|
61
|
-
|
|
62
|
-
if (width || height) {
|
|
63
|
-
imgOnload();
|
|
64
|
-
}
|
|
65
|
-
}, [width, height]);
|
|
32
|
+
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; }
|
|
66
33
|
|
|
34
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
67
35
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
36
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
37
|
+
|
|
38
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
39
|
+
|
|
40
|
+
var _default = function _default(props) {
|
|
41
|
+
var alt = props.alt,
|
|
42
|
+
title = props.title,
|
|
43
|
+
src = props.src,
|
|
44
|
+
width = props.width,
|
|
45
|
+
height = props.height,
|
|
46
|
+
_props$style = props.style,
|
|
47
|
+
style = _props$style === void 0 ? {} : _props$style,
|
|
48
|
+
className = props.className,
|
|
49
|
+
onError = props.onError,
|
|
50
|
+
shape = props.shape,
|
|
51
|
+
errorImgSrc = props.errorImgSrc,
|
|
52
|
+
type = props.type,
|
|
53
|
+
others = _objectWithoutProperties(props, ["alt", "title", "src", "width", "height", "style", "className", "onError", "shape", "errorImgSrc", "type"]);
|
|
54
|
+
|
|
55
|
+
var imgRef = (0, _react.useRef)();
|
|
56
|
+
|
|
57
|
+
var _useState = (0, _react.useState)({
|
|
58
|
+
display: 'block',
|
|
59
|
+
maxWidth: 'none',
|
|
60
|
+
width: 'auto',
|
|
61
|
+
height: 'auto',
|
|
62
|
+
// transition: 'opacity 0.2s ease',
|
|
63
|
+
opacity: 0
|
|
64
|
+
}),
|
|
65
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
66
|
+
imgStyles = _useState2[0],
|
|
67
|
+
setImgStyles = _useState2[1];
|
|
68
|
+
|
|
69
|
+
var getStyles = function getStyles(wrapWidth, wrapHeight, imgWidth, imgHeight) {
|
|
70
|
+
// 进行等比运算
|
|
71
|
+
var wrapRatio = wrapWidth / wrapHeight;
|
|
72
|
+
var imgRatio = imgWidth / imgHeight;
|
|
73
|
+
var finalWidth = 0;
|
|
74
|
+
var finalHeight = 0;
|
|
75
|
+
var finalMarginTop = 0;
|
|
76
|
+
var finalMarginLeft = 0;
|
|
77
|
+
|
|
78
|
+
if (wrapRatio > imgRatio) {
|
|
79
|
+
// 父框宽度更大,以父框的宽度为准,拉伸图片上移
|
|
80
|
+
finalWidth = wrapWidth;
|
|
81
|
+
finalHeight = finalWidth / imgRatio;
|
|
82
|
+
finalMarginTop = (finalHeight - wrapHeight) / 2 * -1;
|
|
83
|
+
} else {
|
|
84
|
+
// 父框高度更大,以父框高度为准,拉伸图片左移动
|
|
85
|
+
finalHeight = wrapHeight;
|
|
86
|
+
finalWidth = finalHeight * imgRatio;
|
|
87
|
+
finalMarginLeft = (finalWidth - wrapWidth) / 2 * -1;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
return {
|
|
91
|
+
height: finalHeight,
|
|
92
|
+
width: finalWidth,
|
|
93
|
+
marginLeft: finalMarginLeft,
|
|
94
|
+
marginTop: finalMarginTop
|
|
74
95
|
};
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
var imgOnload = function imgOnload() {
|
|
99
|
+
var imgDOM = imgRef.current;
|
|
100
|
+
var width = props.width,
|
|
101
|
+
height = props.height;
|
|
102
|
+
var imgWidth = imgDOM.width;
|
|
103
|
+
var imgHeight = imgDOM.height;
|
|
104
|
+
var imgStyles2 = getStyles(width, height, imgWidth, imgHeight);
|
|
105
|
+
setImgStyles(_objectSpread({}, imgStyles, {}, imgStyles2, {
|
|
106
|
+
opacity: 1
|
|
107
|
+
}));
|
|
108
|
+
};
|
|
109
|
+
|
|
110
|
+
(0, _react.useEffect)(function () {
|
|
111
|
+
if (width || height) {
|
|
112
|
+
imgOnload();
|
|
79
113
|
}
|
|
114
|
+
}, [width, height]);
|
|
80
115
|
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
116
|
+
var styles = _objectSpread({}, style, {
|
|
117
|
+
display: 'inline-block',
|
|
118
|
+
overflow: 'hidden',
|
|
119
|
+
width: width,
|
|
120
|
+
height: height
|
|
121
|
+
});
|
|
122
|
+
|
|
123
|
+
if (shape === 'rounded') {
|
|
124
|
+
styles.borderRadius = '5px';
|
|
125
|
+
} else if (shape === 'circle') {
|
|
126
|
+
styles.borderRadius = '50%';
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
var cls = (0, _classnames["default"])('tntd-img', shape, className);
|
|
130
|
+
return _react["default"].createElement("div", _extends({
|
|
131
|
+
className: cls,
|
|
132
|
+
style: styles
|
|
133
|
+
}, others), _react["default"].createElement("img", {
|
|
134
|
+
style: imgStyles,
|
|
135
|
+
onError: onError,
|
|
136
|
+
ref: imgRef,
|
|
137
|
+
src: src,
|
|
138
|
+
alt: alt,
|
|
139
|
+
title: title,
|
|
140
|
+
onLoad: imgOnload
|
|
141
|
+
}));
|
|
96
142
|
};
|
|
143
|
+
|
|
144
|
+
exports["default"] = _default;
|