order page

nova-tourism/components/homestay/index.wxml

@@ -16,7 +16,7 @@
                 <view class="end">{{date_end}}</view>
                 <view class="today" wx:if="{{istoday}}">明天</view>
             </view>
-            <van-calendar show="{{ show }}" show-confirm="{{ true }}" confirm-text="完成" confirm-disabled-text='完成' type="range" bind:close="onClose" bind:confirm="onConfirm" color='#ff0000' position='top' />
+            <van-calendar show="{{ show }}" show-confirm="{{ true }}" confirm-text="完成" confirm-disabled-text='完成' type="range" bind:close="onClose" bind:confirm="onConfirm" color='#46a9a4' position='top' />
         </view>
     </view>
     <!-- 卡片 -->

nova-tourism/pages/homestay/homestay-order/index.js

@@ -131,7 +131,7 @@ Page({
                 // startTime,
                 // endTime,
             })
-
+            console.log('房间',this.data.room);
 
         })
     },

nova-tourism/pages/homestay/homestay-order2/index.js

@@ -17,12 +17,19 @@ Page({
         bottomNavHeight: 0, // 底部导航栏高度
         contentHeight: 0, // 可用内容高度
 
-        roomList: [],
+        room: {},
         startTime: null, // 入住开始时间
         endTime: null, // 入住结束时间
         roomId: null,
         count: 1, // 入住几晚
-        date: '' //入住区间
+        date: '', //入住区间
+        date2: '',
+        name: '',
+        mobile: '',
+        error_message:'',
+        activeOrder:null,//创建的订单
+        tradeNo:null,//订单号
+        showPayment:false,//显示支付组件
     },
 
     /**
@@ -69,34 +76,35 @@ Page({
         // console.log('开始时间', startTime, '结束时间', endTime);
         var dataAll = dateServ.getDayAll(this.data.startTime, this.data.endTime);
         dataAll.pop(); // 最后一天为退房，不算在内
-        console.log('dataAll',dataAll);
+        console.log('dataAll', dataAll);
         // console.log(this.formatDate(startTime), this.formatDate(endTime))
         let dateStr = this.formatDate(this.data.startTime) + '-' + this.formatDate(this.data.endTime)
-        console.log('dateStr',dateStr)
+        console.log('dateStr', dateStr)
         this.setData({
             // showDate: false,
             date: `${this.formatDate(this.data.startTime)} - ${this.formatDate(this.data.endTime)}`,
+            date2: `${this.formatDate2(this.data.startTime,this.data.endTime)}`,
             // priceInfoArr: dataAll,
             count: dataAll.length
         })
 
-        console.log('天数',this.data.count);
+        console.log('天数', this.data.count);
     },
     //修改时间格式
     formatDate(date) {
         date = new Date(date);
-        
+
         // 获取当前日期
         const today = new Date();
-        
+
         // 格式化日期为 "月/日"
         const month = date.getMonth() + 1; // 月份从0开始，所以要加1
         const day = date.getDate();
-        
+
         // 获取星期几
         const weekDays = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
         const weekDay = weekDays[date.getDay()]; // 获取星期几的中文
-    
+
         // 判断是今天还是明天
         let dateDescription = '';
         if (date.toDateString() === today.toDateString()) {
@@ -106,10 +114,26 @@ Page({
         } else {
             dateDescription = weekDay; // 其他情况返回星期几
         }
-    
+
         // 返回格式化的字符串
         return `${month}月${day}日 ${dateDescription}`;
     },
+    formatDate2(date1, date2) {
+        date1 = new Date(date1);
+        date2 = new Date(date2);
+
+        // 获取年份、月份和日期
+        const year1 = date1.getFullYear();
+        const month1 = date1.getMonth() + 1; // 月份从0开始，所以要加1
+        const day1 = date1.getDate();
+
+        const year2 = date2.getFullYear();
+        const month2 = date2.getMonth() + 1; // 月份从0开始，所以要加1
+        const day2 = date2.getDate();
+
+        // 返回格式化的字符串
+        return `${year1}年${month1}月${day1}日入住 - ${year2}年${month2}月${day2}日离店`;
+    },
     //获取房间信息
     async getroom() {
         let room = new Parse.Query('ShopRoom');
@@ -122,9 +146,9 @@ Page({
         let room2 = await room.find();
         let roomList = room2.map(item => item.toJSON());
         this.setData({
-            roomList
+            room: roomList[0]
         })
-        console.log('房间', this.data.roomList);
+        console.log('房间', this.data.room);
     },
     //计算选择日期的房间数量
     async checkOrderCount() {
@@ -133,34 +157,124 @@ Page({
         //   start1 < start2              end1 < end2
         //   start1 > start2              end1 > end2
         //   start1 = start2              end1 = end2
+        const startTime = new Date(this.data.startTime);
+        const endTime = new Date(this.data.endTime);
         let now = dateServ.changeDateTime(new Date(), '14:00:00')
         let Order = new Parse.Query("RoomOrder")
         Order.equalTo("room", this.data.roomId)
         Order.equalTo("company", company)
         Order.exists("status")
-        Order.notEqualTo("status", 100)
-        Order.notEqualTo("status", 400)
-        Order.notEqualTo("status", 601)
-        Order.notEqualTo("status", 700)
-        Order.greaterThanOrEqualTo("startTime", this.data.endTime) //20  23    21 22  
-        Order.lessThanOrEqualTo("endTime", this.data.startTime)
+        Order.notContainedIn('status',[100,400,601,700])
+        Order.greaterThanOrEqualTo("startTime", endTime) //20  23    21 22  
+        Order.lessThanOrEqualTo("endTime", startTime)
         Order.select("startTime", "endTime")
         let count = await Order.count()
         console.log(count);
         return count
     },
-    //点击支付
-    async submit() {
-        if (!this.data.startTime || !this.data.endTime) {
+    //生成订单号
+    getTradeNo() {
+        let now = new Date()
+        let tradeNo = "C" +
+            String(now.getFullYear()) +
+            (now.getMonth() + 1) +
+            now.getDate() +
+            now.getHours() +
+            now.getMinutes() +
+            now.getSeconds() +
+            Math.random().toString().slice(-6); //生成六位随机数
+        return tradeNo
+    },
+    //   创建待支付订单
+    async setOrder(tradeNo) {
+        const startTime = new Date(this.data.startTime);
+        const endTime = new Date(this.data.endTime);
+        let currentUser = Parse.User.current()
+        let Order = Parse.Object.extend("RoomOrder");
+        let order = new Order()
+        try {
+            // order.set("details", this.data.room.details);
+            order.set("user", {
+                __type: 'Pointer',
+                className: '_User',
+                objectId: currentUser.id
+            });
+            order.set("orderNum", tradeNo);
+            order.set("room", {
+                __type: 'Pointer',
+                className: 'ShopRoom',
+                objectId: this.data.roomId
+            });
+            console.log(this.data.startTime, endTime);
+            order.set("startTime", startTime);
+            order.set("endTime", endTime);
+            order.set("price", this.data.count * this.data.room.price);
+            order.set("shopStore", {
+                __type: 'Pointer',
+                className: 'ShopStore',
+                objectId: this.data.room.shop.objectId
+            });
+            order.set("company", {
+                __type: 'Pointer',
+                className: 'Company',
+                objectId: company
+            })
+            order.set("name", this.data.name);
+            order.set("mobile", this.data.mobile);
+            // order.set("merber", this.data.peopleNum);
+            order = await order.save()
+        } catch (error) {
+            console.log(error);
             wx.showToast({
-                title: '请选择入住时间',
-                icon: 'none',
+                title: error.errMsg,
+                icon: 'none'
             })
-            return
         }
-        if (this.data.customers.length == 0) {
+        return order
+    },
+    //获取住客姓名
+    getname(e) {
+        this.setData({
+            name:e.detail
+        })
+        console.log(e.detail);
+    },
+    //获取住客电话
+    getmobile(e) {
+        const mobileNumber = e.detail.value; // 假设手机号是通过 e.detail.value 传递的
+        console.log(mobileNumber);
+    
+        // 正则表达式：匹配中国大陆手机号
+        const mobilePattern = /^1[3-9]\d{9}$/;
+    
+        // 验证手机号格式
+        if (mobilePattern.test(mobileNumber)) {
+            this.setData({
+                error_message:'',
+                mobile:mobileNumber
+            })
+            console.log("手机号格式正确");
+            // 这里可以执行其他操作，比如保存手机号或进行下一步操作
+        } else {
+            this.setData({
+                error_message:'手机号格式不正确'
+            })
+            console.log("手机号格式不正确");
+            // 这里可以提示用户手机号格式不正确
+        }
+    },
+    //点击支付
+    async submit() {
+        // if (!this.data.startTime || !this.data.endTime) {
+        //     wx.showToast({
+        //         title: '请选择入住时间',
+        //         icon: 'none',
+        //     })
+        //     return
+        // }
+        if (this.data.name.length==0||this.data.mobile.length==0) {
             wx.showToast({
-                title: '请选择入住人',
+                title: '请输入住人信息',
                 icon: 'none',
             })
             return
@@ -174,17 +288,67 @@ Page({
             })
             return
         }
-        let tradeNo = this.getTradeNo()
-        let order = await this.setOrder(tradeNo)
+        let tradeNo = this.getTradeNo() //生成订单编号
+        let order = await this.setOrder(tradeNo)//生成订单
         if (order) {
             this.setData({
                 activeOrder: order,
                 tradeNo,
-                showPayment: true,
+                showPayment: true,//展示支付组件
             })
         }
     },
-
+    //  返回首页
+    getback(){
+        wx.navigateTo({
+            url: '../../../pages/index/index',
+        });
+    },
+    //支付反馈
+    async acceptResult(e) {
+        let {
+            activeOrder
+        } = this.data
+        let that = this
+        let {
+            params,
+            no
+        } = e.detail;
+        that.setData({
+            showPayment: false
+        })
+        try {
+            if (params == "ok") {
+                activeOrder.set("status", 100)
+                activeOrder.set("isPay", true)
+                await activeOrder.save()
+                wx.showToast({
+                    title: '支付成功',
+                    icon: 'none',
+                    duration: 1500,
+                    mask: false,
+                });
+                wx.navigateBack({
+                    delta: 1,
+                })
+            } else {
+                wx.showToast({
+                    title: '支付失败，取消订单',
+                    icon: 'none',
+                    duration: 1500,
+                    mask: false,
+                });
+            }
+        } catch (error) {
+            console.log(error)
+            wx.showToast({
+                title: "支付失败",
+                icon: "error",
+                duration: 1500,
+            });
+            wx.hideLoading()
+        }
+    },
     /**
      * 生命周期函数--监听页面初次渲染完成
      */

nova-tourism/pages/homestay/homestay-order2/index.json

@@ -1,3 +1,7 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "van-divider": "@vant/weapp/divider/index",
+    "van-field": "@vant/weapp/field/index",
+    "van-icon": "@vant/weapp/icon/index"
+  }
 }

nova-tourism/pages/homestay/homestay-order2/index.less

@@ -1,8 +1,9 @@
 /* nova-tourism/pages/homestay/homestay-order2/index.wxss */
 .all{
     width: 100vw;
-    padding-left: 20rpx;
-    padding-right: 20rpx;
+    padding-left: 30rpx;
+    padding-right: 30rpx;
+    position: relative;
     .timebox{
         width: 100%;
         height: 50rpx;
@@ -13,4 +14,115 @@
             margin-right: 40rpx;
         }
     }
+    .roombox{
+        width: 100%;
+        display: flex;
+        margin-top: 40rpx;
+        image{
+            width: 170rpx;
+            height: 170rpx;
+            border-radius: 10rpx;
+        }
+        .room{
+            height: 100%;
+            margin-left: 20rpx;
+            .room-name{
+                font-size: 28rpx;
+                font-weight: 600;
+                margin-bottom: 24rpx;
+
+            }
+            .room-tag{
+                font-size: 26rpx;
+                width: 480rpx;
+                height: auto;
+                color: #F37B40;
+                margin-bottom: 10rpx;
+            }
+            .room-text{
+                width: 480rpx;
+                height: auto;
+                font-size: 26rpx;
+                color: #737373;
+            }
+        }
+    }
+    .lable{
+        color: black;
+    }
+    .benefitbox{
+        width: 100%;
+        height: auto;
+        font-size: 28rpx;
+        .benefitbox1{
+            margin-bottom: 40rpx;
+        }
+        .benefitbox2{
+            width: 100%;
+            display: flex;
+            margin-bottom: 40rpx;
+            .benefitbox2-text{
+                width: 120rpx;
+            }
+            .benefitbox2-text2{
+                display: flex;
+                margin-left: auto;
+                color:#F37B40;
+            }
+            .benefitbox2-text_2{
+                display: flex;
+                margin-left: auto;
+                margin-right: 30rpx;
+                color:#F37B40;
+            }
+            .benefitbox2-text_22{
+                display: flex;
+                margin-left: auto;
+                margin-right: 30rpx;
+            }
+
+        }
+    }
+    .benefitbox2{
+        width: 100%;
+        display: flex;
+        margin-bottom: 40rpx;
+        .benefitbox2-text{
+            width: 120rpx;
+        }
+        .benefitbox2-text_22{
+            display: flex;
+            margin-left: auto;
+            margin-right: 30rpx;
+        }
+
+    }
+    .subbox{
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 90rpx;
+        display: flex;
+        font-size: 30rpx;
+        .subbox1{
+            width: 40%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+        .subbox2{
+            width: 60%;
+            height: 100%;
+            background-color: #F89B7F;
+            color: white;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            .subbox2_2{
+                margin-left: 10rpx;
+            }
+        }
+        
+    }
 }

nova-tourism/pages/homestay/homestay-order2/index.wxml

@@ -1,9 +1,67 @@
 <!--nova-tourism/pages/homestay/homestay-order2/index.wxml-->
-<nav type="back" background-color="#ffffff" frontColor="#000000" title="{{roomList[0].shop.storeName}}" />
+<nav type="back" background-color="#ffffff" frontColor="#000000" title="{{room.shop.storeName}}" />
 <view class="all" style="height: {{contentHeight}}rpx;">
     <view class="timebox">
         <view class="time1">{{date}}</view>
         <view>{{count}}晚</view>
     </view>
+    <view class="roombox">
+        <image src="{{room.images[0]}}"></image>
+        <view class="room">
+            <view class="room-name">{{room.name}}</view>
+            <view class="room-tag">
+                <block wx:for="{{room.tags}}">
+                    {{item}}
+                </block>
+            </view>
+            <view class="room-text">{{date2}}</view>
+        </view>
+    </view>
+    <van-divider customStyle="margin: 20rpx;border-color:'#B1B1B1' " />
+    <van-cell-group>
+        <van-field label-class='lable' value="{{ name }}" required label="住客姓名" placeholder="请输入姓名" bind:change='getname' border="{{ false }}" />
+        <van-field label-class='lable' value="{{ mobile }}" error-message="{{error_message}}" required label="联系电话" placeholder="请输入电话" border="{{ false }}" bind:blur='getmobile' />
+    </van-cell-group>
+    <van-divider customStyle="margin: 20rpx;border-color:'#B1B1B1' " />
+    <view class="benefitbox">
+        <view class="benefitbox1">本单可享</view>
+        <view class="benefitbox2">
+            <view class="benefitbox2-text">优惠卷</view>
+            <view class="benefitbox2-text2">
+                减￥1000
+                <van-icon name="arrow" size='30rpx' color="gray" />
+            </view>
+        </view>
+        <view class="benefitbox2">
+            <view class="benefitbox2-text">促销福利</view>
+            <view class="benefitbox2-text_2">
+                减￥1000
+            </view>
+        </view>
+        <view class="benefitbox2">
+            <view class="benefitbox2-text">会员福利</view>
+            <view class="benefitbox2-text_2">
+                减￥1000
+            </view>
+        </view>
+    </view>
+    <van-divider customStyle="margin: 20rpx;border-color:'#B1B1B1' " />
+    <view class="benefitbox2">
+        <view class="benefitbox2-text">发票</view>
+        <view class="benefitbox2-text_22">
+            酒店开票
+        </view>
+    </view>
 
+    <view class="subbox">
+        <view class="subbox1" bindtap="getback">首页</view>
+        <view class="subbox2" bindtap="submit">
+            <view class="subbox2_1">优惠100</view>
+            <view class="subbox2_2">实付款￥{{count*room.price}}</view>
+        </view>
+    </view>
 </view>
+
+<!-- 支付组件 -->
+<payment style="z-index: 99999;" id='payMent' show="{{showPayment}}" tradeNo="{{tradeNo}}" price="{{count*room.price}}"
+	bind:payResult='acceptResult' showType="all" />

nova-tourism/pages/homestay/homestay-order2/index.wxss

@@ -1 +1 @@
-.all{width:100vw;padding-left:20rpx;padding-right:20rpx}.all .timebox{width:100%;height:50rpx;margin-top:10rpx;font-size:30rpx;display:flex}.all .timebox .time1{margin-right:40rpx}
+.all{width:100vw;padding-left:30rpx;padding-right:30rpx;position:relative}.all .timebox{width:100%;height:50rpx;margin-top:10rpx;font-size:30rpx;display:flex}.all .timebox .time1{margin-right:40rpx}.all .roombox{width:100%;display:flex;margin-top:40rpx}.all .roombox image{width:170rpx;height:170rpx;border-radius:10rpx}.all .roombox .room{height:100%;margin-left:20rpx}.all .roombox .room .room-name{font-size:28rpx;font-weight:600;margin-bottom:24rpx}.all .roombox .room .room-tag{font-size:26rpx;width:480rpx;height:auto;color:#F37B40;margin-bottom:10rpx}.all .roombox .room .room-text{width:480rpx;height:auto;font-size:26rpx;color:#737373}.all .lable{color:black}.all .benefitbox{width:100%;height:auto;font-size:28rpx}.all .benefitbox .benefitbox1{margin-bottom:40rpx}.all .benefitbox .benefitbox2{width:100%;display:flex;margin-bottom:40rpx}.all .benefitbox .benefitbox2 .benefitbox2-text{width:120rpx}.all .benefitbox .benefitbox2 .benefitbox2-text2{display:flex;margin-left:auto;color:#F37B40}.all .benefitbox .benefitbox2 .benefitbox2-text_2{display:flex;margin-left:auto;margin-right:30rpx;color:#F37B40}.all .benefitbox .benefitbox2 .benefitbox2-text_22{display:flex;margin-left:auto;margin-right:30rpx}.all .benefitbox2{width:100%;display:flex;margin-bottom:40rpx}.all .benefitbox2 .benefitbox2-text{width:120rpx}.all .benefitbox2 .benefitbox2-text_22{display:flex;margin-left:auto;margin-right:30rpx}.all .subbox{position:absolute;bottom:0;left:0;width:100%;height:90rpx;display:flex;font-size:30rpx}.all .subbox .subbox1{width:40%;display:flex;justify-content:center;align-items:center}.all .subbox .subbox2{width:60%;height:100%;background-color:#F89B7F;color:white;display:flex;justify-content:center;align-items:center}.all .subbox .subbox2 .subbox2_2{margin-left:10rpx}