@qn-pandora/pandora-component 2.2.0 → 3.0.1
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/CHANGELOG.json +45 -0
- package/CHANGELOG.md +19 -0
- package/es/components/AutoComplete/style.css +7 -7
- package/es/components/Button/style.css +0 -1
- package/es/components/Button/style.less +0 -1
- package/es/components/Card/index.js +2 -1
- package/es/components/CheckTransformList/Item/index.js +1 -1
- package/es/components/CheckTransformList/style.css +16 -8
- package/es/components/CheckboxList/index.d.ts +1 -0
- package/es/components/CheckboxList/index.js +3 -2
- package/es/components/Collapse/index.js +2 -1
- package/es/components/CollapsiblePanel/index.d.ts +2 -2
- package/es/components/ConfigProvider/index.js +2 -1
- package/es/components/DateTimePicker/Base/index.js +2 -2
- package/es/components/DateTimePicker/Base/style.css +4 -4
- package/es/components/DateTimePicker/BaseMobile/index.d.ts +1 -0
- package/es/components/DateTimePicker/BaseMobile/index.js +2 -2
- package/es/components/DateTimePicker/DisplayInput/style.css +7 -7
- package/es/components/DateTimePicker/index.d.ts +6 -1
- package/es/components/DateTimePicker/index.js +2 -2
- package/es/components/Input/index.js +2 -1
- package/es/components/Input/style.css +7 -7
- package/es/components/InputNumber/style.css +2 -2
- package/es/components/Menu/index.d.ts +2 -2
- package/es/components/NameLimiter/index.d.ts +3 -13
- package/es/components/NameLimiter/index.js +30 -39
- package/es/components/NameLimiter/style.css +9 -1
- package/es/components/NameLimiter/style.less +10 -1
- package/es/components/OptionList/index.js +2 -1
- package/es/components/RangeInput/style.css +9 -9
- package/es/components/RemarkName/index.d.ts +0 -2
- package/es/components/RemarkName/index.js +2 -4
- package/es/components/RemarkName/style.css +9 -5
- package/es/components/RemarkName/style.less +0 -5
- package/es/components/Selector/style.css +7 -7
- package/es/components/SolidRadioGroup/index.js +7 -4
- package/es/components/SolidRadioGroup/style.css +6 -2
- package/es/components/SolidRadioGroup/style.less +5 -0
- package/es/components/Steps/index.js +2 -1
- package/es/components/Table/index.d.ts +9 -24
- package/es/components/Table/index.js +40 -8
- package/es/components/Table/style.css +5 -5
- package/es/components/TagList/Tag/style.css +3 -3
- package/es/components/TagList/Tag/style.less +3 -3
- package/es/components/TagList/index.js +3 -2
- package/es/components/TagList/style.css +3 -3
- package/es/components/TagList/style.less +8 -8
- package/es/index.css +2252 -2245
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/index.less +6 -6
- package/es/style/theme.less +8 -6
- package/lib/components/AutoComplete/style.css +7 -7
- package/lib/components/Button/style.css +0 -1
- package/lib/components/Button/style.less +0 -1
- package/lib/components/Card/index.js +1 -1
- package/lib/components/CheckTransformList/Item/index.js +1 -1
- package/lib/components/CheckTransformList/style.css +16 -8
- package/lib/components/CheckboxList/index.d.ts +1 -0
- package/lib/components/CheckboxList/index.js +3 -2
- package/lib/components/Collapse/index.js +1 -1
- package/lib/components/CollapsiblePanel/index.d.ts +2 -2
- package/lib/components/ConfigProvider/index.js +1 -1
- package/lib/components/DateTimePicker/Base/index.js +2 -2
- package/lib/components/DateTimePicker/Base/style.css +4 -4
- package/lib/components/DateTimePicker/BaseMobile/index.d.ts +1 -0
- package/lib/components/DateTimePicker/BaseMobile/index.js +2 -2
- package/lib/components/DateTimePicker/DisplayInput/style.css +7 -7
- package/lib/components/DateTimePicker/index.d.ts +6 -1
- package/lib/components/DateTimePicker/index.js +2 -2
- package/lib/components/Input/index.js +1 -1
- package/lib/components/Input/style.css +7 -7
- package/lib/components/InputNumber/style.css +2 -2
- package/lib/components/Menu/index.d.ts +2 -2
- package/lib/components/NameLimiter/index.d.ts +3 -13
- package/lib/components/NameLimiter/index.js +30 -38
- package/lib/components/NameLimiter/style.css +9 -1
- package/lib/components/NameLimiter/style.less +10 -1
- package/lib/components/OptionList/index.js +1 -1
- package/lib/components/RangeInput/style.css +9 -9
- package/lib/components/RemarkName/index.d.ts +0 -2
- package/lib/components/RemarkName/index.js +2 -4
- package/lib/components/RemarkName/style.css +9 -5
- package/lib/components/RemarkName/style.less +0 -5
- package/lib/components/Selector/style.css +7 -7
- package/lib/components/SolidRadioGroup/index.js +6 -3
- package/lib/components/SolidRadioGroup/style.css +6 -2
- package/lib/components/SolidRadioGroup/style.less +5 -0
- package/lib/components/Steps/index.js +1 -1
- package/lib/components/Table/index.d.ts +9 -24
- package/lib/components/Table/index.js +39 -7
- package/lib/components/Table/style.css +5 -5
- package/lib/components/TagList/Tag/style.css +3 -3
- package/lib/components/TagList/Tag/style.less +3 -3
- package/lib/components/TagList/index.js +2 -2
- package/lib/components/TagList/style.css +3 -3
- package/lib/components/TagList/style.less +8 -8
- package/lib/index.css +19 -12
- package/lib/index.d.ts +1 -1
- package/lib/index.js +0 -1
- package/lib/style/theme.less +8 -6
- package/package.json +23 -23
- package/es/components/NameLimiter/transformer.d.ts +0 -6
- package/es/components/NameLimiter/transformer.js +0 -84
- package/lib/components/NameLimiter/transformer.d.ts +0 -6
- package/lib/components/NameLimiter/transformer.js +0 -91
@@ -1,17 +1,20 @@
|
|
1
1
|
"use strict";
|
2
|
-
var
|
3
|
-
var
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
}
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
2
|
+
var __read = (this && this.__read) || function (o, n) {
|
3
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
4
|
+
if (!m) return o;
|
5
|
+
var i = m.call(o), r, ar = [], e;
|
6
|
+
try {
|
7
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
8
|
+
}
|
9
|
+
catch (error) { e = { error: error }; }
|
10
|
+
finally {
|
11
|
+
try {
|
12
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
13
|
+
}
|
14
|
+
finally { if (e) throw e.error; }
|
15
|
+
}
|
16
|
+
return ar;
|
17
|
+
};
|
15
18
|
var __importStar = (this && this.__importStar) || function (mod) {
|
16
19
|
if (mod && mod.__esModule) return mod;
|
17
20
|
var result = {};
|
@@ -20,32 +23,21 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
20
23
|
return result;
|
21
24
|
};
|
22
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
23
|
-
var
|
26
|
+
var react_1 = __importStar(require("react"));
|
24
27
|
var antd_1 = require("antd");
|
25
28
|
var style_1 = require("../../constants/style");
|
26
|
-
|
27
|
-
var
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
function NameLimiter() {
|
35
|
-
return _super !== null && _super.apply(this, arguments) || this;
|
36
|
-
}
|
37
|
-
NameLimiter.prototype.render = function () {
|
38
|
-
var _a = this.props, name = _a.name, length = _a.length, title = _a.title, type = _a.type;
|
39
|
-
var displayName = name;
|
40
|
-
var needFormat = transformer_1.getBytes(displayName) > length;
|
41
|
-
var nameSpan = (React.createElement("span", null, needFormat
|
42
|
-
? transformer_1.getTransformerString(displayName, length, type)
|
43
|
-
: displayName));
|
44
|
-
if (title || needFormat) {
|
45
|
-
return (React.createElement(antd_1.Tooltip, { overlayClassName: style_1.SDK_PREFIX + "-name-tooltip", placement: "top", title: title || displayName }, nameSpan));
|
29
|
+
function NameLimiter(_a) {
|
30
|
+
var name = _a.name, title = _a.title;
|
31
|
+
var _b = __read(react_1.useState(false), 2), ellipsis = _b[0], setEllipsis = _b[1];
|
32
|
+
var _c = __read(react_1.useState(false), 2), visible = _c[0], setVisible = _c[1];
|
33
|
+
var ref = react_1.useRef(null);
|
34
|
+
react_1.useLayoutEffect(function () {
|
35
|
+
if (!ref.current) {
|
36
|
+
return;
|
46
37
|
}
|
47
|
-
|
48
|
-
};
|
49
|
-
return
|
50
|
-
|
38
|
+
setEllipsis(ref.current.clientWidth < ref.current.scrollWidth);
|
39
|
+
});
|
40
|
+
return (react_1.default.createElement(antd_1.Tooltip, { overlayClassName: style_1.SDK_PREFIX + "-name-limit-tooltip", placement: "top", title: title || name, visible: (!!title || ellipsis) && visible, onVisibleChange: setVisible },
|
41
|
+
react_1.default.createElement("span", { className: style_1.SDK_PREFIX + "-name-limit", ref: ref }, name)));
|
42
|
+
}
|
51
43
|
exports.default = NameLimiter;
|
@@ -268,7 +268,15 @@
|
|
268
268
|
.ant-btn-sm {
|
269
269
|
padding: 0 7px;
|
270
270
|
}
|
271
|
-
.pandora-sdk-name-
|
271
|
+
.pandora-sdk-name-limit {
|
272
|
+
max-width: 100%;
|
273
|
+
display: inline-block;
|
274
|
+
vertical-align: top;
|
275
|
+
white-space: nowrap;
|
276
|
+
text-overflow: ellipsis;
|
277
|
+
overflow: hidden;
|
278
|
+
}
|
279
|
+
.pandora-sdk-name-limit-tooltip .ant-tooltip-inner {
|
272
280
|
max-width: 400px !important;
|
273
281
|
max-height: 200px !important;
|
274
282
|
overflow: auto;
|
@@ -1,7 +1,16 @@
|
|
1
1
|
@import 'antd/lib/tooltip/style/index.less';
|
2
2
|
@import '../../style/theme.less';
|
3
3
|
|
4
|
-
.@{sdk-prefix}-name-
|
4
|
+
.@{sdk-prefix}-name-limit {
|
5
|
+
max-width: 100%;
|
6
|
+
display: inline-block;
|
7
|
+
vertical-align: top;
|
8
|
+
white-space: nowrap;
|
9
|
+
text-overflow: ellipsis;
|
10
|
+
overflow: hidden;
|
11
|
+
}
|
12
|
+
|
13
|
+
.@{sdk-prefix}-name-limit-tooltip {
|
5
14
|
.@{ant-prefix}-tooltip-inner {
|
6
15
|
max-width: 400px !important;
|
7
16
|
max-height: 200px !important;
|
@@ -63,7 +63,7 @@ function OptionList(props) {
|
|
63
63
|
}
|
64
64
|
return (React.createElement(InlineOptionList_1.default, __assign({}, other, { className: className, options: inlineOptions })));
|
65
65
|
}
|
66
|
-
exports.default = OptionList;
|
67
66
|
OptionList.EShowMode = constants_1.EShowMode;
|
68
67
|
OptionList.InlineOptionList = InlineOptionList_1.default;
|
69
68
|
OptionList.PopoverOptionList = PopoverOptionList_1.default;
|
69
|
+
exports.default = OptionList;
|
@@ -98,7 +98,7 @@ textarea.ant-input-affix-wrapper {
|
|
98
98
|
transition: all 0.3s, height 0s;
|
99
99
|
}
|
100
100
|
.ant-input-affix-wrapper-lg {
|
101
|
-
padding:
|
101
|
+
padding: 6.5px 11px;
|
102
102
|
font-size: 16px;
|
103
103
|
}
|
104
104
|
.ant-input-affix-wrapper-sm {
|
@@ -291,7 +291,7 @@ textarea.ant-input {
|
|
291
291
|
transition: all 0.3s, height 0s;
|
292
292
|
}
|
293
293
|
.ant-input-lg {
|
294
|
-
padding:
|
294
|
+
padding: 6.5px 11px;
|
295
295
|
font-size: 16px;
|
296
296
|
}
|
297
297
|
.ant-input-sm {
|
@@ -427,7 +427,7 @@ textarea.ant-input {
|
|
427
427
|
}
|
428
428
|
.ant-input-group-lg .ant-input,
|
429
429
|
.ant-input-group-lg > .ant-input-group-addon {
|
430
|
-
padding:
|
430
|
+
padding: 6.5px 11px;
|
431
431
|
font-size: 16px;
|
432
432
|
}
|
433
433
|
.ant-input-group-sm .ant-input,
|
@@ -435,7 +435,7 @@ textarea.ant-input {
|
|
435
435
|
padding: 1px 7px;
|
436
436
|
}
|
437
437
|
.ant-input-group-lg .ant-select-single .ant-select-selector {
|
438
|
-
height:
|
438
|
+
height: 40px;
|
439
439
|
}
|
440
440
|
.ant-input-group-sm .ant-select-single .ant-select-selector {
|
441
441
|
height: 26px;
|
@@ -624,7 +624,7 @@ textarea.ant-input {
|
|
624
624
|
height: 32px;
|
625
625
|
}
|
626
626
|
.ant-input[type='color'].ant-input-lg {
|
627
|
-
height:
|
627
|
+
height: 40px;
|
628
628
|
}
|
629
629
|
.ant-input[type='color'].ant-input-sm {
|
630
630
|
height: 26px;
|
@@ -679,7 +679,7 @@ textarea.ant-input {
|
|
679
679
|
z-index: 1;
|
680
680
|
}
|
681
681
|
.ant-input-search-large .ant-input-search-button {
|
682
|
-
height:
|
682
|
+
height: 40px;
|
683
683
|
}
|
684
684
|
.ant-input-search-small .ant-input-search-button {
|
685
685
|
height: 26px;
|
@@ -738,7 +738,7 @@ textarea.ant-input {
|
|
738
738
|
height: 32px;
|
739
739
|
}
|
740
740
|
.ant-input-lg {
|
741
|
-
height:
|
741
|
+
height: 40px;
|
742
742
|
}
|
743
743
|
.ant-input-sm {
|
744
744
|
height: 26px;
|
@@ -851,7 +851,7 @@ textarea.ant-input-number {
|
|
851
851
|
transition: all 0.3s, height 0s;
|
852
852
|
}
|
853
853
|
.ant-input-number-lg {
|
854
|
-
padding:
|
854
|
+
padding: 6.5px 11px;
|
855
855
|
font-size: 16px;
|
856
856
|
}
|
857
857
|
.ant-input-number-sm {
|
@@ -1000,7 +1000,7 @@ textarea.ant-input-number {
|
|
1000
1000
|
font-size: 16px;
|
1001
1001
|
}
|
1002
1002
|
.ant-input-number-lg input {
|
1003
|
-
height:
|
1003
|
+
height: 38px;
|
1004
1004
|
}
|
1005
1005
|
.ant-input-number-sm {
|
1006
1006
|
padding: 0;
|
@@ -11,20 +11,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
11
11
|
};
|
12
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
13
13
|
var React = __importStar(require("react"));
|
14
|
-
var style_1 = require("../../constants/style");
|
15
14
|
var NameLimiter_1 = __importDefault(require("../../components/NameLimiter"));
|
16
15
|
exports.IgnoreDesString = '由logkit';
|
17
16
|
/**
|
18
17
|
* 资源名称展示位'名称(备注)'
|
19
18
|
*/
|
20
19
|
function RemarkName(props) {
|
21
|
-
var name = props.name, remark = props.remark
|
20
|
+
var name = props.name, remark = props.remark;
|
22
21
|
var getTooltip = function () {
|
23
22
|
return remark && remark !== name && !remark.startsWith(exports.IgnoreDesString)
|
24
23
|
? name + "(" + (remark && remark.trim()) + ")"
|
25
24
|
: '';
|
26
25
|
};
|
27
|
-
return
|
28
|
-
React.createElement(NameLimiter_1.default, { name: name, title: getTooltip(), length: length })));
|
26
|
+
return React.createElement(NameLimiter_1.default, { name: name, title: getTooltip() });
|
29
27
|
}
|
30
28
|
exports.default = RemarkName;
|
@@ -262,7 +262,15 @@
|
|
262
262
|
.ant-tooltip-rtl .ant-tooltip-inner {
|
263
263
|
text-align: right;
|
264
264
|
}
|
265
|
-
.pandora-sdk-name-
|
265
|
+
.pandora-sdk-name-limit {
|
266
|
+
max-width: 100%;
|
267
|
+
display: inline-block;
|
268
|
+
vertical-align: top;
|
269
|
+
white-space: nowrap;
|
270
|
+
text-overflow: ellipsis;
|
271
|
+
overflow: hidden;
|
272
|
+
}
|
273
|
+
.pandora-sdk-name-limit-tooltip .ant-tooltip-inner {
|
266
274
|
max-width: 400px !important;
|
267
275
|
max-height: 200px !important;
|
268
276
|
overflow: auto;
|
@@ -275,7 +283,3 @@
|
|
275
283
|
.ant-btn-sm {
|
276
284
|
padding: 0 7px;
|
277
285
|
}
|
278
|
-
.pandora-sdk-remark-name {
|
279
|
-
word-break: break-all;
|
280
|
-
white-space: nowrap;
|
281
|
-
}
|
@@ -299,20 +299,20 @@
|
|
299
299
|
transition: all 0.3s;
|
300
300
|
}
|
301
301
|
.ant-select-multiple.ant-select-lg .ant-select-selector::after {
|
302
|
-
line-height:
|
302
|
+
line-height: 32px;
|
303
303
|
}
|
304
304
|
.ant-select-multiple.ant-select-lg .ant-select-selection-item {
|
305
|
-
height:
|
306
|
-
line-height:
|
305
|
+
height: 32px;
|
306
|
+
line-height: 30px;
|
307
307
|
}
|
308
308
|
.ant-select-multiple.ant-select-lg .ant-select-selection-search {
|
309
|
-
height:
|
310
|
-
line-height:
|
309
|
+
height: 32px;
|
310
|
+
line-height: 32px;
|
311
311
|
}
|
312
312
|
.ant-select-multiple.ant-select-lg .ant-select-selection-search-input,
|
313
313
|
.ant-select-multiple.ant-select-lg .ant-select-selection-search-mirror {
|
314
|
-
height:
|
315
|
-
line-height:
|
314
|
+
height: 32px;
|
315
|
+
line-height: 30px;
|
316
316
|
}
|
317
317
|
.ant-select-multiple.ant-select-sm .ant-select-selector::after {
|
318
318
|
line-height: 18px;
|
@@ -17,7 +17,7 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
17
17
|
var style_1 = require("../../constants/style");
|
18
18
|
var useCallback = React.useCallback, useMemo = React.useMemo;
|
19
19
|
function SolidRadioGroup(props) {
|
20
|
-
var className = props.className, buttonClassName = props.buttonClassName, value = props.value, size = props.size, onChange = props.onChange, children = props.children, _a = props.options, options = _a === void 0 ? {} : _a;
|
20
|
+
var className = props.className, buttonClassName = props.buttonClassName, value = props.value, size = props.size, onChange = props.onChange, children = props.children, disabled = props.disabled, _a = props.options, options = _a === void 0 ? {} : _a;
|
21
21
|
var handleChange = useCallback(function (e) {
|
22
22
|
if (onChange) {
|
23
23
|
onChange(e.target.value);
|
@@ -31,8 +31,11 @@ function SolidRadioGroup(props) {
|
|
31
31
|
return (React.createElement(radio_1.default.Group, { className: classnames_1.default(style_1.SDK_PREFIX + "-solid-radio-group", className), value: value, onChange: handleChange, size: size },
|
32
32
|
radioOptions.map(function (option) {
|
33
33
|
var _a;
|
34
|
-
var value = option.value, item = option.item
|
35
|
-
|
34
|
+
var value = option.value, item = option.item;
|
35
|
+
var disableRealVal = lodash_1.isUndefined(option.disabled)
|
36
|
+
? disabled
|
37
|
+
: option.disabled;
|
38
|
+
return (React.createElement(radio_1.default.Button, { key: value.toString(), value: value, disabled: disableRealVal, className: classnames_1.default((_a = {}, _a[style_1.SDK_PREFIX + "-solid-radio-item"] = !disableRealVal, _a), buttonClassName) }, item));
|
36
39
|
}),
|
37
40
|
children));
|
38
41
|
}
|
@@ -204,9 +204,9 @@ span.ant-radio + * {
|
|
204
204
|
height: 100%;
|
205
205
|
}
|
206
206
|
.ant-radio-group-large .ant-radio-button-wrapper {
|
207
|
-
height:
|
207
|
+
height: 40px;
|
208
208
|
font-size: 16px;
|
209
|
-
line-height:
|
209
|
+
line-height: 38px;
|
210
210
|
}
|
211
211
|
.ant-radio-group-small .ant-radio-button-wrapper {
|
212
212
|
height: 26px;
|
@@ -399,6 +399,10 @@ span.ant-radio + * {
|
|
399
399
|
border-color: #2c6dd2 !important;
|
400
400
|
color: #2c6dd2 !important;
|
401
401
|
}
|
402
|
+
.pandora-sdk-solid-radio-group .ant-radio-button-wrapper-checked.ant-radio-button-wrapper-disabled {
|
403
|
+
border-color: #bfbfbf !important;
|
404
|
+
color: #333 !important;
|
405
|
+
}
|
402
406
|
.pandora-sdk-solid-radio-group .ant-radio-button-wrapper:not(:first-child)::before {
|
403
407
|
background-color: #bfbfbf;
|
404
408
|
}
|
@@ -18,6 +18,11 @@
|
|
18
18
|
color: @theme-color !important;
|
19
19
|
}
|
20
20
|
|
21
|
+
.@{ant-prefix}-radio-button-wrapper-checked.@{ant-prefix}-radio-button-wrapper-disabled {
|
22
|
+
border-color: @input-border-color !important;
|
23
|
+
color: @heading-color!important;
|
24
|
+
}
|
25
|
+
|
21
26
|
.@{ant-prefix}-radio-button-wrapper {
|
22
27
|
&:not(:first-child) {
|
23
28
|
&::before {
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { TableProps } from 'antd/es/table';
|
3
|
+
import { TableRowSelection } from 'antd/es/table/interface';
|
3
4
|
/**
|
4
5
|
* 表格提供自定义多选, 通过 rowSelection对象的selectedRowKeys和onChange来控制多选的状态
|
5
6
|
* 需要注意的是, 当在外部进行增删改或者外部需要控制选择状态时, 例如删除之后清空全选状态, 需要受控
|
@@ -17,7 +18,7 @@ export interface IOptionItem {
|
|
17
18
|
/**
|
18
19
|
* 禁用当前操作
|
19
20
|
*/
|
20
|
-
disabled?: boolean;
|
21
|
+
disabled?: boolean | ((selectItems: any[]) => boolean);
|
21
22
|
}
|
22
23
|
export interface ITableProps<T> extends TableProps<T> {
|
23
24
|
/**
|
@@ -32,7 +33,7 @@ export interface ITableProps<T> extends TableProps<T> {
|
|
32
33
|
/**
|
33
34
|
* pandora2.0风格的表格
|
34
35
|
*/
|
35
|
-
|
36
|
+
declare class Table<T = any> extends React.Component<ITableProps<T>, any> {
|
36
37
|
static Column: typeof import("antd/lib/table/Column").default;
|
37
38
|
static ColumnTag: (props: {
|
38
39
|
tags: any[];
|
@@ -43,35 +44,19 @@ export default class Table<T = any> extends React.Component<ITableProps<T>, any>
|
|
43
44
|
checkAll: boolean;
|
44
45
|
UNSAFE_componentWillReceiveProps(nextProps: ITableProps<T>): void;
|
45
46
|
get selectedRowKeys(): React.ReactText[];
|
46
|
-
get rowSelection():
|
47
|
-
|
48
|
-
onChange: (selectedRowKeys: string[] | number[], selectedRowsOfCurrentPage: any[]) => void;
|
49
|
-
preserveSelectedRowKeys?: boolean | undefined;
|
50
|
-
type?: "checkbox" | "radio" | undefined;
|
51
|
-
defaultSelectedRowKeys?: React.ReactText[] | undefined;
|
52
|
-
getCheckboxProps?: ((record: T) => Partial<Pick<import("antd/es/checkbox").CheckboxProps, "type" | "onClick" | "className" | "id" | "style" | "tabIndex" | "children" | "onChange" | "onKeyDown" | "onKeyPress" | "onMouseEnter" | "onMouseLeave" | "autoFocus" | "disabled" | "name" | "value" | "prefixCls" | "indeterminate" | "skipGroup">>) | undefined;
|
53
|
-
onSelect?: import("antd/es/table/interface").SelectionSelectFn<T> | undefined;
|
54
|
-
onSelectMultiple?: ((selected: boolean, selectedRows: T[], changeRows: T[]) => void) | undefined;
|
55
|
-
onSelectAll?: ((selected: boolean, selectedRows: T[], changeRows: T[]) => void) | undefined;
|
56
|
-
onSelectInvert?: ((selectedRowKeys: React.ReactText[]) => void) | undefined;
|
57
|
-
onSelectNone?: (() => void) | undefined;
|
58
|
-
selections?: boolean | import("antd/es/table/hooks/useSelection").INTERNAL_SELECTION_ITEM[] | undefined;
|
59
|
-
hideSelectAll?: boolean | undefined;
|
60
|
-
fixed?: boolean | undefined;
|
61
|
-
columnWidth?: string | number | undefined;
|
62
|
-
columnTitle?: React.ReactNode;
|
63
|
-
checkStrictly?: boolean | undefined;
|
64
|
-
renderCell?: ((value: boolean, record: T, index: number, originNode: React.ReactNode) => string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | import("rc-table/lib/interface").RenderedCell<T> | null | undefined) | undefined;
|
65
|
-
} | undefined;
|
47
|
+
get rowSelection(): TableRowSelection<T> | undefined;
|
48
|
+
get undisabledData(): readonly T[];
|
66
49
|
get keysOfCurrentPage(): any[];
|
67
50
|
getRowKey(row: any, index: number): any;
|
68
51
|
setIndeterminate(indeterminate: boolean): void;
|
69
52
|
setCheckAll(checkAll: boolean): void;
|
70
53
|
setCheckboxStatus(selectedRowsOfCurrentPage?: T[], dataSource?: T[]): void;
|
71
|
-
handleSelectionChange(selectedRowKeys:
|
72
|
-
onRowSelectionChange(selectedRowKeys:
|
54
|
+
handleSelectionChange(selectedRowKeys: React.Key[], selectedRowsOfCurrentPage: any[]): void;
|
55
|
+
onRowSelectionChange(selectedRowKeys: React.Key[], selectedRowsOfCurrentPage: any[]): void;
|
73
56
|
handleCheckAllChange(e: any): void;
|
74
57
|
handleBatchOptionClick(option: IOptionItem): void;
|
75
58
|
getRowClassName(record: any, index: number, indent: number): string;
|
59
|
+
getDisabledStatus(option: IOptionItem): boolean | undefined;
|
76
60
|
render(): JSX.Element;
|
77
61
|
}
|
62
|
+
export default Table;
|
@@ -138,10 +138,23 @@ var Table = /** @class */ (function (_super) {
|
|
138
138
|
enumerable: true,
|
139
139
|
configurable: true
|
140
140
|
});
|
141
|
+
Object.defineProperty(Table.prototype, "undisabledData", {
|
142
|
+
get: function () {
|
143
|
+
var _a = this.props, dataSource = _a.dataSource, rowSelection = _a.rowSelection;
|
144
|
+
var getCheckboxProps = (rowSelection || {}).getCheckboxProps;
|
145
|
+
var undisabledData = dataSource || [];
|
146
|
+
if (getCheckboxProps) {
|
147
|
+
// 如果checkbox有disabled的,要去掉这些rowItem
|
148
|
+
undisabledData = undisabledData.filter(function (data) { return !getCheckboxProps(data).disabled; });
|
149
|
+
}
|
150
|
+
return undisabledData;
|
151
|
+
},
|
152
|
+
enumerable: true,
|
153
|
+
configurable: true
|
154
|
+
});
|
141
155
|
Object.defineProperty(Table.prototype, "keysOfCurrentPage", {
|
142
156
|
get: function () {
|
143
|
-
|
144
|
-
return (dataSource || []).map(this.getRowKey);
|
157
|
+
return this.undisabledData.map(this.getRowKey);
|
145
158
|
},
|
146
159
|
enumerable: true,
|
147
160
|
configurable: true
|
@@ -217,19 +230,29 @@ var Table = /** @class */ (function (_super) {
|
|
217
230
|
? rowClassName
|
218
231
|
: rowClassName(record, index, indent));
|
219
232
|
};
|
233
|
+
Table.prototype.getDisabledStatus = function (option) {
|
234
|
+
var noneSelected = this.selectedRowKeys.length === 0;
|
235
|
+
var disabled = typeof option.disabled === 'function'
|
236
|
+
? option.disabled(__spread(this.undisabledData))
|
237
|
+
: option.disabled;
|
238
|
+
return noneSelected || disabled;
|
239
|
+
};
|
220
240
|
Table.prototype.render = function () {
|
221
241
|
var _a, _b;
|
222
242
|
var _this = this;
|
223
243
|
var _c = this.props, className = _c.className, batchOptions = _c.batchOptions, scroll = _c.scroll, restProps = __rest(_c, ["className", "batchOptions", "scroll"]);
|
224
244
|
return (React.createElement("div", null,
|
225
|
-
React.createElement(antd_1.Table, __assign({ scroll: scroll }, restProps, { className: classnames_1.default(style_1.SDK_PREFIX + "-table-wrapper", (_a = {}, _a[style_1.SDK_PREFIX + "-table-scrollX"] = lodash_1.get(scroll, 'x'), _a), (_b = {}, _b[style_1.SDK_PREFIX + "-table-scrollY"] = lodash_1.get(scroll, 'y'), _b), className),
|
245
|
+
React.createElement(antd_1.Table, __assign({ scroll: scroll }, restProps, { className: classnames_1.default(style_1.SDK_PREFIX + "-table-wrapper", (_a = {}, _a[style_1.SDK_PREFIX + "-table-scrollX"] = lodash_1.get(scroll, 'x'), _a), (_b = {}, _b[style_1.SDK_PREFIX + "-table-scrollY"] = lodash_1.get(scroll, 'y'), _b), className),
|
246
|
+
// 涉及到权限
|
247
|
+
// getCheckboxProps只能放到tableBatchWrapper里,因为selectedRowKeys在那个组件计算
|
248
|
+
rowSelection: batchOptions && this.props.rowSelection
|
226
249
|
? this.rowSelection
|
227
250
|
: this.props.rowSelection, rowClassName: this.getRowClassName })),
|
228
251
|
this.props.batchOptions &&
|
229
252
|
this.props.rowSelection &&
|
230
253
|
this.props.dataSource &&
|
231
254
|
this.props.dataSource.length > 0 ? (React.createElement("div", { className: style_1.SDK_PREFIX + "-table-batch-opt" },
|
232
|
-
React.createElement(antd_1.Checkbox, { indeterminate: this.indeterminate, onChange: this.handleCheckAllChange, checked: this.checkAll, disabled: lodash_1.size(this.
|
255
|
+
React.createElement(antd_1.Checkbox, { indeterminate: this.indeterminate, onChange: this.handleCheckAllChange, checked: this.checkAll, disabled: lodash_1.size(this.undisabledData) === 0 }),
|
233
256
|
React.createElement("span", { className: style_1.SDK_PREFIX + "-table-batch-opt-label" },
|
234
257
|
"\u5DF2\u9009 ",
|
235
258
|
this.selectedRowKeys.length),
|
@@ -237,9 +260,7 @@ var Table = /** @class */ (function (_super) {
|
|
237
260
|
var _a;
|
238
261
|
return (React.createElement("span", { key: index, className: classnames_1.default((_a = {},
|
239
262
|
_a[style_1.SDK_PREFIX + "-table-batch-opt-item"] = true,
|
240
|
-
_a[style_1.SDK_PREFIX + "-table-batch-opt-disabled"] =
|
241
|
-
? _this.selectedRowKeys.length === 0
|
242
|
-
: option.disabled,
|
263
|
+
_a[style_1.SDK_PREFIX + "-table-batch-opt-disabled"] = _this.getDisabledStatus(option),
|
243
264
|
_a)), onClick: function () { return _this.handleBatchOptionClick(option); } }, option.text));
|
244
265
|
})))) : null));
|
245
266
|
};
|
@@ -263,6 +284,11 @@ var Table = /** @class */ (function (_super) {
|
|
263
284
|
__metadata("design:type", Object),
|
264
285
|
__metadata("design:paramtypes", [])
|
265
286
|
], Table.prototype, "rowSelection", null);
|
287
|
+
__decorate([
|
288
|
+
mobx_1.computed,
|
289
|
+
__metadata("design:type", Object),
|
290
|
+
__metadata("design:paramtypes", [])
|
291
|
+
], Table.prototype, "undisabledData", null);
|
266
292
|
__decorate([
|
267
293
|
mobx_1.computed,
|
268
294
|
__metadata("design:type", Object),
|
@@ -324,6 +350,12 @@ var Table = /** @class */ (function (_super) {
|
|
324
350
|
__metadata("design:paramtypes", [Object, Number, Number]),
|
325
351
|
__metadata("design:returntype", void 0)
|
326
352
|
], Table.prototype, "getRowClassName", null);
|
353
|
+
__decorate([
|
354
|
+
bind_1.default,
|
355
|
+
__metadata("design:type", Function),
|
356
|
+
__metadata("design:paramtypes", [Object]),
|
357
|
+
__metadata("design:returntype", void 0)
|
358
|
+
], Table.prototype, "getDisabledStatus", null);
|
327
359
|
Table = __decorate([
|
328
360
|
mobx_react_1.observer
|
329
361
|
], Table);
|
@@ -264,7 +264,7 @@
|
|
264
264
|
border-radius: 0;
|
265
265
|
}
|
266
266
|
.ant-table-tbody > tr.ant-table-row:hover > td {
|
267
|
-
background:
|
267
|
+
background: #e9f0fa;
|
268
268
|
}
|
269
269
|
.ant-table-tbody > tr.ant-table-row-selected > td {
|
270
270
|
background: #2c6dd2;
|
@@ -1221,7 +1221,7 @@ textarea.ant-pagination-options-quick-jumper input {
|
|
1221
1221
|
transition: all 0.3s, height 0s;
|
1222
1222
|
}
|
1223
1223
|
.ant-pagination-options-quick-jumper input-lg {
|
1224
|
-
padding:
|
1224
|
+
padding: 6.5px 11px;
|
1225
1225
|
font-size: 16px;
|
1226
1226
|
}
|
1227
1227
|
.ant-pagination-options-quick-jumper input-sm {
|
@@ -1512,10 +1512,10 @@ textarea.ant-pagination-options-quick-jumper input {
|
|
1512
1512
|
background: #ffffff !important;
|
1513
1513
|
}
|
1514
1514
|
.pandora-sdk-table-wrapper .ant-table-row:hover {
|
1515
|
-
background:
|
1515
|
+
background: #e9f0fa;
|
1516
1516
|
}
|
1517
1517
|
.pandora-sdk-table-wrapper .ant-table-row-hover {
|
1518
|
-
background:
|
1518
|
+
background: #e9f0fa;
|
1519
1519
|
}
|
1520
1520
|
.pandora-sdk-table-wrapper .ant-table-placeholder {
|
1521
1521
|
border: none;
|
@@ -1608,7 +1608,7 @@ textarea.ant-pagination-options-quick-jumper input {
|
|
1608
1608
|
max-height: 200px;
|
1609
1609
|
}
|
1610
1610
|
.pandora-sdk-table-wrapper .ant-table-tbody > tr.ant-table-row:hover > td {
|
1611
|
-
background-color:
|
1611
|
+
background-color: #e9f0fa;
|
1612
1612
|
}
|
1613
1613
|
.pandora-sdk-table-wrapper .ant-table-filter-trigger {
|
1614
1614
|
display: block;
|
@@ -9,7 +9,7 @@
|
|
9
9
|
line-height: 24px;
|
10
10
|
margin-right: 8px;
|
11
11
|
border-radius: 1px;
|
12
|
-
color: #
|
12
|
+
color: #333;
|
13
13
|
text-align: center;
|
14
14
|
vertical-align: middle;
|
15
15
|
border-radius: 2px;
|
@@ -47,8 +47,8 @@
|
|
47
47
|
border-left: 1px solid rgba(44, 109, 210, 0.1);
|
48
48
|
}
|
49
49
|
.pandora-sdk-root .pandora-sdk-content {
|
50
|
-
padding: 0
|
51
|
-
max-width:
|
50
|
+
padding: 0 8px;
|
51
|
+
max-width: 150px;
|
52
52
|
vertical-align: middle;
|
53
53
|
overflow: hidden;
|
54
54
|
white-space: nowrap;
|
@@ -5,7 +5,7 @@
|
|
5
5
|
line-height: 24px;
|
6
6
|
margin-right: 8px;
|
7
7
|
border-radius: 1px;
|
8
|
-
color: @font-color-
|
8
|
+
color: @font-color-7;
|
9
9
|
text-align: center;
|
10
10
|
vertical-align: middle;
|
11
11
|
border-radius: @border-radius-base;
|
@@ -45,8 +45,8 @@
|
|
45
45
|
}
|
46
46
|
|
47
47
|
.@{sdk-prefix}-content {
|
48
|
-
padding: 0
|
49
|
-
max-width:
|
48
|
+
padding: 0 8px;
|
49
|
+
max-width: 150px;
|
50
50
|
vertical-align: middle;
|
51
51
|
overflow: hidden;
|
52
52
|
white-space: nowrap;
|
@@ -69,11 +69,11 @@ function TagList(props) {
|
|
69
69
|
}
|
70
70
|
return (React.createElement("div", { className: classnames_1.default(style_1.SDK_PREFIX + "-simplify", props.className) },
|
71
71
|
React.Children.toArray(children).slice(0, simplifyTo),
|
72
|
-
React.createElement(popover_1.default, { content: React.createElement("div", { className: style_1.SDK_PREFIX + "-popover" }, children), getPopupContainer: getPopupContainer },
|
72
|
+
React.createElement(popover_1.default, { content: React.createElement("div", { className: style_1.SDK_PREFIX + "-popover" }, React.Children.toArray(children).slice(simplifyTo, childSize)), getPopupContainer: getPopupContainer },
|
73
73
|
React.createElement(pandora_component_icons_1.MoreCircle, { className: style_1.SDK_PREFIX + "-icon" }))));
|
74
74
|
};
|
75
75
|
return (React.createElement("div", { className: classnames_1.default(style_1.SDK_PREFIX + "-taglist-containter", className) }, mode === 'tag' ? getTagList() : getTagSwitchList()));
|
76
76
|
}
|
77
|
-
exports.default = TagList;
|
78
77
|
TagList.Tag = Tag_1.default;
|
79
78
|
TagList.TagSwitch = TagSwitch_1.default;
|
79
|
+
exports.default = TagList;
|
@@ -266,12 +266,12 @@
|
|
266
266
|
.pandora-sdk-taglist-containter .pandora-sdk-simplify .pandora-sdk-icon:hover {
|
267
267
|
color: #7a869a;
|
268
268
|
}
|
269
|
-
.pandora-sdk-
|
269
|
+
.pandora-sdk-popover {
|
270
270
|
max-width: 400px;
|
271
271
|
max-height: 1000px;
|
272
272
|
overflow: auto;
|
273
|
-
padding:
|
273
|
+
padding: 8px !important;
|
274
274
|
}
|
275
|
-
.pandora-sdk-
|
275
|
+
.pandora-sdk-popover > div {
|
276
276
|
margin: 4px;
|
277
277
|
}
|