确认订单

app.json

@@ -1,5 +1,6 @@
 {
   "pages": [
+      "pages/order/confirmOrder/confirmOrder",
       "pages/index/index",
       "pages/all/all",
       "pages/cart/cart",

components/existProduct-list/existProduct-list.wxml

@@ -9,7 +9,7 @@
                         <text>¥{{item.price}}</text>
                     </view>
                     <view class="count">
-                        <text class="num">{{item.quantity}}</text>
+                        <text class="num">x{{item.quantity}}</text>
                     </view>
                 </view>
             </view>

pages/order/confirmOrder/confirmOrder.js

@@ -0,0 +1,66 @@
+// pages/order/confirmOrder/confirmOrder.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/order/confirmOrder/confirmOrder.json

@@ -0,0 +1,5 @@
+{
+  "usingComponents": {
+      "existProduct":"/components/existProduct-list/existProduct-list"
+  }
+}

pages/order/confirmOrder/confirmOrder.wxml

@@ -0,0 +1,42 @@
+<!--pages/order/confirmOrder/confirmOrder.wxml-->
+<!-- 地址 -->
+<view class="address">
+    <image class="icon" src="/images/mall/address.png" mode="widthFix"/>
+    <view class="addressInfo">
+        <view class="userInfo">
+          <text>张某某</text>
+          <text>12345678901</text>
+        </view>
+        <text>上海市普陀区金沙江路250弄43号101室</text>
+    </view>
+    <image class="more" src="/images/mall/back.png" mode="widthFix" srcset=""/>
+</view>
+
+<!-- 商品 -->
+<existProduct></existProduct>
+
+<!-- 订单信息 -->
+<view class="orderInfo">
+   <view class="info">
+      <view>
+        <text class="title">配送费</text><text class="value">快递费：￥8.00</text>
+      </view>
+      <view>
+        <text class="value">运险费：￥12.00</text>
+      </view>
+      <view>
+        <text class="title">订单备注</text>
+        <text class="value">无备注</text>
+      </view>
+   </view>
+   <view class="info">
+      <text class="title">商品总件数</text>
+      <text class="value">共5件商品</text>
+   </view>
+   <view class="info">
+      <text class="title">商品总价</text>
+      <text class="value">￥8290.00</text>
+   </view>
+</view>
+
+<button class="submit">确 定</button>

pages/order/confirmOrder/confirmOrder.wxss

@@ -0,0 +1,59 @@
+/* pages/order/confirmOrder/confirmOrder.wxss */
+.address{
+    width: 650rpx;
+    height: 176rpx;
+    background: #F7F7F7;
+    border-radius: 30rpx;
+    margin: 64rpx auto;
+    box-shadow: 0 0 10rpx 10rpx #F0F0F0;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+}
+.address .addressInfo{
+    width: 60%;
+}
+.address .userInfo{
+    display: flex;
+    justify-content: space-between;
+}
+.address .icon{
+    width: 100rpx;
+}
+.address .more{
+    width: 30rpx;
+    transform: rotate(180deg);
+}
+
+/* 订单信息 */
+.orderInfo{
+    margin-top: 60rpx;
+}
+.orderInfo .info{
+    width: 650rpx;
+    line-height: 60rpx;
+    padding: 10rpx 0;
+    background: #F7F7F7;
+    margin: 0 auto 16rpx auto;
+    border-radius: 10rpx;
+}
+.orderInfo .info view{
+    overflow: hidden;
+}
+.orderInfo .info .title{
+    margin-left: 20rpx;
+}
+.orderInfo .info .value{
+    margin-right: 100rpx;
+    float: right;
+}
+
+/* 确认订单 */
+.submit{
+    width: 657rpx !important;
+    line-height: 105rpx;
+    padding: 0;
+    background: #FED279;
+    border-radius: 10rpx;
+    font-weight: 500;
+}