Merge branch 'dev' into feature/sku_migration

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/express-way/Option.vue

@@ -1,32 +0,0 @@
-<template>
-  <van-cell class="van-express-way-option" @click="$emit('change')">
-    <van-radio :name="data.express_type" :value="currentExpressWay" />
-    <div class="van-express-way-option__content">
-      <h3 class="van-express-way-option__title">
-        <span>{{ data.postage_title }}</span>
-        <span>{{ data.postage }}</span>
-      </h3>
-      <p>{{ data.postage_desc }}</p>
-      <div class="van-express-way-option__warn" v-if="data.postage_warn_desc">{{ data.postage_warn_desc }}</div>
-    </div>
-  </van-cell>
-</template>
-
-<script>
-import Cell from '../cell';
-import Radio from '../radio';
-
-export default {
-  name: 'van-express-way-option',
-
-  components: {
-    [Cell.name]: Cell,
-    [Radio.name]: Radio
-  },
-
-  props: {
-    data: Object,
-    currentExpressWay: Number
-  }
-};
-</script>

packages/express-way/index.vue

@@ -1,100 +0,0 @@
-<template>
-  <van-cell class="van-express-way">
-    <van-actionsheet v-if="computedEditable" v-model="showActionsheet" :title="actionsheetTitle" >
-      <van-cell-group>
-        <van-express-way-option
-          v-for="(item, index) in computedList"
-          :key="item.express_type"
-          :data="item"
-          :currentExpressWay="value"
-          @change="onSelectExpressWay(item, index)"
-        />
-      </van-cell-group>
-    </van-actionsheet>
-    <van-cell :title="cellTitle" :isLink="computedEditable" @click="showActionsheet = computedEditable">
-      <p class="van-express-way__fee">{{ currentOption.postage }}</p>
-      <p class="van-express-way__type">{{ currentOption.postage_title }}</p>
-    </van-cell>
-  </van-cell>
-</template>
-
-<script>
-import Option from './Option';
-import Cell from '../cell';
-import CellGroup from '../cell-group';
-import Actionsheet from '../actionsheet';
-
-export default {
-  name: 'van-express-way',
-
-  components: {
-    [Option.name]: Option,
-    [Cell.name]: Cell,
-    [CellGroup.name]: CellGroup,
-    [Actionsheet.name]: Actionsheet
-  },
-
-  props: {
-    value: {
-      type: Number,
-      required: true
-    },
-    expressList: {
-      type: Array,
-      required: true
-    },
-    cellTitle: {
-      type: String,
-      default: '配送方式'
-    },
-    actionsheetTitle: {
-      type: String,
-      default: '配送方式'
-    },
-    editable: {
-      type: Boolean,
-      default: true
-    }
-  },
-
-  data() {
-    return {
-      showActionsheet: false
-    };
-  },
-
-  computed: {
-    computedList() {
-      return this.expressList.map(item => ({
-        ...item,
-        postage: this.calcPostage(item.postage)
-      }));
-    },
-
-    computedEditable() {
-      return this.expressList && this.expressList.length >= 2 && this.editable;
-    },
-
-    currentOption() {
-      for (let i = 0; i < this.computedList.length; i++) {
-        if (this.computedList[i].express_type === this.value) {
-          return this.computedList[i];
-        }
-      }
-      return {};
-    }
-  },
-
-  methods: {
-    onSelectExpressWay(item, index) {
-      this.showActionsheet = false;
-      this.$emit('input', item.express_type);
-      this.$emit('change', item, index);
-    },
-
-    calcPostage(postage) {
-      return postage === 0 ? '免运费' : '¥' + (postage / 100).toFixed(2);
-    }
-  }
-};
-</script>

packages/index.js

@@ -10,37 +10,34 @@ 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';
-import ExpressWay from './express-way';
 import Field from './field';
 import GoodsAction from './goods-action';
 import GoodsActionBigBtn from './goods-action-big-btn';
 import GoodsActionMiniBtn from './goods-action-mini-btn';
 import Icon from './icon';
 import ImagePreview from './image-preview';
-import InvalidGoods from './invalid-goods';
 import Lazyload from './lazyload';
 import Loading from './loading';
+import NavBar from './nav-bar';
 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';
 import Picker from './picker';
 import Popup from './popup';
 import Progress from './progress';
 import PullRefresh from './pull-refresh';
-import Quantity from './quantity';
 import Radio from './radio';
 import RadioGroup from './radio-group';
 import Row from './row';
 import Search from './search';
 import Sku from './sku';
 import Step from './step';
+import Stepper from './stepper';
 import Steps from './steps';
+import SubmitBar from './submit-bar';
 import Swipe from './swipe';
 import SwipeItem from './swipe-item';
 import Switch from './switch';
@@ -49,6 +46,7 @@ import Tab from './tab';
 import Tabs from './tabs';
 import Tag from './tag';
 import Toast from './toast';
+import TreeSelect from './tree-select';
 import Uploader from './uploader';
 import Waterfall from './waterfall';
 
@@ -66,34 +64,31 @@ const components = [
   Checkbox,
   CheckboxGroup,
   Col,
+  CouponCell,
+  CouponList,
   DatetimePicker,
-  DeepSelect,
-  ExpressWay,
   Field,
   GoodsAction,
   GoodsActionBigBtn,
   GoodsActionMiniBtn,
   Icon,
-  InvalidGoods,
   Loading,
+  NavBar,
   NoticeBar,
-  OrderCoupon,
-  OrderCouponList,
-  OrderGoods,
   Panel,
-  PayOrder,
   Picker,
   Popup,
   Progress,
   PullRefresh,
-  Quantity,
   Radio,
   RadioGroup,
   Row,
   Search,
   Sku,
   Step,
+  Stepper,
   Steps,
+  SubmitBar,
   Swipe,
   SwipeItem,
   Switch,
@@ -101,6 +96,7 @@ const components = [
   Tab,
   Tabs,
   Tag,
+  TreeSelect,
   Uploader
 ];
 
@@ -132,37 +128,34 @@ export {
   Checkbox,
   CheckboxGroup,
   Col,
+  CouponCell,
+  CouponList,
   DatetimePicker,
-  DeepSelect,
   Dialog,
-  ExpressWay,
   Field,
   GoodsAction,
   GoodsActionBigBtn,
   GoodsActionMiniBtn,
   Icon,
   ImagePreview,
-  InvalidGoods,
   Lazyload,
   Loading,
+  NavBar,
   NoticeBar,
-  OrderCoupon,
-  OrderCouponList,
-  OrderGoods,
   Panel,
-  PayOrder,
   Picker,
   Popup,
   Progress,
   PullRefresh,
-  Quantity,
   Radio,
   RadioGroup,
   Row,
   Search,
   Sku,
   Step,
+  Stepper,
   Steps,
+  SubmitBar,
   Swipe,
   SwipeItem,
   Switch,
@@ -171,6 +164,7 @@ export {
   Tabs,
   Tag,
   Toast,
+  TreeSelect,
   Uploader,
   Waterfall
 };

packages/invalid-goods/Card.vue

@@ -1,30 +0,0 @@
-<template>
-  <div class="van-invalid-goods-card">
-    <div class="van-invalid-goods__thumb">
-      <img :src="item.img_url" />
-      <div class="van-invalid-goods-card__flag">失效</div>
-    </div>
-    <div class="van-invalid-goods-card__content">
-      <div class="van-invalid-goods-card__row">
-        <h4 class="van-invalid-goods-card__title">{{ item.title }}</h4>
-        <span class="van-invalid-goods-card__price">¥{{ item.price }}</span>
-      </div>
-      <div class="van-invalid-goods-card__row">
-        <div class="van-invalid-goods-card__sku">{{ item.sku }}</div>
-        <span  class="van-invalid-goods-card__num">x{{ item.num }}</span>
-      </div>
-      <div class="van-invalid-goods-card__desc">{{ item.unavailable_desc }}</div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'van-invalid-goods-card',
-
-  props: {
-    item: Object
-  }
-};
-</script>
-

packages/invalid-goods/index.vue

@@ -1,78 +0,0 @@
-<template>
-  <div>
-    <div class="van-invalid-goods" @click="showDetail = true">
-      <h3 class="van-invalid-goods__title">{{ title }}</h3>
-      <van-cell-group class="van-invalid-goods__container">
-        <div class="van-invalid-goods__gallery">
-          <div v-for="item in formattedGoods" :key="item.sku_id" class="van-invalid-goods__thumb">
-            <img :src="item.img_url" />
-          </div>
-        </div>
-        <div class="van-invalid-goods__count">
-          <span>共{{ formattedGoods.length }}件</span>
-          <van-icon name="arrow" />
-        </div>
-      </van-cell-group>
-    </div>
-    <van-actionsheet v-model="showDetail" :title="actionsheetTitle">
-      <div class="van-invalid-goods__list">
-        <van-invalid-goods-card  v-for="item in formattedGoods" :key="item.sku_id" :item="item" />
-      </div>
-    </van-actionsheet>
-  </div>
-</template>
-
-<script>
-import Card from './Card';
-import Icon from '../icon';
-import CellGroup from '../cell-group';
-import Actionsheet from '../actionsheet';
-
-export default {
-  name: 'van-invalid-goods',
-
-  components: {
-    [Card.name]: Card,
-    [Icon.name]: Icon,
-    [CellGroup.name]: CellGroup,
-    [Actionsheet.name]: Actionsheet
-  },
-
-  props: {
-    goods: {
-      type: Array,
-      required: true
-    },
-    title: {
-      type: String,
-      default: '以下商品无法一起购买，点击查看原因'
-    },
-    actionsheetTitle: {
-      type: String,
-      default: '以下商品无法一起下单'
-    }
-  },
-
-  data() {
-    return {
-      showDetail: false
-    };
-  },
-
-  methods: {
-    getSkuStr(arr) {
-      return arr.filter(item => item.v).map(item => item.v).join(', ');
-    }
-  },
-
-  computed: {
-    formattedGoods() {
-      return this.goods.map(item => ({
-        ...item,
-        price: parseFloat(item.price / 100, 10).toFixed(2),
-        sku: this.getSkuStr(item.sku)
-      }));
-    }
-  }
-};
-</script>

packages/nav-bar/index.vue

@@ -0,0 +1,38 @@
+<template>
+  <div :class="['van-nav-bar van-hairline--top-bottom', { 'van-nav-bar--fixed': fixed }]">
+    <div class="van-nav-bar__left" @click="$emit('clickLeft')">
+      <slot name="left">
+        <van-icon v-if="leftArrow" class="van-nav-bar__arrow" name="arrow" />
+        <span v-if="leftText" v-text="leftText" class="van-nav-bar__text" />
+      </slot>
+    </div>
+    <div class="van-nav-bar__title">
+      <slot name="title">{{ title }}</slot>
+    </div>
+    <div class="van-nav-bar__right" @click="$emit('clickRight')">
+      <slot name="right">
+        <span v-if="rightText" v-text="rightText" class="van-nav-bar__text" />
+      </slot>
+    </div>
+  </div>
+</template>
+
+<script>
+import Icon from '../icon';
+
+export default {
+  name: 'van-nav-bar',
+
+  components: {
+    [Icon.name]: Icon
+  },
+
+  props: {
+    title: String,
+    leftText: String,
+    rightText: String,
+    leftArrow: Boolean,
+    fixed: Boolean
+  }
+};
+</script>

packages/order-goods/Card.vue

@@ -1,102 +0,0 @@
-<template>
-  <div class="van-order-goods-card van-hairline">
-    <van-card>
-      <div slot="thumb">
-        <img :src="data.img_url" />
-        <span v-if="data.is_present" class="van-order-goods-card__present"></span>
-      </div>
-      <div class="van-card__row" slot="title">
-        <h4 class="van-card__title">{{ data.title }}</h4>
-        <span class="van-card__price">{{ price }}</span>
-      </div>
-      <template slot="desc">
-        <div class="van-card__row">
-          <p class="van-card__desc">{{ desc }}</p>
-          <span class="van-card__num">x {{ data.num }}</span>
-        </div>
-        <div class="van-card__row">
-          <div class="van-order-goods-card__tags">
-            <span v-if="data.is_presale" class="van-order-goods-card__tag-green">预售</span>
-            <span v-if="data.is_period_buy" class="van-order-goods-card__tag-red">周期购</span>
-          </div>
-          <van-button
-            class="van-order-goods-card__message-button"
-            v-if="hasMessage"
-            @click="onClickMessageButton"
-          >
-            查看留言
-          </van-button>
-        </div>
-      </template>
-    </van-card>
-    <van-cell class="van-order-goods-card__delivery van-hairline--top" v-if="data.show_delivery_time" title="发货时间" :value="data.delivery_time" />
-    <van-popup v-if="hasMessage" class="van-order-goods-card__message" v-model="showMessage" position="right">
-      <h2>备注信息</h2>
-      <ul>
-        <li v-for="(value, key) in data.message" class="van-hairline">
-          <label>{{ key }}</label>
-          <a v-if="isURL(value)" :href="value">
-            <img :src="value" />
-          </a>
-          <p v-else>{{ value }}</p>
-        </li>
-      </ul>
-      <div class="van-order-goods-card__button">
-        <van-button size="large" @click="showMessage = false">查看订单详情</van-button>
-      </div>
-    </van-popup>
-  </div>
-</template>
-
-<script>
-import Card from '../card';
-import Cell from '../cell';
-import Button from '../button';
-import Popup from '../popup';
-import { getTotalPrice } from './utils';
-
-export default {
-  name: 'van-order-goods-card',
-
-  components: {
-    [Card.name]: Card,
-    [Cell.name]: Cell,
-    [Popup.name]: Popup,
-    [Button.name]: Button
-  },
-
-  props: {
-    data: {
-      type: Object,
-      required: true
-    }
-  },
-
-  data() {
-    return {
-      showMessage: false
-    };
-  },
-
-  computed: {
-    price() {
-      return getTotalPrice(this.data.pay_price, this.data.points_price);
-    },
-    desc() {
-      return this.data.sku ? this.data.sku.filter(item => item.v).map(item => item.v).join(', ') : '';
-    },
-    hasMessage() {
-      return this.data.message && Object.keys(this.data.message).length;
-    }
-  },
-
-  methods: {
-    onClickMessageButton() {
-      this.showMessage = true;
-    },
-    isURL(value) {
-      return /^\s*http(s)*:\/\/.+/.test(value);
-    }
-  }
-};
-</script>

packages/order-goods/Empty.vue

@@ -1,25 +0,0 @@
-<template>
-  <div class="van-order-goods-empty van-hairline--top">
-    <img :src="icon" />
-    <p>{{ message }}</p>
-    <van-button @click="$emit('clickEmptyButton')">{{ buttonText }}</van-button>
-  </div>
-</template>
-
-<script>
-import Button from '../button';
-
-export default {
-  name: 'van-order-goods-empty',
-
-  components: {
-    [Button.name]: Button
-  },
-
-  props: {
-    icon: String,
-    message: String,
-    buttonText: String
-  }
-};
-</script>

packages/order-goods/Header.vue

@@ -1,26 +0,0 @@
-<template>
-  <div class="van-order-goods-header">
-    <van-icon :name="icon" />
-    <a :href="link">{{ title }}</a>
-    <img v-if="badge" :src="badge" />
-  </div>
-</template>
-
-<script>
-import Icon from '../icon';
-
-export default {
-  name: 'van-order-goods-header',
-
-  components: {
-    [Icon.name]: Icon
-  },
-
-  props: {
-    title: String,
-    icon: String,
-    link: String,
-    badge: String
-  }
-};
-</script>

packages/order-goods/Message.vue

@@ -1,50 +0,0 @@
-<template>
-  <van-cell class="van-order-goods-message" title="买家留言：">
-    <textarea
-      v-if="editable"
-      :value="message"
-      :class="{ 'van-order-goods-message-focused': textareaFocused }"
-      placeholder="点击给商家留言"
-      @focus="textareaFocused = true"
-      @blur="textareaFocused = false"
-      @input="onChange"
-    />
-    <p v-else>{{ message }}</p>
-  </van-cell>
-</template>
-
-<script>
-import Cell from '../cell';
-
-export default {
-  name: 'van-order-goods-message',
-
-  components: {
-    [Cell.name]: Cell
-  },
-
-  props: {
-    message: String,
-    editable: Boolean
-  },
-
-  data() {
-    return {
-      textareaFocused: false
-    };
-  },
-
-  methods: {
-    onChange(event) {
-      this.$emit('change', event.target.value);
-    }
-  },
-
-  created() {
-    // 不可编辑的情况下，默认留言为"无"
-    if (!this.editable && !this.message) {
-      this.$emit('change', '无');
-    }
-  }
-};
-</script>

packages/order-goods/Price.vue

@@ -1,32 +0,0 @@
-<template>
-  <van-cell
-    class="van-order-goods-price"
-    title="合计"
-    :value="totalPrice"
-  />
-</template>
-
-<script>
-import Cell from '../cell';
-import { getTotalPrice } from './utils';
-
-export default {
-  name: 'van-order-goods-price',
-
-  components: {
-    [Cell.name]: Cell
-  },
-
-  props: {
-    price: Number,
-    points: Number,
-    isPoints: Boolean
-  },
-
-  computed: {
-    totalPrice() {
-      return getTotalPrice(this.price, this.points, this.isPoints);
-    }
-  }
-};
-</script>

packages/order-goods/index.vue

@@ -1,114 +0,0 @@
-<template>
-  <van-cell-group class="van-order-goods">
-    <van-order-goods-header
-      :title="shopName"
-      :link="shopLink"
-      :icon="headerIcon"
-      :badge="headerBadge"
-    />
-    <slot name="top"></slot>
-    <van-order-goods-empty
-      v-if="isEmpty"
-      :icon="emptyIcon"
-      :message="emptyMessage"
-      :button-text="emptyButtonText"
-      @clickEmptyButton="$emit('clickEmptyButton')"
-    />
-    <div class="van-order-goods-list">
-      <van-order-goods-card
-        v-for="item in itemList"
-        :data="item"
-        :express-way="expressWay"
-        :key="item.title + item.img_url"
-      />
-    </div>
-    <slot></slot>
-    <template v-if="!isEmpty">
-      <van-order-goods-message v-if="showMessage" :message="message" :editable="messageEditable" @change="onMessageChange" />
-      <van-order-goods-price v-if="showTotalPrice" :price="price" :points="points" />
-    </template>
-    <slot name="bottom"></slot>
-  </van-cell-group>
-</template>
-
-<script>
-import Header from './Header';
-import Empty from './Empty';
-import Message from './Message';
-import Price from './Price';
-import Card from './Card';
-import CellGroup from '../cell-group';
-
-export default {
-  name: 'van-order-goods',
-
-  components: {
-    [Empty.name]: Empty,
-    [Header.name]: Header,
-    [Message.name]: Message,
-    [Price.name]: Price,
-    [Card.name]: Card,
-    [CellGroup.name]: CellGroup
-  },
-
-  model: {
-    prop: 'message'
-  },
-
-  props: {
-    shopName: String,
-    shopLink: String,
-    message: String,
-    price: Number,
-    points: Number,
-    expressWay: String,
-    headerBadge: String,
-    headerIcon: {
-      type: String,
-      default: 'shop'
-    },
-    emptyIcon: {
-      type: String,
-      default: '//b.yzcdn.cn/v2/image/wap/trade/new_order/empty@2x.png'
-    },
-    emptyMessage: {
-      type: String,
-      default: '当前没有可购买的商品，请重新选择'
-    },
-    emptyButtonText: {
-      type: String,
-      default: '返回重新选择'
-    },
-    showMessage: {
-      type: Boolean,
-      default: true
-    },
-    showTotalPrice: {
-      type: Boolean,
-      default: true
-    },
-    messageEditable: {
-      type: Boolean,
-      default: true
-    },
-    itemList: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-
-  computed: {
-    isEmpty() {
-      return this.itemList.length === 0;
-    }
-  },
-
-  methods: {
-    onMessageChange(message) {
-      this.$emit('input', message);
-    }
-  }
-};
-</script>

packages/order-goods/utils.js

@@ -1,13 +0,0 @@
-/**
- * 拼接商品价格（金额和积分）
- */
-export function getTotalPrice(price, points) {
-  const arr = [];
-  if (points) {
-    arr.push(points + '积分');
-  }
-  if (price) {
-    arr.push('¥' + (price / 100).toFixed(2));
-  }
-  return arr.join(' + ');
-}

packages/stepper/index.vue

@@ -1,23 +1,23 @@
 <template>
-  <div class="van-quantity" :class="{ 'van-quantity--disabled': disabled }">
+  <div class="van-stepper" :class="{ 'van-stepper--disabled': disabled }">
     <button
       @click="handleChange('minus')"
-      class="van-quantity__stepper van-quantity__minus"
+      class="van-stepper__stepper van-stepper__minus"
       :class="{
-        'van-quantity__minus--disabled': isMinusDisabled
+        'van-stepper__minus--disabled': isMinusDisabled
       }">
     </button>
     <input
       type="text"
-      class="van-quantity__input"
+      class="van-stepper__input"
       :value="currentValue"
       @input="handleInputChange"
       :disabled="disabled">
     <button
       @click="handleChange('plus')"
-      class="van-quantity__stepper van-quantity__plus"
+      class="van-stepper__stepper van-stepper__plus"
       :class="{
-        'van-quantity__plus--disabled': isPlusDisabled
+        'van-stepper__plus--disabled': isPlusDisabled
       }">
     </button>
   </div>
@@ -25,7 +25,7 @@
 
 <script>
 export default {
-  name: 'van-quantity',
+  name: 'van-stepper',
 
   props: {
     min: {

packages/submit-bar/index.vue

@@ -1,14 +1,14 @@
 <template>
-  <div class="van-pay-order">
-    <div class="van-pay-order__tip" v-show="tip || $slots.tip">
-      <slot name="tip">{{ tip }}</slot>
+  <div class="van-submit-bar">
+    <div class="van-submit-bar__tip" v-show="tip || $slots.tip">
+      {{ tip }}<slot name="tip"></slot>
     </div>
-    <div class="van-pay-order__bar">
-      <div class="van-pay-order__price">
+    <div class="van-submit-bar__bar">
+      <div class="van-submit-bar__price">
         <template v-if="hasPrice">
-          <span class="van-pay-order__price-text">合计：</span>
-          <span class="van-pay-order__price-interger">¥{{ priceInterger }}.</span>
-          <span class="van-pay-order__price-decimal">{{ priceDecimal }}</span>
+          <span class="van-submit-bar__price-text">合计：</span>
+          <span class="van-submit-bar__price-interger">¥{{ priceInterger }}.</span>
+          <span class="van-submit-bar__price-decimal">{{ priceDecimal }}</span>
         </template>
       </div>
       <van-button :type="buttonType" :disabled="disabled" :loading="loading" @click="onSubmit">
@@ -22,7 +22,7 @@
 import Button from '../button';
 
 export default {
-  name: 'van-pay-order',
+  name: 'van-submit-bar',
 
   components: {
     [Button.name]: Button

packages/tree-select/index.vue

@@ -1,26 +1,26 @@
 <template>
-  <div class="van-deep-select" :style="{ height: mainHeight + 'px' }">
-    <div class="van-deep-select__nav">
+  <div class="van-tree-select" :style="{ height: mainHeight + 'px' }">
+    <div class="van-tree-select__nav">
       <div
         v-for="(item, index) in items"
-        class="van-deep-select__nitem"
-        :class="{ 'van-deep-select__nitem--active': mainActiveIndex === index }"
-        @click="onNavClick(index)">
+        class="van-tree-select__nitem"
+        :class="{ 'van-tree-select__nitem--active': mainActiveIndex === index }"
+        @click="$emit('navclick', index)">
         {{ item.text }}
       </div>
     </div>
-    <div class="van-deep-select__content" :style="{ height: itemHeight + 'px' }">
+    <div class="van-tree-select__content" :style="{ height: itemHeight + 'px' }">
       <div
         v-for="item in subItems"
         :key="item.id"
-        class="van-deep-select__item"
-        :class="{ 'van-deep-select__item--active': activeId === item.id }"
+        class="van-tree-select__item"
+        :class="{ 'van-tree-select__item--active': activeId === item.id }"
         @click="onItemSelect(item)">
         {{ item.text }}
         <van-icon
           v-if="activeId === item.id"
           name="success"
-          class="van-deep-select__selected"
+          class="van-tree-select__selected"
         ></van-icon>
       </div>
     </div>
@@ -31,7 +31,7 @@
 import Icon from 'packages/icon';
 
 export default {
-  name: 'van-deep-select',
+  name: 'van-tree-select',
 
   components: {
     'van-icon': Icon
@@ -40,9 +40,7 @@ export default {
   props: {
     items: {
       type: Array,
-      default () {
-        return [];
-      }
+      default: () => []
     },
     mainActiveIndex: {
       type: Number,
@@ -73,12 +71,8 @@ export default {
   },
 
   methods: {
-    onNavClick(index) {
-      this.$emit('navclick', index);
-    },
     onItemSelect(data) {
-      const exportData = Object.assign({}, data);
-      this.$emit('itemclick', exportData);
+      this.$emit('itemclick', { ...data });
     }
   }
 };

packages/vant-css/src/coupon-list.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/express-way.css

@@ -1,60 +0,0 @@
-@import './common/var.css';
-
-.van-express-way {
-  padding: 0;
-
-  &__fee,
-  &__type {
-    color: $gray-darker;
-    line-height: 1.5;
-  }
-
-  &__fee {
-    font-size: 14px;
-  }
-
-  &__type {
-    font-size: 12px;
-  }
-
-  .van-actionsheet__content {
-    max-height: 290px;
-    overflow-y: auto;
-  }
-
-  &-option {
-    position: relative;
-    padding: 14px 15px 14px 0;
-    
-    .van-radio {
-      top: 50%;
-      left: 0;
-      margin-top: -11px;
-      position: absolute;
-    }
-
-    &__content {
-      padding-left: 30px;
-
-      p {
-        color: $gray-dark;
-        font-size: 12px;
-        line-height: 16px;
-      }
-    }
-
-    &__title {
-      span {
-        vertical-align: middle;
-
-        &:first-child {
-          margin-right: 5px;
-        }
-      }
-    }
-
-    &__warn {
-      color: $yellow;
-    }
-  }
-}

packages/vant-css/src/index.css

@@ -12,10 +12,11 @@
 @import './badge.css';
 @import './button.css';
 @import './cell.css';
-@import './cell-swipe.css';
 @import './card.css';
 @import './icon.css';
 @import './loading.css';
+@import './nav-bar.css';
+@import './notice-bar.css';
 @import './popup.css';
 @import './search.css';
 @import './panel.css';
@@ -23,7 +24,7 @@
 @import './tag.css';
 @import './tab.css';
 @import './image-preview.css';
-@import './quantity.css';
+@import './stepper.css';
 @import './progress.css';
 @import './swipe.css';
 
@@ -41,14 +42,13 @@
 @import './pull-refresh.css';
 @import './toast.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 './order-goods.css';
-@import './pay-order.css';
+/* high order components */
+@import './cell-swipe.css';
 @import './switch-cell.css';
+@import './tree-select.css';
+
+/* business components */
+@import './coupon-list.css';
+@import './goods-action.css';
+@import './submit-bar.css';
 @import './sku.css';

packages/vant-css/src/invalid-goods.css

@@ -1,122 +0,0 @@
-@import './common/var.css';
-@import "./mixins/ellipsis.css";
-
-$van-invalid-goods-photo-size: 90px;
-
-.van {
-  &-invalid-goods {
-    margin: 10px 0;
-
-    &__title {
-      color: $gray-dark;
-      font-size: 12px;
-      text-align: center;
-      margin-bottom: 10px;
-    }
-
-    &__container {
-      padding: 5px 10px;
-    }
-
-    &__gallery {
-      overflow: hidden;
-      height: $van-invalid-goods-photo-size;
-    }
-
-    &__thumb {
-      float: left;
-      display: flex;
-      height: 100%;
-      position: relative;
-      margin-right: 5px;
-      align-items: center;
-      justify-content: center;
-
-      img {
-        max-width: $van-invalid-goods-photo-size;
-        max-height: $van-invalid-goods-photo-size;
-      }
-    }
-
-    &__count {
-      position: absolute;
-      top: 0;
-      right: 0;
-      width: 80px;
-      color: $gray-darker;
-      font-size: 14px;
-      padding-right: 8px;
-      line-height: calc($van-invalid-goods-photo-size + 10px);
-      background-color: $white;
-      text-align: right;
-
-      span {
-        margin-right: 6px;
-        vertical-align: middle;
-      }
-    }
-
-    &__list {
-      max-height: 400px;
-      overflow-y: scroll;
-    }
-  }
-
-  &-invalid-goods-card {
-    color: $gray-dark;
-    margin: 10px 0;
-    padding: 5px 10px;
-    background-color: #fafafa;
-    height: $van-invalid-goods-photo-size;
-
-    &__flag {
-      position: absolute;
-      left: 0;
-      top: 70px;
-      width: $van-invalid-goods-photo-size;
-      color: $white;
-      font-size: 12px;
-      line-height: 20px;
-      text-align: center;
-      background-color: rgba(0,0,0,.6);
-    }
-
-    &__content {
-      width: 100%;
-      padding-left: 100px;
-      box-sizing: border-box;
-    }
-
-    &__row {
-      display: flex;
-      line-height: 20px;
-    }
-
-    &__title,
-    &__sku {
-      flex: 1;
-      @mixin multi-ellipsis 2;
-    }
-
-    &__title,
-    &__price {
-      font-size: 14px;
-    }
-
-    &__num,
-    &__sku {
-      font-size: 12px;
-    }
-
-    &__desc {
-      color: $orange;
-      font-size: 12px;
-      margin-top: 5px;
-    }
-  }
-
-  .van-icon-arrow {
-    color: $gray-darker;
-    font-size: 10px;
-  }
-}

packages/vant-css/src/nav-bar.css

@@ -0,0 +1,60 @@
+@import './common/var.css';
+
+.van-nav-bar {
+  height: 46px;
+  position: relative;
+  user-select: none;
+  text-align: center;
+  line-height: 46px;
+  background-color: #fff;
+
+  .van-icon {
+    color: $blue;
+  }
+
+  &__arrow {
+    transform: rotate(180deg);
+
+    + .van-nav-bar__text {
+      margin-left: -20px;
+      padding-left: 25px;
+    }
+  }
+
+  &--fixed {
+    top: 0;
+    left: 0;
+    width: 100%;
+    position: fixed;
+  }
+
+  &__title {
+    font-size: 16px;
+  }
+
+  &__left,
+  &__right {
+    bottom: 0;
+    font-size: 14px;
+    position: absolute;
+  }
+
+  &__left {
+    left: 15px;
+  }
+
+  &__right {
+    right: 15px;
+  }
+
+  &__text {
+    color: $blue;
+    margin: 0 -15px;
+    padding: 0 15px;
+    display: inline-block;
+
+    &:active {
+      background-color: $active-color;
+    }
+  }
+}

packages/vant-css/src/order-goods.css

@@ -1,205 +0,0 @@
-@import './common/var.css';
-
-.van-order-goods {
-  background-color: $white;
-
-  &-card {
-    margin-left: -15px;
-    background-color: #fafafa;
-
-    &:not(:first-child) {
-      &::after {
-        border-top-width: 1px;
-      }
-    }
-
-    &__tags {
-      flex: 1;
-    }
-
-    &__tag-green,
-    &__tag-red {
-      font-size: 10px;
-      padding: 3px 5px;
-      margin-right: 5px;
-      border-radius: 2px;
-      display: inline-block;
-    }
-
-    &__tag-green {
-      color: $white;
-      background-color: $green-wx;
-    }
-
-    &__tag-red {
-      color: $gray;
-      padding: 5px 8px;
-      border: 1px solid $gray;
-    }
-
-    &__delivery {
-      padding-left: 15px;
-      background-color: transparent;
-
-      .van-cell__value {
-        color: $gray-darker;
-      }
-    }
-
-    &__present {
-      top: 0;
-      left: 3px;
-      width: 18px;
-      height: 36px;
-      position: absolute;
-      background: url("https://b.yzcdn.cn/v2/image/wap/trade/confirm/present@2x.png") no-repeat;
-      background-size: 18px 36px;
-    }
-
-    .van-button&__message-button {
-      height: 24px;
-      padding: 0 5px;
-      font-size: 10px;
-      line-height: 22px;
-    }
-
-    &__button {
-      padding: 20px 15px 0;
-      .van-button {
-        height: 40px;
-        line-height: 38px;
-      }
-    }
-
-    &__message {
-      width: 100%;
-      height: 100%;
-      background-color: $background-color;
-
-      h2 {
-        color: $gray-dark;
-        font-size: 12px;
-        line-height: 18px;
-        padding: 5px 0 5px 10px;
-      }
-
-      ul {
-        background-color: $white;
-      }
-
-      p,
-      a,
-      label {
-        font-size: 14px;
-        padding: 14px 0;
-        line-height: 20px;
-        vertical-align: top;
-        display: inline-block;
-      }
-
-      label {
-        color: #c9c9c9;
-        min-width: 90px;
-      }
-
-      li {
-        display: flex;
-        padding: 0 10px;
-
-        &:not(:last-child)::after {
-          border-bottom-width: 1px;
-        }
-
-        img {
-          width: 70px;
-          height: 70px;
-        }
-      }
-    }
-  }
-
-  &-empty {
-    margin-left: -15px;
-    text-align: center;
-
-    p {
-      color: $gray-dark;
-      padding: 0 10px;
-      font-size: 14px;
-      line-height: 20px;
-    }
-
-    img {
-      width: 80px;
-      height: 84px;
-      padding: 15px 0;
-    }
-
-    .van-button {
-      height: 41px;
-      margin: 15px 0;
-      padding: 0 10px;
-      line-height: 39px;
-      border-color: $gray-light;
-    }
-  }
-
-  &-header {
-    line-height: 50px;
-
-    a,
-    img,
-    .van-icon {
-      vertical-align: middle;
-    }
-
-    .van-icon {
-      font-size: 18px;
-      margin-right: 5px;
-    }
-
-    a {
-      color: $text-color;
-      font-size: 14px;
-    }
-
-    img {
-      height: 14px;
-      margin-left: 5px;
-    }
-  }
-
-  &-message {
-    textarea {
-      color: $gray-darker;
-      padding: 0;
-      width: 100%;
-      height: 22px;
-      border: none;
-      resize: none;
-      display: block;
-      font-size: 14px;
-      line-height: 22px;
-      transition: height .3s ease-in-out;
-    }
-
-    textarea&-focused {
-      height: 48px;
-    }
-
-    p {
-      color: $gray-darker;
-      text-align: left;
-    }
-
-    .van-cell__title {
-      width: 75px;
-    }
-  }
-
-  &-price {
-    .van-cell__value {
-      color: $red;
-    }
-  }
-}

packages/vant-css/src/stepper.css

@@ -1,12 +1,12 @@
 @import './common/var.css';
 
-.van-quantity {
+.van-stepper {
   font-size: 0;
 
   &--disabled {
-    .van-quantity__input,
-    .van-quantity__minus,
-    .van-quantity__plus {
+    .van-stepper__input,
+    .van-stepper__minus,
+    .van-stepper__plus {
       border-color: $active-color;
     }
   }

packages/vant-css/src/submit-bar.css

@@ -1,6 +1,6 @@
 @import './common/var.css';
 
-.van-pay-order {
+.van-submit-bar {
   left: 0;
   bottom: 0;
   width: 100%;

packages/vant-css/src/tree-select.css

@@ -2,7 +2,7 @@
 @import "./mixins/clearfix.css";
 @import './common/var.css';
 
-.van-deep-select {
+.van-tree-select {
   user-select: none;
   position: relative;
   @mixin clearfix;