Commit 787ae6a963847a0b11d1972531f96b5fc1229f58
Committed by
GitHub
Merge pull request #3006 from SergioCrisostomo/fix-2984
normalise public (export) value to number of step decimal cases
Showing
1 changed file
with
16 additions
and
14 deletions
Show diff stats
src/components/slider/slider.vue
@@ -5,11 +5,11 @@ | @@ -5,11 +5,11 @@ | ||
5 | :min="min" | 5 | :min="min" |
6 | :max="max" | 6 | :max="max" |
7 | :step="step" | 7 | :step="step" |
8 | - :value="currentValue[0]" | 8 | + :value="exportValue[0]" |
9 | :disabled="disabled" | 9 | :disabled="disabled" |
10 | @on-change="handleInputChange"></Input-number> | 10 | @on-change="handleInputChange"></Input-number> |
11 | <div :class="[prefixCls + '-wrap']" ref="slider" @click.self="sliderClick"> | 11 | <div :class="[prefixCls + '-wrap']" ref="slider" @click.self="sliderClick"> |
12 | - <input type="hidden" :name="name" :value="currentValue"> | 12 | + <input type="hidden" :name="name" :value="exportValue"> |
13 | <template v-if="showStops"> | 13 | <template v-if="showStops"> |
14 | <div :class="[prefixCls + '-stop']" v-for="item in stops" :style="{ 'left': item + '%' }" @click.self="sliderClick"></div> | 14 | <div :class="[prefixCls + '-stop']" v-for="item in stops" :style="{ 'left': item + '%' }" @click.self="sliderClick"></div> |
15 | </template> | 15 | </template> |
@@ -19,7 +19,7 @@ | @@ -19,7 +19,7 @@ | ||
19 | :style="{left: minPosition + '%'}" | 19 | :style="{left: minPosition + '%'}" |
20 | @touchstart="onPointerDown($event, 'min')" | 20 | @touchstart="onPointerDown($event, 'min')" |
21 | @mousedown="onPointerDown($event, 'min')"> | 21 | @mousedown="onPointerDown($event, 'min')"> |
22 | - <Tooltip :controlled="pointerDown === 'min'" placement="top" :content="tipFormat(currentValue[0])" | 22 | + <Tooltip :controlled="pointerDown === 'min'" placement="top" :content="tipFormat(exportValue[0])" |
23 | :disabled="tipDisabled" :always="showTip === 'always'" ref="minTooltip"> | 23 | :disabled="tipDisabled" :always="showTip === 'always'" ref="minTooltip"> |
24 | <div :class="minButtonClasses"></div> | 24 | <div :class="minButtonClasses"></div> |
25 | </Tooltip> | 25 | </Tooltip> |
@@ -29,7 +29,7 @@ | @@ -29,7 +29,7 @@ | ||
29 | :style="{left: maxPosition + '%'}" | 29 | :style="{left: maxPosition + '%'}" |
30 | @touchstart="onPointerDown($event, 'max')" | 30 | @touchstart="onPointerDown($event, 'max')" |
31 | @mousedown="onPointerDown($event, 'max')"> | 31 | @mousedown="onPointerDown($event, 'max')"> |
32 | - <Tooltip :controlled="pointerDown === 'max'" placement="top" :content="tipFormat(currentValue[1])" | 32 | + <Tooltip :controlled="pointerDown === 'max'" placement="top" :content="tipFormat(exportValue[1])" |
33 | :disabled="tipDisabled" :always="showTip === 'always'" ref="maxTooltip"> | 33 | :disabled="tipDisabled" :always="showTip === 'always'" ref="maxTooltip"> |
34 | <div :class="maxButtonClasses"></div> | 34 | <div :class="maxButtonClasses"></div> |
35 | </Tooltip> | 35 | </Tooltip> |
@@ -120,16 +120,16 @@ | @@ -120,16 +120,16 @@ | ||
120 | this.currentValue = val; | 120 | this.currentValue = val; |
121 | } | 121 | } |
122 | }, | 122 | }, |
123 | - currentValue (val) { | 123 | + exportValue (values) { |
124 | this.$nextTick(() => { | 124 | this.$nextTick(() => { |
125 | this.$refs.minTooltip.updatePopper(); | 125 | this.$refs.minTooltip.updatePopper(); |
126 | if (this.range) { | 126 | if (this.range) { |
127 | this.$refs.maxTooltip.updatePopper(); | 127 | this.$refs.maxTooltip.updatePopper(); |
128 | } | 128 | } |
129 | }); | 129 | }); |
130 | - const exportValue = this.range ? val : val[0]; | ||
131 | - this.$emit('input', exportValue); | ||
132 | - this.$emit('on-input', exportValue); | 130 | + const value = this.range ? values : values[0]; |
131 | + this.$emit('input', value); | ||
132 | + this.$emit('on-input', value); | ||
133 | } | 133 | } |
134 | }, | 134 | }, |
135 | computed: { | 135 | computed: { |
@@ -159,6 +159,10 @@ | @@ -159,6 +159,10 @@ | ||
159 | } | 159 | } |
160 | ]; | 160 | ]; |
161 | }, | 161 | }, |
162 | + exportValue(){ | ||
163 | + const decimalCases = (String(this.step).split('.')[1] || '').length; | ||
164 | + return this.currentValue.map(nr => Number(nr.toFixed(decimalCases))); | ||
165 | + }, | ||
162 | minPosition () { | 166 | minPosition () { |
163 | const val = this.currentValue; | 167 | const val = this.currentValue; |
164 | return (val[0] - this.min) / this.valueRange * 100; | 168 | return (val[0] - this.min) / this.valueRange * 100; |
@@ -269,9 +273,9 @@ | @@ -269,9 +273,9 @@ | ||
269 | }, | 273 | }, |
270 | 274 | ||
271 | emitChange(){ | 275 | emitChange(){ |
272 | - const exportValue = this.range ? this.currentValue : this.currentValue[0]; | ||
273 | - this.$emit('on-change', exportValue); | ||
274 | - this.dispatch('FormItem', 'on-form-change', exportValue); | 276 | + const value = this.range ? this.exportValue : this.exportValue[0]; |
277 | + this.$emit('on-change', value); | ||
278 | + this.dispatch('FormItem', 'on-form-change', value); | ||
275 | }, | 279 | }, |
276 | 280 | ||
277 | sliderClick (event) { | 281 | sliderClick (event) { |
@@ -287,9 +291,7 @@ | @@ -287,9 +291,7 @@ | ||
287 | 291 | ||
288 | handleInputChange (val) { | 292 | handleInputChange (val) { |
289 | this.currentValue = [val, this.currentValue[1]]; | 293 | this.currentValue = [val, this.currentValue[1]]; |
290 | - const exportValue = this.range ? this.currentValue : this.currentValue[0]; | ||
291 | - this.$emit('on-change', exportValue); | ||
292 | - this.dispatch('FormItem', 'on-form-change', exportValue); | 294 | + this.emitChange(); |
293 | }, | 295 | }, |
294 | }, | 296 | }, |
295 | mounted () { | 297 | mounted () { |