fix:

api/order.js

@@ -22,6 +22,10 @@ class order extends request {
         const res = await this.postRequest(`${this.BASE_URL}Order/createOrder`,data)
         return res.data
     }
+    static async deleteOrder(id) {
+        const res = await this.postRequest(`${this.BASE_URL}Order/deleteOrder?orderId=${id}`)
+        return res.data
+    }
 
 }
 

app.json

@@ -29,20 +29,20 @@
     "list": [{
       "pagePath": "pages/index/index",
       "text": "首页",
-      "iconPath": "images/icons/index.jpg",
-      "selectedIconPath": "images/icons/index-active.jpg"
+      "iconPath": "images/icons/index.png",
+      "selectedIconPath": "images/icons/index-active.png"
     },
     {
       "pagePath": "pages/personorder/personorder",
       "text": "订单",
-      "iconPath": "images/icons/order.jpg",
-      "selectedIconPath": "images/icons/order-active.jpg"
+      "iconPath": "images/icons/order.png",
+      "selectedIconPath": "images/icons/order-active.png"
     },
     {
       "pagePath": "pages/person/person",
       "text": "我的",
-      "iconPath": "images/icons/person.jpg",
-      "selectedIconPath": "images/icons/person-active.jpg"
+      "iconPath": "images/icons/person.png",
+      "selectedIconPath": "images/icons/person-active.png"
     }]
   },
   "style": "v2",

pages/appointment/appointment.js

@@ -65,8 +65,12 @@ Page({
       mobile: 15656942279
     }
     const rs = await orderApi.createOrder(data)
-   
+    console.log(rs)
+    let orderId = rs.orderId;
 
+    wx.navigateTo({
+      url: '../order/order?status=2&id='+orderId,
+    })
   },
   getMobile:function (params) {
     

pages/order/order.js

@@ -9,7 +9,10 @@ Page({
    * 页面的初始数据
    */
   data: {
-    order: {}
+    order: {},
+    //1显示订单详情，2显示确认支付，取消订单，3显示删除订单
+    orderStatus: 1,
+    timer: {}
 
   },
 
@@ -18,23 +21,88 @@ Page({
    */
   onLoad: async function (options) {
 
+    console.log(options)
     var orderId = options.id;
+    let status = options.status;
     let order = await orderApi.getOrderById(orderId);
     this.setData({
       order: order.info
     })
-    drawById.call(wx, "qrCode", {
+    /*   drawById.call(wx, "qrCode", {
       text: order.info.writeOffCode, // 二维码内容
     })
-
+ */
+    if (status == 2) {
+      console.log('abc')
+      this.setData({
+        orderStatus: 2
+      })
+      this.createTimeClock()
+    }
   },
-
+  //生成二维码
   createQrcode: function () {
     drawById.call(wx, "qrCode", {
       text: "1233", // 二维码内容
     })
   },
 
+  createTimeClock: function () {
+    var self = this;
+    let orderCreateTime = new Date(this.data.order.createTime);
+    let endTime = orderCreateTime.getTime()+15*60*1000;
+    // let endTime = orderCreateTime.getTime() + 30 * 1000;
+    var timerID = setInterval(() => {
+      let nowTime = new Date();
+      let timer = endTime - nowTime;
+      if (timer < 1) {
+        clearInterval(timerID);
+        self.setData({
+          orderStatus: 3
+        })
+      }
+      let minute = Math.floor(timer / (60 * 1000));
+      minute = minute < 0 ? 0 : minute;
+      let second = Math.round((timer % (60 * 1000)) / 1000);
+      this.setData({
+        timer: {
+          minute: minute,
+          second: second
+        }
+      })
+    }, 500);
+  },
+  cancelOrder: function () {
+    var self = this;
+    wx.showModal({
+      title: '是否确认取消订单？',
+      success(res) {
+        if (res.confirm) {
+          self.setData({
+            orderStatus: 3
+          })
+        } else if (res.cancel) {}
+
+      },
+
+    })
+  },
+  deleteOrder: async function () {
+    let id = this.data.order.id;
+    await orderApi.deleteOrder(id);
+    wx.showToast({
+      title: '删除成功',
+      success: function () {
+        setTimeout(() => {
+          wx.switchTab({
+            url: '../personorder/personorder',
+          })
+        }, 1000);
+
+      }
+    })
+
+  },
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
@@ -83,4 +151,5 @@ Page({
   onShareAppMessage: function () {
 
   }
+
 })

pages/order/order.scss

@@ -1,79 +1,106 @@
-.container{
+.container {
     background-color: #F7F7F7;
-    .code-info{
+
+    // 倒计时
+    .timer {
+        background-color: #DF3361;
+        width: 100%;
+        height: 60rpx;
+        font-size: 14px;
+        text-align: center;
+        line-height: 60rpx;
+        color: #fff;
+    }
+
+
+    .code-info {
         width: 100%;
         height: 390rpx;
         background-color: #fff;
-        .code{
+
+        .code {
             width: 320rpx;
             height: 320rpx;
             border: 1px solid #ebeef5;
             margin: 20rpx auto;
-            .canvas-code{
+
+            .canvas-code {
                 background-color: #fff;
                 width: 280rpx;
                 height: 280rpx;
                 margin: 20rpx auto;
             }
-            .code-text{
+
+            .code-text {
                 text-align: center;
                 margin: 30rpx auto;
             }
         }
     }
 
-    .order{
+    .order {
         margin-top: 20rpx;
         display: flex;
         height: 250rpx;
         background-color: #fff;
         justify-content: flex-start;
-        .order-img{
+
+        .order-img {
             width: 200rpx;
             height: 190rpx;
             margin: 20rpx 20rpx;
             padding-top: 25rpx;
-            image{
+
+            image {
                 width: 100%;
                 height: 100%;
             }
         }
-        .order-info{
+
+        .order-info {
             flex: 1;
             padding-top: 10rpx;
             padding-left: 30rpx;
-            .order-id{
+
+            .order-id {
                 height: 50rpx;
                 text-align: right;
             }
-            .order-title{
+
+            .order-title {
                 height: 60rpx;
-                
+
             }
-            .order-price{
+
+            .order-price {
                 height: 80rpx;
             }
-            .order-date{
+
+            .order-date {
                 height: 50rpx;
             }
         }
     }
 
-    .shop-info{
+    .shop-info {
         height: 250rpx;
         margin-top: 20rpx;
         padding: 20rpx 30rpx;
         background-color: #fff;
-        .shop{
+
+        .shop {
             height: 50rpx;
             line-height: 50rpx;
         }
-        .address,.tel{
+
+        .address,
+        .tel {
             height: 30rpx;
             line-height: 30rpx;
             margin: 20rpx;
             position: relative;
-            image{
+
+            image {
                 width: 40rpx;
                 height: 40rpx;
                 position: absolute;
@@ -82,5 +109,42 @@
             }
         }
     }
-}
 
+    .order-btn {
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100rpx;
+        display: flex;
+        justify-content: flex-end;
+        align-items: center;
+        border-top: 1rpx solid #ECECEC;
+
+        .confirm-btn,
+        .pay-btn {
+            background-color: #DF3361;
+            width: 180rpx;
+            height: 50rpx;
+            font-size: 14px;
+            text-align: center;
+            line-height: 50rpx;
+            border-radius: 25rpx;
+            color: #fff;
+            margin-right: 20rpx;
+
+        }
+
+        .delete-btn {
+            width: 180rpx;
+            height: 50rpx;
+            font-size: 14px;
+            text-align: center;
+            line-height: 50rpx;
+            border-radius: 25rpx;
+            color: #999;
+            border: 1rpx solid #999;
+            margin: 0 20rpx;
+        }
+    }
+}

pages/order/order.wxml

@@ -1,50 +1,42 @@
-<!--pages/order/order.wxml-->
+<!-- pages/order/order.wxml -->
 <view class="container">
-    <view class="code-info" >
-        
+    <!-- 倒计时 -->
+    <view class="timer" wx:if="{{orderStatus==2}}">等待买家付款，剩余{{timer.minute}}分{{timer.second}}秒后自动关闭</view>
+    <view class="code-info" wx:if="{{order.status==2}}">
         <view class="code card">
             <canvas class="canvas-code" type="2d" id="qrCode" />
-            <view class="code-text f13 c-707070">
-                进店请出示二维码进行核销
-            </view>
+            <view class="code-text f13 c-707070">进店请出示二维码进行核销</view>
         </view>
     </view>
     <view class="order card">
         <view class="order-img">
-            <image class="" src="{{order.productImg}}">
-
-            </image>
+            <image class="" src="{{order.productImg}}"></image>
         </view>
         <view class="order-info">
-
             <view class="order-id f13 c-707070">{{order.orderSn}}</view>
-            <view class="order-title c-202020">
-                {{order.productName}}
-
-            </view>
+            <view class="order-title c-202020">{{order.productName}}</view>
             <view class="order-price f18">¥{{order.orderMoney}}</view>
-
             <view class="order-date f13 c-707070">
                 <mp-icon icon="time" size="18" class="icon" color="#707070"></mp-icon>
                 {{order.appointmentTime}}
             </view>
-
         </view>
     </view>
     <view class="shop-info card">
-        <view class="shop f17">
-            {{ order.storeName}}
-        </view>
+        <view class="shop f17">{{ order.storeName}}</view>
         <view class="address f14 c-707070 ">
             <image src="../../images/icons/location.png"></image>
             {{order.address}}
         </view>
-        <view class="f17 shop">
-            场馆电话
-        </view>
+        <view class="f17 shop">场馆电话</view>
         <view class="tel f14 c-707070 ">
             <image src="../../images/icons/tel.png"></image>
             {{order.mobile}}
         </view>
     </view>
+    <view class="order-btn">
+        <view class="delete-btn" bindtap = "cancelOrder" wx:if="{{orderStatus==2}}">取消订单</view>
+        <view class="pay-btn" wx:if="{{orderStatus==2}}">确认支付</view>
+        <view class="delete-btn" bindtap = "deleteOrder" wx:if="{{orderStatus==3}}">删除订单</view>
+    </view>
 </view>

pages/order/order.wxss

@@ -2,6 +2,16 @@
   background-color: #F7F7F7;
 }
 
+.container .timer {
+  background-color: #DF3361;
+  width: 100%;
+  height: 60rpx;
+  font-size: 14px;
+  text-align: center;
+  line-height: 60rpx;
+  color: #fff;
+}
+
 .container .code-info {
   width: 100%;
   height: 390rpx;
@@ -82,17 +92,56 @@
   line-height: 50rpx;
 }
 
-.container .shop-info .address, .container .shop-info .tel {
+.container .shop-info .address,
+.container .shop-info .tel {
   height: 30rpx;
   line-height: 30rpx;
   margin: 20rpx;
   position: relative;
 }
 
-.container .shop-info .address image, .container .shop-info .tel image {
+.container .shop-info .address image,
+.container .shop-info .tel image {
   width: 40rpx;
   height: 40rpx;
   position: absolute;
   right: 0;
   bottom: 0;
 }
+
+.container .order-btn {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100rpx;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  border-top: 1rpx solid #ECECEC;
+}
+
+.container .order-btn .confirm-btn,
+.container .order-btn .pay-btn {
+  background-color: #DF3361;
+  width: 180rpx;
+  height: 50rpx;
+  font-size: 14px;
+  text-align: center;
+  line-height: 50rpx;
+  border-radius: 25rpx;
+  color: #fff;
+  margin-right: 20rpx;
+}
+
+.container .order-btn .delete-btn {
+  width: 180rpx;
+  height: 50rpx;
+  font-size: 14px;
+  text-align: center;
+  line-height: 50rpx;
+  border-radius: 25rpx;
+  color: #999;
+  border: 1rpx solid #999;
+  margin: 0 20rpx;
+}

pages/person/person.js

@@ -115,5 +115,10 @@ Page({
     wx.navigateTo({
       url: '../personinfo/personinfo',
     })
+  },
+  gotoOrder: function (e) {
+    wx.switchTab({
+      url: '../personorder/personorder',
+    })
   }
 })

pages/person/person.wxml

@@ -32,7 +32,7 @@
 
 
     </view>
-    <view class="order">
+    <view class="order" bindtap = "gotoOrder">
         <image class="icons" src="../../images/icons/order.png">
         </image>
         <view class="order-text">我的订单

pages/personinfo/personinfo.js

@@ -43,7 +43,7 @@ Page({
     let userId = userInfo.userId;
     let user = await userApi.getUserById(userId);
     let birth = user.info.birthday;
-    birth == "" ? '1970-01-01' : birth;
+    birth = birth == "" ? '1970-01-01' : birth;
     console.log(user)
     this.setData({
       sex: userInfo.gender,
@@ -102,10 +102,19 @@ Page({
       key: 'userInfo',
     })
     await userApi.updateUserInfo(name, birthDay, avatar, sex);
-    wx.switchTab({
-
-      url: '/pages/person/person',
+    wx.showToast({
+      title: '修改成功',
+      icon: 'success',
+      success: function () {
+        setTimeout(() => {
+          wx.switchTab({
+            url: '/pages/person/person',
+          })
+        }, 1000);
+        
+      }
     })
+
   },
   /**
    * 生命周期函数--监听页面初次渲染完成

pages/personinfo/personinfo.json

@@ -1,6 +1,5 @@
 {
-  "disableScroll": true,
-  "navigationStyle": "custom",
+
   "usingComponents": {
     "mp-icon": "weui-miniprogram/icon/icon"
    

pages/personinfo/personinfo.scss

@@ -1,28 +1,8 @@
-.top-bar{
-    background-color: #343434;
-    .bar-text{
-        text-align: center;
-        color: #fff;
-        position: relative;
-        padding-bottom: 15rpx;
-        font-size: 25rpx;
-        .left{
-            position: absolute;
-            left: 30rpx;
-            top: 6rpx;
-            >.left-img{
-                width: 38rpx;
-                height: 38rpx;
-            }
-        }
-    }
-}
-
-
 .container {
     background-color: #F7F7F7;
     min-height: 1200rpx;
     letter-spacing: 3rpx;
+
     .head-img {
         height: 200rpx;
         display: flex;
@@ -30,15 +10,18 @@
         background-color: #fff;
         padding: 0 50rpx;
         margin-bottom: 20rpx;
-        .title{
+
+        .title {
             height: 200rpx;
             line-height: 200rpx;
         }
+
         .info {
             width: 150rpx;
             height: 150rpx;
             border-radius: 50%;
             margin-top: 25rpx;
+
             >image {
                 width: 150rpx;
                 height: 150rpx;
@@ -46,25 +29,33 @@
             }
         }
     }
-    .user-name,.sex,.birth,.tel{
+
+    .user-name,
+    .sex,
+    .birth,
+        {
         display: flex;
         justify-content: space-between;
         height: 100rpx;
         background-color: #fff;
         position: relative;
         padding: 0 50rpx;
-        
-        .title,.info{
+
+        .title,
+        .info {
             line-height: 100rpx;
         }
-        .info{
+
+        .info {
             text-align: right;
             color: #707070;
-            >input{
+
+            >input {
                 height: 100%;
             }
         }
-        .icon{
+
+        .icon {
             width: 30rpx;
             height: 30rpx;
             position: absolute;
@@ -72,4 +63,19 @@
             right: 15rpx;
         }
     }
+
+    .submit {
+        width: 90%;
+        height: 100rpx;
+        margin: 10rpx auto;
+        background-color: #DF3361;
+        color: #fff;
+        font-size: 17px;
+        line-height: 100rpx;
+        text-align: center;
+        letter-spacing: 2rpx;
+        position: fixed;
+        bottom: 20rpx;
+        left: 5%;
+    }
 }

pages/personinfo/personinfo.wxml

@@ -1,23 +1,9 @@
-<!--pages/personinfo/personinfo.wxml-->
-<!-- 标题栏 -->
-<view class="top-bar">
-    <!-- 沉浸栏 -->
-    <view style="width:100%;height:{{statusBarHeight}}px"></view>
-    <!-- 标题栏 这里就可以自定义写标题 -->
-    <view class="bar-text">
-        <view class="left" bindtap = "updateUser">
-            <image class="left-img" src="../../images/icons/left.png"></image>
-        </view>
-        <text>个人</text>
-    </view>
-</view>
+<!-- pages/personinfo/personinfo.wxml -->
 <view class="container">
     <view class="head-img card">
         <view class="title">头像</view>
         <view class="info" bindtap='upload'>
-            <image class="" src="{{imgUrl}}">
-
-            </image>
+            <image class="" src="{{imgUrl}}"></image>
         </view>
     </view>
     <view class="user-name">
@@ -25,9 +11,6 @@
         <view class="info">
             <input type="text" value="{{userName}}" name="user" bindblur="changeUserName" />
         </view>
-        <image class="icon" src="../../images/icons/next-gray.png">
-
-        </image>
     </view>
     <view class="sex">
         <view class="title">性别</view>
@@ -36,9 +19,6 @@
                 {{array[sex]}}
             </picker>
         </view>
-        <image class="icon" src="../../images/icons/next-gray.png">
-
-        </image>
     </view>
     <view class="birth">
         <view class="title">生日</view>
@@ -47,18 +27,6 @@
                 {{birth}}
             </picker>
         </view>
-        <image class="icon" src="../../images/icons/next-gray.png">
-
-        </image>
-
     </view>
-    <!-- <view class="tel">
-        <view class="title">手机</view>
-        <view class="info">
-            <input type="text" value="{{tel}}" bindblur = "changeTel"/>
-        </view>
-        <image class="icon" src="../../images/icons/next-gray.png">
-
-        </image>
-    </view> -->
+    <view class="submit" bindtap = "updateUser">保存</view>
 </view>

pages/personinfo/personinfo.wxss

@@ -1,26 +1,3 @@
-.top-bar {
-  background-color: #343434;
-}
-
-.top-bar .bar-text {
-  text-align: center;
-  color: #fff;
-  position: relative;
-  padding-bottom: 15rpx;
-  font-size: 25rpx;
-}
-
-.top-bar .bar-text .left {
-  position: absolute;
-  left: 30rpx;
-  top: 6rpx;
-}
-
-.top-bar .bar-text .left > .left-img {
-  width: 38rpx;
-  height: 38rpx;
-}
-
 .container {
   background-color: #F7F7F7;
   min-height: 1200rpx;
@@ -54,7 +31,9 @@
   border-radius: 50%;
 }
 
-.container .user-name, .container .sex, .container .birth, .container .tel {
+.container .user-name,
+.container .sex,
+.container .birth {
   display: flex;
   justify-content: space-between;
   height: 100rpx;
@@ -63,23 +42,49 @@
   padding: 0 50rpx;
 }
 
-.container .user-name .title, .container .user-name .info, .container .sex .title, .container .sex .info, .container .birth .title, .container .birth .info, .container .tel .title, .container .tel .info {
+.container .user-name .title,
+.container .user-name .info,
+.container .sex .title,
+.container .sex .info,
+.container .birth .title,
+.container .birth .info {
   line-height: 100rpx;
 }
 
-.container .user-name .info, .container .sex .info, .container .birth .info, .container .tel .info {
+.container .user-name .info,
+.container .sex .info,
+.container .birth .info {
   text-align: right;
   color: #707070;
 }
 
-.container .user-name .info > input, .container .sex .info > input, .container .birth .info > input, .container .tel .info > input {
+.container .user-name .info > input,
+.container .sex .info > input,
+.container .birth .info > input {
   height: 100%;
 }
 
-.container .user-name .icon, .container .sex .icon, .container .birth .icon, .container .tel .icon {
+.container .user-name .icon,
+.container .sex .icon,
+.container .birth .icon {
   width: 30rpx;
   height: 30rpx;
   position: absolute;
   top: 38rpx;
   right: 15rpx;
 }
+
+.container .submit {
+  width: 90%;
+  height: 100rpx;
+  margin: 10rpx auto;
+  background-color: #DF3361;
+  color: #fff;
+  font-size: 17px;
+  line-height: 100rpx;
+  text-align: center;
+  letter-spacing: 2rpx;
+  position: fixed;
+  bottom: 20rpx;
+  left: 5%;
+}

pages/product/product.scss

@@ -29,11 +29,6 @@ page {
     .product-desc {
         margin-top: 10rpx;
         width: 100%;
-
-        image {
-            width: 100%;
-            height: 100%;
-        }
     }
 
     .comments {

pages/product/product.wxml

@@ -7,11 +7,11 @@
         <view class="price c-e40360 fw300">¥{{product.currentPrice}}/人</view>
     </view>
     <!-- 产品描述 -->
-    <view class="product-desc card">
-        {{product.product.productContent}}
-    </view>
+    <rich-text class="product-desc card" nodes="{{product.productContent}}">
+        
+    </rich-text>
     <!-- 评论 -->
-    <view class="comments card">
+    <view class="comments card" >
         <view class="comment-title f17 fw300">
             <view class="title">
 
@@ -22,7 +22,7 @@
                 <mp-icon icon="arrow" size="12" class="comments-icon" color="#707070"></mp-icon>
             </view>
         </view>
-        <comments commentsList="{{[commentsList[0],commentsList[1],commentsList[1]]}}"></comments>
+        <comments wx:if="{{commentsNum!=0}}" commentsList="{{[commentsList[0],commentsList[1],commentsList[1]]}}"></comments>
 
     </view>
     <!-- 预约 -->

pages/product/product.wxss

@@ -31,11 +31,6 @@ page {
   width: 100%;
 }
 
-.container .product-desc image {
-  width: 100%;
-  height: 100%;
-}
-
 .container .comments {
   width: 100%;
   margin-top: 10rpx;