mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-06 03:58:05 +08:00
build: compile 1.1.0-beta.2
This commit is contained in:
rex-zsd
parent
f15b49c7d2
commit
673f1c5fc5
134
dist/stepper/index.js
vendored
134
dist/stepper/index.js
vendored
@ -1,5 +1,5 @@
|
||||
import { VantComponent } from '../common/component';
|
||||
import { addUnit, isDef } from '../common/utils';
|
||||
import { isDef } from '../common/utils';
|
||||
const LONG_PRESS_START_TIME = 600;
|
||||
const LONG_PRESS_INTERVAL = 200;
|
||||
// add num and avoid float number
|
||||
@ -7,6 +7,9 @@ function add(num1, num2) {
|
||||
const cardinal = Math.pow(10, 10);
|
||||
return Math.round((num1 + num2) * cardinal) / cardinal;
|
||||
}
|
||||
function equal(value1, value2) {
|
||||
return String(value1) === String(value2);
|
||||
}
|
||||
VantComponent({
|
||||
field: true,
|
||||
classes: ['input-class', 'plus-class', 'minus-class'],
|
||||
@ -14,47 +17,34 @@ VantComponent({
|
||||
value: {
|
||||
type: null,
|
||||
observer(value) {
|
||||
if (value === '') {
|
||||
return;
|
||||
if (!equal(value, this.data.currentValue)) {
|
||||
this.setData({ currentValue: this.format(value) });
|
||||
}
|
||||
const newValue = this.range(value);
|
||||
if (typeof newValue === 'number' && +this.data.value !== newValue) {
|
||||
this.setData({ value: newValue });
|
||||
}
|
||||
},
|
||||
},
|
||||
integer: Boolean,
|
||||
disabled: Boolean,
|
||||
inputWidth: {
|
||||
type: null,
|
||||
observer() {
|
||||
this.setData({
|
||||
inputStyle: this.computeInputStyle()
|
||||
});
|
||||
},
|
||||
},
|
||||
buttonSize: {
|
||||
type: null,
|
||||
observer() {
|
||||
this.setData({
|
||||
inputStyle: this.computeInputStyle(),
|
||||
buttonStyle: this.computeButtonStyle()
|
||||
});
|
||||
}
|
||||
},
|
||||
integer: {
|
||||
type: Boolean,
|
||||
observer: 'check'
|
||||
},
|
||||
disabled: Boolean,
|
||||
inputWidth: null,
|
||||
buttonSize: null,
|
||||
asyncChange: Boolean,
|
||||
disableInput: Boolean,
|
||||
decimalLength: {
|
||||
type: Number,
|
||||
value: null
|
||||
value: null,
|
||||
observer: 'check'
|
||||
},
|
||||
min: {
|
||||
type: null,
|
||||
value: 1
|
||||
value: 1,
|
||||
observer: 'check'
|
||||
},
|
||||
max: {
|
||||
type: null,
|
||||
value: Number.MAX_SAFE_INTEGER
|
||||
value: Number.MAX_SAFE_INTEGER,
|
||||
observer: 'check'
|
||||
},
|
||||
step: {
|
||||
type: null,
|
||||
@ -73,36 +63,52 @@ VantComponent({
|
||||
longPress: {
|
||||
type: Boolean,
|
||||
value: true
|
||||
},
|
||||
}
|
||||
},
|
||||
data: {
|
||||
focus: false,
|
||||
inputStyle: '',
|
||||
buttonStyle: ''
|
||||
currentValue: ''
|
||||
},
|
||||
created() {
|
||||
this.setData({
|
||||
value: this.range(this.data.value)
|
||||
currentValue: this.format(this.data.value)
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
check() {
|
||||
const val = this.format(this.data.currentValue);
|
||||
if (!equal(val, this.data.currentValue)) {
|
||||
this.setData({ currentValue: val });
|
||||
}
|
||||
},
|
||||
isDisabled(type) {
|
||||
if (type === 'plus') {
|
||||
return this.data.disabled || this.data.disablePlus || this.data.value >= this.data.max;
|
||||
return (this.data.disabled ||
|
||||
this.data.disablePlus ||
|
||||
this.data.currentValue >= this.data.max);
|
||||
}
|
||||
return this.data.disabled || this.data.disableMinus || this.data.value <= this.data.min;
|
||||
return (this.data.disabled ||
|
||||
this.data.disableMinus ||
|
||||
this.data.currentValue <= this.data.min);
|
||||
},
|
||||
onFocus(event) {
|
||||
this.$emit('focus', event.detail);
|
||||
},
|
||||
onBlur(event) {
|
||||
const value = this.range(this.data.value);
|
||||
this.triggerInput(value);
|
||||
this.$emit('blur', event.detail);
|
||||
const value = this.format(event.detail.value);
|
||||
this.emitChange(value);
|
||||
this.$emit('blur', Object.assign(Object.assign({}, event.detail), { value }));
|
||||
},
|
||||
// filter illegal characters
|
||||
filter(value) {
|
||||
value = String(value).replace(/[^0-9.-]/g, '');
|
||||
if (this.data.integer && value.indexOf('.') !== -1) {
|
||||
value = value.split('.')[0];
|
||||
}
|
||||
return value;
|
||||
},
|
||||
// limit value range
|
||||
range(value) {
|
||||
value = String(value).replace(/[^0-9.-]/g, '');
|
||||
format(value) {
|
||||
value = this.filter(value);
|
||||
// format range
|
||||
value = value === '' ? 0 : +value;
|
||||
value = Math.max(Math.min(this.data.max, value), this.data.min);
|
||||
@ -114,7 +120,23 @@ VantComponent({
|
||||
},
|
||||
onInput(event) {
|
||||
const { value = '' } = event.detail || {};
|
||||
this.triggerInput(value);
|
||||
// allow input to be empty
|
||||
if (value === '') {
|
||||
return;
|
||||
}
|
||||
let formatted = this.filter(value);
|
||||
// limit max decimal length
|
||||
if (isDef(this.data.decimalLength) && formatted.indexOf('.') !== -1) {
|
||||
const pair = formatted.split('.');
|
||||
formatted = `${pair[0]}.${pair[1].slice(0, this.data.decimalLength)}`;
|
||||
}
|
||||
this.emitChange(formatted);
|
||||
},
|
||||
emitChange(value) {
|
||||
if (!this.data.asyncChange) {
|
||||
this.setData({ currentValue: value });
|
||||
}
|
||||
this.$emit('change', value);
|
||||
},
|
||||
onChange() {
|
||||
const { type } = this;
|
||||
@ -123,8 +145,8 @@ VantComponent({
|
||||
return;
|
||||
}
|
||||
const diff = type === 'minus' ? -this.data.step : +this.data.step;
|
||||
const value = add(+this.data.value, diff);
|
||||
this.triggerInput(this.range(value));
|
||||
const value = this.format(add(+this.data.currentValue, diff));
|
||||
this.emitChange(value);
|
||||
this.$emit(type);
|
||||
},
|
||||
longPressStep() {
|
||||
@ -157,30 +179,6 @@ VantComponent({
|
||||
return;
|
||||
}
|
||||
clearTimeout(this.longPressTimer);
|
||||
},
|
||||
triggerInput(value) {
|
||||
this.setData({
|
||||
value: this.data.asyncChange ? this.data.value : value
|
||||
});
|
||||
this.$emit('change', value);
|
||||
},
|
||||
computeInputStyle() {
|
||||
let style = '';
|
||||
if (this.data.inputWidth) {
|
||||
style = `width: ${addUnit(this.data.inputWidth)};`;
|
||||
}
|
||||
if (this.data.buttonSize) {
|
||||
style += `height: ${addUnit(this.data.buttonSize)};`;
|
||||
}
|
||||
return style;
|
||||
},
|
||||
computeButtonStyle() {
|
||||
let style = '';
|
||||
const size = addUnit(this.data.buttonSize);
|
||||
if (this.data.buttonSize) {
|
||||
style = `width: ${size};height: ${size};`;
|
||||
}
|
||||
return style;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
12
dist/stepper/index.wxml
vendored
12
dist/stepper/index.wxml
vendored
@ -4,8 +4,8 @@
|
||||
<view
|
||||
wx:if="{{ showMinus }}"
|
||||
data-type="minus"
|
||||
style="{{ buttonStyle }}"
|
||||
class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || value <= min }) }}"
|
||||
style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= min }) }}"
|
||||
hover-class="van-stepper__minus--hover"
|
||||
hover-stay-time="70"
|
||||
bind:tap="onTap"
|
||||
@ -15,8 +15,8 @@
|
||||
<input
|
||||
type="{{ integer ? 'number' : 'digit' }}"
|
||||
class="input-class {{ utils.bem('stepper__input', { disabled: disabled || disableInput }) }}"
|
||||
style="{{ inputStyle }}"
|
||||
value="{{ value }}"
|
||||
style="width: {{ utils.addUnit(inputWidth) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
value="{{ currentValue }}"
|
||||
focus="{{ focus }}"
|
||||
disabled="{{ disabled || disableInput }}"
|
||||
bindinput="onInput"
|
||||
@ -26,8 +26,8 @@
|
||||
<view
|
||||
wx:if="{{ showPlus }}"
|
||||
data-type="plus"
|
||||
style="{{ buttonStyle }}"
|
||||
class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || value >= max }) }}"
|
||||
style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= max }) }}"
|
||||
hover-class="van-stepper__plus--hover"
|
||||
hover-stay-time="70"
|
||||
bind:tap="onTap"
|
||||
|
||||
@ -1,4 +1,15 @@
|
||||
"use strict";
|
||||
var __assign = (this && this.__assign) || function () {
|
||||
__assign = Object.assign || function(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
||||
t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var component_1 = require("../common/component");
|
||||
var utils_1 = require("../common/utils");
|
||||
@ -9,6 +20,9 @@ function add(num1, num2) {
|
||||
var cardinal = Math.pow(10, 10);
|
||||
return Math.round((num1 + num2) * cardinal) / cardinal;
|
||||
}
|
||||
function equal(value1, value2) {
|
||||
return String(value1) === String(value2);
|
||||
}
|
||||
component_1.VantComponent({
|
||||
field: true,
|
||||
classes: ['input-class', 'plus-class', 'minus-class'],
|
||||
@ -16,47 +30,34 @@ component_1.VantComponent({
|
||||
value: {
|
||||
type: null,
|
||||
observer: function (value) {
|
||||
if (value === '') {
|
||||
return;
|
||||
if (!equal(value, this.data.currentValue)) {
|
||||
this.setData({ currentValue: this.format(value) });
|
||||
}
|
||||
var newValue = this.range(value);
|
||||
if (typeof newValue === 'number' && +this.data.value !== newValue) {
|
||||
this.setData({ value: newValue });
|
||||
}
|
||||
},
|
||||
},
|
||||
integer: Boolean,
|
||||
disabled: Boolean,
|
||||
inputWidth: {
|
||||
type: null,
|
||||
observer: function () {
|
||||
this.setData({
|
||||
inputStyle: this.computeInputStyle()
|
||||
});
|
||||
},
|
||||
},
|
||||
buttonSize: {
|
||||
type: null,
|
||||
observer: function () {
|
||||
this.setData({
|
||||
inputStyle: this.computeInputStyle(),
|
||||
buttonStyle: this.computeButtonStyle()
|
||||
});
|
||||
}
|
||||
},
|
||||
integer: {
|
||||
type: Boolean,
|
||||
observer: 'check'
|
||||
},
|
||||
disabled: Boolean,
|
||||
inputWidth: null,
|
||||
buttonSize: null,
|
||||
asyncChange: Boolean,
|
||||
disableInput: Boolean,
|
||||
decimalLength: {
|
||||
type: Number,
|
||||
value: null
|
||||
value: null,
|
||||
observer: 'check'
|
||||
},
|
||||
min: {
|
||||
type: null,
|
||||
value: 1
|
||||
value: 1,
|
||||
observer: 'check'
|
||||
},
|
||||
max: {
|
||||
type: null,
|
||||
value: Number.MAX_SAFE_INTEGER
|
||||
value: Number.MAX_SAFE_INTEGER,
|
||||
observer: 'check'
|
||||
},
|
||||
step: {
|
||||
type: null,
|
||||
@ -75,36 +76,52 @@ component_1.VantComponent({
|
||||
longPress: {
|
||||
type: Boolean,
|
||||
value: true
|
||||
},
|
||||
}
|
||||
},
|
||||
data: {
|
||||
focus: false,
|
||||
inputStyle: '',
|
||||
buttonStyle: ''
|
||||
currentValue: ''
|
||||
},
|
||||
created: function () {
|
||||
this.setData({
|
||||
value: this.range(this.data.value)
|
||||
currentValue: this.format(this.data.value)
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
check: function () {
|
||||
var val = this.format(this.data.currentValue);
|
||||
if (!equal(val, this.data.currentValue)) {
|
||||
this.setData({ currentValue: val });
|
||||
}
|
||||
},
|
||||
isDisabled: function (type) {
|
||||
if (type === 'plus') {
|
||||
return this.data.disabled || this.data.disablePlus || this.data.value >= this.data.max;
|
||||
return (this.data.disabled ||
|
||||
this.data.disablePlus ||
|
||||
this.data.currentValue >= this.data.max);
|
||||
}
|
||||
return this.data.disabled || this.data.disableMinus || this.data.value <= this.data.min;
|
||||
return (this.data.disabled ||
|
||||
this.data.disableMinus ||
|
||||
this.data.currentValue <= this.data.min);
|
||||
},
|
||||
onFocus: function (event) {
|
||||
this.$emit('focus', event.detail);
|
||||
},
|
||||
onBlur: function (event) {
|
||||
var value = this.range(this.data.value);
|
||||
this.triggerInput(value);
|
||||
this.$emit('blur', event.detail);
|
||||
var value = this.format(event.detail.value);
|
||||
this.emitChange(value);
|
||||
this.$emit('blur', __assign(__assign({}, event.detail), { value: value }));
|
||||
},
|
||||
// filter illegal characters
|
||||
filter: function (value) {
|
||||
value = String(value).replace(/[^0-9.-]/g, '');
|
||||
if (this.data.integer && value.indexOf('.') !== -1) {
|
||||
value = value.split('.')[0];
|
||||
}
|
||||
return value;
|
||||
},
|
||||
// limit value range
|
||||
range: function (value) {
|
||||
value = String(value).replace(/[^0-9.-]/g, '');
|
||||
format: function (value) {
|
||||
value = this.filter(value);
|
||||
// format range
|
||||
value = value === '' ? 0 : +value;
|
||||
value = Math.max(Math.min(this.data.max, value), this.data.min);
|
||||
@ -116,7 +133,23 @@ component_1.VantComponent({
|
||||
},
|
||||
onInput: function (event) {
|
||||
var _a = (event.detail || {}).value, value = _a === void 0 ? '' : _a;
|
||||
this.triggerInput(value);
|
||||
// allow input to be empty
|
||||
if (value === '') {
|
||||
return;
|
||||
}
|
||||
var formatted = this.filter(value);
|
||||
// limit max decimal length
|
||||
if (utils_1.isDef(this.data.decimalLength) && formatted.indexOf('.') !== -1) {
|
||||
var pair = formatted.split('.');
|
||||
formatted = pair[0] + "." + pair[1].slice(0, this.data.decimalLength);
|
||||
}
|
||||
this.emitChange(formatted);
|
||||
},
|
||||
emitChange: function (value) {
|
||||
if (!this.data.asyncChange) {
|
||||
this.setData({ currentValue: value });
|
||||
}
|
||||
this.$emit('change', value);
|
||||
},
|
||||
onChange: function () {
|
||||
var type = this.type;
|
||||
@ -125,8 +158,8 @@ component_1.VantComponent({
|
||||
return;
|
||||
}
|
||||
var diff = type === 'minus' ? -this.data.step : +this.data.step;
|
||||
var value = add(+this.data.value, diff);
|
||||
this.triggerInput(this.range(value));
|
||||
var value = this.format(add(+this.data.currentValue, diff));
|
||||
this.emitChange(value);
|
||||
this.$emit(type);
|
||||
},
|
||||
longPressStep: function () {
|
||||
@ -161,30 +194,6 @@ component_1.VantComponent({
|
||||
return;
|
||||
}
|
||||
clearTimeout(this.longPressTimer);
|
||||
},
|
||||
triggerInput: function (value) {
|
||||
this.setData({
|
||||
value: this.data.asyncChange ? this.data.value : value
|
||||
});
|
||||
this.$emit('change', value);
|
||||
},
|
||||
computeInputStyle: function () {
|
||||
var style = '';
|
||||
if (this.data.inputWidth) {
|
||||
style = "width: " + utils_1.addUnit(this.data.inputWidth) + ";";
|
||||
}
|
||||
if (this.data.buttonSize) {
|
||||
style += "height: " + utils_1.addUnit(this.data.buttonSize) + ";";
|
||||
}
|
||||
return style;
|
||||
},
|
||||
computeButtonStyle: function () {
|
||||
var style = '';
|
||||
var size = utils_1.addUnit(this.data.buttonSize);
|
||||
if (this.data.buttonSize) {
|
||||
style = "width: " + size + ";height: " + size + ";";
|
||||
}
|
||||
return style;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -4,8 +4,8 @@
|
||||
<view
|
||||
wx:if="{{ showMinus }}"
|
||||
data-type="minus"
|
||||
style="{{ buttonStyle }}"
|
||||
class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || value <= min }) }}"
|
||||
style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= min }) }}"
|
||||
hover-class="van-stepper__minus--hover"
|
||||
hover-stay-time="70"
|
||||
bind:tap="onTap"
|
||||
@ -15,8 +15,8 @@
|
||||
<input
|
||||
type="{{ integer ? 'number' : 'digit' }}"
|
||||
class="input-class {{ utils.bem('stepper__input', { disabled: disabled || disableInput }) }}"
|
||||
style="{{ inputStyle }}"
|
||||
value="{{ value }}"
|
||||
style="width: {{ utils.addUnit(inputWidth) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
value="{{ currentValue }}"
|
||||
focus="{{ focus }}"
|
||||
disabled="{{ disabled || disableInput }}"
|
||||
bindinput="onInput"
|
||||
@ -26,8 +26,8 @@
|
||||
<view
|
||||
wx:if="{{ showPlus }}"
|
||||
data-type="plus"
|
||||
style="{{ buttonStyle }}"
|
||||
class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || value >= max }) }}"
|
||||
style="width: {{ utils.addUnit(buttonSize) }}; height: {{ utils.addUnit(buttonSize) }}"
|
||||
class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= max }) }}"
|
||||
hover-class="van-stepper__plus--hover"
|
||||
hover-stay-time="70"
|
||||
bind:tap="onTap"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user