”订单页面

git commit -m ”订单页面

app.json

@@ -10,7 +10,10 @@
     "pages/select-history/select-history",
     "pages/select-nothing/select-nothing",
     "pages/select-shopping/select-shopping",
-    "pages/zhuye/zhuye"
+    "pages/zhuye/zhuye",
+    "pages/order_address/order_address",
+    "pages/order_confirm/order_confirm",
+    "pages/order_submit/order_submit"
   ],
   "window": {
     "backgroundTextStyle": "light",

pages/order_address/order_address.js

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

pages/order_address/order_address.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "确认订单"
+}

pages/order_address/order_address.wxml

@@ -0,0 +1,57 @@
+<!--pages/order_address/order_address.wxml-->
+<!-- <text>pages/order_address/order_address.wxml</text><!--pages/order_submit/order_submit.wxml-->
+<!-- <text>pages/order_submit/order_submit.wxml</text> -->
+<!-- 确认订单页面 有备注 有按钮 有地址 -->
+<!-- 收货地址 -->
+<view class="ad">
+  <view class="ad-box">
+    <image src="../image/dizhi.png" mode="" />
+    <text class="ad-text01">哈尔滨师范大学第一公寓2门312室</text>
+    <text class="message">
+      吴迪（先生）182****2898
+    </text>
+  </view>
+</view>
+<!-- 商品信息 -->
+<view class="food">
+  <text class="food-text">二楼麻辣烫、麻辣香锅、麻辣拌饭</text>
+</view>
+<view class="store-box">
+  <image src="../image/商品.png" mode="" />
+  <view class="store-message">
+    <text class="store-title">麻辣烫微辣微麻</text>
+    <text class="store-price01">￥10.98+40积分</text>
+    <text class="store-price02">￥28.80</text>
+    <view>
+      <text class="store-numb">*2</text>
+    </view>
+  </view>
+</view>
+<view class="others-box">
+  <text class="other01">包装费</text>
+  <text class="other02">￥0</text>
+</view>
+<view class="others-box">
+  <text class="other01">付款费</text>
+  <text class="other02">￥3</text>
+</view>
+<view class="others-boxs">
+  <text class="others01">已优惠</text>
+  <text class="others02">￥10</text>
+  <text class="others01">累计</text>
+  <text class="others02">￥21.8</text>
+</view>
+<!-- 备注 -->
+<view>
+  <van-cell-group inset>
+    <van-field v-model="message" rows="2" autosize label="备注：" type="textarea" maxlength="15" placeholder="请输入备注" show-word-limit />
+  </van-cell-group>
+</view>
+<!-- 提交订单按钮 -->
+<view class="btn">
+  <view class="btn-box">
+    <text class="btn-text01">累计：</text>
+    <text class="btn-text02">￥10.98</text>
+    <van-button class="order-btn"  type="warning" round >提交订单</van-button>
+  </view>
+</view> 

pages/order_address/order_address.wxss

@@ -0,0 +1,137 @@
+/* pages/order_address/order_address.wxss */
+/* pages/order_submit/order_submit.wxss */
+.ad {
+  border-bottom: 5px rgb(228, 227, 227) solid;
+}
+
+.ad-box {
+  width: 90%;
+  margin: 18rpx 38rpx;
+  /* border-bottom: 5px rgb(228, 227, 227) solid; */
+}
+
+.ad-box image {
+  width: 40rpx;
+  height: 40rpx;
+  float: left;
+}
+
+.ad-text01 {
+  font-size: 32rpx;
+  font-weight: 600;
+  margin-left: 20rpx;
+}
+
+.message {
+  display: flex;
+  padding-left: 52rpx;
+  font-size: 30rpx;
+  color: rgb(158, 158, 158);
+}
+
+.food {
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding-bottom: 15rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+
+.food-text {
+  font-size: 30rpx;
+  font-weight: 500;
+}
+
+.store-box {
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding: 20rpx 0 50rpx 0;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+
+.store-box image {
+  width: 250rpx;
+  height: 150rpx;
+  float: left;
+  margin: 0 15rpx 20rpx 0;
+}
+
+.store-title {
+  font-size: 28rpx;
+}
+
+.store-price01 {
+  font-size: 22rpx;
+  font-weight: 550;
+  color: red;
+  padding-left: 40rpx;
+}
+
+.store-price02 {
+  font-size: 20rpx;
+  padding-left: 330rpx;
+  color: rgb(158, 158, 158);
+  text-decoration: line-through;
+
+}
+
+.store-numb {
+  font-size: 20rpx;
+  color: rgb(158, 158, 158);
+}
+
+.others-box {
+  width: 90%;
+  margin: 10rpx 38rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+  padding-bottom: 20rpx;
+}
+
+.other01 {
+  font-size: 25rpx;
+  color: rgb(158, 158, 158);
+}
+
+.other02 {
+  color: red;
+  font-size: 25rpx;
+  padding-left: 550rpx;
+}
+
+.others-boxs {
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding-left: 420rpx;
+}
+
+.others01 {
+  font-size: 25rpx;
+  color: rgb(158, 158, 158);
+}
+
+.others02 {
+  font-size: 25rpx;
+  color: red;
+}
+
+.btn-text01 {
+  font-size: 34rpx;
+}
+
+.btn-text02 {
+  font-size: 34rpx;
+  color: red;
+}
+
+.order-btn {
+  float: right;
+}
+
+.btn-box {
+  width: 90%;
+  margin: 30rpx 38rpx;
+}
+
+.btn {
+  margin-top: 250rpx;
+  border-top: rgb(228, 227, 227) 3px solid;
+}

pages/order_confirm/order_confirm.js

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

pages/order_confirm/order_confirm.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "确认订单"
+}

pages/order_confirm/order_confirm.wxml

@@ -0,0 +1,59 @@
+<!--pages/order_confirm/order_confirm.wxml-->
+<!-- <text>pages/order_confirm/order_confirm.wxml</text> -->
+<!-- 确认订单页面   无按钮，有地址 -->
+<view class="box">
+  <view>
+    <text class="address">
+      哈尔滨师范大学第一公寓2门312室
+    </text>
+    <text class="message">
+      吴迪（先生）182****2898
+    </text>
+  </view>
+</view>
+<view class="food">
+  <text class="food-text">二楼麻辣烫、麻辣香锅、麻辣拌饭</text>
+</view>
+<view class="store-box">
+  <image src="../image/商品.png" mode="" />
+  <view class="store-message">
+    <text class="store-title">麻辣烫微辣微麻</text>
+    <text class="store-price01">￥10.98+40积分</text>
+    <text class="store-price02">￥28.80</text>
+    <view>
+      <text class="store-numb">*2</text>
+    </view>
+  </view>
+</view>
+<view class="others-box">
+  <text class="other01">包装费</text>
+  <text class="other02">￥0</text>
+</view>
+<view class="others-box">
+  <text class="other01">付款费</text>
+  <text class="other02">￥3</text>
+</view>
+<view class="beizhu">
+  <view class="beizhu-box">
+    <text class="beizhu-text01">备注</text>
+    <text class="beizhu-text02">不要香菜</text>
+  </view>
+</view>
+<view class="messages">
+  <view class="messages-box">
+    <text class="messages-text01">订单编号：</text>
+    <text class="messages-text02">203266542344565</text>
+  </view>
+  <view class="messages-box">
+    <text class="messages-text01">交易时间：</text>
+    <text class="messages-text02">2022-06-03 13:19:08</text>
+  </view>
+  <view class="messages-box">
+    <text class="messages-text01">积分抵扣：</text>
+    <text class="messages-text02">40积分</text>
+  </view>
+  <view class="messages-box">
+    <text class="messages-text01">实付金额：</text>
+    <text class="messages-text03">￥21.80</text>
+  </view>
+</view>

pages/order_confirm/order_confirm.wxss

@@ -0,0 +1,116 @@
+/* pages/order_confirm/order_confirm.wxss */
+.box{
+  /* background-color:deeppink; */
+  width: 100%;
+  height: 100%;
+  display: flex;
+  /* margin: 0 38rpx; */
+  border-bottom: rgb(228, 227, 227) 5px solid;
+  padding: 0 38rpx 10rpx 38rpx;
+}
+.address{
+  font-size: 37rpx;
+  font-weight: 550;
+  display: flex;
+  width: 100%;
+  height: 69rpx;
+}
+.message{
+  font-size: 30rpx;
+  color: rgb(158, 158, 158);
+
+}
+.food{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding-bottom: 15rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+.food-text{
+  font-size: 30rpx;
+  font-weight: 500;
+}
+.store-box{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding: 20rpx 0 50rpx 0;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+.store-box image{
+  width: 250rpx;
+  height: 150rpx;
+  float: left;
+  margin: 0 15rpx 20rpx 0;
+}
+.store-title{
+  font-size: 28rpx;
+}
+.store-price01{
+  font-size: 22rpx;
+  font-weight: 550;
+  color: red;
+  padding-left: 40rpx;
+}
+.store-price02{
+  font-size: 20rpx;
+  padding-left: 330rpx;
+  color:  rgb(158, 158, 158);
+  text-decoration: line-through;
+  
+}
+.store-numb{
+  font-size: 20rpx;
+  color:  rgb(158, 158, 158);
+}
+.others-box{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+  padding-bottom: 20rpx;
+}
+.other01{
+  font-size: 25rpx;
+  color: rgb(158, 158, 158);
+}
+.other02{
+  color: red;
+  font-size: 25rpx;
+  padding-left: 550rpx;
+}
+.beizhu{
+  border-top: rgb(228, 227, 227) 5px solid;
+  border-bottom: rgb(228, 227, 227) 5px solid;
+  margin-top: 60rpx;
+}
+.beizhu-box{
+  width: 90%;
+  margin: 20rpx 38rpx;
+}
+.beizhu-text01{
+  font-size: 28rpx;
+  font-weight: 600;
+}
+.beizhu-text02{
+  font-size: 28rpx;
+  color:  rgb(158, 158, 158);
+  padding-left: 30rpx;
+}
+.messages-box{
+  width: 90%;
+  margin: 25rpx 38rpx;
+}
+.messages-text01{
+  font-size: 28rpx;
+  font-weight: 600;
+}
+.messages-text02{
+  font-size: 24rpx;
+  color:  rgb(158, 158, 158);
+}
+.messages-text03{
+  font-size: 24rpx;
+  color: red;
+}
+.messages{
+  border-bottom: rgb(228, 227, 227) 5px solid;
+}

pages/order_submit/order_submit.js

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

pages/order_submit/order_submit.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "确认订单"
+}

pages/order_submit/order_submit.wxml

@@ -0,0 +1,54 @@
+<!--pages/order_submit/order_submit.wxml-->
+<!-- <text>pages/order_submit/order_submit.wxml</text> -->
+<!-- 确认订单页面 有备注 有按钮 有地址 -->
+<!-- 收货地址 -->
+<view class="ad">
+  <view class="ad-box">
+    <image src="../image/dizhi.png" mode="" />
+    <text class="ad-text01">请选择收货地址</text>
+    <text class="ad-text02">></text>
+  </view>
+</view>
+<!-- 商品信息 -->
+<view class="food">
+  <text class="food-text">二楼麻辣烫、麻辣香锅、麻辣拌饭</text>
+</view>
+<view class="store-box">
+  <image src="../image/商品.png" mode="" />
+  <view class="store-message">
+    <text class="store-title">麻辣烫微辣微麻</text>
+    <text class="store-price01">￥10.98+40积分</text>
+    <text class="store-price02">￥28.80</text>
+    <view>
+      <text class="store-numb">*2</text>
+    </view>
+  </view>
+</view>
+<view class="others-box">
+  <text class="other01">包装费</text>
+  <text class="other02">￥0</text>
+</view>
+<view class="others-box">
+  <text class="other01">付款费</text>
+  <text class="other02">￥3</text>
+</view>
+<view class="others-boxs">
+  <text class="others01">已优惠</text>
+  <text class="others02">￥10</text>
+  <text class="others01">累计</text>
+  <text class="others02">￥21.8</text>
+</view>
+<!-- 备注 -->
+<view>
+  <van-cell-group inset>
+    <van-field v-model="message" rows="2" autosize label="备注：" type="textarea" maxlength="15" placeholder="请输入备注" show-word-limit />
+  </van-cell-group>
+</view>
+<!-- 提交订单按钮 -->
+<view class="btn">
+  <view class="btn-box">
+    <text class="btn-text01">累计：</text>
+    <text class="btn-text02">￥10.98</text>
+    <van-button class="order-btn"  type="warning" round >提交订单</van-button>
+  </view>
+</view>

pages/order_submit/order_submit.wxss

@@ -0,0 +1,111 @@
+/* pages/order_submit/order_submit.wxss */
+.ad{
+  border-bottom: 5px rgb(228, 227, 227) solid;
+}
+.ad-box{
+  width: 90%;
+  margin: 18rpx 38rpx;
+  /* border-bottom: 5px rgb(228, 227, 227) solid; */
+}
+.ad-box image{
+  width: 40rpx;
+  height: 40rpx;
+  float: left;
+}
+.ad-text01{
+  font-size: 32rpx;
+  font-weight: 600;
+  margin-left: 20rpx;
+}
+.ad-text02{
+  color: rgb(158, 158, 158);
+  padding-left: 350rpx;
+}
+.food{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding-bottom: 15rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+.food-text{
+  font-size: 30rpx;
+  font-weight: 500;
+}
+.store-box{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding: 20rpx 0 50rpx 0;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+}
+.store-box image{
+  width: 250rpx;
+  height: 150rpx;
+  float: left;
+  margin: 0 15rpx 20rpx 0;
+}
+.store-title{
+  font-size: 28rpx;
+}
+.store-price01{
+  font-size: 22rpx;
+  font-weight: 550;
+  color: red;
+  padding-left: 40rpx;
+}
+.store-price02{
+  font-size: 20rpx;
+  padding-left: 330rpx;
+  color:  rgb(158, 158, 158);
+  text-decoration: line-through;
+  
+}
+.store-numb{
+  font-size: 20rpx;
+  color:  rgb(158, 158, 158);
+}
+.others-box{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  border-bottom: 1px rgb(228, 227, 227) solid;
+  padding-bottom: 20rpx;
+}
+.other01{
+  font-size: 25rpx;
+  color: rgb(158, 158, 158);
+}
+.other02{
+  color: red;
+  font-size: 25rpx;
+  padding-left: 550rpx;
+}
+.others-boxs{
+  width: 90%;
+  margin: 10rpx 38rpx;
+  padding-left: 420rpx;
+}
+.others01{
+  font-size: 25rpx;
+  color: rgb(158, 158, 158);
+}
+.others02{
+  font-size: 25rpx;
+  color: red;
+}
+.btn-text01{
+  font-size: 34rpx;
+}
+.btn-text02{
+  font-size: 34rpx;
+  color: red;
+}
+.order-btn{
+  float: right;
+}
+.btn-box{
+  width: 90%;
+  margin: 30rpx 38rpx;
+}
+.btn{
+  margin-top: 250rpx;
+  border-top: rgb(228, 227, 227) 3px solid;
+}

project.private.config.json

@@ -69,6 +69,27 @@
           "query": "",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "订单地址",
+          "pathName": "pages/order_address/order_address",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "订单提交",
+          "pathName": "pages/order_submit/order_submit",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "订单确认",
+          "pathName": "pages/order_confirm/order_confirm",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }