acud 0.0.63 → 0.0.66
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/dist/acud.css +164 -53
- package/dist/acud.css.map +1 -1
- package/dist/acud.js +817 -213
- package/dist/acud.js.map +1 -1
- package/dist/acud.min.css +1 -1
- package/dist/acud.min.css.map +1 -1
- package/dist/acud.min.js +10 -4
- package/dist/acud.min.js.map +1 -1
- package/es/alert/style/index.css +1 -1
- package/es/alert/style/index.less +150 -147
- package/es/alert/style/rtl.less +27 -27
- package/es/breadcrumb/BreadcrumbItem.d.ts +1 -1
- package/es/breadcrumb/BreadcrumbItem.js +16 -4
- package/es/date-picker/src/Picker.js +1 -1
- package/es/date-picker/src/RangePicker.js +1 -1
- package/es/date-picker/style/index.css +43 -11
- package/es/date-picker/style/index.less +13 -2
- package/es/date-picker/style/panel.less +32 -10
- package/es/dialog-box/style/index.css +4 -4
- package/es/dropdown/dropdown-button.js +11 -2
- package/es/dropdown/style/index.css +6 -1
- package/es/dropdown/style/index.less +6 -1
- package/es/modal/DialogBox.d.ts +46 -0
- package/es/modal/DialogBox.js +152 -0
- package/es/modal/Modal.d.ts +5 -0
- package/es/modal/Modal.js +6 -4
- package/es/modal/dialog.d.ts +17 -0
- package/es/modal/dialog.js +123 -0
- package/es/modal/index.d.ts +11 -2
- package/es/modal/index.js +10 -1
- package/es/modal/style/index.css +62 -16
- package/es/modal/style/index.less +76 -5
- package/es/modal/style/mixin.less +2 -2
- package/es/progress/style/common.less +5 -3
- package/es/progress/style/index.css +2 -1
- package/es/radio/index.d.ts +3 -0
- package/es/style/themes/dark/components/modal.less +14 -9
- package/es/style/themes/default/components/datePicker.less +1 -1
- package/es/style/themes/default/components/modal.less +14 -14
- package/es/time-picker/style/index.css +1 -0
- package/es/time-picker/style/index.less +1 -0
- package/es/transfer/{dataSource.d.ts → DataSource.d.ts} +1 -1
- package/es/transfer/{dataSource.js → DataSource.js} +37 -6
- package/{lib/transfer/sourceList.d.ts → es/transfer/SourceList.d.ts} +2 -2
- package/es/transfer/{sourceList.js → SourceList.js} +0 -0
- package/es/transfer/{target.d.ts → Target.d.ts} +1 -1
- package/es/transfer/{target.js → Target.js} +60 -4
- package/{lib/transfer/targetList.d.ts → es/transfer/TargetList.d.ts} +2 -2
- package/es/transfer/{targetList.js → TargetList.js} +0 -0
- package/es/transfer/index.d.ts +3 -0
- package/es/transfer/index.js +9 -4
- package/es/transfer/style/css.js +3 -1
- package/es/transfer/style/index.css +27 -5
- package/es/transfer/style/index.d.ts +1 -0
- package/es/transfer/style/index.js +3 -1
- package/es/transfer/style/index.less +32 -5
- package/es/upload/UploadList/ListItem.js +7 -2
- package/es/upload/UploadList/index.js +4 -7
- package/es/upload/style/index.css +17 -13
- package/es/upload/style/index.less +25 -20
- package/es/upload/utils.js +1 -1
- package/lib/alert/style/index.css +1 -1
- package/lib/alert/style/index.less +150 -147
- package/lib/alert/style/rtl.less +27 -27
- package/lib/breadcrumb/BreadcrumbItem.d.ts +1 -1
- package/lib/breadcrumb/BreadcrumbItem.js +21 -8
- package/lib/date-picker/src/Picker.js +1 -1
- package/lib/date-picker/src/RangePicker.js +1 -1
- package/lib/date-picker/style/index.css +43 -11
- package/lib/date-picker/style/index.less +13 -2
- package/lib/date-picker/style/panel.less +32 -10
- package/lib/dialog-box/style/index.css +4 -4
- package/lib/dropdown/dropdown-button.js +11 -2
- package/lib/dropdown/style/index.css +6 -1
- package/lib/dropdown/style/index.less +6 -1
- package/lib/modal/DialogBox.d.ts +46 -0
- package/lib/modal/DialogBox.js +179 -0
- package/lib/modal/Modal.d.ts +5 -0
- package/lib/modal/Modal.js +6 -4
- package/lib/modal/dialog.d.ts +17 -0
- package/lib/modal/dialog.js +145 -0
- package/lib/modal/index.d.ts +11 -2
- package/lib/modal/index.js +13 -1
- package/lib/modal/style/index.css +62 -16
- package/lib/modal/style/index.less +76 -5
- package/lib/modal/style/mixin.less +2 -2
- package/lib/progress/style/common.less +5 -3
- package/lib/progress/style/index.css +2 -1
- package/lib/radio/index.d.ts +3 -0
- package/lib/style/themes/dark/components/modal.less +14 -9
- package/lib/style/themes/default/components/datePicker.less +1 -1
- package/lib/style/themes/default/components/modal.less +14 -14
- package/lib/time-picker/style/index.css +1 -0
- package/lib/time-picker/style/index.less +1 -0
- package/lib/transfer/{dataSource.d.ts → DataSource.d.ts} +1 -1
- package/lib/transfer/{dataSource.js → DataSource.js} +38 -6
- package/{es/transfer/sourceList.d.ts → lib/transfer/SourceList.d.ts} +2 -2
- package/lib/transfer/{sourceList.js → SourceList.js} +0 -0
- package/lib/transfer/{target.d.ts → Target.d.ts} +1 -1
- package/lib/transfer/{target.js → Target.js} +63 -5
- package/{es/transfer/targetList.d.ts → lib/transfer/TargetList.d.ts} +2 -2
- package/lib/transfer/{targetList.js → TargetList.js} +0 -0
- package/lib/transfer/index.d.ts +3 -0
- package/lib/transfer/index.js +11 -7
- package/lib/transfer/style/css.js +3 -1
- package/lib/transfer/style/index.css +27 -5
- package/lib/transfer/style/index.d.ts +1 -0
- package/lib/transfer/style/index.js +3 -1
- package/lib/transfer/style/index.less +32 -5
- package/lib/upload/UploadList/ListItem.js +7 -2
- package/lib/upload/UploadList/index.js +4 -7
- package/lib/upload/style/index.css +17 -13
- package/lib/upload/style/index.less +25 -20
- package/lib/upload/utils.js +1 -1
- package/package.json +1 -1
|
@@ -19,7 +19,6 @@
|
|
|
19
19
|
transform: translate(-50%, -50%);
|
|
20
20
|
width: auto;
|
|
21
21
|
max-width: calc(100vw - 32px);
|
|
22
|
-
padding-bottom: 24px;
|
|
23
22
|
}
|
|
24
23
|
.acud-modal.zoom-enter,
|
|
25
24
|
.acud-modal.zoom-appear {
|
|
@@ -56,25 +55,25 @@
|
|
|
56
55
|
-webkit-overflow-scrolling: touch;
|
|
57
56
|
z-index: 1000;
|
|
58
57
|
}
|
|
59
|
-
.acud-modal-sm {
|
|
58
|
+
.acud-modal-sm > .acud-modal-content {
|
|
60
59
|
width: 520px;
|
|
61
|
-
height: 240px;
|
|
62
|
-
max-height:
|
|
60
|
+
min-height: 240px;
|
|
61
|
+
max-height: 560px;
|
|
63
62
|
}
|
|
64
|
-
.acud-modal-md {
|
|
63
|
+
.acud-modal-md > .acud-modal-content {
|
|
65
64
|
width: 800px;
|
|
66
|
-
height: 400px;
|
|
67
|
-
max-height:
|
|
65
|
+
min-height: 400px;
|
|
66
|
+
max-height: 560px;
|
|
68
67
|
}
|
|
69
|
-
.acud-modal-lg {
|
|
68
|
+
.acud-modal-lg > .acud-modal-content {
|
|
70
69
|
width: 1120px;
|
|
71
|
-
height: 480px;
|
|
72
|
-
max-height:
|
|
70
|
+
min-height: 480px;
|
|
71
|
+
max-height: 560px;
|
|
73
72
|
}
|
|
74
|
-
.acud-modal-xl {
|
|
73
|
+
.acud-modal-xl > .acud-modal-content {
|
|
75
74
|
width: 1200px;
|
|
76
|
-
height: 480px;
|
|
77
|
-
max-height:
|
|
75
|
+
min-height: 480px;
|
|
76
|
+
max-height: 560px;
|
|
78
77
|
}
|
|
79
78
|
.acud-modal-content {
|
|
80
79
|
position: relative;
|
|
@@ -111,7 +110,7 @@
|
|
|
111
110
|
}
|
|
112
111
|
.acud-modal-close-x {
|
|
113
112
|
display: block;
|
|
114
|
-
margin-top:
|
|
113
|
+
margin-top: 27px;
|
|
115
114
|
font-size: 16px;
|
|
116
115
|
text-align: center;
|
|
117
116
|
text-transform: none;
|
|
@@ -125,8 +124,9 @@
|
|
|
125
124
|
font-weight: 900;
|
|
126
125
|
}
|
|
127
126
|
.acud-modal-title {
|
|
128
|
-
font-size:
|
|
129
|
-
line-height:
|
|
127
|
+
font-size: 14px;
|
|
128
|
+
line-height: 22px;
|
|
129
|
+
padding-right: 12px;
|
|
130
130
|
word-wrap: break-word;
|
|
131
131
|
}
|
|
132
132
|
.acud-modal-body {
|
|
@@ -143,6 +143,9 @@
|
|
|
143
143
|
background: #FFFFFF;
|
|
144
144
|
text-align: right;
|
|
145
145
|
flex: none;
|
|
146
|
+
display: flex;
|
|
147
|
+
align-items: center;
|
|
148
|
+
justify-content: flex-end;
|
|
146
149
|
}
|
|
147
150
|
.acud-modal-footer .acud-btn {
|
|
148
151
|
margin: 0;
|
|
@@ -150,3 +153,46 @@
|
|
|
150
153
|
.acud-modal-footer .acud-btn + .acud-btn {
|
|
151
154
|
margin-left: 16px;
|
|
152
155
|
}
|
|
156
|
+
.acud-modal-dialogbox {
|
|
157
|
+
width: 400px;
|
|
158
|
+
height: auto;
|
|
159
|
+
min-height: 184px;
|
|
160
|
+
}
|
|
161
|
+
.acud-modal-dialogbox-icon {
|
|
162
|
+
height: 100%;
|
|
163
|
+
margin-right: 12px;
|
|
164
|
+
float: left;
|
|
165
|
+
display: flex;
|
|
166
|
+
align-items: center;
|
|
167
|
+
padding-top: 2px;
|
|
168
|
+
}
|
|
169
|
+
.acud-modal-dialogbox-title {
|
|
170
|
+
overflow: hidden;
|
|
171
|
+
padding-right: 12px;
|
|
172
|
+
}
|
|
173
|
+
.acud-modal-dialogbox-content {
|
|
174
|
+
width: 400px;
|
|
175
|
+
padding-left: 32px;
|
|
176
|
+
}
|
|
177
|
+
.acud-modal-dialogbox .acud-modal-title .acudicon {
|
|
178
|
+
font-size: 20px;
|
|
179
|
+
}
|
|
180
|
+
.acud-modal-dialogbox > .acud-modal-content {
|
|
181
|
+
width: 400px;
|
|
182
|
+
min-height: 184px;
|
|
183
|
+
}
|
|
184
|
+
.acud-modal-dialogbox-warning .acud-modal-dialogbox-icon {
|
|
185
|
+
color: #FF9326;
|
|
186
|
+
}
|
|
187
|
+
.acud-modal-dialogbox-info .acud-modal-dialogbox-icon {
|
|
188
|
+
color: #2468F2;
|
|
189
|
+
}
|
|
190
|
+
.acud-modal-dialogbox-success .acud-modal-dialogbox-icon {
|
|
191
|
+
color: #30BF13;
|
|
192
|
+
}
|
|
193
|
+
.acud-modal-dialogbox-error .acud-modal-dialogbox-icon {
|
|
194
|
+
color: #F33E3E;
|
|
195
|
+
}
|
|
196
|
+
.acud-modal-dialogbox-confirm .acud-modal-dialogbox-icon {
|
|
197
|
+
color: #FF9326;
|
|
198
|
+
}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
@import './mixin';
|
|
4
4
|
|
|
5
5
|
@modal-prefix-cls: ~'@{acud-prefix}-modal';
|
|
6
|
+
@dialogbox-prefix: ~'@{modal-prefix-cls}-dialogbox';
|
|
6
7
|
|
|
7
8
|
.@{modal-prefix-cls} {
|
|
8
9
|
.reset-component();
|
|
@@ -16,21 +17,20 @@
|
|
|
16
17
|
transform: translate(-50%, -50%);
|
|
17
18
|
width: auto;
|
|
18
19
|
max-width: calc(100vw - 32px);
|
|
19
|
-
padding-bottom: 24px;
|
|
20
20
|
|
|
21
|
-
&-sm {
|
|
21
|
+
&-sm > &-content {
|
|
22
22
|
.modal-size-config(sm);
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
&-md {
|
|
25
|
+
&-md > &-content {
|
|
26
26
|
.modal-size-config(md);
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
&-lg {
|
|
29
|
+
&-lg > &-content {
|
|
30
30
|
.modal-size-config(lg);
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
&-xl {
|
|
33
|
+
&-xl > &-content {
|
|
34
34
|
.modal-size-config(xl);
|
|
35
35
|
}
|
|
36
36
|
|
|
@@ -94,6 +94,7 @@
|
|
|
94
94
|
&-title {
|
|
95
95
|
font-size: @modal-heading-font-size;
|
|
96
96
|
line-height: @modal-heading-height;
|
|
97
|
+
padding-right: @P * 3;
|
|
97
98
|
word-wrap: break-word;
|
|
98
99
|
}
|
|
99
100
|
|
|
@@ -114,6 +115,10 @@
|
|
|
114
115
|
background: @modal-footer-bg-color;
|
|
115
116
|
text-align: right;
|
|
116
117
|
flex: none;
|
|
118
|
+
// TODO: 暂时解决 confirmLoading 时按钮对齐问题
|
|
119
|
+
display: flex;
|
|
120
|
+
align-items: center;
|
|
121
|
+
justify-content: flex-end;
|
|
117
122
|
|
|
118
123
|
.@{acud-prefix}-btn {
|
|
119
124
|
margin: 0;
|
|
@@ -123,3 +128,69 @@
|
|
|
123
128
|
}
|
|
124
129
|
}
|
|
125
130
|
}
|
|
131
|
+
|
|
132
|
+
.@{dialogbox-prefix} {
|
|
133
|
+
width: @P * 100;
|
|
134
|
+
height: auto;
|
|
135
|
+
min-height: @P * 46;
|
|
136
|
+
|
|
137
|
+
&-icon {
|
|
138
|
+
height: 100%;
|
|
139
|
+
margin-right: @P * 3;
|
|
140
|
+
float: left;
|
|
141
|
+
// TODO: 没找到更好的居中办法
|
|
142
|
+
display: flex;
|
|
143
|
+
align-items: center;
|
|
144
|
+
padding-top: 2px;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
&-title {
|
|
148
|
+
overflow: hidden;
|
|
149
|
+
padding-right: @P * 3;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
&-content {
|
|
153
|
+
width: @P * 100;
|
|
154
|
+
padding-left: @P * 3 + @T6;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
.@{modal-prefix-cls}-title {
|
|
158
|
+
.acudicon {
|
|
159
|
+
font-size: @T6;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
& > .@{modal-prefix-cls}-content {
|
|
164
|
+
width: @P * 100;
|
|
165
|
+
min-height: @P * 46;
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
.@{dialogbox-prefix}-warning {
|
|
170
|
+
.@{dialogbox-prefix}-icon {
|
|
171
|
+
color: @W6;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
.@{dialogbox-prefix}-info {
|
|
176
|
+
.@{dialogbox-prefix}-icon {
|
|
177
|
+
color: @B6;
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.@{dialogbox-prefix}-success {
|
|
182
|
+
.@{dialogbox-prefix}-icon {
|
|
183
|
+
color: @S6;
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
.@{dialogbox-prefix}-error {
|
|
187
|
+
.@{dialogbox-prefix}-icon {
|
|
188
|
+
color: @E6;
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
.@{dialogbox-prefix}-confirm {
|
|
193
|
+
.@{dialogbox-prefix}-icon {
|
|
194
|
+
color: @W6;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
@@ -39,9 +39,9 @@
|
|
|
39
39
|
|
|
40
40
|
.modal-size-config(@type) {
|
|
41
41
|
@width: ~'modal-width-@{type}';
|
|
42
|
-
@height: ~'modal-height-@{type}';
|
|
42
|
+
@min-height: ~'modal-height-@{type}';
|
|
43
43
|
@max-height: ~'modal-max-height-@{type}';
|
|
44
44
|
width: @@width;
|
|
45
|
-
height: @@height;
|
|
45
|
+
min-height: @@min-height;
|
|
46
46
|
max-height: @@max-height;
|
|
47
47
|
}
|
|
@@ -29,6 +29,8 @@
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
.@{progress-prefix-cls}-label-hidden .@{progress-prefix-cls}-label
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
.@{progress-prefix-cls}-label-hidden .@{progress-prefix-cls}-label{
|
|
33
|
+
&.@{progress-prefix-cls}-label-outer, &.@{progress-prefix-cls}-label-inner{
|
|
34
|
+
display: none;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
@@ -23,7 +23,8 @@
|
|
|
23
23
|
.acud-progress-success .acud-progress-label-icon {
|
|
24
24
|
font-size: 0;
|
|
25
25
|
}
|
|
26
|
-
.acud-progress-label-hidden .acud-progress-label
|
|
26
|
+
.acud-progress-label-hidden .acud-progress-label.acud-progress-label-outer,
|
|
27
|
+
.acud-progress-label-hidden .acud-progress-label.acud-progress-label-inner {
|
|
27
28
|
display: none;
|
|
28
29
|
}
|
|
29
30
|
.acud-progress-line {
|
package/lib/radio/index.d.ts
CHANGED
|
@@ -10,15 +10,20 @@
|
|
|
10
10
|
@modal-mask-color: fade(@G5, 50%);
|
|
11
11
|
|
|
12
12
|
// 默认宽高设置
|
|
13
|
-
@modal-width-sm: 100
|
|
14
|
-
@modal-width-md: 150
|
|
15
|
-
@modal-width-lg: 200
|
|
16
|
-
@modal-width-xl: 300
|
|
17
|
-
|
|
18
|
-
@modal-max-height-sm:
|
|
19
|
-
@modal-max-height-md:
|
|
20
|
-
@modal-max-height-lg:
|
|
21
|
-
@modal-max-height-xl:
|
|
13
|
+
@modal-width-sm: 100 * @P;
|
|
14
|
+
@modal-width-md: 150 * @P;
|
|
15
|
+
@modal-width-lg: 200 * @P;
|
|
16
|
+
@modal-width-xl: 300 * @P;
|
|
17
|
+
|
|
18
|
+
@modal-max-height-sm: 140 * @P;
|
|
19
|
+
@modal-max-height-md: 140 * @P;
|
|
20
|
+
@modal-max-height-lg: 140 * @P;
|
|
21
|
+
@modal-max-height-xl: 140 * @P;
|
|
22
|
+
|
|
23
|
+
@modal-height-sm: 60 * @P;
|
|
24
|
+
@modal-height-md: 100 * @P;
|
|
25
|
+
@modal-height-lg: 120 * @P;
|
|
26
|
+
@modal-height-xl: 120 * @P;
|
|
22
27
|
|
|
23
28
|
// Content
|
|
24
29
|
@modal-content-bg-color: @G11;
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
@primary-color: @B2;
|
|
28
28
|
@picker-basic-cell-active-with-range-color: @B1;
|
|
29
29
|
@picker-date-hover-range-border-color: @B4;
|
|
30
|
-
@picker-date-hover-range-color: @
|
|
30
|
+
@picker-date-hover-range-color: @B2;
|
|
31
31
|
@disabled-color: @G6;
|
|
32
32
|
@picker-basic-cell-disabled-bg: transparent;
|
|
33
33
|
|
|
@@ -10,29 +10,29 @@
|
|
|
10
10
|
@modal-mask-color: fade(@G5, 50%);
|
|
11
11
|
|
|
12
12
|
// 默认宽高设置
|
|
13
|
-
@modal-width-sm: 130
|
|
14
|
-
@modal-width-md: 200
|
|
15
|
-
@modal-width-lg: 280
|
|
16
|
-
@modal-width-xl: 300
|
|
13
|
+
@modal-width-sm: 130 * @P;
|
|
14
|
+
@modal-width-md: 200 * @P;
|
|
15
|
+
@modal-width-lg: 280 * @P;
|
|
16
|
+
@modal-width-xl: 300 * @P;
|
|
17
17
|
|
|
18
|
-
@modal-max-height-sm:
|
|
19
|
-
@modal-max-height-md:
|
|
20
|
-
@modal-max-height-lg:
|
|
21
|
-
@modal-max-height-xl:
|
|
18
|
+
@modal-max-height-sm: 140 * @P;
|
|
19
|
+
@modal-max-height-md: 140 * @P;
|
|
20
|
+
@modal-max-height-lg: 140 * @P;
|
|
21
|
+
@modal-max-height-xl: 140 * @P;
|
|
22
22
|
|
|
23
|
-
@modal-height-sm: 60
|
|
24
|
-
@modal-height-md: 100
|
|
25
|
-
@modal-height-lg: 120
|
|
26
|
-
@modal-height-xl: 120
|
|
23
|
+
@modal-height-sm: 60 * @P;
|
|
24
|
+
@modal-height-md: 100 * @P;
|
|
25
|
+
@modal-height-lg: 120 * @P;
|
|
26
|
+
@modal-height-xl: 120 * @P;
|
|
27
27
|
|
|
28
28
|
// Content
|
|
29
29
|
@modal-content-bg-color: @G11;
|
|
30
30
|
|
|
31
31
|
// Header
|
|
32
|
-
@modal-heading-height:
|
|
32
|
+
@modal-heading-height: 22px;
|
|
33
33
|
@modal-heading-bg-color: @G10;
|
|
34
34
|
@modal-heading-padding: 6*@P 6*@P 0;
|
|
35
|
-
@modal-heading-font-size: @
|
|
35
|
+
@modal-heading-font-size: @T3;
|
|
36
36
|
@modal-heading-font-weight: 500;
|
|
37
37
|
@modal-heading-color: @G2;
|
|
38
38
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { TransferItem, TransferProps } from '
|
|
2
|
+
import { TransferItem, TransferProps } from '.';
|
|
3
3
|
export interface DataSourceProps<RecordType> extends TransferProps<RecordType> {
|
|
4
4
|
tKeys: string[];
|
|
5
5
|
setTKeys: (t: string[]) => void;
|
|
@@ -21,9 +21,11 @@ var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
|
|
|
21
21
|
|
|
22
22
|
var _checkbox = _interopRequireDefault(require("../checkbox"));
|
|
23
23
|
|
|
24
|
+
var _table = _interopRequireDefault(require("../table"));
|
|
25
|
+
|
|
24
26
|
var _search = _interopRequireDefault(require("../search"));
|
|
25
27
|
|
|
26
|
-
var
|
|
28
|
+
var _SourceList = _interopRequireDefault(require("./SourceList"));
|
|
27
29
|
|
|
28
30
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
29
31
|
|
|
@@ -37,13 +39,18 @@ var defaultFilterOption = function defaultFilterOption(inputValue, option) {
|
|
|
37
39
|
return option.title.indexOf(inputValue) > -1;
|
|
38
40
|
};
|
|
39
41
|
|
|
42
|
+
var defaultTableFilterOption = function defaultTableFilterOption(inputValue, option) {
|
|
43
|
+
return option.key.indexOf(inputValue) > -1;
|
|
44
|
+
};
|
|
45
|
+
|
|
40
46
|
function dataSource(props) {
|
|
41
47
|
var prefixCls = props.prefixCls,
|
|
48
|
+
displayType = props.displayType,
|
|
49
|
+
columns = props.columns,
|
|
42
50
|
expansionSource = props.expansionSource,
|
|
43
51
|
_props$showSelectAll = props.showSelectAll,
|
|
44
52
|
showSelectAll = _props$showSelectAll === void 0 ? true : _props$showSelectAll,
|
|
45
|
-
|
|
46
|
-
filterOption = _props$filterOption === void 0 ? defaultFilterOption : _props$filterOption,
|
|
53
|
+
filterOptionProp = props.filterOption,
|
|
47
54
|
showSearch = props.showSearch,
|
|
48
55
|
_props$showSearchClea = props.showSearchClear,
|
|
49
56
|
showSearchClear = _props$showSearchClea === void 0 ? true : _props$showSearchClea,
|
|
@@ -51,6 +58,7 @@ function dataSource(props) {
|
|
|
51
58
|
setTKeys = props.setTKeys,
|
|
52
59
|
leftStyle = props.leftStyle,
|
|
53
60
|
locale = props.locale;
|
|
61
|
+
var filterOption = filterOptionProp || (displayType === 'table' ? defaultTableFilterOption : defaultFilterOption);
|
|
54
62
|
var dataSourceCls = "".concat(prefixCls, "-datasource");
|
|
55
63
|
var sourceTitle = locale.sourceTitle,
|
|
56
64
|
searchPlaceholder = locale.searchPlaceholder,
|
|
@@ -100,7 +108,7 @@ function dataSource(props) {
|
|
|
100
108
|
}
|
|
101
109
|
});
|
|
102
110
|
return fileterCloneSource;
|
|
103
|
-
}, [searchValue, expansionSource]);
|
|
111
|
+
}, [searchValue, expansionSource, displayType]);
|
|
104
112
|
var totalUndisabledKeys = React.useMemo(function () {
|
|
105
113
|
var unDisabledDataSource = filterSource.filter(function (data) {
|
|
106
114
|
return !data.group && !data.disabled;
|
|
@@ -133,14 +141,31 @@ function dataSource(props) {
|
|
|
133
141
|
var searchValue = e.target.value;
|
|
134
142
|
setSearchValue(searchValue);
|
|
135
143
|
}, []);
|
|
144
|
+
|
|
145
|
+
var onSelectChange = function onSelectChange(v) {
|
|
146
|
+
// 排除filter中包含的tKeys,记为noneFilterKeys
|
|
147
|
+
// 联合noneFilterKeys与filter中的选择项,记为最终keys
|
|
148
|
+
var noneFilterKeys = tKeys.filter(function (key) {
|
|
149
|
+
return !filterSource.some(function (item) {
|
|
150
|
+
return item.key === key;
|
|
151
|
+
});
|
|
152
|
+
});
|
|
153
|
+
setTKeys([].concat((0, _toConsumableArray2["default"])(noneFilterKeys), (0, _toConsumableArray2["default"])(v)));
|
|
154
|
+
};
|
|
155
|
+
|
|
156
|
+
var rowSelection = {
|
|
157
|
+
onChange: onSelectChange,
|
|
158
|
+
selectedRowKeys: tKeys
|
|
159
|
+
};
|
|
136
160
|
return /*#__PURE__*/React.createElement("div", {
|
|
137
161
|
className: dataSourceCls,
|
|
138
162
|
style: leftStyle
|
|
139
163
|
}, /*#__PURE__*/React.createElement("div", {
|
|
140
164
|
className: "".concat(dataSourceCls, "-header")
|
|
141
|
-
}, showSelectAll && /*#__PURE__*/React.createElement(_checkbox["default"], {
|
|
165
|
+
}, showSelectAll && displayType === 'single' && /*#__PURE__*/React.createElement(_checkbox["default"], {
|
|
142
166
|
checked: allChecked,
|
|
143
167
|
indeterminate: indeterminate,
|
|
168
|
+
className: "".concat(dataSourceCls, "-header-checkall"),
|
|
144
169
|
onClick: selectAll
|
|
145
170
|
}), /*#__PURE__*/React.createElement("span", {
|
|
146
171
|
className: "".concat(dataSourceCls, "-label")
|
|
@@ -152,7 +177,14 @@ function dataSource(props) {
|
|
|
152
177
|
allowClear: showSearchClear,
|
|
153
178
|
size: "small",
|
|
154
179
|
onChange: searchChange
|
|
155
|
-
}), !!filterSource.length && /*#__PURE__*/React.createElement(
|
|
180
|
+
}), !!filterSource.length && displayType === 'table' && /*#__PURE__*/React.createElement("div", {
|
|
181
|
+
className: "".concat(prefixCls, "-table-box")
|
|
182
|
+
}, /*#__PURE__*/React.createElement(_table["default"], {
|
|
183
|
+
pagination: false,
|
|
184
|
+
dataSource: filterSource,
|
|
185
|
+
columns: columns,
|
|
186
|
+
rowSelection: rowSelection
|
|
187
|
+
})), !!filterSource.length && displayType === 'single' && /*#__PURE__*/React.createElement(_SourceList["default"], (0, _extends2["default"])({}, props, {
|
|
156
188
|
filterSource: filterSource
|
|
157
189
|
})), filterSource.length === 0 && /*#__PURE__*/React.createElement("p", {
|
|
158
190
|
className: "".concat(dataSourceCls, "-nodata")
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { DataSourceProps } from './
|
|
3
|
-
import { TransferItem } from '
|
|
2
|
+
import { DataSourceProps } from './DataSource';
|
|
3
|
+
import { TransferItem } from '.';
|
|
4
4
|
export interface DataSourceListProps<RecordType> extends DataSourceProps<RecordType> {
|
|
5
5
|
filterSource: RecordType[];
|
|
6
6
|
}
|
|
File without changes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { TransferItem, TransferProps } from '
|
|
2
|
+
import { TransferItem, TransferProps } from '.';
|
|
3
3
|
export interface DataSourceProps<RecordType> extends TransferProps<RecordType> {
|
|
4
4
|
tKeys: string[];
|
|
5
5
|
setTKeys: (t: string[]) => void;
|
|
@@ -13,13 +13,19 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
13
13
|
|
|
14
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
15
|
|
|
16
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
17
|
+
|
|
16
18
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
19
|
|
|
18
20
|
var React = _interopRequireWildcard(require("react"));
|
|
19
21
|
|
|
20
|
-
var
|
|
22
|
+
var _dedupe = _interopRequireDefault(require("classnames/dedupe"));
|
|
23
|
+
|
|
24
|
+
var _acudIcon = require("acud-icon");
|
|
21
25
|
|
|
22
|
-
var
|
|
26
|
+
var _table = _interopRequireDefault(require("../table"));
|
|
27
|
+
|
|
28
|
+
var _TargetList = _interopRequireDefault(require("./TargetList"));
|
|
23
29
|
|
|
24
30
|
var _search = _interopRequireDefault(require("../search"));
|
|
25
31
|
|
|
@@ -39,6 +45,7 @@ function target(props) {
|
|
|
39
45
|
var _classnames;
|
|
40
46
|
|
|
41
47
|
var prefixCls = props.prefixCls,
|
|
48
|
+
displayType = props.displayType,
|
|
42
49
|
_props$showClearAll = props.showClearAll,
|
|
43
50
|
showClearAll = _props$showClearAll === void 0 ? true : _props$showClearAll,
|
|
44
51
|
_props$filterOption = props.filterOption,
|
|
@@ -50,7 +57,8 @@ function target(props) {
|
|
|
50
57
|
setTKeys = props.setTKeys,
|
|
51
58
|
rightStyle = props.rightStyle,
|
|
52
59
|
locale = props.locale,
|
|
53
|
-
expansionSource = props.expansionSource
|
|
60
|
+
expansionSource = props.expansionSource,
|
|
61
|
+
columns = props.columns;
|
|
54
62
|
var targetCls = "".concat(prefixCls, "-target");
|
|
55
63
|
var targetTitle = locale.targetTitle,
|
|
56
64
|
searchPlaceholder = locale.searchPlaceholder,
|
|
@@ -125,7 +133,51 @@ function target(props) {
|
|
|
125
133
|
var searchValue = e.target.value;
|
|
126
134
|
setSearchValue(searchValue);
|
|
127
135
|
}, []);
|
|
128
|
-
var
|
|
136
|
+
var targetColumns = React.useMemo(function () {
|
|
137
|
+
if (!columns) {
|
|
138
|
+
return;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
var cancelItem = function cancelItem(data) {
|
|
142
|
+
if (data.disabled) {
|
|
143
|
+
return;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
var curTKeys = (0, _toConsumableArray2["default"])(tKeys);
|
|
147
|
+
|
|
148
|
+
if (data.group) {
|
|
149
|
+
var deleteKeys = data.childrenKeys;
|
|
150
|
+
curTKeys = curTKeys.filter(function (tKey) {
|
|
151
|
+
return !deleteKeys.includes(tKey);
|
|
152
|
+
});
|
|
153
|
+
} else if (curTKeys.includes(data.key)) {
|
|
154
|
+
curTKeys.splice(curTKeys.indexOf(data.key), 1);
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
setTKeys(curTKeys);
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
var tColumns = (0, _toConsumableArray2["default"])(columns);
|
|
161
|
+
tColumns.push({
|
|
162
|
+
title: '',
|
|
163
|
+
key: 'action',
|
|
164
|
+
width: 40,
|
|
165
|
+
render: function render(_text, data) {
|
|
166
|
+
if (!data.disabled) {
|
|
167
|
+
return /*#__PURE__*/React.createElement(_acudIcon.OutlinedClose, {
|
|
168
|
+
className: "".concat(prefixCls, "-target-item-cancel"),
|
|
169
|
+
onClick: function onClick() {
|
|
170
|
+
return cancelItem(data);
|
|
171
|
+
}
|
|
172
|
+
});
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
return null;
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
return tColumns;
|
|
179
|
+
}, [columns, tKeys]);
|
|
180
|
+
var clearCls = (0, _dedupe["default"])((_classnames = {}, (0, _defineProperty2["default"])(_classnames, "".concat(targetCls, "-clear-all"), true), (0, _defineProperty2["default"])(_classnames, "".concat(targetCls, "-clear-all-disabled"), filterSource.length === totalDisabledKeys.length), _classnames));
|
|
129
181
|
return /*#__PURE__*/React.createElement("div", {
|
|
130
182
|
className: targetCls,
|
|
131
183
|
style: rightStyle
|
|
@@ -145,7 +197,13 @@ function target(props) {
|
|
|
145
197
|
allowClear: showSearchClear,
|
|
146
198
|
size: "small",
|
|
147
199
|
onChange: searchChange
|
|
148
|
-
}), !!filterSource.length && /*#__PURE__*/React.createElement(
|
|
200
|
+
}), !!filterSource.length && displayType === 'table' && /*#__PURE__*/React.createElement("div", {
|
|
201
|
+
className: "".concat(prefixCls, "-table-box")
|
|
202
|
+
}, /*#__PURE__*/React.createElement(_table["default"], {
|
|
203
|
+
pagination: false,
|
|
204
|
+
dataSource: filterSource,
|
|
205
|
+
columns: targetColumns
|
|
206
|
+
})), !!filterSource.length && displayType === 'single' && /*#__PURE__*/React.createElement(_TargetList["default"], (0, _extends2["default"])({}, props, {
|
|
149
207
|
filterSource: filterSource
|
|
150
208
|
})), filterSource.length === 0 && /*#__PURE__*/React.createElement("p", {
|
|
151
209
|
className: "".concat(prefixCls, "-target-nodata")
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { DataSourceProps } from './
|
|
3
|
-
import { TransferItem } from '
|
|
2
|
+
import { DataSourceProps } from './DataSource';
|
|
3
|
+
import { TransferItem } from '.';
|
|
4
4
|
export interface DataSourceListProps<RecordType> extends DataSourceProps<RecordType> {
|
|
5
5
|
filterSource: RecordType[];
|
|
6
6
|
}
|
|
File without changes
|
package/lib/transfer/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { ColumnsType } from '../table';
|
|
2
3
|
export declare type TransferDirection = 'left' | 'right';
|
|
3
4
|
export declare type SelectAllLabel = React.ReactNode | ((info: {
|
|
4
5
|
selectedCount: number;
|
|
@@ -24,6 +25,7 @@ export interface TransferItem {
|
|
|
24
25
|
export interface TransferProps<RecordType> {
|
|
25
26
|
prefixCls?: string;
|
|
26
27
|
className?: string;
|
|
28
|
+
displayType?: 'single' | 'table';
|
|
27
29
|
dataSource: RecordType[];
|
|
28
30
|
targetKeys?: string[];
|
|
29
31
|
render?: TransferRender<RecordType>;
|
|
@@ -42,5 +44,6 @@ export interface TransferProps<RecordType> {
|
|
|
42
44
|
selectAllLabels?: SelectAllLabel[];
|
|
43
45
|
defaultExpandGroupKey?: string[] | string | number[] | number | boolean;
|
|
44
46
|
virtual?: boolean;
|
|
47
|
+
columns?: ColumnsType<RecordType>;
|
|
45
48
|
}
|
|
46
49
|
export default function transfer<RecordType extends TransferItem = TransferItem>(props: TransferProps<RecordType>): JSX.Element;
|