@cloudbase/weda-ui-mp 3.18.3 → 3.18.4
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.
|
@@ -7,13 +7,7 @@ import { convertSize } from '../../utils/getFormLegacy';
|
|
|
7
7
|
import classNames from '../../utils/classnames';
|
|
8
8
|
import { commonCompBehavior } from '../../utils/common-behavior';
|
|
9
9
|
import formFieldBehavior from '../form-field-behavior/form-field-behavior';
|
|
10
|
-
import {
|
|
11
|
-
dealDecimals,
|
|
12
|
-
strNumAddCalc,
|
|
13
|
-
isNumber,
|
|
14
|
-
dealPercent,
|
|
15
|
-
getPercentUnit,
|
|
16
|
-
} from './number';
|
|
10
|
+
import { dealDecimals, strNumAddCalc, isNumber, dealPercent, getPercentUnit } from './number';
|
|
17
11
|
import equal from '../../utils/deepEqual';
|
|
18
12
|
|
|
19
13
|
const getHasClearIcon = (clearable, focus, disabled, readOnly, realValue) =>
|
|
@@ -26,12 +20,7 @@ const getRealValue = ({ value, format }) => {
|
|
|
26
20
|
return Number(v.replace(/,/g, ''));
|
|
27
21
|
};
|
|
28
22
|
|
|
29
|
-
const judgeRule = ({
|
|
30
|
-
value = undefined,
|
|
31
|
-
max = undefined,
|
|
32
|
-
min = undefined,
|
|
33
|
-
resultType = 'boolean',
|
|
34
|
-
} = {}) => {
|
|
23
|
+
const judgeRule = ({ value = undefined, max = undefined, min = undefined, resultType = 'boolean' } = {}) => {
|
|
35
24
|
let maxFit = true;
|
|
36
25
|
let minFit = true;
|
|
37
26
|
if (isNumber(max)) {
|
|
@@ -45,12 +34,7 @@ const judgeRule = ({
|
|
|
45
34
|
return resultType === 'boolean' ? maxFit && minFit : { maxFit, minFit };
|
|
46
35
|
};
|
|
47
36
|
|
|
48
|
-
const getRuleMessage = ({
|
|
49
|
-
value = undefined,
|
|
50
|
-
max = undefined,
|
|
51
|
-
min = undefined,
|
|
52
|
-
validMsgObj = {},
|
|
53
|
-
} = {}) => {
|
|
37
|
+
const getRuleMessage = ({ value = undefined, max = undefined, min = undefined, validMsgObj = {} } = {}) => {
|
|
54
38
|
const { maxFit, minFit } = judgeRule({
|
|
55
39
|
value,
|
|
56
40
|
max,
|
|
@@ -129,7 +113,7 @@ Component({
|
|
|
129
113
|
inputWrap: `${WD_PREFIX}-form-input-wrap`,
|
|
130
114
|
inputCls: `${WD_PREFIX}-form-input-wrap__input`,
|
|
131
115
|
inputGroup: `${WD_PREFIX}-form-input-group`,
|
|
132
|
-
placeholderCls: `${WD_PREFIX}-form-input-wrap__placeholder`,
|
|
116
|
+
placeholderCls: `${WD_PREFIX}-form-input-wrap__placeholder weui-input__placeholder`,
|
|
133
117
|
cls: '',
|
|
134
118
|
formClass: '',
|
|
135
119
|
|
|
@@ -147,21 +131,8 @@ Component({
|
|
|
147
131
|
},
|
|
148
132
|
methods: {
|
|
149
133
|
updateWidgetAPI: function () {
|
|
150
|
-
const {
|
|
151
|
-
|
|
152
|
-
label,
|
|
153
|
-
required,
|
|
154
|
-
visible,
|
|
155
|
-
disabled,
|
|
156
|
-
readOnly,
|
|
157
|
-
before,
|
|
158
|
-
after,
|
|
159
|
-
min,
|
|
160
|
-
max,
|
|
161
|
-
step,
|
|
162
|
-
format,
|
|
163
|
-
value,
|
|
164
|
-
} = this.data;
|
|
134
|
+
const { name, label, required, visible, disabled, readOnly, before, after, min, max, step, format, value } =
|
|
135
|
+
this.data;
|
|
165
136
|
this.setReadonlyAttributes?.({
|
|
166
137
|
name,
|
|
167
138
|
value,
|
|
@@ -186,20 +157,12 @@ Component({
|
|
|
186
157
|
},
|
|
187
158
|
onRealChange(e, type = '', { needSetData = true, value = '' } = {}) {
|
|
188
159
|
const { readOnly, disabled, status, format, step } = this.properties;
|
|
189
|
-
if (readOnly || disabled || (status && status !== 'edit'))
|
|
190
|
-
return this.data.realValue;
|
|
160
|
+
if (readOnly || disabled || (status && status !== 'edit')) return this.data.realValue;
|
|
191
161
|
|
|
192
|
-
const { stepPlusDisabled, stepMinusDisabled } = this.getStepDisabled(
|
|
193
|
-
null,
|
|
194
|
-
this.data.realValue
|
|
195
|
-
);
|
|
162
|
+
const { stepPlusDisabled, stepMinusDisabled } = this.getStepDisabled(null, this.data.realValue);
|
|
196
163
|
|
|
197
164
|
if (['plus', 'minus'].includes(type)) {
|
|
198
|
-
if (
|
|
199
|
-
!isNumber(step) ||
|
|
200
|
-
(type === 'plus' && stepPlusDisabled) ||
|
|
201
|
-
(type === 'minus' && stepMinusDisabled)
|
|
202
|
-
) {
|
|
165
|
+
if (!isNumber(step) || (type === 'plus' && stepPlusDisabled) || (type === 'minus' && stepMinusDisabled)) {
|
|
203
166
|
needSetData &&
|
|
204
167
|
this.setData({
|
|
205
168
|
stepPlusDisabled,
|
|
@@ -263,10 +226,7 @@ Component({
|
|
|
263
226
|
return;
|
|
264
227
|
}
|
|
265
228
|
|
|
266
|
-
const reg = new RegExp(
|
|
267
|
-
`^\\D*(\\d*(?:\\.\\d{0,${Math.max(0, 10000)}})?).*$`,
|
|
268
|
-
'g'
|
|
269
|
-
);
|
|
229
|
+
const reg = new RegExp(`^\\D*(\\d*(?:\\.\\d{0,${Math.max(0, 10000)}})?).*$`, 'g');
|
|
270
230
|
value = value.replace(reg, '$1');
|
|
271
231
|
|
|
272
232
|
if (e.detail.value.startsWith('-')) {
|
|
@@ -313,10 +273,8 @@ Component({
|
|
|
313
273
|
stepPlusDisabled = true;
|
|
314
274
|
stepMinusDisabled = true;
|
|
315
275
|
} else {
|
|
316
|
-
stepPlusDisabled =
|
|
317
|
-
|
|
318
|
-
stepMinusDisabled =
|
|
319
|
-
isNumber(+realValue) && isNumber(min) && min >= +realValue;
|
|
276
|
+
stepPlusDisabled = isNumber(+realValue) && isNumber(max) && max <= +realValue;
|
|
277
|
+
stepMinusDisabled = isNumber(+realValue) && isNumber(min) && min >= +realValue;
|
|
320
278
|
}
|
|
321
279
|
|
|
322
280
|
return { stepPlusDisabled, stepMinusDisabled };
|
|
@@ -334,7 +292,7 @@ Component({
|
|
|
334
292
|
|
|
335
293
|
const { stepPlusDisabled, stepMinusDisabled } = this.getStepDisabled(
|
|
336
294
|
{ readOnly, disabled, status, max, min, format },
|
|
337
|
-
toReal
|
|
295
|
+
toReal,
|
|
338
296
|
);
|
|
339
297
|
|
|
340
298
|
const readValue = `${toShow}${getPercentUnit(format)}`;
|
|
@@ -342,17 +300,7 @@ Component({
|
|
|
342
300
|
return { toShow, toReal, stepPlusDisabled, stepMinusDisabled, readValue };
|
|
343
301
|
},
|
|
344
302
|
// 获取显示在输入框的值,非真实值
|
|
345
|
-
getShowValue({
|
|
346
|
-
value,
|
|
347
|
-
thousandShow,
|
|
348
|
-
decimals,
|
|
349
|
-
step,
|
|
350
|
-
max,
|
|
351
|
-
min,
|
|
352
|
-
format,
|
|
353
|
-
type = '',
|
|
354
|
-
needSetData = true,
|
|
355
|
-
}) {
|
|
303
|
+
getShowValue({ value, thousandShow, decimals, step, max, min, format, type = '', needSetData = true }) {
|
|
356
304
|
if (value === '' && !['plus', 'minus'].includes(type)) return '';
|
|
357
305
|
|
|
358
306
|
if (value === 'null' || value === 'undefined') return '';
|
|
@@ -362,9 +310,7 @@ Component({
|
|
|
362
310
|
let res = `${value}`;
|
|
363
311
|
|
|
364
312
|
if (isNumber(value) && res.includes('e')) {
|
|
365
|
-
res = `${res.startsWith('-') ? '-' : ''}${res
|
|
366
|
-
.replace(/^-/, '')
|
|
367
|
-
.toLocaleString()}`;
|
|
313
|
+
res = `${res.startsWith('-') ? '-' : ''}${res.replace(/^-/, '').toLocaleString()}`;
|
|
368
314
|
}
|
|
369
315
|
|
|
370
316
|
res = res.replace(/ /g, '').replace(/,/g, '');
|
|
@@ -383,11 +329,7 @@ Component({
|
|
|
383
329
|
}
|
|
384
330
|
|
|
385
331
|
const validMsgObj = getValidMsgObj(format, max, min);
|
|
386
|
-
const rules = getRules(
|
|
387
|
-
validMsgObj,
|
|
388
|
-
this.properties.max,
|
|
389
|
-
this.properties.min
|
|
390
|
-
);
|
|
332
|
+
const rules = getRules(validMsgObj, this.properties.max, this.properties.min);
|
|
391
333
|
|
|
392
334
|
if (isNumber(this.properties.max) && Number(res) > max) {
|
|
393
335
|
validState = 'error';
|
|
@@ -406,9 +348,7 @@ Component({
|
|
|
406
348
|
// 千分符转换
|
|
407
349
|
if (thousandShow && res !== 'Infinity' && res !== '-Infinity') {
|
|
408
350
|
const temp = res.split('.');
|
|
409
|
-
res = `${temp[0].replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')}${
|
|
410
|
-
temp[1] ? `.${temp[1]}` : ''
|
|
411
|
-
}`;
|
|
351
|
+
res = `${temp[0].replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')}${temp[1] ? `.${temp[1]}` : ''}`;
|
|
412
352
|
}
|
|
413
353
|
|
|
414
354
|
needSetData &&
|
|
@@ -422,118 +362,89 @@ Component({
|
|
|
422
362
|
},
|
|
423
363
|
},
|
|
424
364
|
observers: {
|
|
425
|
-
'name,value,label,required,visible,disabled,readOnly,before,after,min,max,step,format':
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
365
|
+
'name,value,label,required,visible,disabled,readOnly,before,after,min,max,step,format': function () {
|
|
366
|
+
this.updateWidgetAPI();
|
|
367
|
+
},
|
|
368
|
+
'disabled,readOnly,clearable,isFocus': function (disabled, readOnly, clearable, isFocus) {
|
|
369
|
+
const hasClearIcon = getHasClearIcon(clearable, isFocus, disabled, readOnly, this.data.realValue);
|
|
370
|
+
this.setData({ hasClearIcon });
|
|
371
|
+
},
|
|
372
|
+
'disabled,size,wrapClassName,before,after,classRoot,className,stepOption': function (
|
|
430
373
|
disabled,
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
374
|
+
size,
|
|
375
|
+
wrapClassName,
|
|
376
|
+
before,
|
|
377
|
+
after,
|
|
378
|
+
classRoot,
|
|
379
|
+
className,
|
|
380
|
+
stepOption,
|
|
434
381
|
) {
|
|
435
|
-
const
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
382
|
+
const _size = convertSize(size);
|
|
383
|
+
const { classPrefix, inputWrap } = this.data;
|
|
384
|
+
const root = `${classPrefix}-${classRoot}`;
|
|
385
|
+
const cls = classNames(
|
|
386
|
+
root,
|
|
387
|
+
inputWrap,
|
|
388
|
+
this.data.inputGroup,
|
|
389
|
+
wrapClassName,
|
|
390
|
+
`size-width-${_size}`,
|
|
391
|
+
`size-font-${_size}`,
|
|
392
|
+
`size-height-${_size}`,
|
|
393
|
+
`${root}-${classRoot}`,
|
|
394
|
+
{
|
|
395
|
+
'is-not-h5': true,
|
|
396
|
+
'size-width-hundred': true,
|
|
397
|
+
'is-disabled': disabled,
|
|
398
|
+
[`${classPrefix}-input-number-input-number`]: true,
|
|
399
|
+
[`${classPrefix}-form-input-wrap--no-border`]: stepOption !== 'both',
|
|
400
|
+
[`${inputWrap}--no-radius-left`]: before,
|
|
401
|
+
[`${inputWrap}--no-radius-right`]: after,
|
|
402
|
+
[`${inputWrap}--no-radius`]: before && after,
|
|
403
|
+
[`${classPrefix}-form-input-wrap`]: true,
|
|
404
|
+
},
|
|
441
405
|
);
|
|
442
|
-
|
|
406
|
+
const formClass = classNames(className, `${root}--row`, stepOption !== 'both' ? 'input-number-step-right' : '');
|
|
407
|
+
|
|
408
|
+
this.setData({ cls, root, _size, formClass });
|
|
443
409
|
},
|
|
444
|
-
'
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
inputWrap,
|
|
461
|
-
this.data.inputGroup,
|
|
462
|
-
wrapClassName,
|
|
463
|
-
`size-width-${_size}`,
|
|
464
|
-
`size-font-${_size}`,
|
|
465
|
-
`size-height-${_size}`,
|
|
466
|
-
`${root}-${classRoot}`,
|
|
467
|
-
{
|
|
468
|
-
'is-not-h5': true,
|
|
469
|
-
'size-width-hundred': true,
|
|
470
|
-
'is-disabled': disabled,
|
|
471
|
-
[`${classPrefix}-input-number-input-number`]: true,
|
|
472
|
-
[`${classPrefix}-form-input-wrap--no-border`]:
|
|
473
|
-
stepOption !== 'both',
|
|
474
|
-
[`${inputWrap}--no-radius-left`]: before,
|
|
475
|
-
[`${inputWrap}--no-radius-right`]: after,
|
|
476
|
-
[`${inputWrap}--no-radius`]: before && after,
|
|
477
|
-
[`${classPrefix}-form-input-wrap`]: true,
|
|
478
|
-
}
|
|
479
|
-
);
|
|
480
|
-
const formClass = classNames(
|
|
481
|
-
className,
|
|
482
|
-
`${root}--row`,
|
|
483
|
-
stepOption !== 'both' ? 'input-number-step-right' : ''
|
|
484
|
-
);
|
|
485
|
-
|
|
486
|
-
this.setData({ cls, root, _size, formClass });
|
|
487
|
-
},
|
|
488
|
-
'inputValue,format,decimals,min,max,status,readOnly,disabled,after,before,thousandShow,step':
|
|
489
|
-
function (
|
|
490
|
-
inputValue,
|
|
410
|
+
'inputValue,format,decimals,min,max,status,readOnly,disabled,after,before,thousandShow,step': function (
|
|
411
|
+
inputValue,
|
|
412
|
+
format,
|
|
413
|
+
decimals,
|
|
414
|
+
min,
|
|
415
|
+
max,
|
|
416
|
+
status,
|
|
417
|
+
readOnly,
|
|
418
|
+
disabled,
|
|
419
|
+
after,
|
|
420
|
+
before,
|
|
421
|
+
thousandShow,
|
|
422
|
+
step,
|
|
423
|
+
) {
|
|
424
|
+
const { toReal, toShow, stepPlusDisabled, stepMinusDisabled, readValue } = this.getRealAndShowData({
|
|
425
|
+
value: this.data.isInit ? (isNumber(inputValue) ? inputValue : '') : this.data.realValue,
|
|
491
426
|
format,
|
|
492
427
|
decimals,
|
|
493
428
|
min,
|
|
494
429
|
max,
|
|
495
|
-
status,
|
|
496
430
|
readOnly,
|
|
497
431
|
disabled,
|
|
498
|
-
|
|
432
|
+
status,
|
|
499
433
|
before,
|
|
434
|
+
after,
|
|
500
435
|
thousandShow,
|
|
501
|
-
step
|
|
502
|
-
)
|
|
503
|
-
const {
|
|
504
|
-
toReal,
|
|
505
|
-
toShow,
|
|
506
|
-
stepPlusDisabled,
|
|
507
|
-
stepMinusDisabled,
|
|
508
|
-
readValue,
|
|
509
|
-
} = this.getRealAndShowData({
|
|
510
|
-
value: this.data.isInit
|
|
511
|
-
? isNumber(inputValue)
|
|
512
|
-
? inputValue
|
|
513
|
-
: ''
|
|
514
|
-
: this.data.realValue,
|
|
515
|
-
format,
|
|
516
|
-
decimals,
|
|
517
|
-
min,
|
|
518
|
-
max,
|
|
519
|
-
readOnly,
|
|
520
|
-
disabled,
|
|
521
|
-
status,
|
|
522
|
-
before,
|
|
523
|
-
after,
|
|
524
|
-
thousandShow,
|
|
525
|
-
step,
|
|
526
|
-
});
|
|
436
|
+
step,
|
|
437
|
+
});
|
|
527
438
|
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
439
|
+
this.setData({
|
|
440
|
+
readValue,
|
|
441
|
+
realValue: toReal,
|
|
442
|
+
showValue: readOnly ? readValue : toShow,
|
|
443
|
+
stepPlusDisabled,
|
|
444
|
+
stepMinusDisabled,
|
|
445
|
+
});
|
|
446
|
+
this.changeForm({ value: toReal });
|
|
447
|
+
},
|
|
537
448
|
// 监听非输入引起的value变化,比如调用 setValue, clearValue
|
|
538
449
|
value: function (value) {
|
|
539
450
|
const { format } = this.properties;
|
|
@@ -573,8 +484,9 @@ Component({
|
|
|
573
484
|
},
|
|
574
485
|
inputValue: function (inputValue) {
|
|
575
486
|
if (equal(inputValue, this.data._oldInputValue)) return;
|
|
576
|
-
const { toReal, toShow, stepPlusDisabled, stepMinusDisabled, readValue } =
|
|
577
|
-
|
|
487
|
+
const { toReal, toShow, stepPlusDisabled, stepMinusDisabled, readValue } = this.getRealAndShowData({
|
|
488
|
+
value: inputValue,
|
|
489
|
+
});
|
|
578
490
|
|
|
579
491
|
this.setData({
|
|
580
492
|
readValue,
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
>
|
|
26
26
|
<wd-input-group before="{{before}}" after="{{after}}" block="{{true}}" size="{{_size}}" classRoot="{{classRoot}}">
|
|
27
27
|
<wd-input-wrap block="{{block}}" classRoot="{{classRoot}}" before="{{before}}" after="{{after}}" disabled="{{disabled}}" prefixType="{{prefixType}}" prefixIcon="{{prefixIcon}}" prefixSrc="{{prefixSrc}}" suffixType="{{suffixType}}" suffixIcon="{{suffixIcon}}" suffixSrc="{{suffixSrc}}" hasClearIcon="{{clearable && !disabled && (value != null)}}" bind:onClear="handleClear">
|
|
28
|
-
<input class="{{classPrefix}}-form-select_input" placeholder="{{placeholder}}" value="{{readValue}}" disabled="true" name="{{name}}" bindtap="setPickerVisible" />
|
|
28
|
+
<input placeholder-class="weui-input__placeholder" class="{{classPrefix}}-form-select_input" placeholder="{{placeholder}}" value="{{readValue}}" disabled="true" name="{{name}}" bindtap="setPickerVisible" />
|
|
29
29
|
</wd-input-wrap>
|
|
30
30
|
</wd-input-group>
|
|
31
31
|
</wd-form-item>
|