From 178656e0fb2e2ef6c52b439087b09d08eb6b31d4 Mon Sep 17 00:00:00 2001
From: niunai <colonD.wny@gmail.com>
Date: Tue, 26 Sep 2017 16:57:53 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=8D=95=E7=8B=AC?=
 =?UTF-8?q?=E7=A6=81=E7=94=A8stepper=20input=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/examples-docs/sku.md                |  6 ++++--
 packages/sku/components/SkuStepper.vue   | 13 ++++++++++++-
 packages/sku/containers/SkuContainer.vue |  2 ++
 packages/stepper/index.vue               | 14 ++++++++++----
 test/unit/specs/stepper.js               | 20 +++++++++++++++++++-
 5 files changed, 47 insertions(+), 8 deletions(-)

diff --git a/docs/examples-docs/sku.md b/docs/examples-docs/sku.md
index e01db13ab..2381a5c6d 100644
--- a/docs/examples-docs/sku.md
+++ b/docs/examples-docs/sku.md
@@ -16,6 +16,8 @@ export default {
       goodsId: data.goods_id,
       quota: data.quota,
       quotaUsed: data.quota_used,
+      disableStepperInput: true,
+      resetStepperOnHide: true,
       initialSku: {
         s1: '30349',
         s2: '1193'
@@ -62,10 +64,10 @@ Vue.component(Sku.name, Sku);
       :goods="goods"
       :goods-id="goodsId"
       :hide-stock="sku.hide_stock"
-      :show-add-cart-btn="true"
       :quota="quota"
       :quota-used="quotaUsed"
-      :reset-stepper-on-hide="true"
+      :reset-stepper-on-hide="resetStepperOnHide"
+      :disable-stepper-input="disableStepperInput"
       @buy-clicked="handleBuyClicked"
       @add-cart="handleAddCartClicked"
     >
diff --git a/packages/sku/components/SkuStepper.vue b/packages/sku/components/SkuStepper.vue
index 892c235f9..c15be326f 100644
--- a/packages/sku/components/SkuStepper.vue
+++ b/packages/sku/components/SkuStepper.vue
@@ -2,7 +2,14 @@
   <div class="van-sku-stepper-stock">
     <div class="van-sku-stepper-container">
       <div class="van-sku__stepper-title">{{ stepperTitle }}：</div>
-      <van-stepper v-model="currentNum" :min="1" :max="stepperLimit" class="van-sku__stepper" @overlimit="handleOverLimit"></van-stepper>
+      <van-stepper
+        class="van-sku__stepper"
+        v-model="currentNum"
+        :min="1"
+        :max="stepperLimit"
+        :disableInput="disableStepperInput"
+        @overlimit="handleOverLimit">
+      </van-stepper>
     </div>
     <div v-if="!hideStock" class="van-sku__stock">剩余{{ stock }}件</div>
     <div v-if="quota > 0" class="van-sku__quota">每人限购{{ quota }}件</div>
@@ -34,6 +41,10 @@ export default {
       type: Boolean,
       default: false
     },
+    disableStepperInput: {
+      type: Boolean,
+      default: false
+    },
     stepperTitle: {
       type: String,
       default: DEFAULT_BUY_TEXT
diff --git a/packages/sku/containers/SkuContainer.vue b/packages/sku/containers/SkuContainer.vue
index 2d36faa0a..b79a0c3f2 100644
--- a/packages/sku/containers/SkuContainer.vue
+++ b/packages/sku/containers/SkuContainer.vue
@@ -45,6 +45,7 @@
               :skuStockNum="sku.stock_num"
               :quota="quota"
               :quotaUsed="quotaUsed"
+              :disableStepperInput="disableStepperInput"
               :hideStock="hideStock">
             </van-sku-stepper>
           </slot>
@@ -133,6 +134,7 @@ export default {
       default: 200
     },
     resetStepperOnHide: Boolean,
+    disableStepperInput: Boolean,
     messagePlaceholderMap: {
       type: Object,
       default() {
diff --git a/packages/stepper/index.vue b/packages/stepper/index.vue
index adc61b2e4..cf8bb9a78 100644
--- a/packages/stepper/index.vue
+++ b/packages/stepper/index.vue
@@ -8,11 +8,11 @@
       }">
     </button>
     <input
-      type="text"
+      type="number"
       class="van-stepper__input"
       :value="currentValue"
       @input="handleInputChange"
-      :disabled="disabled">
+      :disabled="disabled || disableInput">
     <button
       @click="handleChange('plus')"
       class="van-stepper__stepper van-stepper__plus"
@@ -42,6 +42,7 @@ export default {
       default: 1
     },
     disabled: Boolean,
+    disableInput: Boolean,
     defaultValue: {
       type: [String, Number],
       default: 1
@@ -91,8 +92,13 @@ export default {
   methods: {
     // 纠正value值
     correctValue(value) {
-      value = Math.max(this.min, value);
-      value = Math.min(this.max, value);
+      if (Number.isNaN(value)) {
+        value = this.min;
+      } else {
+        value = Math.max(this.min, value);
+        value = Math.min(this.max, value);
+      }
+
       return value;
     },
     handleInputChange(event) {
diff --git a/test/unit/specs/stepper.js b/test/unit/specs/stepper.js
index 7362d6a4f..9da978e63 100644
--- a/test/unit/specs/stepper.js
+++ b/test/unit/specs/stepper.js
@@ -60,6 +60,17 @@ describe('Stepper', () => {
     });
   });
 
+  it('only disable stepper input', () => {
+    wrapper = mount(Stepper, {
+      propsData: {
+        disableInput: true
+      }
+    });
+
+    const input = wrapper.find('.van-stepper__input')[0];
+    expect(input.hasAttribute('disabled', 'disabled')).to.be.true;
+  });
+
   it('update stepper value use v-model', (done) => {
     wrapper = mount(Stepper, {
       propsData: {
@@ -96,7 +107,14 @@ describe('Stepper', () => {
     wrapper.vm.$nextTick(() => {
       expect(wrapper.vm.currentValue).to.equal(30);
       expect(eventStub.calledWith('input'));
-      done();
+
+      // value设置非数字时，则使用设置的最小值（默认1）
+      wrapper.vm.value = 'abc';
+      wrapper.update();
+      wrapper.vm.$nextTick(() => {
+        expect(wrapper.vm.currentValue).to.equal(1);
+        done();
+      });
     });
   });