@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.
Files changed (106) hide show
  1. package/CHANGELOG.json +45 -0
  2. package/CHANGELOG.md +19 -0
  3. package/es/components/AutoComplete/style.css +7 -7
  4. package/es/components/Button/style.css +0 -1
  5. package/es/components/Button/style.less +0 -1
  6. package/es/components/Card/index.js +2 -1
  7. package/es/components/CheckTransformList/Item/index.js +1 -1
  8. package/es/components/CheckTransformList/style.css +16 -8
  9. package/es/components/CheckboxList/index.d.ts +1 -0
  10. package/es/components/CheckboxList/index.js +3 -2
  11. package/es/components/Collapse/index.js +2 -1
  12. package/es/components/CollapsiblePanel/index.d.ts +2 -2
  13. package/es/components/ConfigProvider/index.js +2 -1
  14. package/es/components/DateTimePicker/Base/index.js +2 -2
  15. package/es/components/DateTimePicker/Base/style.css +4 -4
  16. package/es/components/DateTimePicker/BaseMobile/index.d.ts +1 -0
  17. package/es/components/DateTimePicker/BaseMobile/index.js +2 -2
  18. package/es/components/DateTimePicker/DisplayInput/style.css +7 -7
  19. package/es/components/DateTimePicker/index.d.ts +6 -1
  20. package/es/components/DateTimePicker/index.js +2 -2
  21. package/es/components/Input/index.js +2 -1
  22. package/es/components/Input/style.css +7 -7
  23. package/es/components/InputNumber/style.css +2 -2
  24. package/es/components/Menu/index.d.ts +2 -2
  25. package/es/components/NameLimiter/index.d.ts +3 -13
  26. package/es/components/NameLimiter/index.js +30 -39
  27. package/es/components/NameLimiter/style.css +9 -1
  28. package/es/components/NameLimiter/style.less +10 -1
  29. package/es/components/OptionList/index.js +2 -1
  30. package/es/components/RangeInput/style.css +9 -9
  31. package/es/components/RemarkName/index.d.ts +0 -2
  32. package/es/components/RemarkName/index.js +2 -4
  33. package/es/components/RemarkName/style.css +9 -5
  34. package/es/components/RemarkName/style.less +0 -5
  35. package/es/components/Selector/style.css +7 -7
  36. package/es/components/SolidRadioGroup/index.js +7 -4
  37. package/es/components/SolidRadioGroup/style.css +6 -2
  38. package/es/components/SolidRadioGroup/style.less +5 -0
  39. package/es/components/Steps/index.js +2 -1
  40. package/es/components/Table/index.d.ts +9 -24
  41. package/es/components/Table/index.js +40 -8
  42. package/es/components/Table/style.css +5 -5
  43. package/es/components/TagList/Tag/style.css +3 -3
  44. package/es/components/TagList/Tag/style.less +3 -3
  45. package/es/components/TagList/index.js +3 -2
  46. package/es/components/TagList/style.css +3 -3
  47. package/es/components/TagList/style.less +8 -8
  48. package/es/index.css +2252 -2245
  49. package/es/index.d.ts +1 -1
  50. package/es/index.js +1 -1
  51. package/es/index.less +6 -6
  52. package/es/style/theme.less +8 -6
  53. package/lib/components/AutoComplete/style.css +7 -7
  54. package/lib/components/Button/style.css +0 -1
  55. package/lib/components/Button/style.less +0 -1
  56. package/lib/components/Card/index.js +1 -1
  57. package/lib/components/CheckTransformList/Item/index.js +1 -1
  58. package/lib/components/CheckTransformList/style.css +16 -8
  59. package/lib/components/CheckboxList/index.d.ts +1 -0
  60. package/lib/components/CheckboxList/index.js +3 -2
  61. package/lib/components/Collapse/index.js +1 -1
  62. package/lib/components/CollapsiblePanel/index.d.ts +2 -2
  63. package/lib/components/ConfigProvider/index.js +1 -1
  64. package/lib/components/DateTimePicker/Base/index.js +2 -2
  65. package/lib/components/DateTimePicker/Base/style.css +4 -4
  66. package/lib/components/DateTimePicker/BaseMobile/index.d.ts +1 -0
  67. package/lib/components/DateTimePicker/BaseMobile/index.js +2 -2
  68. package/lib/components/DateTimePicker/DisplayInput/style.css +7 -7
  69. package/lib/components/DateTimePicker/index.d.ts +6 -1
  70. package/lib/components/DateTimePicker/index.js +2 -2
  71. package/lib/components/Input/index.js +1 -1
  72. package/lib/components/Input/style.css +7 -7
  73. package/lib/components/InputNumber/style.css +2 -2
  74. package/lib/components/Menu/index.d.ts +2 -2
  75. package/lib/components/NameLimiter/index.d.ts +3 -13
  76. package/lib/components/NameLimiter/index.js +30 -38
  77. package/lib/components/NameLimiter/style.css +9 -1
  78. package/lib/components/NameLimiter/style.less +10 -1
  79. package/lib/components/OptionList/index.js +1 -1
  80. package/lib/components/RangeInput/style.css +9 -9
  81. package/lib/components/RemarkName/index.d.ts +0 -2
  82. package/lib/components/RemarkName/index.js +2 -4
  83. package/lib/components/RemarkName/style.css +9 -5
  84. package/lib/components/RemarkName/style.less +0 -5
  85. package/lib/components/Selector/style.css +7 -7
  86. package/lib/components/SolidRadioGroup/index.js +6 -3
  87. package/lib/components/SolidRadioGroup/style.css +6 -2
  88. package/lib/components/SolidRadioGroup/style.less +5 -0
  89. package/lib/components/Steps/index.js +1 -1
  90. package/lib/components/Table/index.d.ts +9 -24
  91. package/lib/components/Table/index.js +39 -7
  92. package/lib/components/Table/style.css +5 -5
  93. package/lib/components/TagList/Tag/style.css +3 -3
  94. package/lib/components/TagList/Tag/style.less +3 -3
  95. package/lib/components/TagList/index.js +2 -2
  96. package/lib/components/TagList/style.css +3 -3
  97. package/lib/components/TagList/style.less +8 -8
  98. package/lib/index.css +19 -12
  99. package/lib/index.d.ts +1 -1
  100. package/lib/index.js +0 -1
  101. package/lib/style/theme.less +8 -6
  102. package/package.json +23 -23
  103. package/es/components/NameLimiter/transformer.d.ts +0 -6
  104. package/es/components/NameLimiter/transformer.js +0 -84
  105. package/lib/components/NameLimiter/transformer.d.ts +0 -6
  106. package/lib/components/NameLimiter/transformer.js +0 -91
@@ -1,42 +1,33 @@
1
- var __extends = (this && this.__extends) || (function () {
2
- var extendStatics = function (d, b) {
3
- extendStatics = Object.setPrototypeOf ||
4
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
- function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
6
- return extendStatics(d, b);
7
- };
8
- return function (d, b) {
9
- extendStatics(d, b);
10
- function __() { this.constructor = d; }
11
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
12
- };
13
- })();
14
- import * as React from 'react';
1
+ var __read = (this && this.__read) || function (o, n) {
2
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
3
+ if (!m) return o;
4
+ var i = m.call(o), r, ar = [], e;
5
+ try {
6
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
7
+ }
8
+ catch (error) { e = { error: error }; }
9
+ finally {
10
+ try {
11
+ if (r && !r.done && (m = i["return"])) m.call(i);
12
+ }
13
+ finally { if (e) throw e.error; }
14
+ }
15
+ return ar;
16
+ };
17
+ import React, { useLayoutEffect, useRef, useState } from 'react';
15
18
  import { Tooltip } from 'antd';
16
19
  import { SDK_PREFIX } from '../../constants/style';
17
- import { getBytes, getTransformerString } from './transformer';
18
- export var SplitType;
19
- (function (SplitType) {
20
- SplitType["End"] = "end";
21
- SplitType["Between"] = "between";
22
- })(SplitType || (SplitType = {}));
23
- var NameLimiter = /** @class */ (function (_super) {
24
- __extends(NameLimiter, _super);
25
- function NameLimiter() {
26
- return _super !== null && _super.apply(this, arguments) || this;
27
- }
28
- NameLimiter.prototype.render = function () {
29
- var _a = this.props, name = _a.name, length = _a.length, title = _a.title, type = _a.type;
30
- var displayName = name;
31
- var needFormat = getBytes(displayName) > length;
32
- var nameSpan = (React.createElement("span", null, needFormat
33
- ? getTransformerString(displayName, length, type)
34
- : displayName));
35
- if (title || needFormat) {
36
- return (React.createElement(Tooltip, { overlayClassName: SDK_PREFIX + "-name-tooltip", placement: "top", title: title || displayName }, nameSpan));
20
+ export default function NameLimiter(_a) {
21
+ var name = _a.name, title = _a.title;
22
+ var _b = __read(useState(false), 2), ellipsis = _b[0], setEllipsis = _b[1];
23
+ var _c = __read(useState(false), 2), visible = _c[0], setVisible = _c[1];
24
+ var ref = useRef(null);
25
+ useLayoutEffect(function () {
26
+ if (!ref.current) {
27
+ return;
37
28
  }
38
- return nameSpan;
39
- };
40
- return NameLimiter;
41
- }(React.PureComponent));
42
- export default NameLimiter;
29
+ setEllipsis(ref.current.clientWidth < ref.current.scrollWidth);
30
+ });
31
+ return (React.createElement(Tooltip, { overlayClassName: SDK_PREFIX + "-name-limit-tooltip", placement: "top", title: title || name, visible: (!!title || ellipsis) && visible, onVisibleChange: setVisible },
32
+ React.createElement("span", { className: SDK_PREFIX + "-name-limit", ref: ref }, name)));
33
+ }
@@ -268,7 +268,15 @@
268
268
  .ant-btn-sm {
269
269
  padding: 0 7px;
270
270
  }
271
- .pandora-sdk-name-tooltip .ant-tooltip-inner {
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-tooltip {
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;
@@ -28,7 +28,7 @@ export * from './constants';
28
28
  /**
29
29
  * 资源列表页面表格中操作列表
30
30
  */
31
- export default function OptionList(props) {
31
+ function OptionList(props) {
32
32
  var mode = props.mode, _a = props.options, options = _a === void 0 ? [] : _a, placement = props.placement, className = props.className, popupClassName = props.popupClassName, other = __rest(props, ["mode", "options", "placement", "className", "popupClassName"]);
33
33
  var globalShowMode = mode === 'popover' ? EShowMode.POPOVER : EShowMode.INLINE;
34
34
  var showingOptions = options.filter(function (op) { return !op.hidden; });
@@ -51,3 +51,4 @@ export default function OptionList(props) {
51
51
  OptionList.EShowMode = EShowMode;
52
52
  OptionList.InlineOptionList = InlineOptionList;
53
53
  OptionList.PopoverOptionList = PopoverOptionList;
54
+ export 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: 2.5px 11px;
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: 2.5px 11px;
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: 2.5px 11px;
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: 32px;
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: 32px;
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: 32px;
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: 32px;
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: 2.5px 11px;
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: 30px;
1003
+ height: 38px;
1004
1004
  }
1005
1005
  .ant-input-number-sm {
1006
1006
  padding: 0;
@@ -4,8 +4,6 @@ export interface IRemarkName {
4
4
  name: string;
5
5
  /** 备注 */
6
6
  remark?: string;
7
- /** 名称展示最大长度 */
8
- length: number;
9
7
  }
10
8
  export declare const IgnoreDesString = "\u7531logkit";
11
9
  /**
@@ -1,17 +1,15 @@
1
1
  import * as React from 'react';
2
- import { SDK_PREFIX } from '../../constants/style';
3
2
  import NameLimiter from '../../components/NameLimiter';
4
3
  export var IgnoreDesString = '由logkit';
5
4
  /**
6
5
  * 资源名称展示位'名称(备注)'
7
6
  */
8
7
  export default function RemarkName(props) {
9
- var name = props.name, remark = props.remark, length = props.length;
8
+ var name = props.name, remark = props.remark;
10
9
  var getTooltip = function () {
11
10
  return remark && remark !== name && !remark.startsWith(IgnoreDesString)
12
11
  ? name + "(" + (remark && remark.trim()) + ")"
13
12
  : '';
14
13
  };
15
- return (React.createElement("span", { className: SDK_PREFIX + "-remark-name" },
16
- React.createElement(NameLimiter, { name: name, title: getTooltip(), length: length })));
14
+ return React.createElement(NameLimiter, { name: name, title: getTooltip() });
17
15
  }
@@ -262,7 +262,15 @@
262
262
  .ant-tooltip-rtl .ant-tooltip-inner {
263
263
  text-align: right;
264
264
  }
265
- .pandora-sdk-name-tooltip .ant-tooltip-inner {
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
- }
@@ -1,7 +1,2 @@
1
1
  @import '../NameLimiter/style.less';
2
2
  @import '../../style/theme.less';
3
-
4
- .@{sdk-prefix}-remark-name {
5
- word-break: break-all;
6
- white-space: nowrap;
7
- }
@@ -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: 24px;
302
+ line-height: 32px;
303
303
  }
304
304
  .ant-select-multiple.ant-select-lg .ant-select-selection-item {
305
- height: 24px;
306
- line-height: 22px;
305
+ height: 32px;
306
+ line-height: 30px;
307
307
  }
308
308
  .ant-select-multiple.ant-select-lg .ant-select-selection-search {
309
- height: 24px;
310
- line-height: 24px;
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: 24px;
315
- line-height: 22px;
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;
@@ -1,11 +1,11 @@
1
1
  import * as React from 'react';
2
- import { isArray } from 'lodash';
2
+ import { isArray, isUndefined } from 'lodash';
3
3
  import Radio from 'antd/es/radio';
4
4
  import classnames from 'classnames';
5
5
  import { SDK_PREFIX } from '../../constants/style';
6
6
  var useCallback = React.useCallback, useMemo = React.useMemo;
7
7
  export default function SolidRadioGroup(props) {
8
- 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;
8
+ 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;
9
9
  var handleChange = useCallback(function (e) {
10
10
  if (onChange) {
11
11
  onChange(e.target.value);
@@ -19,8 +19,11 @@ export default function SolidRadioGroup(props) {
19
19
  return (React.createElement(Radio.Group, { className: classnames(SDK_PREFIX + "-solid-radio-group", className), value: value, onChange: handleChange, size: size },
20
20
  radioOptions.map(function (option) {
21
21
  var _a;
22
- var value = option.value, item = option.item, disabled = option.disabled;
23
- return (React.createElement(Radio.Button, { key: value.toString(), value: value, disabled: disabled, className: classnames((_a = {}, _a[SDK_PREFIX + "-solid-radio-item"] = !disabled, _a), buttonClassName) }, item));
22
+ var value = option.value, item = option.item;
23
+ var disableRealVal = isUndefined(option.disabled)
24
+ ? disabled
25
+ : option.disabled;
26
+ return (React.createElement(Radio.Button, { key: value.toString(), value: value, disabled: disableRealVal, className: classnames((_a = {}, _a[SDK_PREFIX + "-solid-radio-item"] = !disableRealVal, _a), buttonClassName) }, item));
24
27
  }),
25
28
  children));
26
29
  }
@@ -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: 32px;
207
+ height: 40px;
208
208
  font-size: 16px;
209
- line-height: 30px;
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 {
@@ -44,7 +44,7 @@ import Step from './Step';
44
44
  import ControlButton from './ControlButton';
45
45
  import { Provider } from './context';
46
46
  var useMemo = React.useMemo, useState = React.useState, useCallback = React.useCallback;
47
- export default function Steps(props) {
47
+ function Steps(props) {
48
48
  var _a = __read(useState(0), 2), stepLength = _a[0], setStepLength = _a[1];
49
49
  var current = props.current, _b = props.steps, steps = _b === void 0 ? [] : _b, className = props.className, children = props.children, otherProps = __rest(props, ["current", "steps", "className", "children"]);
50
50
  var handleAddSteps = useCallback(function () {
@@ -70,3 +70,4 @@ export default function Steps(props) {
70
70
  }
71
71
  Steps.Step = Step;
72
72
  Steps.ControlButton = ControlButton;
73
+ export default Steps;
@@ -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
- export default class Table<T = any> extends React.Component<ITableProps<T>, any> {
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
- selectedRowKeys: React.ReactText[];
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: string[] | number[], selectedRowsOfCurrentPage: any[]): void;
72
- onRowSelectionChange(selectedRowKeys: string[] | number[], selectedRowsOfCurrentPage: any[]): void;
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;
@@ -66,7 +66,7 @@ import * as React from 'react';
66
66
  import { Table as AntTable, Checkbox } from 'antd';
67
67
  import classnames from 'classnames';
68
68
  import { observable, action, computed } from 'mobx';
69
- import { size, xor, union, unionBy, differenceBy, get, isUndefined } from 'lodash';
69
+ import { size, xor, union, unionBy, differenceBy, get } from 'lodash';
70
70
  import { observer } from 'mobx-react';
71
71
  import bind from '../../utils/bind';
72
72
  import { SDK_PREFIX } from '../../constants/style';
@@ -126,10 +126,23 @@ var Table = /** @class */ (function (_super) {
126
126
  enumerable: true,
127
127
  configurable: true
128
128
  });
129
+ Object.defineProperty(Table.prototype, "undisabledData", {
130
+ get: function () {
131
+ var _a = this.props, dataSource = _a.dataSource, rowSelection = _a.rowSelection;
132
+ var getCheckboxProps = (rowSelection || {}).getCheckboxProps;
133
+ var undisabledData = dataSource || [];
134
+ if (getCheckboxProps) {
135
+ // 如果checkbox有disabled的,要去掉这些rowItem
136
+ undisabledData = undisabledData.filter(function (data) { return !getCheckboxProps(data).disabled; });
137
+ }
138
+ return undisabledData;
139
+ },
140
+ enumerable: true,
141
+ configurable: true
142
+ });
129
143
  Object.defineProperty(Table.prototype, "keysOfCurrentPage", {
130
144
  get: function () {
131
- var dataSource = this.props.dataSource;
132
- return (dataSource || []).map(this.getRowKey);
145
+ return this.undisabledData.map(this.getRowKey);
133
146
  },
134
147
  enumerable: true,
135
148
  configurable: true
@@ -205,19 +218,29 @@ var Table = /** @class */ (function (_super) {
205
218
  ? rowClassName
206
219
  : rowClassName(record, index, indent));
207
220
  };
221
+ Table.prototype.getDisabledStatus = function (option) {
222
+ var noneSelected = this.selectedRowKeys.length === 0;
223
+ var disabled = typeof option.disabled === 'function'
224
+ ? option.disabled(__spread(this.undisabledData))
225
+ : option.disabled;
226
+ return noneSelected || disabled;
227
+ };
208
228
  Table.prototype.render = function () {
209
229
  var _a, _b;
210
230
  var _this = this;
211
231
  var _c = this.props, className = _c.className, batchOptions = _c.batchOptions, scroll = _c.scroll, restProps = __rest(_c, ["className", "batchOptions", "scroll"]);
212
232
  return (React.createElement("div", null,
213
- React.createElement(AntTable, __assign({ scroll: scroll }, restProps, { className: classnames(SDK_PREFIX + "-table-wrapper", (_a = {}, _a[SDK_PREFIX + "-table-scrollX"] = get(scroll, 'x'), _a), (_b = {}, _b[SDK_PREFIX + "-table-scrollY"] = get(scroll, 'y'), _b), className), rowSelection: batchOptions && this.props.rowSelection
233
+ React.createElement(AntTable, __assign({ scroll: scroll }, restProps, { className: classnames(SDK_PREFIX + "-table-wrapper", (_a = {}, _a[SDK_PREFIX + "-table-scrollX"] = get(scroll, 'x'), _a), (_b = {}, _b[SDK_PREFIX + "-table-scrollY"] = get(scroll, 'y'), _b), className),
234
+ // 涉及到权限
235
+ // getCheckboxProps只能放到tableBatchWrapper里,因为selectedRowKeys在那个组件计算
236
+ rowSelection: batchOptions && this.props.rowSelection
214
237
  ? this.rowSelection
215
238
  : this.props.rowSelection, rowClassName: this.getRowClassName })),
216
239
  this.props.batchOptions &&
217
240
  this.props.rowSelection &&
218
241
  this.props.dataSource &&
219
242
  this.props.dataSource.length > 0 ? (React.createElement("div", { className: SDK_PREFIX + "-table-batch-opt" },
220
- React.createElement(Checkbox, { indeterminate: this.indeterminate, onChange: this.handleCheckAllChange, checked: this.checkAll, disabled: size(this.props.dataSource) === 0 }),
243
+ React.createElement(Checkbox, { indeterminate: this.indeterminate, onChange: this.handleCheckAllChange, checked: this.checkAll, disabled: size(this.undisabledData) === 0 }),
221
244
  React.createElement("span", { className: SDK_PREFIX + "-table-batch-opt-label" },
222
245
  "\u5DF2\u9009 ",
223
246
  this.selectedRowKeys.length),
@@ -225,9 +248,7 @@ var Table = /** @class */ (function (_super) {
225
248
  var _a;
226
249
  return (React.createElement("span", { key: index, className: classnames((_a = {},
227
250
  _a[SDK_PREFIX + "-table-batch-opt-item"] = true,
228
- _a[SDK_PREFIX + "-table-batch-opt-disabled"] = isUndefined(option.disabled)
229
- ? _this.selectedRowKeys.length === 0
230
- : option.disabled,
251
+ _a[SDK_PREFIX + "-table-batch-opt-disabled"] = _this.getDisabledStatus(option),
231
252
  _a)), onClick: function () { return _this.handleBatchOptionClick(option); } }, option.text));
232
253
  })))) : null));
233
254
  };
@@ -251,6 +272,11 @@ var Table = /** @class */ (function (_super) {
251
272
  __metadata("design:type", Object),
252
273
  __metadata("design:paramtypes", [])
253
274
  ], Table.prototype, "rowSelection", null);
275
+ __decorate([
276
+ computed,
277
+ __metadata("design:type", Object),
278
+ __metadata("design:paramtypes", [])
279
+ ], Table.prototype, "undisabledData", null);
254
280
  __decorate([
255
281
  computed,
256
282
  __metadata("design:type", Object),
@@ -312,6 +338,12 @@ var Table = /** @class */ (function (_super) {
312
338
  __metadata("design:paramtypes", [Object, Number, Number]),
313
339
  __metadata("design:returntype", void 0)
314
340
  ], Table.prototype, "getRowClassName", null);
341
+ __decorate([
342
+ bind,
343
+ __metadata("design:type", Function),
344
+ __metadata("design:paramtypes", [Object]),
345
+ __metadata("design:returntype", void 0)
346
+ ], Table.prototype, "getDisabledStatus", null);
315
347
  Table = __decorate([
316
348
  observer
317
349
  ], 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: rgba(44, 109, 210, 0.1);
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: 2.5px 11px;
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: rgba(44, 109, 210, 0.1);
1515
+ background: #e9f0fa;
1516
1516
  }
1517
1517
  .pandora-sdk-table-wrapper .ant-table-row-hover {
1518
- background: rgba(44, 109, 210, 0.1);
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: rgba(44, 109, 210, 0.1);
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: #42526e;
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 4px;
51
- max-width: 200px;
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-2;
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 4px;
49
- max-width: 200px;
48
+ padding: 0 8px;
49
+ max-width: 150px;
50
50
  vertical-align: middle;
51
51
  overflow: hidden;
52
52
  white-space: nowrap;
@@ -26,7 +26,7 @@ import { MoreCircle } from '@qn-pandora/pandora-component-icons';
26
26
  import Tag from './Tag';
27
27
  import TagSwitch from './TagSwitch';
28
28
  import { SDK_PREFIX } from '../../constants/style';
29
- export default function TagList(props) {
29
+ function TagList(props) {
30
30
  var _a = props.mode, mode = _a === void 0 ? 'tag' : _a, className = props.className;
31
31
  var handleSwitchChange = function (active, value) {
32
32
  var values = props.values, onChange = props.onChange;
@@ -57,10 +57,11 @@ export default function TagList(props) {
57
57
  }
58
58
  return (React.createElement("div", { className: classnames(SDK_PREFIX + "-simplify", props.className) },
59
59
  React.Children.toArray(children).slice(0, simplifyTo),
60
- React.createElement(Popover, { content: React.createElement("div", { className: SDK_PREFIX + "-popover" }, children), getPopupContainer: getPopupContainer },
60
+ React.createElement(Popover, { content: React.createElement("div", { className: SDK_PREFIX + "-popover" }, React.Children.toArray(children).slice(simplifyTo, childSize)), getPopupContainer: getPopupContainer },
61
61
  React.createElement(MoreCircle, { className: SDK_PREFIX + "-icon" }))));
62
62
  };
63
63
  return (React.createElement("div", { className: classnames(SDK_PREFIX + "-taglist-containter", className) }, mode === 'tag' ? getTagList() : getTagSwitchList()));
64
64
  }
65
65
  TagList.Tag = Tag;
66
66
  TagList.TagSwitch = TagSwitch;
67
+ export default TagList;