[bugfix] Sku button border radius (#378)

docs/demos/views/sku.vue

@@ -42,13 +42,9 @@
           <!-- 自定义sku actions -->
           <template slot="sku-actions" slot-scope="props">
             <div class="van-sku-actions">
-              <button class="van-sku__add-cart-btn" @click="handlePointClicked">
+              <van-button bottomAction @click="handlePointClicked">积分兑换</van-button>
-                积分兑换
-              </button>
               <!-- 直接触发sku内部事件，通过内部事件执行handleBuyClicked回调 -->
-              <button class="van-sku__buy-btn" @click="props.skuEventBus.$emit('sku:buy')">
+              <van-button type="primary" bottomAction @click="props.skuEventBus.$emit('sku:buy')">买买买</van-button>
-                买买买
-              </button>
             </div>
           </template>
         </van-sku>

docs/markdown/en-US/sku.md

@@ -49,13 +49,9 @@ Vue.component(Sku.name, Sku);
   <!-- 自定义sku actions -->
   <template slot="sku-actions" slot-scope="props">
     <div class="van-sku-actions">
-      <button class="van-sku__add-cart-btn" @click="handlePointClicked">
+      <van-button bottomAction @click="handlePointClicked">积分兑换</van-button>
-        积分兑换
-      </button>
       <!-- 直接触发sku内部事件，通过内部事件执行handleBuyClicked回调 -->
-      <button class="van-sku__buy-btn" @click="props.skuEventBus.$emit('sku:buy')">
+      <van-button type="primary" bottomAction @click="props.skuEventBus.$emit('sku:buy')">买买买</van-button>
-        买买买
-      </button>
     </div>
   </template>
 </van-sku>

docs/markdown/zh-CN/button.md

@@ -58,14 +58,14 @@ Vue.component(Button.name, Button);
 #### 页面底部操作按钮
 
 ```html 
-<van-button type="primary" bottom-action>按钮</van-button>
+<van-button type="primary" bottomAction>按钮</van-button>
 
 <van-row>
   <van-col span="12">
-    <van-button bottom-action>按钮</van-button>
+    <van-button bottomAction>按钮</van-button>
   </van-col>
   <van-col span="12">
-    <van-button type="primary" bottom-action>按钮</van-button>
+    <van-button type="primary" bottomAction>按钮</van-button>
   </van-col>
 </van-row>
 ```

docs/markdown/zh-CN/sku.md

@@ -49,13 +49,9 @@ Vue.component(Sku.name, Sku);
   <!-- 自定义sku actions -->
   <template slot="sku-actions" slot-scope="props">
     <div class="van-sku-actions">
-      <button class="van-sku__add-cart-btn" @click="handlePointClicked">
+      <van-button bottomAction @click="handlePointClicked">积分兑换</van-button>
-        积分兑换
-      </button>
       <!-- 直接触发sku内部事件，通过内部事件执行handleBuyClicked回调 -->
-      <button class="van-sku__buy-btn" @click="props.skuEventBus.$emit('sku:buy')">
+      <van-button type="primary" bottomAction @click="props.skuEventBus.$emit('sku:buy')">买买买</van-button>
-        买买买
-      </button>
     </div>
   </template>
 </van-sku>

packages/sku/components/SkuActions.vue

@@ -1,18 +1,20 @@
 <template>
   <div class="van-sku-actions">
-    <button v-if="showAddCartBtn" class="van-sku__add-cart-btn" @click="onAddCartClicked">
+    <van-button v-if="showAddCartBtn" bottomAction @click="onAddCartClicked">加入购物车</van-button>
-      加入购物车
+    <van-button type="primary" bottomAction @click="onBuyClicked">{{ buyText }}</van-button>
-    </button>
-    <button class="van-sku__buy-btn" @click="onBuyClicked">
-      {{ buyText }}
-    </button>
   </div>
 </template>
 
 <script>
+import Button from '../../button';
+
 export default {
   name: 'van-sku-actions',
 
+  components: {
+    [Button.name]: Button
+  },
+
   props: {
     skuEventBus: Object,
     showAddCartBtn: Boolean,

packages/vant-css/src/sku.css

@@ -174,35 +174,7 @@
 
   /* sku actions */
   &-actions {
+    display: flex;
     margin-top: 10px;
-    font-size: 0;
-  }
-
-  &__add-cart-btn {
-    width: 50%;
-    height: 50px;
-    padding: 0;
-    border: 0;
-    background: #f85;
-    color: $white;
-    font-size: 16px;
-    line-height: 50px;
-    text-align: center;
-
-    & + .van-sku__buy-btn {
-      width: 50%;
-    }
-  }
-
-  &__buy-btn {
-    width: 100%;
-    height: 50px;
-    padding: 0;
-    border: 0;
-    background: $red;
-    color: $white;
-    font-size: 16px;
-    line-height: 50px;
-    text-align: center;
   }
 }

test/unit/specs/sku.spec.js

@@ -82,8 +82,8 @@ describe('Sku', (done) => {
 
     const buyCallback = sinon.spy();
     const addCartCallback = sinon.spy();
-    const buyBtn = wrapper.find('.van-sku__buy-btn')[0];
+    const buyBtn = wrapper.find('.van-button--bottom-action')[1];
-    const addCartBtn = wrapper.find('.van-sku__add-cart-btn')[0];
+    const addCartBtn = wrapper.find('.van-button--bottom-action')[0];
     wrapper.vm.$on('buy-clicked', buyCallback);
     wrapper.vm.$on('add-cart', addCartCallback);
 
@@ -187,7 +187,7 @@ describe('Sku', (done) => {
       }
     });
 
-    const buyBtn = wrapper.find('.van-sku__buy-btn')[0];
+    const buyBtn = wrapper.find('.van-button--bottom-action')[0];
     const skuMessages = wrapper.find('.van-sku-messages')[0];
     const inputs = skuMessages.find('input');
     const textarea = skuMessages.find('textarea')[0];
@@ -272,7 +272,7 @@ describe('Sku', (done) => {
       }
     });
 
-    const buyBtn = wrapper.find('.van-sku__buy-btn')[0];
+    const buyBtn = wrapper.find('.van-button--bottom-action')[0];
 
     wrapper.vm.$nextTick(() => {
       buyBtn.trigger('click');