@autobest-ui/components 1.2.1 → 1.3.0
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/esm/carousel/index.d.ts +13 -21
- package/esm/carousel/index.js +44 -77
- package/esm/carousel/style/index.css +1 -1
- package/esm/carousel/style/index.scss +1 -7
- package/esm/date-picker/calendar/grid/index.css +1 -1
- package/esm/date-picker/calendar/grid/index.js +17 -27
- package/esm/date-picker/calendar/grid/index.scss +4 -0
- package/esm/date-picker/calendar/index.d.ts +4 -0
- package/esm/date-picker/calendar/index.js +1 -1
- package/esm/date-picker/index.d.ts +17 -6
- package/esm/date-picker/index.js +62 -17
- package/esm/date-picker/style/index.css +1 -1
- package/esm/date-picker/style/index.js +0 -2
- package/esm/date-picker/style/index.scss +6 -1
- package/esm/index.d.ts +3 -4
- package/esm/index.js +1 -2
- package/esm/input-number/index.d.ts +30 -17
- package/esm/input-number/index.js +116 -36
- package/esm/style.css +6 -21
- package/esm/table/body/BodyRow.d.ts +9 -3
- package/esm/table/body/BodyRow.js +6 -2
- package/esm/table/body/index.d.ts +2 -2
- package/esm/table/body/index.js +8 -7
- package/esm/table/header/HeaderCell.d.ts +2 -2
- package/esm/table/header/HeaderCell.js +15 -7
- package/esm/table/header/HeaderRow.d.ts +2 -2
- package/esm/table/index.d.ts +4 -4
- package/esm/table/index.js +3 -3
- package/esm/table/interface.d.ts +9 -3
- package/esm/table/style/index.css +1 -1
- package/esm/table/style/index.js +0 -2
- package/esm/table/style/index.scss +2 -0
- package/lib/carousel/index.d.ts +13 -21
- package/lib/carousel/index.js +45 -80
- package/lib/carousel/style/index.css +1 -1
- package/lib/carousel/style/index.scss +1 -7
- package/lib/date-picker/calendar/grid/index.css +1 -1
- package/lib/date-picker/calendar/grid/index.js +17 -28
- package/lib/date-picker/calendar/grid/index.scss +4 -0
- package/lib/date-picker/calendar/index.d.ts +4 -0
- package/lib/date-picker/calendar/index.js +1 -1
- package/lib/date-picker/index.d.ts +17 -6
- package/lib/date-picker/index.js +61 -17
- package/lib/date-picker/style/index.css +1 -1
- package/lib/date-picker/style/index.js +0 -2
- package/lib/date-picker/style/index.scss +6 -1
- package/lib/index.d.ts +3 -4
- package/lib/index.js +2 -22
- package/lib/input-number/index.d.ts +30 -17
- package/lib/input-number/index.js +116 -36
- package/lib/style.css +6 -21
- package/lib/table/body/BodyRow.d.ts +9 -3
- package/lib/table/body/BodyRow.js +6 -2
- package/lib/table/body/index.d.ts +2 -2
- package/lib/table/body/index.js +8 -7
- package/lib/table/header/HeaderCell.d.ts +2 -2
- package/lib/table/header/HeaderCell.js +15 -8
- package/lib/table/header/HeaderRow.d.ts +2 -2
- package/lib/table/index.d.ts +4 -4
- package/lib/table/index.js +3 -3
- package/lib/table/interface.d.ts +9 -3
- package/lib/table/style/index.css +1 -1
- package/lib/table/style/index.js +0 -2
- package/lib/table/style/index.scss +2 -0
- package/package.json +2 -2
- package/esm/accordion/__stories__/style.css +0 -1
- package/esm/accordion/__stories__/style.scss +0 -59
- package/esm/affix/__stories__/style.css +0 -1
- package/esm/affix/__stories__/style.scss +0 -13
- package/esm/carousel/__stories__/style.css +0 -1
- package/esm/carousel/__stories__/style.scss +0 -41
- package/esm/collapse/__stories__/style.css +0 -1
- package/esm/collapse/__stories__/style.scss +0 -19
- package/esm/guide/__stories__/style.css +0 -1
- package/esm/guide/__stories__/style.scss +0 -14
- package/esm/icon/__stories__/iconNames.d.ts +0 -2
- package/esm/icon/__stories__/iconNames.js +0 -1
- package/esm/icon/__stories__/style.css +0 -1
- package/esm/icon/__stories__/style.scss +0 -40
- package/esm/icon/index.d.ts +0 -43
- package/esm/icon/index.js +0 -94
- package/esm/icon/style/index.css +0 -1
- package/esm/icon/style/index.d.ts +0 -1
- package/esm/icon/style/index.js +0 -5
- package/esm/icon/style/index.scss +0 -7
- package/esm/lazy-image/__stories__/style.css +0 -1
- package/esm/lazy-image/__stories__/style.scss +0 -9
- package/esm/loading-container/__stories__/style.css +0 -1
- package/esm/loading-container/__stories__/style.scss +0 -6
- package/esm/move/__stories__/style.css +0 -1
- package/esm/move/__stories__/style.scss +0 -6
- package/esm/popover/__stories__/style.css +0 -1
- package/esm/popover/__stories__/style.scss +0 -16
- package/esm/select/__stories__/style.css +0 -1
- package/esm/select/__stories__/style.scss +0 -8
- package/esm/skeleton/__stories__/style.css +0 -1
- package/esm/skeleton/__stories__/style.scss +0 -3
- package/esm/table/__stories__/style.css +0 -1
- package/esm/table/__stories__/style.scss +0 -34
- package/esm/tabs/__stories__/style.css +0 -1
- package/esm/tabs/__stories__/style.scss +0 -8
- package/lib/accordion/__stories__/style.css +0 -1
- package/lib/accordion/__stories__/style.scss +0 -59
- package/lib/affix/__stories__/style.css +0 -1
- package/lib/affix/__stories__/style.scss +0 -13
- package/lib/carousel/__stories__/style.css +0 -1
- package/lib/carousel/__stories__/style.scss +0 -41
- package/lib/collapse/__stories__/style.css +0 -1
- package/lib/collapse/__stories__/style.scss +0 -19
- package/lib/guide/__stories__/style.css +0 -1
- package/lib/guide/__stories__/style.scss +0 -14
- package/lib/icon/__stories__/iconNames.d.ts +0 -2
- package/lib/icon/__stories__/iconNames.js +0 -8
- package/lib/icon/__stories__/style.css +0 -1
- package/lib/icon/__stories__/style.scss +0 -40
- package/lib/icon/index.d.ts +0 -43
- package/lib/icon/index.js +0 -111
- package/lib/icon/style/index.css +0 -1
- package/lib/icon/style/index.d.ts +0 -1
- package/lib/icon/style/index.js +0 -7
- package/lib/icon/style/index.scss +0 -7
- package/lib/lazy-image/__stories__/style.css +0 -1
- package/lib/lazy-image/__stories__/style.scss +0 -9
- package/lib/loading-container/__stories__/style.css +0 -1
- package/lib/loading-container/__stories__/style.scss +0 -6
- package/lib/move/__stories__/style.css +0 -1
- package/lib/move/__stories__/style.scss +0 -6
- package/lib/popover/__stories__/style.css +0 -1
- package/lib/popover/__stories__/style.scss +0 -16
- package/lib/select/__stories__/style.css +0 -1
- package/lib/select/__stories__/style.scss +0 -8
- package/lib/skeleton/__stories__/style.css +0 -1
- package/lib/skeleton/__stories__/style.scss +0 -3
- package/lib/table/__stories__/style.css +0 -1
- package/lib/table/__stories__/style.scss +0 -34
- package/lib/tabs/__stories__/style.css +0 -1
- package/lib/tabs/__stories__/style.scss +0 -8
|
@@ -8,12 +8,17 @@ $namespace: ab-date-picker;
|
|
|
8
8
|
font-size: .14rem;
|
|
9
9
|
padding: .04rem;
|
|
10
10
|
width: 1.44rem;
|
|
11
|
+
|
|
12
|
+
&.#{$namespace}-error {
|
|
13
|
+
background: #fffacd;
|
|
14
|
+
}
|
|
11
15
|
}
|
|
12
16
|
|
|
13
17
|
&-icon {
|
|
18
|
+
color: #606060;
|
|
14
19
|
position: absolute;
|
|
15
20
|
right: 0.05rem;
|
|
16
21
|
top: 50%;
|
|
17
22
|
transform: translateY(-50%);
|
|
18
23
|
}
|
|
19
|
-
}
|
|
24
|
+
}
|
package/esm/index.d.ts
CHANGED
|
@@ -11,8 +11,6 @@ export type { PopoverPlacement, PopoverTriggerType, PopoverProps } from './popov
|
|
|
11
11
|
export { default as Popover } from './popover';
|
|
12
12
|
export type { TooltipProps, TooltipPlacement, TooltipTriggerType } from './tooltip';
|
|
13
13
|
export { default as Tooltip } from './tooltip';
|
|
14
|
-
export type { IconProps } from './icon';
|
|
15
|
-
export { default as Icon } from './icon';
|
|
16
14
|
export type { SkeletonProps } from './skeleton';
|
|
17
15
|
export { default as Skeleton } from './skeleton';
|
|
18
16
|
export type { MoveProps } from './move';
|
|
@@ -26,7 +24,7 @@ export { default as Confirm } from './confirm';
|
|
|
26
24
|
export type { CollapseProps } from './collapse';
|
|
27
25
|
export { default as Collapse } from './collapse';
|
|
28
26
|
export type { CarouselProps } from './carousel';
|
|
29
|
-
export { default as Carousel
|
|
27
|
+
export { default as Carousel } from './carousel';
|
|
30
28
|
export type { GuideProps } from './guide';
|
|
31
29
|
export { default as Guide } from './guide';
|
|
32
30
|
export type { DrawerProps } from './drawer';
|
|
@@ -43,7 +41,8 @@ export type { ScriptAttributes, ScriptProps } from './script';
|
|
|
43
41
|
export { default as Script } from './script';
|
|
44
42
|
export type { MessageProps } from './message';
|
|
45
43
|
export { default as Message } from './message';
|
|
46
|
-
export type { TableProps } from './table';
|
|
44
|
+
export type { TableProps, TableRowSelectionInfo } from './table';
|
|
45
|
+
export type { TableColumnInfo, TableColumnOnRenderReturnObjectInfo } from './table/interface';
|
|
47
46
|
export { default as Table } from './table';
|
|
48
47
|
export type { DatePickerProps } from './date-picker';
|
|
49
48
|
export { default as DatePicker } from './date-picker';
|
package/esm/index.js
CHANGED
|
@@ -5,14 +5,13 @@ export { default as Affix } from './affix';
|
|
|
5
5
|
export { default as Modal } from './modal';
|
|
6
6
|
export { default as Popover } from './popover';
|
|
7
7
|
export { default as Tooltip } from './tooltip';
|
|
8
|
-
export { default as Icon } from './icon';
|
|
9
8
|
export { default as Skeleton } from './skeleton';
|
|
10
9
|
export { default as Move } from './move';
|
|
11
10
|
export { default as ShowMore } from './show-more';
|
|
12
11
|
export { default as Select } from './select';
|
|
13
12
|
export { default as Confirm } from './confirm';
|
|
14
13
|
export { default as Collapse } from './collapse';
|
|
15
|
-
export { default as Carousel
|
|
14
|
+
export { default as Carousel } from './carousel';
|
|
16
15
|
export { default as Guide } from './guide';
|
|
17
16
|
export { default as Drawer } from './drawer';
|
|
18
17
|
export { default as InputNumber } from './input-number';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { AddListenerEventHandler } from '@autobest-ui/utils';
|
|
3
|
-
interface
|
|
2
|
+
import { debounce, AddListenerEventHandler } from '@autobest-ui/utils';
|
|
3
|
+
interface OnChangeHandler {
|
|
4
4
|
(value: string, name?: string): void;
|
|
5
5
|
}
|
|
6
6
|
interface ChangeEvent {
|
|
@@ -12,7 +12,7 @@ export interface InputNumberProps extends Omit<React.InputHTMLAttributes<any>, '
|
|
|
12
12
|
/**
|
|
13
13
|
* 值修改后的回调函数,用于修改value属性
|
|
14
14
|
*/
|
|
15
|
-
onChange:
|
|
15
|
+
onChange: OnChangeHandler;
|
|
16
16
|
/**
|
|
17
17
|
* input样式
|
|
18
18
|
*/
|
|
@@ -30,7 +30,8 @@ export interface InputNumberProps extends Omit<React.InputHTMLAttributes<any>, '
|
|
|
30
30
|
*/
|
|
31
31
|
max?: number;
|
|
32
32
|
/**
|
|
33
|
-
*
|
|
33
|
+
* 打包值,向上取整,不赋值或者赋值为0表示不做取整操作
|
|
34
|
+
* 注:packMultiple不允许传小数
|
|
34
35
|
*/
|
|
35
36
|
packMultiple?: number;
|
|
36
37
|
/**
|
|
@@ -38,9 +39,13 @@ export interface InputNumberProps extends Omit<React.InputHTMLAttributes<any>, '
|
|
|
38
39
|
*/
|
|
39
40
|
disabled?: boolean;
|
|
40
41
|
/**
|
|
41
|
-
*
|
|
42
|
+
* 可输入的小数位数,0或没有值表示只能输入整数
|
|
42
43
|
*/
|
|
43
|
-
|
|
44
|
+
digital?: number;
|
|
45
|
+
/**
|
|
46
|
+
* 为true则自动补全小数位数
|
|
47
|
+
*/
|
|
48
|
+
padDigital?: boolean;
|
|
44
49
|
/**
|
|
45
50
|
* 输入框默认字符大小
|
|
46
51
|
*/
|
|
@@ -56,11 +61,11 @@ export interface InputNumberProps extends Omit<React.InputHTMLAttributes<any>, '
|
|
|
56
61
|
/**
|
|
57
62
|
* packMultiple 有值时,判断前的回调函数
|
|
58
63
|
*/
|
|
59
|
-
onChangePackMultipleBefore?:
|
|
64
|
+
onChangePackMultipleBefore?: OnChangeHandler;
|
|
60
65
|
/**
|
|
61
66
|
* packMultiple 有值时,判断后的回调函数
|
|
62
67
|
*/
|
|
63
|
-
onChangePackMultipleAfter?:
|
|
68
|
+
onChangePackMultipleAfter?: OnChangeHandler;
|
|
64
69
|
/**
|
|
65
70
|
* 是否需要显示增加按钮
|
|
66
71
|
*/
|
|
@@ -70,10 +75,6 @@ interface InputNumberStates {
|
|
|
70
75
|
enter: boolean;
|
|
71
76
|
focus: boolean;
|
|
72
77
|
}
|
|
73
|
-
interface DebounceRef {
|
|
74
|
-
(value: string): void;
|
|
75
|
-
cancel: () => void;
|
|
76
|
-
}
|
|
77
78
|
interface LocationInfo {
|
|
78
79
|
left: number;
|
|
79
80
|
top: number;
|
|
@@ -86,13 +87,15 @@ declare class InputNumber extends React.Component<InputNumberProps, InputNumberS
|
|
|
86
87
|
name: string;
|
|
87
88
|
size: number;
|
|
88
89
|
disabled: boolean;
|
|
89
|
-
|
|
90
|
+
digital: number;
|
|
91
|
+
padDigital: boolean;
|
|
90
92
|
delay: number;
|
|
91
93
|
visibleButton: boolean;
|
|
92
94
|
};
|
|
93
95
|
constructor(props: InputNumberProps);
|
|
94
96
|
currentRef: React.RefObject<HTMLLabelElement>;
|
|
95
|
-
|
|
97
|
+
changePackMultipleValueDebounce: ReturnType<typeof debounce>;
|
|
98
|
+
padDigitalDebounce: ReturnType<typeof debounce>;
|
|
96
99
|
addLocationInfo: LocationInfo;
|
|
97
100
|
subLocationInfo: LocationInfo;
|
|
98
101
|
mouseUpHandler: AddListenerEventHandler;
|
|
@@ -120,10 +123,20 @@ declare class InputNumber extends React.Component<InputNumberProps, InputNumberS
|
|
|
120
123
|
isInside: (ev: React.MouseEvent<Element, MouseEvent>, locationInfo: LocationInfo) => boolean;
|
|
121
124
|
getLocationInfo: () => void;
|
|
122
125
|
getCurrentValue: (value: string) => number;
|
|
126
|
+
getPadDigitalValue: (value: string) => string;
|
|
123
127
|
onChangePackMultipleValue: (value: string) => void;
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
128
|
+
onPadDigital: (value: any) => void;
|
|
129
|
+
getPadDigitalDebounce: () => {
|
|
130
|
+
(...arg: any[]): void;
|
|
131
|
+
cancel(): void;
|
|
132
|
+
};
|
|
133
|
+
getChangePackMultipleValueDebounce: () => {
|
|
134
|
+
(...arg: any[]): void;
|
|
135
|
+
cancel(): void;
|
|
136
|
+
};
|
|
137
|
+
callback: (value: string, ignoreDelay?: any) => void;
|
|
138
|
+
onValueChange: (ev: ChangeEvent, ignoreDelay?: any) => void;
|
|
139
|
+
getValueCalculate: (value: number, offset: number) => number;
|
|
127
140
|
onAdd: () => void;
|
|
128
141
|
onSub: () => void;
|
|
129
142
|
renderButton: () => JSX.Element;
|
|
@@ -43,7 +43,7 @@ var __assign = this && this.__assign || function () {
|
|
|
43
43
|
import React from 'react';
|
|
44
44
|
import classNames from 'classnames';
|
|
45
45
|
import { isBlank, debounce, getOffsetAndSize, addEventListener } from '@autobest-ui/utils';
|
|
46
|
-
var cls = 'ab-input-number';
|
|
46
|
+
var cls = 'ab-input-number'; // TODO: 重构组件
|
|
47
47
|
|
|
48
48
|
var InputNumber =
|
|
49
49
|
/** @class */
|
|
@@ -305,6 +305,19 @@ function (_super) {
|
|
|
305
305
|
return ceilNumber;
|
|
306
306
|
};
|
|
307
307
|
|
|
308
|
+
_this.getPadDigitalValue = function (value) {
|
|
309
|
+
var _a = _this.props,
|
|
310
|
+
digital = _a.digital,
|
|
311
|
+
padDigital = _a.padDigital;
|
|
312
|
+
|
|
313
|
+
if (!padDigital || isBlank(value) || !digital) {
|
|
314
|
+
return value;
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
var resultArr = value.split('.');
|
|
318
|
+
return resultArr[0] + "." + (resultArr[1] || '').padEnd(digital, '0');
|
|
319
|
+
};
|
|
320
|
+
|
|
308
321
|
_this.onChangePackMultipleValue = function (value) {
|
|
309
322
|
var currentValue = _this.getCurrentValue(value).toString();
|
|
310
323
|
|
|
@@ -319,60 +332,97 @@ function (_super) {
|
|
|
319
332
|
}
|
|
320
333
|
};
|
|
321
334
|
|
|
322
|
-
_this.
|
|
323
|
-
|
|
324
|
-
|
|
335
|
+
_this.onPadDigital = function (value) {
|
|
336
|
+
var currentValue = _this.getPadDigitalValue(value);
|
|
337
|
+
|
|
338
|
+
var _a = _this.props,
|
|
339
|
+
onChange = _a.onChange,
|
|
340
|
+
name = _a.name;
|
|
341
|
+
|
|
342
|
+
if (value !== currentValue) {
|
|
343
|
+
onChange(currentValue, name);
|
|
325
344
|
}
|
|
345
|
+
};
|
|
346
|
+
|
|
347
|
+
_this.getPadDigitalDebounce = function () {
|
|
348
|
+
if (_this.padDigitalDebounce) {
|
|
349
|
+
return _this.padDigitalDebounce;
|
|
350
|
+
}
|
|
351
|
+
|
|
352
|
+
_this.padDigitalDebounce = debounce(_this.onPadDigital, _this.props.delay);
|
|
353
|
+
return _this.padDigitalDebounce;
|
|
354
|
+
};
|
|
326
355
|
|
|
327
|
-
|
|
328
|
-
|
|
356
|
+
_this.getChangePackMultipleValueDebounce = function () {
|
|
357
|
+
if (_this.changePackMultipleValueDebounce) {
|
|
358
|
+
return _this.changePackMultipleValueDebounce;
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
_this.changePackMultipleValueDebounce = debounce(_this.onChangePackMultipleValue, _this.props.delay);
|
|
362
|
+
return _this.changePackMultipleValueDebounce;
|
|
329
363
|
};
|
|
330
364
|
|
|
331
|
-
_this.callback = function (value) {
|
|
365
|
+
_this.callback = function (value, ignoreDelay) {
|
|
332
366
|
var _a = _this.props,
|
|
333
367
|
name = _a.name,
|
|
334
368
|
onChange = _a.onChange,
|
|
335
|
-
onChangePackMultipleBefore = _a.onChangePackMultipleBefore
|
|
336
|
-
|
|
369
|
+
onChangePackMultipleBefore = _a.onChangePackMultipleBefore,
|
|
370
|
+
packMultiple = _a.packMultiple,
|
|
371
|
+
padDigital = _a.padDigital;
|
|
337
372
|
|
|
338
|
-
if (onChange) {
|
|
373
|
+
if (onChange && value !== _this.props.value) {
|
|
339
374
|
onChange(value, name);
|
|
340
375
|
}
|
|
341
376
|
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
if (!isBlank(packMultiple) && !isBlank(value) && valueNumber % packMultiple !== 0) {
|
|
377
|
+
if (packMultiple && !isBlank(value) && parseFloat(value) % packMultiple !== 0) {
|
|
345
378
|
if (onChangePackMultipleBefore) {
|
|
346
379
|
onChangePackMultipleBefore(value, name);
|
|
347
380
|
}
|
|
348
381
|
|
|
349
|
-
|
|
382
|
+
if (ignoreDelay) {
|
|
383
|
+
_this.onChangePackMultipleValue(value);
|
|
384
|
+
} else {
|
|
385
|
+
_this.getChangePackMultipleValueDebounce()(value);
|
|
386
|
+
}
|
|
387
|
+
|
|
388
|
+
return;
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
if (padDigital) {
|
|
392
|
+
if (ignoreDelay) {
|
|
393
|
+
_this.onPadDigital(value);
|
|
394
|
+
|
|
395
|
+
return;
|
|
396
|
+
}
|
|
397
|
+
|
|
398
|
+
_this.getPadDigitalDebounce()(value);
|
|
350
399
|
}
|
|
351
400
|
};
|
|
352
401
|
|
|
353
|
-
_this.onValueChange = function (ev) {
|
|
354
|
-
if (_this.
|
|
355
|
-
_this.
|
|
402
|
+
_this.onValueChange = function (ev, ignoreDelay) {
|
|
403
|
+
if (_this.changePackMultipleValueDebounce) {
|
|
404
|
+
_this.changePackMultipleValueDebounce.cancel();
|
|
356
405
|
}
|
|
357
406
|
|
|
358
407
|
var _a = _this.props,
|
|
359
408
|
min = _a.min,
|
|
360
409
|
max = _a.max,
|
|
361
|
-
|
|
410
|
+
digital = _a.digital,
|
|
362
411
|
value = _a.value;
|
|
363
|
-
var currentValue = ev.target.value.toString();
|
|
412
|
+
var currentValue = ev.target.value.toString(); // 输入为空
|
|
364
413
|
|
|
365
414
|
if (isBlank(currentValue)) {
|
|
366
|
-
_this.callback('');
|
|
415
|
+
_this.callback('', ignoreDelay);
|
|
367
416
|
|
|
368
417
|
return;
|
|
369
418
|
}
|
|
370
419
|
|
|
371
|
-
var preValue = value.toString();
|
|
420
|
+
var preValue = value.toString(); // 输入的不是数字格式
|
|
421
|
+
|
|
372
422
|
var reg = /^-$|(^(-?\d+)(\.\d*)?)$/;
|
|
373
423
|
|
|
374
424
|
if (!reg.test(currentValue)) {
|
|
375
|
-
_this.callback(preValue);
|
|
425
|
+
_this.callback(preValue, ignoreDelay);
|
|
376
426
|
|
|
377
427
|
return;
|
|
378
428
|
} // 0开头后面直接是数字,没有点如:011, 这是不合法的
|
|
@@ -381,41 +431,59 @@ function (_super) {
|
|
|
381
431
|
var zeroReg = /^0\d+$/;
|
|
382
432
|
|
|
383
433
|
if (zeroReg.test(currentValue)) {
|
|
384
|
-
_this.callback(preValue);
|
|
434
|
+
_this.callback(preValue, ignoreDelay);
|
|
385
435
|
|
|
386
436
|
return;
|
|
437
|
+
} // 小数位数限制
|
|
438
|
+
|
|
439
|
+
|
|
440
|
+
if (digital) {
|
|
441
|
+
currentValue = new RegExp("[^.]+([.](\\d{0," + digital + "}))?").exec(currentValue)[0].toString();
|
|
387
442
|
}
|
|
388
443
|
|
|
389
444
|
var valueNumber = parseFloat(currentValue);
|
|
390
445
|
|
|
391
446
|
if (!isBlank(min)) {
|
|
392
447
|
if (min > valueNumber) {
|
|
393
|
-
_this.callback(preValue);
|
|
448
|
+
_this.callback(preValue, ignoreDelay);
|
|
394
449
|
|
|
395
450
|
return;
|
|
396
451
|
} // 如果min>= 0, 将阻止输入-
|
|
397
452
|
|
|
398
453
|
|
|
399
454
|
if (min >= 0 && currentValue.indexOf('-') > -1) {
|
|
400
|
-
_this.callback('');
|
|
455
|
+
_this.callback('', ignoreDelay);
|
|
401
456
|
|
|
402
457
|
return;
|
|
403
458
|
}
|
|
404
459
|
}
|
|
405
460
|
|
|
406
461
|
if (!isBlank(max) && max < valueNumber) {
|
|
407
|
-
_this.callback(preValue);
|
|
462
|
+
_this.callback(preValue, ignoreDelay);
|
|
408
463
|
|
|
409
464
|
return;
|
|
410
465
|
}
|
|
411
466
|
|
|
412
|
-
if (
|
|
413
|
-
_this.callback(preValue);
|
|
467
|
+
if (!digital && currentValue.indexOf('.') > -1) {
|
|
468
|
+
_this.callback(preValue, ignoreDelay);
|
|
414
469
|
|
|
415
470
|
return;
|
|
416
471
|
}
|
|
417
472
|
|
|
418
|
-
_this.callback(currentValue);
|
|
473
|
+
_this.callback(currentValue, ignoreDelay);
|
|
474
|
+
};
|
|
475
|
+
|
|
476
|
+
_this.getValueCalculate = function (value, offset) {
|
|
477
|
+
var valueStr = value.toString();
|
|
478
|
+
var offsetStr = offset.toString();
|
|
479
|
+
|
|
480
|
+
if (valueStr.indexOf('.') < 0 && offsetStr.indexOf('.') < 0) {
|
|
481
|
+
return value + offset;
|
|
482
|
+
}
|
|
483
|
+
|
|
484
|
+
var digital = _this.props.digital;
|
|
485
|
+
var powValue = Math.pow(10, digital);
|
|
486
|
+
return Math.round((value + offset) * powValue) / powValue;
|
|
419
487
|
};
|
|
420
488
|
|
|
421
489
|
_this.onAdd = function () {
|
|
@@ -426,7 +494,7 @@ function (_super) {
|
|
|
426
494
|
|
|
427
495
|
var ev = {
|
|
428
496
|
target: {
|
|
429
|
-
value: (
|
|
497
|
+
value: _this.getPadDigitalValue(_this.getValueCalculate(Number(value), step).toString())
|
|
430
498
|
}
|
|
431
499
|
};
|
|
432
500
|
|
|
@@ -440,7 +508,7 @@ function (_super) {
|
|
|
440
508
|
var step = packMultiple || 1;
|
|
441
509
|
var ev = {
|
|
442
510
|
target: {
|
|
443
|
-
value: (
|
|
511
|
+
value: _this.getPadDigitalValue(_this.getValueCalculate(Number(value), step * -1).toString())
|
|
444
512
|
}
|
|
445
513
|
};
|
|
446
514
|
|
|
@@ -473,6 +541,11 @@ function (_super) {
|
|
|
473
541
|
|
|
474
542
|
InputNumber.prototype.componentDidMount = function () {
|
|
475
543
|
this.addMouseMoveListener();
|
|
544
|
+
this.onValueChange({
|
|
545
|
+
target: {
|
|
546
|
+
value: this.props.value
|
|
547
|
+
}
|
|
548
|
+
}, true);
|
|
476
549
|
};
|
|
477
550
|
|
|
478
551
|
InputNumber.prototype.componentWillUnmount = function () {
|
|
@@ -486,9 +559,14 @@ function (_super) {
|
|
|
486
559
|
this.mouseMoveHandler = null;
|
|
487
560
|
}
|
|
488
561
|
|
|
489
|
-
if (this.
|
|
490
|
-
this.
|
|
491
|
-
this.
|
|
562
|
+
if (this.padDigitalDebounce) {
|
|
563
|
+
this.padDigitalDebounce.cancel();
|
|
564
|
+
this.padDigitalDebounce = null;
|
|
565
|
+
}
|
|
566
|
+
|
|
567
|
+
if (this.changePackMultipleValueDebounce) {
|
|
568
|
+
this.changePackMultipleValueDebounce.cancel();
|
|
569
|
+
this.changePackMultipleValueDebounce = null;
|
|
492
570
|
}
|
|
493
571
|
};
|
|
494
572
|
|
|
@@ -497,7 +575,8 @@ function (_super) {
|
|
|
497
575
|
|
|
498
576
|
delete copyProps.onChangePackMultipleBefore;
|
|
499
577
|
delete copyProps.onChangePackMultipleAfter;
|
|
500
|
-
delete copyProps.
|
|
578
|
+
delete copyProps.digital;
|
|
579
|
+
delete copyProps.padDigital;
|
|
501
580
|
delete copyProps.packMultiple;
|
|
502
581
|
delete copyProps.visibleButton;
|
|
503
582
|
delete copyProps.onChange;
|
|
@@ -539,7 +618,8 @@ function (_super) {
|
|
|
539
618
|
name: '',
|
|
540
619
|
size: 3,
|
|
541
620
|
disabled: false,
|
|
542
|
-
|
|
621
|
+
digital: 0,
|
|
622
|
+
padDigital: false,
|
|
543
623
|
delay: 1000,
|
|
544
624
|
visibleButton: false
|
|
545
625
|
};
|
package/esm/style.css
CHANGED
|
@@ -1,49 +1,34 @@
|
|
|
1
1
|
a,abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,input,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,textarea,tfoot,th,thead,time,tr,ul,var,video{box-sizing:border-box}html{font-size:100px;font-family:Arial,sans-serif;touch-action:manipulation;-ms-touch-action:manipulation}@media only screen and (max-width:767px){html{font-size:100px}}body{font-size:.12rem;color:#333;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:none}input{outline:0}li,ul{padding:0;margin:0;list-style:none}
|
|
2
|
-
.demo-accordion{margin:.5rem auto;width:5rem;display:flex;justify-content:center;flex-direction:column}.accordion-demo-wrap{width:3rem}.accordion-demo-text{height:.3rem}.accordion-demo-title{display:block;padding:.1rem 0;background-color:#b0b0b0;color:#f7f7f7;cursor:pointer}.accordion-demo-a-content>li{padding:.1rem 0;border-top:dotted 1px grey}.accordion-demo-a-content>li:first-child{border:none;cursor:pointer}.accordion-demo-a-content>li>a{color:#333}.accordion-demo-d-content{padding-left:.1rem}.accordion-demo-d-content .ab-collapse{padding-left:.2rem}.accordion-demo-d-title{background-color:grey;display:block;padding:.1rem 0;color:#f7f7f7;cursor:pointer}
|
|
3
|
-
.affix-demo{height:200vh;overflow:auto;width:1000px;max-width:100%;margin:auto}.affix-demo .affix-wrap{height:500px;width:100%;background-color:#d1d5db}
|
|
4
|
-
.demo-carousel{margin:auto;position:relative}.demo-carousel p{display:flex;align-items:center;justify-content:center;font-size:32px;margin:0;color:#f3f4f6;height:225px;border-radius:3px}.ab-carousel{position:relative}.button-next,.button-prev{position:absolute;box-sizing:border-box;cursor:pointer;font-size:32px;top:50%;margin-top:-15px;width:30px;height:30px;color:#f3f4f6}.button-prev{left:5px;top:50%}.button-next{right:5px;top:50%}
|
|
5
2
|
.ab-affix,.ab-affix-custom{z-index:100}.ab-affix-custom{position:fixed;transition:transform .2s cubic-bezier(.7,.3,.1,1)}.ab-affix-fade-appear,.ab-affix-fade-enter{transform:translate(0,-100%)}.ab-affix-fade-appear-active,.ab-affix-fade-enter-active{transform:translate(0,0)}.ab-affix-fade-exit{transform:translate(0,0)}.ab-affix-fade-exit-active{transform:translate(0,-100%)}.ab-affix-fade-exit-done{display:none}
|
|
6
|
-
.ab-carousel{position:relative
|
|
3
|
+
.ab-carousel{position:relative}.ab-carousel-content{position:relative;display:block;height:100%;width:100%;margin:0;padding:0;overflow:hidden}.ab-carousel-list{user-select:none;position:relative;top:0;left:0;display:block;overflow:hidden}.ab-carousel-slider{outline:0;overflow:hidden;float:left;display:none}.ab-carousel.ab-carousel-init .ab-carousel-slider{display:block}
|
|
7
4
|
.ab-checkbox{display:inline-block;position:relative;font-size:0;cursor:pointer}.ab-checkbox-input{position:absolute;opacity:0;margin:0;padding:0;width:100%;height:100%;cursor:pointer;z-index:2}.ab-checkbox-inner{display:inline-block;position:relative;width:.16rem;height:.16rem;transition:all .3s;border:.02rem solid #b0b0b0;border-radius:.02rem;background-color:#fff}.ab-checkbox-icon{visibility:hidden;position:absolute;width:.06rem;height:.1rem;left:20%;top:40%;transform:rotate(45deg) scale(0) translate(-50%,-50%);transition:all .2s;border:.02rem solid #e84040;border-top:none;border-left:none}.ab-checkbox.ab-checkbox-checked .ab-checkbox-icon{visibility:visible;transform:rotate(45deg) scale(1) translate(-50%,-50%)}.ab-checkbox.ab-checkbox-disabled{cursor:not-allowed;color:rgba(0,0,0,.25)}.ab-checkbox.ab-checkbox-disabled .ab-checkbox-inner{border-color:#f0f0f0!important;background-color:#f5f5f5!important}.ab-checkbox.ab-checkbox-disabled .ab-checkbox-icon{border-color:#cecece}.ab-checkbox.ab-checkbox-disabled .ab-checkbox-content{text-decoration:none!important}.ab-checkbox-wrap{display:inline-block;position:relative;cursor:pointer}.ab-checkbox-wrap .ab-checkbox{position:absolute;transform:translateY(-50%);top:50%;left:0}.ab-checkbox-wrap:hover .ab-checkbox-content{text-decoration:underline}.ab-checkbox-content{padding-left:.24rem;display:inline-block}.ab-checkbox-wrap.ab-checkbox-reverse .ab-checkbox{left:auto;right:0}.ab-checkbox-wrap.ab-checkbox-reverse .ab-checkbox-content{padding-left:0;padding-right:.24rem}.ab-checkbox-wrap.ab-checkbox-disabled{cursor:not-allowed;color:rgba(0,0,0,.25)}.ab-checkbox-wrap.ab-checkbox-disabled .ab-checkbox-content{text-decoration:none!important}
|
|
8
|
-
.demo-collapse{min-height:200px;padding:.2rem}.title-wrap{width:1rem;height:.4rem;background-color:#3b82f6;color:#f3f4f6}.title-wrap>strong{display:block;width:1rem;height:.2rem;background-color:#10b981;cursor:pointer}
|
|
9
5
|
.ab-collapse{transform-origin:left top;transition:opacity .2s,height .2s}.ab-collapse-hidden{height:0;overflow:hidden}.ab-collapse-fade-enter{opacity:.8;overflow:hidden}.ab-collapse-fade-enter-active{opacity:1;overflow:hidden}.ab-collapse-fade-enter-done{opacity:1;overflow:initial}.ab-collapse-fade-exit{opacity:1;overflow:hidden}.ab-collapse-fade-exit-active{opacity:.8;overflow:hidden}.ab-collapse-fade-exit-done{display:none;overflow:initial}
|
|
10
6
|
.ab-confirm-btns{display:flex;justify-content:flex-end;padding-top:.42rem}.ab-confirm-cancel,.ab-confirm-ok{overflow:hidden;position:relative;font-size:.12rem;border-width:1px;border-style:solid;outline:0;cursor:pointer;font-weight:700;padding:.05rem .3rem;display:inline-block;color:#fff;margin-left:.3rem}.ab-confirm-ok{border-color:#bc0000;background:linear-gradient(180deg,#c00000 0,#c00000 0,#a00000 100%,#a00000 100%)}.ab-confirm-ok:hover{border-color:#bc0000;background:#bc0000}.ab-confirm-cancel{border-color:grey;background:linear-gradient(180deg,#909090 0,#909090 0,#707070 100%,#707070 100%)}.ab-confirm-cancel:hover{border-color:grey;background:grey}
|
|
11
7
|
.ab-dp-cal{display:flex}.ab-dp-cal-my{padding-left:.12rem;margin-left:.12rem;border-left:1px solid #b0b0b0}.ab-dp-cal-day,.ab-dp-cal-my{width:2.1rem}.ab-dp-cal-dis{color:#c8c8c8}.ab-dp-cal-dg>ul>li{width:14.28%;height:.28rem}.ab-dp-cal-dg>ul>li.ab-dp-cal-out{color:#666}.ab-dp-cal-myg{padding-bottom:.62rem}.ab-dp-cal-myg>ul{justify-content:space-between}.ab-dp-cal-myg>ul>li{width:.4rem;height:.4rem;margin-bottom:.1rem}.ab-dp-cal-t{cursor:pointer;position:absolute;right:.08rem;bottom:.3rem}.ab-dp-cal-t.ab-dp-cal-t-dis{color:#b0b0b0;cursor:default}
|
|
12
|
-
.ab-date-picker{position:relative}.ab-date-picker-input{outline:0;font-size:.14rem;padding:.04rem;width:1.44rem}.ab-date-picker-icon{position:absolute;right:.05rem;top:50%;transform:translateY(-50%)}
|
|
8
|
+
.ab-date-picker{position:relative}.ab-date-picker-input{outline:0;font-size:.14rem;padding:.04rem;width:1.44rem}.ab-date-picker-input.ab-date-picker-error{background:#fffacd}.ab-date-picker-icon{color:#606060;position:absolute;right:.05rem;top:50%;transform:translateY(-50%)}
|
|
13
9
|
.ab-drawer{position:fixed;z-index:101;background-color:#fff;overflow:auto;transition:transform .3s cubic-bezier(.7,.3,.1,1)}.ab-drawer-times{position:absolute;right:.17rem;font-size:.16rem;color:#b0b0b0;cursor:pointer;top:.11rem}.ab-drawer-times:hover{color:#333}.ab-drawer-tf-top{transform:translate(0,-100%)}.ab-drawer-tf-bottom{transform:translate(0,100%)}.ab-drawer-tf-left{transform:translate(-100%,0)}.ab-drawer-tf-right{transform:translate(100%,0)}.ab-drawer-hidden.ab-drawer,.ab-drawer-hidden.ab-mask{display:none}
|
|
14
10
|
.ab-ellipsis{overflow:hidden;display:block;display:-webkit-box;-webkit-box-orient:vertical}.ab-ellipsis.ab-ellipsis-line1{-webkit-line-clamp:1}.ab-ellipsis.ab-ellipsis-line2{-webkit-line-clamp:2}.ab-ellipsis.ab-ellipsis-line3{-webkit-line-clamp:3}.ab-ellipsis.ab-ellipsis-line4{-webkit-line-clamp:4}.ab-ellipsis.ab-ellipsis-line5{-webkit-line-clamp:5}@media only screen and (max-width:767px){.ab-ellipsis.ab-ellipsis-line1{-webkit-line-clamp:unset}.ab-ellipsis.ab-ellipsis-line2{-webkit-line-clamp:unset}.ab-ellipsis.ab-ellipsis-line3{-webkit-line-clamp:unset}.ab-ellipsis.ab-ellipsis-line4{-webkit-line-clamp:unset}.ab-ellipsis.ab-ellipsis-line5{-webkit-line-clamp:unset}.ab-ellipsis.ab-ellipsis-m-line1{-webkit-line-clamp:1}.ab-ellipsis.ab-ellipsis-m-line2{-webkit-line-clamp:2}.ab-ellipsis.ab-ellipsis-m-line3{-webkit-line-clamp:3}.ab-ellipsis.ab-ellipsis-m-line4{-webkit-line-clamp:4}.ab-ellipsis.ab-ellipsis-m-line5{-webkit-line-clamp:5}}
|
|
15
|
-
.guide-demo .input{width:3rem}.guide-demo .btn{display:block;margin-top:.2rem;width:.8rem;height:.3rem;font-size:.16rem;text-align:center}
|
|
16
|
-
.ab-guide-mask.ab-mask{background-color:rgba(0,0,0,.7);z-index:4}.ab-guide-icon{position:absolute;z-index:5}.ab-guide-content{position:relative;z-index:6}
|
|
17
|
-
.demo-icon-list{padding:.2rem .1rem;font-size:.12rem;display:flex;width:100%;flex-wrap:wrap}.demo-icon-list>li{padding:.1rem;border:1px solid #e0e0e0;margin:.05rem;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#f3f4f6;min-width:1.2rem;min-height:1.5rem}.demo-icon-list>li svg{max-width:.5rem;height:.5rem}.demo-icon-list>li p{padding:0 5px;text-align:center;width:1rem;word-break:break-all}.demo-icon-list>li:hover{background-color:#e5e7eb}.demo-icon-list .demo-icon-name{padding-top:.15rem}
|
|
18
|
-
.ab-icon,.ab-icon div,.ab-icon span,.ab-icon svg{display:block}
|
|
19
11
|
.ab-input-number{padding:.06rem .07rem;-webkit-appearance:none;outline:0;width:100%;border:1px solid #ccc;border-radius:2px;resize:none;font-size:.12rem;transition:all .3s;position:relative;background-color:transparent;z-index:2}.ab-input-number:focus{box-shadow:0 0 4px rgba(52,143,238,.8);border-color:rgba(52,143,238,.8)}.ab-input-number-wrap{position:relative;background-color:#fff;display:inline-block}.ab-input-number-button-wrap{position:absolute;user-select:none;top:50%;transform:translateY(-50%);right:.02rem}.ab-input-number-button{position:relative;width:.16rem;height:.1rem;overflow:hidden;background-color:#f1f1f1}.ab-input-number-button.ab-input-number-hover{background-color:#d0d0d0}.ab-input-number-button.ab-input-number-active{background-color:#787878}.ab-input-number-button.ab-input-number-active .ab-input-number-add{border-bottom-color:#fff}.ab-input-number-button.ab-input-number-active .ab-input-number-sub{border-top-color:#fff}.ab-input-number-button:first-child{margin-bottom:.02rem}.ab-input-number-add{position:absolute;top:-.01rem;left:.04rem;display:block;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#505050;border-left-color:transparent;border-width:.04rem;border-style:solid;width:0;height:0}.ab-input-number-sub{display:block;margin:.03rem 0 0 .04rem;border-top-color:#505050;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;border-width:.04rem;border-style:solid;width:0;height:0}
|
|
20
|
-
.
|
|
12
|
+
.ab-guide-mask.ab-mask{background-color:rgba(0,0,0,.7);z-index:4}.ab-guide-icon{position:absolute;z-index:5}.ab-guide-content{position:relative;z-index:6}
|
|
21
13
|
.ab-lazy-image{transition:opacity .5s}.ab-lazy-image-loading{background:#f2f2f2;overflow:hidden}.ab-lazy-image-loading.ab-lazy-image-active{background:linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);background-size:400% 100%;animation:ab-skeleton-loading 1.4s ease infinite}@keyframes ab-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}
|
|
22
14
|
.ab-link-list-title{font-size:.16rem;margin:0 0;padding:0 0 .12rem 0;display:flex;justify-content:space-between;align-items:center}.ab-link-list-icon{display:none}.ab-link-list-content{flex-wrap:wrap;width:auto;margin-right:-.15rem}.ab-link-list-content.ab-link-list-col2>a,.ab-link-list-content.ab-link-list-col2>span{min-width:calc(100% / 2 - .15rem);max-width:calc(100% / 2 - .15rem)}.ab-link-list-content.ab-link-list-col4>a,.ab-link-list-content.ab-link-list-col4>span{min-width:calc(100% / 4 - .15rem);max-width:calc(100% / 4 - .15rem)}.ab-link-list-content.ab-link-list-col5>a,.ab-link-list-content.ab-link-list-col5>span{min-width:calc(100% / 5 - .15rem);max-width:calc(100% / 5 - .15rem)}.ab-link-list-content.ab-link-list-col6>a,.ab-link-list-content.ab-link-list-col6>span{min-width:calc(100% / 6 - .15rem);max-width:calc(100% / 6 - .15rem)}.ab-link-list-content.ab-link-list-col8>a,.ab-link-list-content.ab-link-list-col8>span{min-width:calc(100% / 8 - .15rem);max-width:calc(100% / 8 - .15rem)}.ab-link-list-content>a,.ab-link-list-content>span{cursor:pointer;border:.5px solid #d0d0d0;margin-bottom:8px;display:inline-block;justify-content:space-between;align-items:center;width:100%;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.085rem .15rem .085rem .12rem;color:#333;margin-right:.15rem}.ab-link-list-content>a:after,.ab-link-list-content>span:after{content:'>';position:absolute;right:.1rem;top:50%;transform:translateY(-50%);color:grey;font-size:.12rem}.ab-link-list-content>a:hover,.ab-link-list-content>span:hover{text-decoration:underline;color:#f97601}.ab-link-list-content>.ab-link-list-hidden{display:none}.ab-link-list-wrap-popover.ab-popover-wrap{max-width:3.5rem;min-width:3rem}.ab-link-list-sub-title{display:block;padding-bottom:.06rem;font-size:.12rem}.ab-link-list-sub-link{text-decoration:underline;color:#333;font-size:.12rem;padding:0 .05rem .05rem 0;display:inline-block}@media only screen and (max-width:767px){.ab-link-list-divider{border-bottom:1px solid #d0d0d0}.ab-link-list-body{height:0;width:0;overflow:hidden}.ab-link-list-body.ab-link-list-active{height:auto;width:auto}.ab-link-list-content>a,.ab-link-list-content>span{min-width:calc(50% - .15rem)!important;max-width:calc(50% - .15rem)!important}.ab-link-list-icon{font-weight:700;font-size:.22rem;cursor:pointer;width:.2rem;height:.2rem;display:flex;align-items:center;justify-content:center}}
|
|
23
15
|
.ab-loading-wrap{position:fixed;top:0;left:0;z-index:9999;background-color:rgba(255,255,255,.7);height:100%;width:100%}.ab-loading-wrap .ab-loading-content{position:absolute;left:50%;top:50%;display:block;width:.31rem;height:.31rem;transform:translate3d(-50%,-50%,0)}.ab-loading-wrap.ab-loading-rect-loading{background-color:rgba(0,0,0,.7)}.ab-loading-wrap.ab-loading-rect-loading .ab-loading-content{top:10%;width:1.6rem;height:.24rem}
|
|
24
16
|
.ab-loading-bar{position:fixed;top:0;left:0;margin-bottom:-3px;height:3px;width:100%;z-index:999}@keyframes movingBar{0%{left:50%;right:50%}99.9%{left:0;right:0}100%{left:50%;right:50%}}@keyframes changeBar{0%{background-color:#0aa770}33.3%{background-color:#0aa770}33.33%{background-color:red}66.6%{background-color:#f987d6}66.66%{background-color:#f987d6}99.9%{background-color:#00bcd4}}.ab-loading-bar-bar{position:absolute;height:0;width:100%;text-indent:-9999px;background-color:#0aa770;animation:changeBar 2.25s infinite}.ab-loading-bar-bar:before{content:"";height:3px;position:absolute;left:50%;right:50%;background-color:inherit;animation:movingBar .75s infinite}
|
|
25
|
-
.loading-container-demo{margin:1rem;width:2rem;height:2rem;background:#b0b0b0}
|
|
26
17
|
.ab-loading-container{position:relative}.ab-loading-container-active{user-select:none;pointer-events:none}.ab-loading-container-icon-box{position:absolute;background-color:rgba(255,255,255,.7);top:0;left:0;z-index:4;display:block;width:100%;height:100%}.ab-loading-container-icon{position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}
|
|
27
|
-
.ab-svg-loading{display:inline-block}.ab-svg-loading-icon{display:block;width:.31rem;height:.31rem;animation:loading 1s infinite linear reverse}@keyframes loading{0%{transform:rotate(0)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}
|
|
28
18
|
.ab-mask{position:fixed;top:0;left:0;z-index:101;width:100%;height:100%;background-color:rgba(0,0,0,.45);transition:opacity .4s cubic-bezier(.7,.3,.1,1)}.ab-mask-fade-appear,.ab-mask-fade-enter{opacity:0}.ab-mask-fade-appear-active,.ab-mask-fade-enter-active,.ab-mask-fade-enter-done{opacity:1}.ab-mask-fade-exit{opacity:1}.ab-mask-fade-exit-active{opacity:0}.ab-mask-fade-exit-done{display:none}
|
|
19
|
+
.ab-svg-loading{display:inline-block}.ab-svg-loading-icon{display:block;width:.31rem;height:.31rem;animation:loading 1s infinite linear reverse}@keyframes loading{0%{transform:rotate(0)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}
|
|
29
20
|
.ab-message-container{position:fixed;left:0;bottom:0}.ab-message-content{display:flex;align-items:center;justify-content:space-between;max-width:calc(100vw - .3rem);border-radius:.02rem;margin:.08rem .15rem;padding:.08rem;background-color:#333;color:#fff;box-shadow:0 .04rem .08rem #00000059;transition:opacity .3s}.ab-message-close{display:flex;align-items:center;justify-content:center;cursor:pointer;width:.2rem;height:.2rem;font-size:.2rem;margin-left:.08rem;color:#b0b0b0}.ab-message-close:hover{color:#fff}.ab-message-fade-appear,.ab-message-fade-enter{opacity:0}.ab-message-fade-appear-active,.ab-message-fade-enter-active,.ab-message-fade-enter-done{opacity:1}.ab-message-fade-exit{opacity:1}.ab-message-fade-exit-active{opacity:0}.ab-message-fade-exit-done{display:none}@media only screen and (max-width:767px){.ab-message-content{width:calc(100vw - .3rem);margin:.08rem .15rem}}
|
|
30
21
|
.ab-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:101;overflow:auto;outline:0}.ab-modal.ab-modal-center{text-align:center}.ab-modal.ab-modal-center:before{display:inline-block;width:0;height:100%;vertical-align:middle;content:''}.ab-modal.ab-modal-center .ab-modal-content{top:0;text-align:left;display:inline-block;vertical-align:middle}.ab-modal-content{position:relative;background-color:#fff;max-width:calc(100vw - .3rem);margin-left:auto;margin-right:auto;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s,opacity .3s cubic-bezier(.7,.3,.1,1);z-index:101}.ab-modal-title{position:relative;width:100%}.ab-modal-title .ab-modal-times{top:50%;transform:translateY(-50%)}.ab-modal-times{position:absolute;top:.12rem;right:.12rem;font-size:.15rem;color:#b0b0b0;cursor:pointer}.ab-modal-times svg{display:block}.ab-modal-times:hover{color:#333}.ab-modal-hidden{display:none}@media only screen and (max-width:767px){.ab-modal-content{width:calc(100vw - .3rem)}}.ab-modal-fade-appear,.ab-modal-fade-enter{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-appear-active,.ab-modal-fade-enter-active{transform:translateZ(0);opacity:1}.ab-modal-fade-enter-done{transform:translateZ(0);opacity:1}.ab-modal-fade-exit{transform:translateZ(0);opacity:1}.ab-modal-fade-exit-active{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-exit-done{display:none}
|
|
31
|
-
.demo-move{margin:.2rem auto;width:500px;height:500px;border:5px solid #ccc}
|
|
32
22
|
.ab-move{cursor:move;visibility:hidden;transform-origin:center center}
|
|
33
|
-
.popover-demo{padding:80px 60px;width:465px;height:400px;margin:auto;position:relative}.popover-demo button{width:100px;display:inline-block}.popover-demo-tip{height:60px;width:100px}
|
|
34
23
|
.ab-popover-wrap{background-color:#fff;background-clip:padding-box;box-shadow:0 2px 8px rgba(0,0,0,.15);padding:.08rem .11rem .05rem;min-width:210px;border-radius:4px}.ab-popover-inner{position:relative;width:100%;overflow:hidden;font-size:.12rem}.ab-popover-inner-expand{padding-right:.1rem}.ab-popover-arrow{position:absolute;display:block;width:8px;height:8px;border-top-color:transparent;border-left-color:transparent;border-style:solid;background-color:#fff;border-right-color:#fff;border-bottom-color:#fff;border-width:4px;box-shadow:3px 3px 7px rgba(0,0,0,.07)}.ab-popover-close{position:absolute;right:.02rem;top:.05rem;cursor:pointer;padding:0 .05rem;color:#bfbfbf;font-size:.2rem;line-height:1;z-index:2}.ab-popover-close:hover{color:#4a4a4a}@media only screen and (max-width:767px){.ab-popover-wrap{width:calc(100% - .3rem)}}
|
|
35
24
|
|
|
36
25
|
|
|
37
|
-
.select-demo{margin:10px auto;width:200px}.select-demo .select-group{width:1rem}
|
|
38
26
|
.ab-select-wrap{min-width:177px;background-color:#fff;background-clip:padding-box;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.15)}.ab-select-bottom,.ab-select-content,.ab-select-title{display:flex}.ab-select-title{padding:.09rem 0;background-color:transparent;cursor:context-menu;border-bottom:1px solid #d7d7d7;font-weight:700;color:#606060;font-size:.12rem;margin:0 .1rem}.ab-select-col{font-size:.12rem;padding-right:.07rem;flex:auto}.ab-select-col:last-child{padding-right:0}.ab-select-col>li{padding:.08rem .11rem;cursor:pointer}.ab-select-col>li:hover{background-color:#eee}.ab-select-col>li.ab-select-active{background-color:#e6f7ff}.ab-select-col>li.ab-select-unselect{background-color:transparent;cursor:context-menu}.ab-select-input-group{position:relative;overflow:hidden}.ab-select-input-control{-webkit-appearance:none;outline:0;user-select:none;width:100%;border:1px solid #ccc;border-radius:2px;resize:none;transition:all .2s;background-color:#fff;text-overflow:ellipsis;padding:.08rem .28rem .07rem .07rem;font-size:.14rem;white-space:nowrap;overflow:hidden;max-width:100%;cursor:pointer}.ab-select-input-control.ab-select-focused{box-shadow:0 0 4px rgba(52,143,238,.8);border-color:rgba(52,143,238,.8)}.ab-select-input-control.ab-select-empty{color:#888}.ab-select-input-control.error{background-color:#fffacd}.ab-select-icon{position:absolute;right:.21rem;top:50%;color:#ccc;font-size:0;transform:translate(100%,-50%);transition:transform .2s}.ab-select-icon svg{font-size:.12rem}.ab-select-active .ab-select-icon{transform:translate(100%,-50%) rotate(180deg)}@media only screen and (max-width:767px){.ab-select-content{display:block}.ab-select-input-control{padding:.1rem .05rem;font-size:.14rem}.ab-select-col{padding-right:0}}
|
|
39
27
|
.ab-show-more-ellipsis{white-space:nowrap}.ab-show-more-btn{color:#4068b0;cursor:pointer}.ab-show-more-hidden,.ab-show-more-text{visibility:hidden;height:0;display:block;overflow:hidden}.ab-show-more-hidden{width:0}
|
|
40
|
-
.skeleton-demo{padding:.2rem}
|
|
41
28
|
.ab-skeleton{overflow:hidden}.ab-skeleton-item{background:#f2f2f2;overflow:hidden}.ab-skeleton-active .ab-skeleton-item{background:linear-gradient(90deg,#f2f2f2 25%,#e6e6e6 37%,#f2f2f2 63%);background-size:400% 100%;animation:ab-skeleton-loading 1.4s ease infinite}@keyframes ab-skeleton-loading{0%{background-position:100% 50%}100%{background-position:0 50%}}
|
|
42
|
-
.
|
|
29
|
+
.ab-table{overflow-x:auto}.ab-table table{border-spacing:0;width:100%;table-layout:fixed}.ab-table-header{overflow:hidden}.ab-table-header table{width:calc(100% - .17rem)}.ab-table-body{overflow:auto scroll}.ab-table-checkbox{width:.32rem;text-align:center}.ab-table-title{display:flex;align-items:center;text-align:left}.ab-table-title.ab-table-point{cursor:pointer}.ab-table-arrow{font-size:.16rem;color:#fff;padding:0 .05rem}@media only screen and (max-width:767px){.ab-table-header table{width:100%}}
|
|
43
30
|
.ab-tabs{position:relative;display:flex}.ab-tabs-item{cursor:pointer}.ab-tabs-item.ab-tabs-active{font-weight:700}.ab-tabs-item.ab-tabs-disabled{cursor:not-allowed;opacity:.7}.ab-tabs-bar{position:absolute;background-color:#b22222;transition:all .25s;width:0;height:0;overflow:hidden;margin:0;padding:0}.ab-tabs-bottom,.ab-tabs-top{flex-direction:row}.ab-tabs-bottom>.ab-tabs-bar,.ab-tabs-top>.ab-tabs-bar{left:0}.ab-tabs-left,.ab-tabs-right{flex-direction:column}.ab-tabs-left>.ab-tabs-bar,.ab-tabs-right>.ab-tabs-bar{top:0}.ab-tabs-top>.ab-tabs-bar{bottom:0}.ab-tabs-bottom>.ab-tabs-bar{top:0}.ab-tabs-left>.ab-tabs-bar{right:0}.ab-tabs-right>.ab-tabs-bar{left:0}
|
|
44
31
|
.ab-tooltip-wrap{background-clip:padding-box;padding:.08rem .11rem .05rem;min-width:210px;border-radius:4px;line-height:1.4;border:1px solid #906c00;box-shadow:1px 1px 5px -1px #000;background-color:#fffaec}.ab-tooltip-inner{position:relative;width:100%;overflow:hidden;font-size:.12rem}.ab-tooltip-inner-expand{padding-right:.1rem}.ab-tooltip-arrow{position:absolute;display:block;width:8px;height:8px;border-top-color:transparent;border-left-color:transparent;border-style:solid;box-shadow:3px 3px 7px rgba(0,0,0,.07);background-color:#fffaec;border-right-color:#906c00;border-bottom-color:#906c00;border-width:1px}.ab-tooltip-close{position:absolute;right:.02rem;top:.05rem;cursor:pointer;padding:0 .05rem;color:#bfbfbf;font-size:.2rem;line-height:1;z-index:2}.ab-tooltip-close:hover{color:#4a4a4a}@media only screen and (max-width:767px){.ab-tooltip-wrap{width:calc(100% - .3rem)}}
|
|
45
|
-
.table-demo thead{background-color:#2b5797;color:#fff}.table-demo tbody tr.ab-table-expand-row{background-color:#fafafa}.table-demo tbody tr:hover{background-color:#f3f3f3}.table-demo td,.table-demo th{padding:.16rem;border-bottom:1px solid #d0d0d0}.table-demo td.ab-table-checkbox,.table-demo th.ab-table-checkbox{padding:.16rem 0}.table-demo .merged-cell{border-left:1px solid #d0d0d0;border-right:1px solid #d0d0d0}.table-demo-expanded{font-size:.2rem}
|
|
46
|
-
.ab-table{overflow-x:auto}.ab-table table{border-spacing:0;width:100%;table-layout:fixed}.ab-table-header{overflow:hidden}.ab-table-header table{width:calc(100% - .17rem)}.ab-table-body{overflow:auto scroll}.ab-table-checkbox{width:.32rem;text-align:center}.ab-table-title{display:flex;align-items:center;text-align:left}.ab-table-title.ab-table-point{cursor:pointer}.ab-table-arrow{padding:0 .05rem}@media only screen and (max-width:767px){.ab-table-header table{width:100%}}
|
|
47
32
|
.ab-trigger-wrap{position:absolute;top:0;left:0;z-index:101}.ab-trigger-wrap.ab-trigger-hidden{display:none}.ab-trigger-mask{position:fixed;top:0;left:0;bottom:0;right:0;z-index:101;background-color:transparent;display:none}.ab-trigger-mask.ab-trigger-mask-show{display:block}.ab-trigger-fade-appear,.ab-trigger-fade-enter,.ab-trigger-fade-hr-appear,.ab-trigger-fade-hr-enter{opacity:0}.ab-trigger-fade-appear,.ab-trigger-fade-enter{transform:scale(.7)}.ab-trigger-fade-hr-appear,.ab-trigger-fade-hr-enter{opacity:0;transform:scaleY(.7)}.ab-trigger-fade-appear-active,.ab-trigger-fade-enter-active,.ab-trigger-fade-hr-appear-active,.ab-trigger-fade-hr-enter-active{opacity:1;transition:opacity .2s,transform .2s}.ab-trigger-fade-appear-active,.ab-trigger-fade-enter-active{transform:scale(1)}.ab-trigger-fade-hr-appear-active,.ab-trigger-fade-hr-enter-active{transform:scaleY(1)}.ab-trigger-fade-exit,.ab-trigger-fade-hr-exit{opacity:1}.ab-trigger-fade-exit-active,.ab-trigger-fade-hr-exit-active{opacity:0;transition:opacity .2s,transform .2s}.ab-trigger-fade-exit-active{transform:scale(.7)}.ab-trigger-fade-hr-exit-active{transform:scaleY(.7)}.ab-trigger-fade-exit-done,.ab-trigger-fade-hr-exit-done{display:none}
|
|
48
33
|
|
|
49
|
-
.ab-dp-cg-content,.ab-dp-cg-head,.ab-dp-cg-title{display:flex;align-items:center}.ab-dp-cg-title{user-select:none;font-size:.14rem;padding-bottom:.08rem}.ab-dp-cg-title>strong{flex:1 1;margin-left:.1rem;cursor:default;color:#4a4a4a}.ab-dp-cg-title>strong.ab-dp-cg-clickable{cursor:pointer}.ab-dp-cg-title>strong.ab-dp-cg-clickable:hover{color:#000}.ab-dp-cg-dis-icon,.ab-dp-cg-icon{align-self:flex-end;margin-left:.08rem}.ab-dp-cg-icon{cursor:pointer}.ab-dp-cg-head{padding-bottom:.05rem}.ab-dp-cg-head>li{display:flex;align-items:center;justify-content:center;cursor:default}.ab-dp-cg-content{flex-wrap:wrap}.ab-dp-cg-content>li{cursor:pointer;display:flex;align-items:center;justify-content:center;color:#000}.ab-dp-cg-content>li:hover{background:#f0f0f0}.ab-dp-cg-content>li.ab-dp-cg-dis{cursor:not-allowed;color:#b0b0b0}.ab-dp-cg-content>li.ab-dp-cg-dis:hover{background:0 0}.ab-dp-cg-content>li.ab-dp-cg-selected,.ab-dp-cg-content>li:active{background:#c7e0f4;border:3px solid #c7e0f4;border-radius:2px;color:#000}.ab-dp-cg-content>li.ab-dp-cg-today{background:#0078d4;color:#fff}
|
|
34
|
+
.ab-dp-cg-content,.ab-dp-cg-head,.ab-dp-cg-title{display:flex;align-items:center}.ab-dp-cg-title{user-select:none;font-size:.14rem;padding-bottom:.08rem}.ab-dp-cg-title>strong{flex:1 1;margin-left:.1rem;cursor:default;color:#4a4a4a}.ab-dp-cg-title>strong.ab-dp-cg-clickable{cursor:pointer}.ab-dp-cg-title>strong.ab-dp-cg-clickable:hover{color:#000}.ab-dp-cg-dis-icon,.ab-dp-cg-icon{align-self:flex-end;margin-left:.08rem}.ab-dp-cg-icon{cursor:pointer}.ab-dp-cg-head{padding-bottom:.05rem}.ab-dp-cg-head>li{display:flex;align-items:center;justify-content:center;cursor:default}.ab-dp-cg-content{flex-wrap:wrap}.ab-dp-cg-content>li{cursor:pointer;display:flex;align-items:center;justify-content:center;color:#000}.ab-dp-cg-content>li:hover{background:#f0f0f0}.ab-dp-cg-content>li.ab-dp-cg-dis{cursor:not-allowed;color:#b0b0b0}.ab-dp-cg-content>li.ab-dp-cg-dis:hover{background:0 0}.ab-dp-cg-content>li.ab-dp-cg-selected,.ab-dp-cg-content>li:active{background:#c7e0f4;border:3px solid #c7e0f4;border-radius:2px;color:#000}.ab-dp-cg-content>li.ab-dp-cg-today{background:#0078d4;color:#fff}.ab-dp-cg-arrow{cursor:pointer}
|
|
@@ -1,13 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { TableColumnInfo } from '../interface';
|
|
3
3
|
export interface BodyRowProps<T> {
|
|
4
4
|
className?: string;
|
|
5
5
|
prefixCls: string;
|
|
6
6
|
rowData: T;
|
|
7
7
|
index: number;
|
|
8
|
-
columns:
|
|
8
|
+
columns: TableColumnInfo<T>[];
|
|
9
9
|
indent: number;
|
|
10
10
|
CheckCell: React.ReactElement;
|
|
11
|
+
isExpand?: boolean;
|
|
12
|
+
}
|
|
13
|
+
declare function BodyRow<RowDataType>({ className, prefixCls: cls, rowData, index, columns, indent, CheckCell, isExpand }: BodyRowProps<RowDataType>): JSX.Element;
|
|
14
|
+
declare namespace BodyRow {
|
|
15
|
+
var defaultProps: {
|
|
16
|
+
isExpand: boolean;
|
|
17
|
+
};
|
|
11
18
|
}
|
|
12
|
-
declare function BodyRow<RowDataType>({ className, prefixCls: cls, rowData, index, columns, indent, CheckCell }: BodyRowProps<RowDataType>): JSX.Element;
|
|
13
19
|
export default BodyRow;
|
|
@@ -40,7 +40,8 @@ function BodyRow(_a) {
|
|
|
40
40
|
index = _a.index,
|
|
41
41
|
columns = _a.columns,
|
|
42
42
|
indent = _a.indent,
|
|
43
|
-
CheckCell = _a.CheckCell
|
|
43
|
+
CheckCell = _a.CheckCell,
|
|
44
|
+
isExpand = _a.isExpand;
|
|
44
45
|
var indentCell = React.useMemo(function () {
|
|
45
46
|
return getIndentCol(cls, indent);
|
|
46
47
|
}, [cls, indent]);
|
|
@@ -70,7 +71,7 @@ function BodyRow(_a) {
|
|
|
70
71
|
rowSpan: rowSpan === undefined ? 1 : rowSpan
|
|
71
72
|
});
|
|
72
73
|
|
|
73
|
-
if (cellInfo.colSpan === 0 || cellInfo.rowSpan === 0 || !cellInfo.content) {
|
|
74
|
+
if (cellInfo.colSpan === 0 || cellInfo.rowSpan === 0 || isExpand && !cellInfo.content) {
|
|
74
75
|
return;
|
|
75
76
|
}
|
|
76
77
|
|
|
@@ -91,4 +92,7 @@ function BodyRow(_a) {
|
|
|
91
92
|
return null;
|
|
92
93
|
}
|
|
93
94
|
|
|
95
|
+
BodyRow.defaultProps = {
|
|
96
|
+
isExpand: false
|
|
97
|
+
};
|
|
94
98
|
export default BodyRow;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import React, { ReactText } from 'react';
|
|
2
2
|
import { BodyRowProps } from './BodyRow';
|
|
3
3
|
import { BodyCheckIconProps, BodyRowSelectionInfo } from './CheckIcon';
|
|
4
|
-
import {
|
|
4
|
+
import { TableColumnOnRenderReturnObjectInfo } from '../interface';
|
|
5
5
|
/**
|
|
6
6
|
* 可展开子列表
|
|
7
7
|
*/
|
|
8
8
|
export interface TableExpandableInfo<T> {
|
|
9
|
-
expandedRowRender: (rowData: T, index: number) => React.ReactNode | React.ReactNode[] |
|
|
9
|
+
expandedRowRender: (rowData: T, index: number) => React.ReactNode | React.ReactNode[] | TableColumnOnRenderReturnObjectInfo;
|
|
10
10
|
}
|
|
11
11
|
export interface BodyProps<T> extends Pick<BodyRowProps<T>, 'prefixCls' | 'columns'>, Pick<BodyCheckIconProps<T>, 'selectedRowKeys'> {
|
|
12
12
|
/**
|