添加订单确认页 -- reviewed by jinyou

@@ -35,6 +35,7 @@ class App extends Component {
 			'pages/orderList/index',
 			'pages/nativeTest/nativeTest',
 			'pages/userCenter/collection/collection',
+      'pages/order/orderConfirm/orderConfirm',
 		],
 		window: {
 			backgroundTextStyle: 'light',

@@ -19,6 +19,7 @@ export default class SelectSize extends Component {
 
         this.state = {
             curSelect: '',
+            selectedskup: 0,
             canBuy: true,
             curPrice: '',
             hide: false
@@ -32,6 +33,7 @@ export default class SelectSize extends Component {
     onChangeSize(item) {
         this.setState({
             curSelect: item.size_id,
+            selectedskup: item.skup,
             curPrice: item.sell_least_price,
             canBuy: item.storage_num > 0
         });
@@ -43,6 +45,12 @@ export default class SelectSize extends Component {
         showSizeBox(false);
     }
 
+    onClickBuy() {
+      Taro.navigateTo({
+        url: `/pages/order/orderConfirm/orderConfirm?skup=${this.state.selectedskup}`,
+      })
+    }
+
     render() {
         let {sizeList} = this.props;
         let curSelect = this.state.curSelect;
@@ -77,7 +85,7 @@ export default class SelectSize extends Component {
                         </View>
                     }
 
-                    <Button className={this.state.canBuy ? 'buy-btn' : 'buy-btn disabled'} hover-class='none'>
+                    <Button className={this.state.canBuy ? 'buy-btn' : 'buy-btn disabled'} hover-class='none' onClick={this.onClickBuy}>
                         购买
                         {
                             this.state.canBuy && this.state.curPrice &&
@@ -88,4 +96,4 @@ export default class SelectSize extends Component {
             </View>
         )
     }
-}
\ No newline at end of file
+}

+/**
+ * addressCell.js
+ *@author dennis
+ *@createtime 2018/10/26
+ *@description 地址选择及展示
+ */
+
+Component({
+  properties: {//属性值可以在组件使用时指定
+    hasAddress: {
+      type:Boolean,
+      value: false
+    },
+    userName: {
+      type: String,
+      value: ''
+    },
+    addressDetail: {
+      type: String,
+      value: ''
+    },
+    userPhone: {
+      type: String,
+      value: ''
+    }
+  },
+  data: {//组件内部数据
+    addressIcon: '../../../../assets/images/noad@2x.png',
+    noAddressText: '添加地址',
+  },
+
+  created(options) {
+  },
+
+  ready() {
+    console.log(this.properties)
+  },
+
+  methods: {
+    chooseAddress: function(){
+    }
+  }
+
+})

+{
+  "component": true
+}

+<view wx:if="{{hasAddress}}">
+  <view class="addressHasItem"  bindtap="chooseAddress">
+    <view class="addressHasIconContainer">
+      <image class="addressHasIcon" src="{{addressIcon}}"></image>
+    </view>
+    <view class="addressRightContainer">
+      <text class="addressUserName">{{userName}}</text>
+      <text class="addressUserAddress">{{addressDetail}}</text>
+      <text class="addressUserPhone">{{userPhone}}</text>
+    </view>
+  </view>
+
+</view>
+
+<view wx:else>
+<view class="addressNoItem" bindtap="chooseAddress">
+  <image class="addressIcon" src="{{addressIcon}}"></image>
+  <text class="addressNoText">{{noAddressText}}</text>
+</view>
+</view>
+

+.addressIcon {
+  width: 40rpx;
+  height: 40rpx;
+}
+
+.addressNoText {
+  font-size:40rpx;
+  font-family: PingFang-SC-Medium;
+  color: #000000;
+
+}
+
+.addressNoItem {
+
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+}
+
+.addressHasIconContainer {
+  width: 40rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 40rpx;
+}
+
+.addressHasIcon {
+  width: 40rpx;
+  height: 40rpx;
+}
+
+.addressUserName {
+  font-family: DINAlternate-Bold;
+  font-size: 32rpx;
+  color: #000000;
+  letter-spacing: 0;
+  display: block;
+}
+
+.addressUserAddress {
+  font-family: PingFang-SC-Regular;
+  font-size: 24rpx;
+  color: #999999;
+  letter-spacing: 0;
+  display: block;
+}
+
+.addressUserPhone {
+  font-family: SFProText-Medium;
+  font-size: 28rpx;
+  color: #000000;
+  letter-spacing: 0;
+  display: block;
+}
+
+.addressRightContainer {
+  overflow: auto;
+}
+
+.addressHasItem {
+  overflow: hidden;
+  display: flex;
+  flex-direction: row;
+}

+/**
+ * payDeliveryCell.js
+ *@author dennis
+ *@createtime 2018/10/29
+ *@description
+ */
+
+Component({
+    properties: {//属性值可以在组件使用时指定
+      deliveryWay: {
+        type: Object,
+        value: {}
+      },
+      paymentWay: {
+        type: Object,
+        value: {}
+      }
+    },
+    data: {//组件内部数据
+      paytLabel: '支付方式：',
+      deliveryLabel: '配送方式：',
+    },
+
+    methods: {
+        //一个自定义方法
+        customMethod: function () {
+
+        }
+    }
+
+})

+{
+  "component": true
+}

+<view class="payDeliveryContainer">
+  <view class="payContainer">
+    <text class="text">{{paytLabel}}</text>
+    <text class="text">{{paymentWay.paymentTypeName}}</text>
+  </view>
+  <view class="deliveryContainer">
+    <text class="text">{{deliveryLabel}}</text>
+    <text class="text">{{deliveryWay.deliveryWayName}}</text>
+  </view>
+</view>

+.payDeliveryContainer {
+  padding-top: 40rpx;
+  padding-bottom: 40rpx;
+
+}
+
+.payContainer {
+  display: block;
+}
+
+.deliveryContainer {
+  display: block;
+  margin-top: 20rpx;
+}
+
+.text {
+  font-family: PingFang-SC-Regular;
+  font-size: 28rpx;
+  color: #000000;
+  letter-spacing: 0;
+}

+/**
+ * priceCell.js
+ *@author dennis
+ *@createtime 2018/10/26
+ *@description 价格构成展示
+ */
+
+Component({
+    properties: {//属性值可以在组件使用时指定
+      promotionFormulaList: {
+        type: Array,
+        value:[]
+      },
+      damagesDesc: {
+        type: String,
+        value:''
+      }
+    },
+    data: {//组件内部数据
+      productPriceLabel:'商品金额：',
+      transportPriceLabel: '运费：',
+      allPriceLabel: '实付金额：',
+    },
+  ready() {
+    console.log(this.properties)
+  },
+    methods: {
+        //一个自定义方法
+        customMethod: function () {
+
+        }
+    }
+
+})

+{
+  "component": true
+}

+<view class="priceCellContainer">
+  <view class="priceItem" wx:for="{{promotionFormulaList}}" wx:key="">
+    <text class="priceLeft">{{item.promotion}}：</text>
+    <text class="{{item.promotion=='实付金额' ? 'priceRightTwo': 'priceRight'}}">{{item.promotionAmount}}</text>
+  </view>
+  <view>
+    <text class="priceInfo">{{damagesDesc}}</text>
+  </view>
+</view>

+.priceCellContainer {
+  padding-top: 40rpx;
+  padding-bottom: 40rpx;
+  border-bottom: 1px solid  #EEEEEE;
+}
+
+.priceItem {
+  margin-bottom: 20rpx;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.priceLeft {
+  font-family: PingFang-SC-Regular;
+  font-size: 28rpx;
+  color: #000000;
+  letter-spacing: 0;
+}
+
+.priceRight {
+  font-family: SFProText-Regular;
+  font-size: 28rpx;
+  color: #000000;
+  letter-spacing: 0;
+  text-align: right;
+}
+
+.priceRightTwo {
+  font-family: SFProText-Regular;
+  font-size: 36rpx;
+  color:  #D0021B;
+  letter-spacing: 0;
+  text-align: right;
+}
+
+
+.priceInfo {
+  font-family: PingFang-SC-Regular;
+  font-size: 24rpx;
+  color: #999999;
+  letter-spacing: 0;
+}
+

+/**
+ * productCell.js
+ *@author dennis
+ *@createtime 2018/10/26
+ *@description 商品信息展示
+ */
+
+Component({
+    properties: {//属性值可以在组件使用时指定
+      productInfo: {
+        type:Object,
+        value: {
+
+        }
+      }
+    },
+    data: {//组件内部数据
+    },
+
+    methods: {
+        //一个自定义方法
+        customMethod: function () {
+
+        }
+    }
+
+})

+{
+  "component": true
+}

+<view class="productContainer">
+  <view class="productImageContainer">
+    <image class="productImage" src="{{productInfo.goodImg}}"></image>
+  </view>
+  <view class="productRightContainer">
+    <text class="productPrice">￥{{productInfo.goodPrice}}</text>
+    <text class="productName">{{productInfo.productName}}</text>
+    <text class="productColor">{{productInfo.colorName + '，' + productInfo.sizeName}}</text>
+  </view>
+</view>

+.productContainer {
+  display: flex;
+  flex-direction: row;
+  padding-top: 40rpx;
+  padding-bottom: 40rpx;
+  border-bottom: 1px solid #EEEEEE;
+  border-top: 1px solid #EEEEEE;
+}
+
+.productImageContainer {
+ display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 20rpx;
+  width: 180rpx;
+}
+
+.productImage {
+  width: 180rpx;
+  height: 180rpx;
+}
+
+.productRightContainer {
+
+}
+
+.productPrice {
+  font-family: DINAlternate-Bold;
+  font-size: 28rpx;
+  color: #D0021B;
+  letter-spacing: 0;
+  display: block;
+}
+
+.productName {
+  font-family: SFProText-Regular;
+  font-size: 24rpx;
+  color: #999999;
+  letter-spacing: 0;
+  line-height: 36rpx;
+  margin-top: 12rpx;
+  display: block;
+}
+
+.productColor {
+  font-family: PingFang-SC-Medium;
+  font-size: 24rpx;
+  color: #000000;
+  letter-spacing: 0;
+  margin-top: 30px;
+  display: block;
+}
+

+/**
+ * orderConfirm.js
+ *@author dennis
+ *@createtime 2018/10/26
+ *@description 订单支付确认界面
+ */
+
+Page({
+
+  data: {
+    productInfo: {
+      "colorId": 1,
+      "colorName": "红色",
+      "goodImg": "http://img11.static.yhbimg.com/goodsimg/2018/10/18/17/01699014e8981a532f27abc74730e40bbd.jpg?imageMogr2/thumbnail/90x90/background/d2hpdGU=/position/center/quality/80",
+      "goodPrice": "9.00",
+      "productName": "Air Jordan XX9 Low “Chicago Bulls”",
+      "sizeId": 2,
+      "sizeName": "M111",
+      "skup": 1468
+    },
+    "damagesDesc": "如卖家原因导致交易失败，您将获得赔偿金¥0.80元",
+    "promotionFormulaList": [{
+      "promotion": "商品金额",
+      "promotionAmount": "¥9.00"
+    }, {
+      "promotion": "运费",
+      "promotionAmount": "+ ¥0.0"
+    }, {
+      "promotion": "实付金额",
+      "promotionAmount": "¥9.00"
+    }],
+    "deliveryWay": {
+      "deliveryWayCost": "¥0.0",
+      "deliveryWayId": 2,
+      "deliveryWayName": "顺丰速运"
+    },
+    "paymentWay": {
+      "paymentType": 1,
+      "paymentTypeName": "在线支付"
+    },
+    payLabel: '待支付：',
+    payButton: '去支付',
+    amount: '9.00',
+
+  },
+  onLoad: function (option) {
+    console.log(option)
+  }
+})

+{
+  "navigationBarBackgroundColor": "#ffffff",
+  "navigationBarTitleText": "确认订单",
+  "usingComponents": {
+    "addressCell": "./components/addressCell",
+    "productCell": "./components/productCell",
+    "priceCell": "./components/priceCell",
+    "payDeliveryCell": "./components/payDeliveryCell"
+  }
+}

+<view class="orderContainer">
+  <scroll-view scroll-x="false">
+    <addressCell hasAddress="{{true}}" userName="{{'哇哈哈'}}" addressDetail="{{'江苏省南京市建邺区嘉陵江东街国家广告产业园5栋17楼yoho有货'}}" userPhone="{{'1521045443'}}"></addressCell>
+    <productCell productInfo="{{productInfo}}"></productCell>
+    <priceCell promotionFormulaList="{{promotionFormulaList}}" damagesDesc="{{damagesDesc}}"></priceCell>
+    <payDeliveryCell paymentWay="{{paymentWay}}" deliveryWay="{{deliveryWay}}"></payDeliveryCell>
+  </scroll-view>
+</view>
+
+<view class="payBottomContainer">
+<view class="payBottomLeft">
+  <view class="payBottomLeftItem">
+    <text class="payLabel">{{payLabel}}</text>
+    <text class="payAmount">￥{{amount}}</text>
+  </view>
+</view>
+<view class="payBottomRight">
+  <text class="payButton">{{payButton}}</text>
+</view>
+
+</view>

+.orderContainer {
+  margin-left: 40rpx;
+  margin-right: 40rpx;
+
+}
+
+.payBottomContainer {
+  position: absolute;
+  bottom: 0;
+  height: 120rpx;
+  border-top: 1px solid #EEEEEE;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin-left: 0;
+  margin-right: 0;
+  bottom: 0;
+  width: 100%;
+}
+
+.payBottomLeft {
+ display: flex;
+  align-items: center;
+  overflow: auto;
+}
+
+.payBottomLeftItem {
+  margin-left: 40rpx;
+}
+
+.payLabel {
+  font-family: PingFang-SC-Regular;
+  font-size: 24rpx;
+  color: #000000;
+  letter-spacing: 0;
+}
+
+.payAmount {
+  font-family: DINAlternate-Bold;
+  font-size: 36rpx;
+  color: #000200;
+  letter-spacing: 0;
+  line-height: 25px;
+}
+
+.payBottomRight {
+  background: #002B47;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 300rpx;
+}
+
+.payButton {
+  font-family: PingFang-SC-Semibold;
+  font-size: 35rpx;
+  color: #FFFFFF;
+  letter-spacing: 0;
+}