OrderCoupon: rename to Coupon

packages/coupon-cell/index.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="van-order-coupon">
+  <div class="van-coupon-cell">
     <van-cell-group>
-      <van-cell title="优惠" :isLink="editable" @click="$emit('click')">
+      <van-cell :title="title" :isLink="editable" @click="$emit('click')">
         <div v-if="coupons[chosenCoupon]">
           <h2>{{ amount }}</h2>
           <span>{{ coupons[chosenCoupon].condition }}</span>
@@ -17,7 +17,7 @@ import Cell from '../cell';
 import CellGroup from '../cell-group';
 
 export default {
-  name: 'van-order-coupon',
+  name: 'van-coupon-cell',
 
   components: {
     [Cell.name]: Cell,
@@ -29,6 +29,10 @@ export default {
   },
 
   props: {
+    title: {
+      type: String,
+      default: '优惠'
+    },
     coupons: {
       type: Array,
       default: () => []

packages/coupon-list/Item.vue

@@ -1,17 +1,17 @@
 <template>
-  <div :class="['van-order-coupon-coupon', { 'van-order-coupon-coupon--disabled': disabled }]">
-    <div class="van-order-coupon-coupon__head">
-      <div class="van-order-coupon-coupon__lines"></div>
-      <div class="van-order-coupon-coupon__gradient">
+  <div :class="['van-coupon-item', { 'van-coupon-item--disabled': disabled }]">
+    <div class="van-coupon-item__head">
+      <div class="van-coupon-item__lines"></div>
+      <div class="van-coupon-item__gradient">
         <h2 v-html="faceAmount" />
         <p>{{ conditionMessage }}</p>
       </div>
     </div>
-    <div class="van-order-coupon-coupon__body">
+    <div class="van-coupon-item__body">
       <h2>{{ data.name }}</h2>
       <span>{{ validPeriod }}</span>
       <p v-if="disabled && data.reason">{{ data.reason }}</p>
-      <div class="van-order-coupon-coupon__corner" v-if="chosen">
+      <div class="van-coupon-item__corner" v-if="chosen">
         <van-icon name="success" />
       </div>
     </div>
@@ -22,7 +22,7 @@
 import Icon from '../icon';
 
 export default {
-  name: 'van-order-coupon-coupon',
+  name: 'van-coupon-item',
 
   components: {
     [Icon.name]: Icon

packages/coupon-list/index.vue

@@ -1,11 +1,11 @@
 <template>
-  <van-popup v-model="showPopup" position="bottom" class="van-order-coupon-list">
-    <van-cell-group class="van-order-coupon-list__top">
+  <van-popup v-model="showPopup" position="bottom" class="van-coupon-list">
+    <van-cell-group class="van-coupon-list__top">
       <van-field v-model="exchangeCode" :placeholder="inputPlaceholder" :maxlength="20" />
-      <van-button size="small" type="danger" class="van-order-coupon-list__exchange" :disabled="exchangeButtonDisabled || !exchangeCode.length" @click="onClickExchangeButton">{{ exchangeButtonText }}</van-button>
+      <van-button size="small" type="danger" class="van-coupon-list__exchange" :disabled="exchangeButtonDisabled || !exchangeCode.length" @click="onClickExchangeButton">{{ exchangeButtonText }}</van-button>
     </van-cell-group>
-    <div class="van-order-coupon-list__list" ref="list">
-      <van-order-coupon-coupon
+    <div class="van-coupon-list__list" ref="list">
+      <van-coupon-item
         ref="card"
         v-for="(item, index) in coupons"
         :key="item.id || item.name"
@@ -14,27 +14,27 @@
         @click.native="onClickCoupon(index)"
       />
       <h3 v-if="disabledCoupons.length">{{ disabledListTitle }}</h3>
-      <van-order-coupon-coupon
+      <van-coupon-item
         disabled
         v-for="item in disabledCoupons"
         :key="item.id || item.name"
         :data="item"
       />
     </div>
-    <div class="van-order-coupon-list__close van-hairline--top" @click="onClickNotUse">{{ closeButtonText }}</div>
+    <div class="van-coupon-list__close van-hairline--top" @click="onClickNotUse">{{ closeButtonText }}</div>
   </van-popup>
 </template>
 
 <script>
 import Cell from '../cell';
 import CellGroup from '../cell-group';
-import Coupon from './Coupon';
+import Item from './Item';
 import Field from '../field';
 import Popup from '../popup';
 import Button from '../button';
 
 export default {
-  name: 'van-order-coupon-list',
+  name: 'van-coupon-list',
 
   components: {
     [Button.name]: Button,
@@ -42,7 +42,7 @@ export default {
     [CellGroup.name]: CellGroup,
     [Field.name]: Field,
     [Popup.name]: Popup,
-    [Coupon.name]: Coupon
+    [Item.name]: Item
   },
 
   model: {

packages/index.js

@@ -10,6 +10,8 @@ import CellSwipe from './cell-swipe';
 import Checkbox from './checkbox';
 import CheckboxGroup from './checkbox-group';
 import Col from './col';
+import CouponCell from './coupon-cell';
+import CouponList from './coupon-list';
 import DatetimePicker from './datetime-picker';
 import DeepSelect from './deep-select';
 import Dialog from './dialog';
@@ -24,8 +26,6 @@ import InvalidGoods from './invalid-goods';
 import Lazyload from './lazyload';
 import Loading from './loading';
 import NoticeBar from './notice-bar';
-import OrderCoupon from './order-coupon';
-import OrderCouponList from './order-coupon-list';
 import OrderGoods from './order-goods';
 import Panel from './panel';
 import PayOrder from './pay-order';
@@ -65,6 +65,8 @@ const components = [
   Checkbox,
   CheckboxGroup,
   Col,
+  CouponCell,
+  CouponList,
   DatetimePicker,
   DeepSelect,
   ExpressWay,
@@ -76,8 +78,6 @@ const components = [
   InvalidGoods,
   Loading,
   NoticeBar,
-  OrderCoupon,
-  OrderCouponList,
   OrderGoods,
   Panel,
   PayOrder,
@@ -130,6 +130,8 @@ export {
   Checkbox,
   CheckboxGroup,
   Col,
+  CouponCell,
+  CouponList,
   DatetimePicker,
   DeepSelect,
   Dialog,
@@ -144,8 +146,6 @@ export {
   Lazyload,
   Loading,
   NoticeBar,
-  OrderCoupon,
-  OrderCouponList,
   OrderGoods,
   Panel,
   PayOrder,

packages/vant-css/src/coupon.css

@@ -1,7 +1,7 @@
 @import './common/var.css';
 @import "./mixins/ellipsis.css";
 
-.van-order-coupon {
+.van-coupon {
   &-list {
     height: 100%;
     background-color: $background-color;
@@ -57,7 +57,7 @@
         }
       }
 
-      .van-order-coupon-card + h3 {
+      .van-coupon-item + h3 {
         margin-top: 30px;
       }
     }
@@ -74,7 +74,7 @@
     }
   }
 
-  &-coupon {
+  &-item {
     display: flex;
     height: 100px;
     margin: 0 15px 10px;
@@ -176,11 +176,11 @@
     }
 
     &--disabled {
-      .van-order-coupon-coupon__lines {
+      .van-coupon-item__lines {
         background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAADICAMAAAC3WLNTAAAAWlBMVEUAAACqrremq7Oqv7+mq7Wqqr+rsLeprreqsrmqrralq7SkqbKrsbikqLGqwNWqrrmrr7mkqbGrsbijqLGnq7SssrimrLKlqrOnrLWprraqr7ekqbKrsLijqLGfTYl9AAAAF3RSTlMAN5oMQgya5kJC5uaSkgZC8/PV1b0rK6hQU+kAAASjSURBVFjDfZlJduMwDESZntJDeh5sUdb9r9kuA+AXA0iIIi/8X6FYALNJU/19+fWj3/pNT1V35NvLratgMvTtjxH+1NBLt7rLHbb7OwhVrSUhKQhz7z1Dv6xZoLWnH70vg5ESINDedkg5BrR0yrGs9Pbpw21SqxNvH593YsN+30OibhwvaQXUPgghVH1m6EkAXK30VllB+UeCMG7OmCPtlk5exN6TcWsRv0UE/aG0GIKxMsycfB9j6QgZwn7FgO/AYhSFq+7Q4hBgyMT9kJKkkhJiriTEuoKACereTw+Y98LTsDVvKdenDWAW6gh1lNwTGHvjEGGhRre+U3J0iKGGknl7zeCJjoBCDPQBBxXhY94WwlYFuXLQTfW979LKYKzvECKH3aLGRSCFnnPwK7UPi8VZ7IRAGH+9X9w7iv0a3GvjZG+F8Y8LRRS0fMQ0hUn0o2ws1wEB7tJqV4iEDKVlgZo5bDWYPQWiVzNmNCX2CMo9XSutziEFoTRjRNqkAwBBqBGBvSpMpEVwrXLgr9Gidi511FaQSZVASO2VkJqxRQPefw3GbX2syqdnqdEy2bd7F77qWRvU3ggp09LDvUMmu/crJVN+wlRA9CrG4+0eadmTteLeScW0/De3+zSEljIpD3Mx53WoGssbfQfgrwm6Un5EgAJCL0MAQ2r4AkoYzoBgBnbuiREilSGLw/YLpUuSChBjKAGltIBSzxDKUOpVQYbEx27ABTYiEOurUjvSi6V7V0ihxb3LqbNfXARqRvdXqmb8fgyI8eSNqNst834l41mNe1f1G38EHzE9w8ycZW5juVzEwCHl7S5CqJJrd0Sci9VUM8CcJ843qwnBVFUGCamJBU+OGVsEKsiYE18egQllJSLA1ZF3Nx6uyoYonRwRJbBM+oANtY6pbFU+iwBMp/R7x/dZa6yvGELVZ4aeRliEn6C3QlDzvgnyIvS6HYWpZJxQzRQUEYC5fTDCpFjleLf3jGWvhTG2oKKoBHEA2tZK1gxPpdC8XzXELosBOsIeYDsEEMpKOXugGjG1MyUW9VgJBqWC88cGfJKCgazKETiW7jhOFeubigvNRTjbGIPeFwRJAB1T3LvTwviJFhGshxRhnjl/jGVd0Sk9rUKoGroj4s7EtE/x9aqnhqQRptYzTysqJ578dQIZ475OIvATnhlfcVVjzZFwFXCthNipUo0xYHpVjK3KFxcTk8FYujuB0Hq0vkgJ0WeGnggrjYcrRRCRfwENBk+53SbEQUxl43ZAY48jwDvhz2GqAMuxbPcfPbF/Q4gBb5teoQMFtN0rkE3AiAqw6euBccRaaRMK5kccSsIQYmeMNUiAYU5iC08BGAGAkCBvuEZa+Wq0Gclh6SWl4X1Ogt1pmwMg2/6MYvCkj30/5mgDXi1PDrmNQxpoqxJCSCE3lk4KKdRLjDvWdwPAfQQ6LgJHnPK0CPxK2fnQA1MBCaDZ/oS0A4v9oty4MajNgVoEG7UOMaIgTJy7LZzHWGBWA+FswBTctMsZYr+AfpbAHFb7XQiZScy3rxliFfzd/h06wlY7kJp86d+FGTEhlO4UWgU6Bvzv6++fmWGE/wHKk5MgoCYAjwAAAABJRU5ErkJggg==');
       }
 
-      .van-order-coupon-coupon__gradient {
+      .van-coupon-item__gradient {
         background-image: linear-gradient(45deg, #a4a9b2, #b7bcc3);
       }
     }

packages/vant-css/src/index.css

@@ -41,13 +41,15 @@
 @import './pull-refresh.css';
 @import './toast.css';
 
+/* high order components */
+@import './switch-cell.css';
+
 /* business components */
 @import './deep-select.css';
 @import './express-way.css';
 @import './goods-action.css';
 @import './invalid-goods.css';
 @import './notice-bar.css';
-@import './order-coupon.css';
+@import './coupon.css';
 @import './order-goods.css';
 @import './pay-order.css';
-@import './switch-cell.css';