feat：添加酒店预订模块

src/app.scss

@@ -47,9 +47,9 @@ view,text,div {
 /* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
 @font-face {
     font-family: 'iconfont';  /* Project id 3748689 */
-    src: url('//at.alicdn.com/t/c/font_3748689_ve67hfiiel.woff2?t=1689921473246') format('woff2'),
-         url('//at.alicdn.com/t/c/font_3748689_ve67hfiiel.woff?t=1689921473246') format('woff'),
-         url('//at.alicdn.com/t/c/font_3748689_ve67hfiiel.ttf?t=1689921473246') format('truetype');
+    src: url('//at.alicdn.com/t/c/font_3748689_3gha90do7me.woff2?t=1690376314279') format('woff2'),
+         url('//at.alicdn.com/t/c/font_3748689_3gha90do7me.woff?t=1690376314279') format('woff'),
+         url('//at.alicdn.com/t/c/font_3748689_3gha90do7me.ttf?t=1690376314279') format('truetype');
   }
 
 .iconfont {

src/pages.json

@@ -364,6 +364,18 @@
 						"navigationStyle": "custom"
 					}
 				},
+				{
+					"path": "hotel/hotelDetail",
+					"style": {
+						"navigationBarTitleText": "酒店民宿"
+					}
+				},
+				{
+					"path": "hotel/orderDetail",
+					"style": {
+						"navigationBarTitleText": ""
+					}
+				},
 
 				{
 					"path": "order/verificationCode",

src/pages/orderingfood/tabs.js

@@ -1,13 +1,13 @@
 export default [
   {
-      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/9b77a4e9651ebb272f58972297f15989c8e7dfe2png",
+      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/d201a5541214b9b4fa010638012872d0c33c9587png",
       url: "/pagesB/orderingfood/fineFood",
-      tit: "餐厅"
+      tit: "美食饮品"
   },
   {
-      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/c49b23e0145a7c4e52183ae0850d0948e2ada385png",
-      url: "/pagesB/orderingfood/fineFood",
-      tit: "饮品"
+      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/83906365c174dcc7acf620d7247f80f9f1818d6epng",
+      url: "/pagesB/hotel/index",
+      tit: "酒店民宿"
   },
   {
       ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/e3d3719e646469f2615abce1ef61753ea7de0b19png",
@@ -22,7 +22,7 @@ export default [
   {
       ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/8da4591235832a8475719f9b515d918132bda879png",
       url: "/pagesB/directCharge/index?type=2",
-      tit: "折扣券"
+      tit: "卡券"
   },
   {
       ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/06b44cf0c78938c9740a13826cd7b3777c7bb1c6png",
@@ -35,14 +35,14 @@ export default [
       tit: "加油"
   },
   {
-      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/83906365c174dcc7acf620d7247f80f9f1818d6epng",
-      url: "/pagesB/hotel/index",
-      tit: "酒店"
+      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/b839413bd50aa2a8326730eb56b3ec2382dc4b99png",
+      url: "",
+      tit: "机票"
   },
   {
-      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/3ef239b805b42b155d05ddeb3e3755c1a6522633png",
+      ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/8a0b4789778aca7d6664498e15da08b9a04244b0png",
       url: "",
-      tit: "出行"
+      tit: "景区景点"
   },
   {
       ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/4089ec6a9c87e91d4ed8207562b87e9bd48b8c9dpng",
@@ -54,11 +54,6 @@ export default [
 //       url: "",
 //       tit: "丽人医美"
 //   },
-  // {
-  //     ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/8b0b0de11b1d5b2e3e97cf3b20d489ecdb32f27epng",
-  //     url: "",
-  //     tit: "景区"
-  // },
   // {
   //     ico: "http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/67e25d80a52975f21eebe115c782984aa2dfa2d3png",
   //     url: "",

src/pagesB/components/number-box/number-box.vue

@@ -43,7 +43,7 @@
 		},
 		watch: {
 			value(val) {
-				this.inputValue = +val;
+				this.inputValue = val;
 			}
 		},
 		methods: {

src/pagesB/directCharge/orderDetail.vue

@@ -4,7 +4,7 @@
             <image :src="order.product_img" class="p_img" mode="widthFix" />
             <div class="p_t">{{ order.product_name }}</div>
         </div>
-        <div class="card qupiao" v-if="detail.order_no">
+        <div class="card qupiao" v-for="(detail,s) in orders" :key="s">
             <uqrcode ref="uqcode" v-if="[0,2].includes(detail.card_type)" :code="detail.unique_code" class="code-img" :size="150" />
             <tki-barcode v-if="[1,2].includes(detail.card_type)" :val="detail.unique_code" />
             <p @click="copyText(detail.card_no)" v-if="detail.card_no">
@@ -21,6 +21,10 @@
             </p>
         </div>
         <div class="money card" v-if="order.type==2">
+            <div class="li flex_r flex_jb">
+                <span>数量</span>
+                <span>x {{ order.number }}</span>
+            </div>
             <div class="li flex_r flex_jb">
                 <span>消费金额</span>
                 <span>￥{{ order.order_amount || 0 }}</span>
@@ -39,6 +43,7 @@
                 <p>产品品牌：{{ order.restaurant_name }}</p>
                 <p>产品名称：{{ order.product_name }}</p>
             </template>
+            <p>数量：{{ order.number }}</p>
             <p>订单金额：￥{{ order.pay_amount }}</p>
             <p>订单编号：{{ order.trade_no }}</p>
             <p>下单时间：{{ order.create_time }}</p>
@@ -62,7 +67,7 @@ export default {
     data() {
         return {
             order: {},
-            detail: {},
+            orders: [],
             pda: {},
             Integral: 0,
             deduction: 0,
@@ -78,7 +83,7 @@ export default {
                     delete da.orderGoods;
                     this.order = da;
                     if(res.data.detail.code == 200){
-                        this.detail = res.data.detail.data[0];
+                        this.orders = res.data.detail.data;
                     }
                     if(this.order.type==2) this.getIntegral()
                 }

src/pagesB/hotel/hotel.vue

@@ -18,9 +18,9 @@
             <div class="RatePlan">
                 <div class="Room" v-for="(i,s) in RatePlan" :key="s">
                     <div class="Room_row flex_r flex_jb" @click="onshow(s)">
-                        <div class="h_img">
+                        <div class="h_img" @click="onpreview2(i.pictures)">
                             <div class="img_num">{{i.pictures.length}}</div>
-                            <image :src="i.pictures[0].path" mode="aspectFill" class="img"/>
+                            <image :src="i.pictures[0].path" mode="aspectFill" class="img" />
                         </div>
                         <div class="info">
                             <div class="RName">{{i.roomName}}</div>
@@ -34,7 +34,7 @@
                                 <span>{{ i.floor }}</span>
                             </div>
                             <div class="item_price">
-                                <div class="dinB price" v-if="i.ratePlans[0]">{{ i.ratePlans[0].averagePrice }}</div>
+                                <div class="dinB price" v-if="i.ratePlans[0]">{{ i.ratePlans[0].aveOriginalPrice }}</div>
                                 <div class="price" v-else>暂无报价</div>
                             </div>
                         </div>
@@ -46,24 +46,24 @@
                                 <span class="breakfast">{{ a.breakfast }}</span>
                             </div>
                             <div class="cancelRule">{{ a.cancelRule.desc }}</div>
-                            <div class="reserve flex_r flex_je flex_ae">
-                                <div class="price dinB">{{ a.averagePrice }}</div>
-                                <div class="reserve_btn"><div class="t1">预订</div>在线付</div>
+                            <div class="reserve flex_r flex_je flex_ae" @click="hotelDetail(i,a)">
+                                <div class="price dinB">{{ a.aveOriginalPrice }}</div>
+                                <div class="reserve_btn">
+                                    <div class="t1">预订</div>在线付
+                                </div>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
-
         <!-- 图片查看组件 -->
         <preview ref="previewimg" />
     </div>
 </template>
-
 <script>
 import preview from "@/pagesB/components/swiper-preview/index.vue";
-import { getCache } from "@/utils/storage.js";
+import { setCache, getCache } from "@/utils/storage.js";
 import { post } from "@/request/api.js";
 export default {
     name: "hotel",
@@ -82,7 +82,8 @@ export default {
             let { checkInDate, checkOutDate } = this.query;
             post("/local/hotel/detail", {
                 hotelID: this.hotelID,
-                checkInDate, checkOutDate,
+                checkInDate,
+                checkOutDate,
             }).then((res) => {
                 if (res.code == 0) {
                     this.detail = res.data.data;
@@ -90,7 +91,8 @@ export default {
             });
             post("/local/hotel/room", {
                 hotelID: this.hotelID,
-                checkInDate, checkOutDate,
+                checkInDate,
+                checkOutDate,
             }).then((res) => {
                 if (res.code == 0) {
                     this.RatePlan = res.data.data.rooms;
@@ -105,8 +107,22 @@ export default {
                 });
             }
         },
-        onshow(i){
-            this.$set(this.RatePlan[i],'show',!this.RatePlan[i].show)
+        onpreview2(arr) {
+            if (arr.length) {
+                this.$refs.previewimg.open({
+                    imgs: arr,
+                    current: 0,
+                });
+            }
+        },
+        onshow(i) {
+            this.$set(this.RatePlan[i], 'show', !this.RatePlan[i].show)
+        },
+        hotelDetail(a, b) {
+            let { checkInDate, checkOutDate } = this.query;
+            let qd = Object.assign({ checkInDate, checkOutDate, hotelID: this.hotelID }, a, b);
+            setCache("roomInfo", qd)
+            this.goto("/pagesB/hotel/hotelDetail");
         }
     },
     onLoad(da) {
@@ -118,7 +134,6 @@ export default {
     mounted() {},
 };
 </script>
-
 <style scoped lang='scss'>
 .head_img {
     .bg_img {
@@ -126,30 +141,38 @@ export default {
         height: 460rpx;
     }
 }
+
 .head_info {
     padding: 0 30rpx;
+
     .head_name {
         font-size: 36rpx;
         font-weight: 600;
         padding: 8rpx 0;
     }
+
     .h_tags {
         font-size: 25rpx;
         font-weight: 400;
+
         span {
             margin-right: 18rpx;
+
             &:last-child {
                 margin-right: 0;
             }
         }
     }
+
     .h_address {
         padding: 8rpx 0;
         margin-bottom: 30rpx;
+
         .address {
             width: calc(100% - 100rpx);
             font-size: 24rpx;
         }
+
         .ico {
             width: 60rpx;
             height: 50rpx;
@@ -159,26 +182,31 @@ export default {
         }
     }
 }
-.RatePlan{
-    .Room{
+
+.RatePlan {
+    .Room {
         background-color: #fff;
         padding: 15rpx 18rpx;
         margin-bottom: 12rpx;
         border-radius: 10rpx;
         box-shadow: 4rpx 4rpx 18rpx 2rpx rgba(17, 18, 29, 0.1);
-        &:last-child{
+
+        &:last-child {
             margin-bottom: 0;
         }
-        .h_img{
+
+        .h_img {
             position: relative;
             width: 160rpx;
             height: 180rpx;
-            .img{
+
+            .img {
                 width: 160rpx;
                 height: 180rpx;
                 border-radius: 8rpx;
             }
-            .img_num{
+
+            .img_num {
                 background-color: rgba($color: #000, $alpha: 0.6);
                 position: absolute;
                 right: 12rpx;
@@ -189,103 +217,126 @@ export default {
                 border-radius: 6rpx;
             }
         }
-        .info{
+
+        .info {
             position: relative;
             width: calc(100% - 186rpx);
-            .RName{
+
+            .RName {
                 font-size: 34rpx;
                 font-weight: 600;
                 margin-bottom: 8rpx;
             }
-            .tegs{
+
+            .tegs {
                 font-size: 24rpx;
                 color: #666;
                 margin-bottom: 8rpx;
-                &:last-child{
+
+                &:last-child {
                     margin-bottom: 0;
                 }
-                span{
+
+                span {
                     margin-right: 16rpx;
-                    &:last-child{
+
+                    &:last-child {
                         margin-right: 0;
                     }
                 }
             }
-            .item_price{
+
+            .item_price {
                 width: 100%;
                 text-align: right;
                 position: absolute;
-                bottom: 0;right: 0;
+                bottom: 0;
+                right: 0;
             }
-            .price{
+
+            .price {
                 color: #666;
                 font-size: 28rpx;
             }
-            .dinB{
+
+            .dinB {
                 font-size: 36rpx;
                 color: #00B76C;
-                &::before{
+
+                &::before {
                     content: "￥";
                     font-size: 22rpx;
                 }
-                &::after{
+
+                &::after {
                     content: "起";
                     margin-left: 6rpx;
                     font-size: 22rpx;
                 }
             }
         }
-        .Plans{
+
+        .Plans {
             margin-top: 20rpx;
             padding: 16rpx 22rpx;
             border-radius: 10rpx;
             background-color: rgba($color: #000, $alpha: 0.05);
         }
-        .p_li{
+
+        .p_li {
             padding: 12rpx 0;
             min-height: 100rpx;
             margin-bottom: 10rpx;
             border-bottom: 1rpx solid rgba($color: #000, $alpha: 0.05);
-            &:last-child{
+
+            &:last-child {
                 margin-bottom: 0;
                 border-bottom: none;
             }
-            .ratePlanName{
+
+            .ratePlanName {
                 font-size: 30rpx;
                 font-weight: 600;
-                span{
+
+                span {
                     vertical-align: middle;
                 }
             }
-            .breakfast{
+
+            .breakfast {
                 font-size: 24rpx;
                 margin-top: 6rpx;
                 font-weight: 400;
                 margin-left: 16rpx;
             }
-            .cancelRule{
+
+            .cancelRule {
                 font-size: 24rpx;
                 margin-top: 6rpx;
                 color: #555;
             }
-            .reserve{
-                .price{
+
+            .reserve {
+                .price {
                     font-size: 36rpx;
                     color: #00B76C;
                     margin-right: 20rpx;
-                    &::before{
+
+                    &::before {
                         content: "￥";
                         font-size: 24rpx;
                     }
                 }
-                .reserve_btn{
+
+                .reserve_btn {
                     text-align: center;
                     font-size: 20rpx;
                     color: #555;
                     border: 1rpx solid #00B76C;
                     border-radius: 10rpx;
                     width: 80rpx;
-                    .t1{
+
+                    .t1 {
                         background: #00B76C;
                         color: #fff;
                         font-size: 24rpx;

src/pagesB/hotel/hotelDetail.vue

@@ -0,0 +1,386 @@
+<template>
+    <div class="hotelDetail">
+        <div class="hotelinnfo">
+            <div class="p p1 flex_r flex_js flex_ac">
+                <div class="day">
+                    <span>{{ daydate(roomInfo.checkInDate) }}</span>
+                    <span class="teg">{{ getThatDay(roomInfo.checkInDate) }}</span>
+                </div>
+                <div class="daynum">{{ numberdays }} 晚</div>
+                <div class="day">
+                    <span>{{ daydate(roomInfo.checkOutDate) }}</span>
+                    <span class="teg">{{ getThatDay(roomInfo.checkOutDate) }}</span>
+                </div>
+            </div>
+            <div class="p p2 iconfont">{{roomInfo.roomName}}&#xe605;{{roomInfo.ratePlanName}}</div>
+            <div class="p p3">
+                <span>{{ roomInfo.bedType }}</span>
+                <span>{{ roomInfo.windowType }}</span>
+                <span>{{ roomInfo.breakfast }}</span>
+                <span>可入住{{ roomInfo.capacity }}人</span>
+            </div>
+            <div class="p4">
+                <span class="iconfont">&#xe636;</span>
+                <span>{{ roomInfo.cancelRule.desc }}</span>
+            </div>
+        </div>
+        <div class="userinfo">
+            <div class="tit">入住信息</div>
+            <div class="p flex_r flex_js flex_ac">
+                <span class="label">房间数量</span>
+                <scroll-view class="scroll_H" :scroll-x="true">
+                    <div class="rommnum">
+                        <template v-for="i in 8">
+                            <div :class="{'r_num':true,'active':qda.roomNum==i}" :key="i" v-if="i>0" @click="roomNumf(i)">{{ i }} 间</div>
+                        </template>
+                    </div>
+                </scroll-view>
+            </div>
+            <div class="p flex_r flex_jb flex_ac">
+                <span class="label">住客姓名</span>
+                <input v-model="qda.contactName" />
+            </div>
+            <div class="p flex_r flex_jb flex_ac">
+                <span class="label">联系电话</span>
+                <input v-model="qda.contactMobile" />
+            </div>
+            <div class="p flex_r flex_js flex_ac">
+                <span class="label">最晚到店</span>
+                <scroll-view class="scroll_H" :scroll-x="true">
+                    <div class="rommnum">
+                        <div v-for="(a,b) in Timearr" :key="b" class="r_num" :class="[a.active?'active':'']" @click="Timeitem(b,a.t)">{{ a.v }}</div>
+                    </div>
+                </scroll-view>
+            </div>
+            <div class="p flex_r flex_jb flex_ac">
+                <span class="label">备注</span>
+                <input v-model="qda.orderRemark" />
+            </div>
+        </div>
+        <div class="money card">
+            <div class="li flex_r flex_jb">
+                <span>消费金额</span>
+                <span>￥{{ cartTotal || 0 }}</span>
+            </div>
+            <div class="li flex_r flex_jb">
+                <span>消费金抵扣<span class="corg">{{Integral}}%</span></span>
+                <span class="corg">-￥{{ deduction || 0 }}</span>
+            </div>
+            <div class="li flex_r flex_jb">
+                <span>实付金额</span>
+                <span>￥{{ actuallypaid || 0 }}</span>
+            </div>
+        </div>
+        <div class="money card">
+            <div class="li flex_r flex_jb">
+                <span>赠送茶宝</span>
+                <span>{{ chabao || 0 }}</span>
+            </div>
+        </div>
+        <div class="footbtn" @click="onpay">立即支付</div>
+    </div>
+</template>
+<script>
+import { ToPayOpre } from "@/utils/reqTools.js";
+let toPayOpre = new ToPayOpre();
+import { getCache } from "@/utils/storage.js";
+import { post } from "@/request/api.js";
+import { getThatDay, getDaysBetween } from "@/utils/myfun.js"
+export default {
+    name: "hotelDetail",
+    props: {},
+    components: {},
+    data() {
+        return {
+            numberdays: 1,
+            qda: {},
+            roomInfo: getCache("roomInfo"),
+            userinfo: uni.getStorageSync("userinfo"),
+            ratio: {},
+            cartTotal: 0,
+            Integral: 0,
+            deduction: 0,
+            actuallypaid: 0,
+            chabao: 0,
+
+            Timearr: [], //最晚时间数组
+
+            guestNames: [], // 房客姓名，每个房间预留一个房客姓名。长度需和房间数量保持一致
+        };
+    },
+    methods: {
+        getThatDay,
+        getDaysBetween,
+        getIntegral() {
+            post("local/getIntegral", { type: 4 }).then(res => {
+                if (res.code == 0) {
+                    this.ratio = res.data;
+                    this.computef();
+                }
+            })
+        },
+        computef() {
+            let { integral, chabao } = this.ratio
+            let i1 = integral,
+                i2 = chabao;
+            let Total = this.$h.Mul(this.roomInfo.aveOriginalPrice, this.numberdays);
+            this.cartTotal = this.$h.Mul(Total, this.qda.roomNum);
+            this.Integral = this.$h.Mul(i1, 100);
+            this.deduction = this.$h.Mul(this.cartTotal, i1);
+            this.actuallypaid = this.$h.Sub(this.cartTotal, this.deduction);
+            this.chabao = this.$h.Mul(this.actuallypaid, i2);
+        },
+        arriveTimearr(){
+            let tim = this.$day(this.roomInfo.checkInDate + " 18:00:00"), arr = [];
+            for (let a = 0; a < 9; a++) {
+                let t = tim.add(a,"h")
+                arr.push({
+                    t: t.format("YYYY-MM-DD HH:mm"),
+                    v: t.format("HH:mm"),
+                    active: false
+                })
+            }
+            this.Timearr = arr;
+            this.qda.arriveTime = arr[2].t
+            this.Timearr[2].active = true
+        },
+        daydate(va) {
+            return this.$day(va).format("M月DD日")
+        },
+        roomNumf(va) {
+            this.qda.roomNum = va
+            this.computef();
+            this.guestNames = []
+            for (let a = 0; a < va; a++) {
+                this.guestNames.push(this.qda.contactName)
+            }
+        },
+        Timeitem(inx,va){
+            for (let i of this.Timearr) {
+                i.active = false
+            }
+            this.$set(this.Timearr[inx],"active",true)
+            this.qda.arriveTime = va
+        },
+        onpay() {
+            let da = {
+                ...this.qda,
+                hotelID: this.roomInfo.hotelID,
+                ratePlanID: this.roomInfo.ratePlanId,
+                checkInDate: this.roomInfo.checkInDate,
+                checkOutDate: this.roomInfo.checkOutDate,
+                guestNames: this.guestNames,
+                // orderAmount: this.actuallypaid
+            }
+            post("local/hotel/addOrder", da).then(res => {
+                if (res.code == 0 && res.data.prepayid) {
+                    toPayOpre.toPay(res.data, (rea) => {
+                        if (!rea) {
+                            // 支付成功
+                            this.goto("/pagesB/orderingfood/orderlist")
+                        } else {
+                            // 支付失败
+                        }
+                    });
+                }
+            })
+        }
+    },
+    onLoad(da) {
+        // this.roomInfo = getCache("roomInfo");
+        this.getIntegral();
+        this.qda = {
+            roomNum: 1,
+            contactName: this.userinfo.nickname,
+            contactMobile: this.userinfo.mobile
+        }
+        this.roomNumf(1);
+        this.numberdays = getDaysBetween(this.roomInfo.checkInDate, this.roomInfo.checkOutDate);
+        this.arriveTimearr();
+    },
+    onShow() {},
+    mounted() {},
+};
+</script>
+<style scoped lang='scss'>
+.hotelDetail {
+    padding: 28rpx 32rpx;
+}
+
+.hotelinnfo {
+    background-color: #fff;
+    border-radius: 16rpx;
+    padding: 26rpx 30rpx;
+    box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.1);
+
+    .daynum {
+        margin: 0 36rpx;
+        font-size: 32rpx;
+        padding: 3rpx 16rpx;
+        border-radius: 8rpx;
+        background-color: rgba($color: #000, $alpha: 0.06);
+    }
+
+    .day {
+        font-size: 36rpx;
+        font-weight: 600;
+
+        span {
+            vertical-align: middle;
+        }
+    }
+
+    .teg {
+        font-weight: 400;
+        font-size: 26rpx;
+        margin-left: 10rpx;
+    }
+
+    .p2 {
+        font-size: 34rpx;
+        font-weight: 600;
+    }
+
+    .p3 {
+        font-size: 28rpx;
+
+        span {
+            margin-right: 16rpx;
+
+            :last-child {
+                margin-right: 0;
+            }
+        }
+    }
+
+    .p4 {
+        color: #00B76C;
+        font-size: 26rpx;
+
+        .iconfont {
+            margin-right: 16rpx;
+            color: #00B76C;
+        }
+    }
+
+    .p {
+        margin-bottom: 16rpx;
+
+        &:last-child {
+            margin-bottom: 0;
+        }
+    }
+}
+
+.userinfo {
+    background-color: #fff;
+    border-radius: 16rpx;
+    padding: 26rpx 30rpx;
+    margin: 30rpx 0;
+    box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.1);
+
+    .tit {
+        font-size: 34rpx;
+        font-weight: 600;
+        margin-bottom: 16rpx;
+    }
+
+    .p {
+        padding: 10rpx 0;
+        margin-bottom: 6rpx;
+        border-bottom: 1px solid rgba($color: #000, $alpha: 0.05);
+
+        &:last-child {
+            margin-bottom: 0;
+            border-bottom: none;
+        }
+
+        .label {
+            display: inline-block;
+            width: 136rpx;
+            font-size: 28rpx;
+            color: #999;
+        }
+
+        .scroll_H {
+            width: calc(100% - 136rpx);
+        }
+
+        input {
+            font-size: 30rpx;
+            width: calc(100% - 136rpx);
+            padding-left: 12rpx;
+        }
+    }
+
+    .rommnum {
+        white-space: nowrap;
+
+        .r_num {
+            display: inline-block;
+            margin-right: 18rpx;
+            padding: 10rpx 20rpx;
+            font-size: 26rpx;
+            border-radius: 8rpx;
+            border: 1rpx solid rgba($color: #000, $alpha: 0.032);
+            background-color: rgba($color: #000, $alpha: 0.032);
+
+            &:last-child {
+                margin-right: 0;
+            }
+
+            &.active {
+                border-color: rgba($color: #00B76C, $alpha: 0.36);
+                background-color: rgba($color: #00B76C, $alpha: 0.06);
+            }
+        }
+    }
+
+}
+
+.money {
+    .li {
+        margin-bottom: 16rpx;
+
+        &:last-child {
+            margin-bottom: 0;
+        }
+
+        span {
+            font-size: 30rpx;
+        }
+    }
+
+    .corg {
+        color: #18bb88;
+        margin-left: 12rpx;
+    }
+}
+
+.card {
+    background-color: #fff;
+    border-radius: 20rpx;
+    margin-bottom: 30rpx;
+    padding: 28rpx 30rpx;
+    font-size: 32rpx;
+    box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.1);
+
+    &:last-child {
+        margin-bottom: 0;
+    }
+}
+
+.footbtn {
+    width: calc(100% - 60rpx);
+    height: 80rpx;
+    background: #17bb87;
+    border-radius: 45rpx;
+    position: fixed;
+    bottom: 50rpx;
+    left: 30rpx;
+    color: #fff;
+    font-size: 36rpx;
+    text-align: center;
+    line-height: 80rpx;
+}
+</style>

src/pagesB/hotel/hotelList.vue

@@ -12,7 +12,7 @@
                                 <span>{{i.avgScore}}分</span>
                                 <span class="hotelStar">{{ hotelStarF(i.hotelStar) }}</span>
                             </div>
-                            <div class="dinB price" v-if="i.startingPrice">{{ i.startingPrice }}</div>
+                            <div class="dinB price" v-if="i.starOriginalPrice">{{ i.starOriginalPrice }}</div>
                             <div class="price" v-else>暂无报价</div>
                         </div>
                     </div>
@@ -39,12 +39,15 @@ export default {
         gethotelList(){
             post("local/hotel/hotelList", this.query).then(res => {
                 if (res.code == 0) {
-                    this.hotelList = res.data.data.hotelList
+                    let da = res.data.data.hotelList;
+                    this.hotelList = [...this.hotelList,...da]
                 }
             })
         },
         scrolltolower(){
-            console.log("scrolltolower");
+            // console.log("scrolltolower");
+            this.query.pageIndex++;
+            this.gethotelList();
         },
         hotelById(id){
             this.goto("/pagesB/hotel/hotel",{id});

src/pagesB/hotel/index.vue

@@ -63,7 +63,7 @@
         </dev>
         <div class="footimg">
             <image @click="search" class="btn" src="http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/7603bae2564783682b68b025003cae9012f917dcpng" mode="widthFix">
-            <image class="img" src="http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/2fd3f66be733feca588418d4a9537b3b1560431cpng" mode="widthFix">
+                <image class="img" src="http://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/head_pic/2fd3f66be733feca588418d4a9537b3b1560431cpng" mode="widthFix">
         </div>
     </div>
 </template>
@@ -112,14 +112,14 @@ export default {
                 { p: [400, 600], txt: "￥400-600" },
                 { p: [600, 800], txt: "￥600-800" },
                 { p: [800, 1500], txt: "￥800-1500" },
-                { p: [1500,1500], txt: "￥1500以上" },
+                { p: [1500, 1500], txt: "￥1500以上" },
             ],
             Leve: undefined,
             Levels: [
-                {v:2,t:"二星/经济"},
-                {v:3,t:"三星/舒适"},
-                {v:4,t:"四星/高档"},
-                {v:5,t:"五星/豪华"},
+                { v: 2, t: "二星/经济" },
+                { v: 3, t: "三星/舒适" },
+                { v: 4, t: "四星/高档" },
+                { v: 5, t: "五星/豪华" },
             ]
         };
     },
@@ -140,7 +140,7 @@ export default {
         },
         search() {
             let qd = Object.assign({}, this.qda)
-            setCache("hotelquery",qd);
+            setCache("hotelquery", qd);
             this.goto("/pagesB/hotel/hotelList");
         },
         // 获取当前位置
@@ -172,37 +172,37 @@ export default {
                 }
             });
         },
-        onRange(va){
+        onRange(va) {
             this.priceRange = va.p
-            setTimeout(()=>{
+            setTimeout(() => {
                 this.numinfo = va.txt
-            },0)
+            }, 0)
         },
-        activef(va){
-            if(va.p[0]==this.priceRange[0]&&va.p[1]==this.priceRange[1]){
+        activef(va) {
+            if (va.p[0] == this.priceRange[0] && va.p[1] == this.priceRange[1]) {
                 return true
-            }else return false
+            } else return false
         },
-        onLevel(va){
-            if(this.Leve == va.v){
+        onLevel(va) {
+            if (this.Leve == va.v) {
                 this.Leve = undefined
-            }else this.Leve = va.v
+            } else this.Leve = va.v
         },
-        confirm(){
-            if(this.priceRange.length){
+        confirm() {
+            if (this.priceRange.length) {
                 this.qda.minPrice = this.priceRange[0]
-                if(this.priceRange[0]!=this.priceRange[1]){
+                if (this.priceRange[0] != this.priceRange[1]) {
                     this.qda.maxPrice = this.priceRange[1]
-                }else{
+                } else {
                     delete this.qda.maxPrice;
                 }
             }
-            if(this.Leve){
+            if (this.Leve) {
                 this.qda.hotelStars = this.Leve
             }
             this.popupShow = false
         },
-        reset(){
+        reset() {
             this.priceRange = [];
             delete this.qda.minPrice;
             delete this.qda.maxPrice;
@@ -327,13 +327,16 @@ export default {
         width: 366rpx;
         margin-left: 16rpx;
     }
-    .location{
+
+    .location {
         text-align: center;
+
         .ico2 {
             font-size: 36rpx;
             color: #000;
         }
-        .it{
+
+        .it {
             font-size: 20rpx;
             color: #999;
         }
@@ -348,9 +351,11 @@ export default {
     left: 0;
     top: 0;
     z-index: 999;
-    .pbtn{
+
+    .pbtn {
         margin-top: 50rpx;
-        .btn{
+
+        .btn {
             color: #666;
             font-size: 34rpx;
             width: 250rpx;
@@ -360,7 +365,8 @@ export default {
             border-radius: 35rpx;
             line-height: 70rpx;
         }
-        .corg{
+
+        .corg {
             background-color: #00B76C;
             color: #fff;
         }
@@ -417,25 +423,30 @@ export default {
             background-color: rgba($color: #000, $alpha: 0.08);
             margin-bottom: 12rpx;
             border-radius: 8rpx;
-            &.active{
+
+            &.active {
                 color: #000;
                 background-color: rgba($color: #00B76C, $alpha: 0.8);
             }
         }
     }
-    .LevelB{
+
+    .LevelB {
         margin-top: 45rpx;
-        .tit{
+
+        .tit {
             font-size: 32rpx;
             margin-bottom: 20rpx;
         }
-        .ls_i{
+
+        .ls_i {
             color: #333;
             font-size: 26rpx;
             background-color: rgba($color: #000, $alpha: 0.08);
             padding: 8rpx 22rpx;
             border-radius: 8rpx;
-            &.active{
+
+            &.active {
                 color: #000;
                 background-color: rgba($color: #00B76C, $alpha: 0.8);
             }
@@ -443,18 +454,20 @@ export default {
     }
 }
 
-.footimg{
+.footimg {
     width: 100%;
     position: fixed;
     bottom: -10rpx;
     left: 0;
-    .btn{
+
+    .btn {
         width: 250rpx;
         position: absolute;
         left: calc(50% - 125rpx);
         top: -8rpx;
     }
-    .img{
+
+    .img {
         width: 100%;
     }
 }

src/pagesB/hotel/orderDetail.vue

@@ -0,0 +1,242 @@
+<template>
+    <div class="orderDetail">
+        <template v-if="detail">
+            <div class="card">
+                <div class="hotelName">{{ hotel.hotelName }}</div>
+                <div class="address">{{ hotel.address }}</div>
+                <div class="btnico flex_r flex_jb">
+                    <div class="btn_i" @click="openm">
+                        <span class="iconfont">&#xe8ae;</span>
+                        <div class="t">查看地图</div>
+                    </div>
+                    <div class="btn_i" @click="PhoneCall(hotel.phone)">
+                        <span class="iconfont">&#xe8ad;</span>
+                        <div class="t">联系酒店</div>
+                    </div>
+                </div>
+                <div class="roominfo">
+                    <div class="name">{{ detail.roomTypeName }}</div>
+                    <div class="days">
+                        <span>{{ daydate(detail.checkInDate) }} - {{ daydate(detail.checkOutDate) }}</span>
+                        <span class="dn">共{{ detail.numberOfNights }}晚</span>
+                    </div>
+                    <div class="tegs">
+                        <span>{{ detail.bedTypeName }}</span>
+                        <span>{{ detail.breakfastDesc }}</span>
+                        <span>{{ detail.cancelDesc }}</span>
+                    </div>
+                    <div class="pli">
+                        <div class="label">入住人</div>
+                        <span>{{ detail.guestNames }}</span>
+                    </div>
+                    <div class="pli">
+                        <div class="label">联系手机</div>
+                        <span>{{ detail.contactMobile }}</span>
+                    </div>
+                    <div class="pli" v-if="detail.arriveTime">
+                        <div class="label">预计到店</div>
+                        <span>{{ detail.arriveTime }}</span>
+                    </div>
+                    <div class="pli" v-else>
+                        <div class="label">入住时间</div>
+                        <span>{{ daydate2(detail.checkInDate) + " 12:00" }}后</span>
+                    </div>
+                </div>
+            </div>
+            <div class="card">
+                <div class="tit">订单信息</div>
+                <div class="pli">
+                    <div class="label">订单编号</div>
+                    <span>{{ order.trade_no }}</span>
+                </div>
+                <div class="pli">
+                    <div class="label">磐河编号</div>
+                    <span>{{ detail.orderNo }}</span>
+                </div>
+                <div class="pli">
+                    <div class="label">下单时间</div>
+                    <span>{{ detail.createTime }}</span>
+                </div>
+
+            </div>
+        </template>
+        <template v-else>
+            <div class="card">
+                <div class="hotelName">{{ hotel.hotelName }}</div>
+                <div class="address">{{ hotel.address }}</div>
+                <div class="btnico flex_r flex_jb">
+                    <div class="btn_i" @click="openm">
+                        <span class="iconfont">&#xe8ae;</span>
+                        <div class="t">查看地图</div>
+                    </div>
+                    <div class="btn_i" @click="PhoneCall(hotel.phone)">
+                        <span class="iconfont">&#xe8ad;</span>
+                        <div class="t">联系酒店</div>
+                    </div>
+                </div>
+            </div>
+        </template>
+    </div>
+</template>
+
+<script>
+import { post } from "@/request/api.js";
+export default {
+    name: "orderDetail",
+    props: {},
+    components: {},
+    data() {
+        return {
+            tradeNo: "",
+            hotel: {},
+            detail: {},
+            order: {},
+            ratePlan: {}
+        };
+    },
+    methods: {
+        daydate(va) {
+            return this.$day(va).format("M月DD日")
+        },
+        daydate2(va) {
+            return this.$day(va).format("YYYY-MM-DD")
+        },
+        getorderDetail(da) {
+            post("local/hotel/orderDetail",da).then(res => {
+                if (res.code == 0) {
+                    this.detail = res.data.detail.data
+                    this.order = res.data.order
+                    let de = JSON.parse(res.data.order.product_detail)
+                    let { hotelID,checkInDate,checkOutDate,ratePlanID } = de
+                    this.gethotel({ hotelID,checkInDate,checkOutDate },ratePlanID)
+                }
+            })
+        },
+        gethotel(da,ratePlanID){
+            post("/local/hotel/detail", da).then((res) => {
+                if (res.code == 0) {
+                    this.hotel = res.data.data;
+                }
+            });
+            post("/local/hotel/room", da).then((res) => {
+                if (res.code == 0) {
+                    let da = res.data.data.rooms;
+                    for (const a of da) {
+                        for (const b of a.ratePlans) {
+                            if(b.ratePlanId == ratePlanID){
+                                this.ratePlan = Object.assign({},a,b)
+                                console.log(this.ratePlan);
+                            }
+                        }
+                    }
+                }
+            });
+        },
+        openm() {
+            console.log(12);
+            let latitude = this.hotel.googleLat;
+            let longitude = this.hotel.googleLon;
+            let name = this.hotel.hotelName;
+            let address = this.hotel.address;
+            uni.openLocation({
+                latitude, longitude, scale: 18, name, address,
+                success: function() {
+                    console.log('success');
+                }
+            });
+        },
+        PhoneCall(va){
+            uni.makePhoneCall({ phoneNumber: va });
+        },
+    },
+    onLoad(da) {
+        this.tradeNo = da.trade_no;
+        this.getorderDetail(da);
+    },
+    onShow() {},
+    mounted() {},
+};
+</script>
+
+<style scoped lang='scss'>
+.orderDetail{
+    padding: 28rpx 32rpx;
+    .hotelName{
+        font-size: 36rpx;
+        font-weight: 600;
+    }
+    .address{
+        font-size: 25rpx;
+        color: #555;
+        margin-top: 10rpx;
+    }
+    .btnico{
+        padding: 26rpx 36rpx;
+        margin-bottom: 10rpx;
+        .iconfont{
+            font-size: 40rpx;
+            font-weight: bold;
+        }
+        .btn_i{
+            text-align: center;
+            .t{
+                font-size: 22rpx;
+                margin-top: 6rpx;
+            }
+        }
+    }
+    .roominfo{
+        margin-top: 10rpx;
+        .name{
+            font-size: 32rpx;
+            font-weight: 600;
+        }
+        .days{
+            margin-top: 12rpx;
+            font-size: 28rpx;
+            .dn{
+                margin-left: 16rpx;
+            }
+        }
+        .tegs{
+            font-size: 26rpx;
+            margin: 12rpx 0;
+            span{
+                margin-right: 12rpx;
+                &:last-child{
+                    margin-right: 0;
+                }
+            }
+        }
+    }
+    .pli{
+        margin-bottom: 10rpx;
+        font-size: 26rpx;
+        &:last-child{
+            margin-bottom: 0;
+        }
+       .label{
+            width: 150rpx;
+            font-weight: 600;
+            display: inline-block;
+       } 
+    }
+    .tit{
+        font-size: 32rpx;
+        font-weight: 600;
+        margin-bottom: 16rpx;
+    }
+}
+.card {
+    background-color: #fff;
+    border-radius: 20rpx;
+    margin-bottom: 30rpx;
+    padding: 28rpx 30rpx;
+    font-size: 32rpx;
+    box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.1);
+
+    &:last-child {
+        margin-bottom: 0;
+    }
+}
+</style>

src/pagesB/orderingfood/orderlist.vue

@@ -31,6 +31,16 @@
                 </div>
                 <div class="g_amount"><span class="amount dinB">{{ i.pay_amount }}</span></div>
             </div>
+            <div class="p2 flex_r flex_jb" v-else-if="i.type == 4">
+                <div class="Movie flex_r flex_jb" v-for="(a,b) in i.orderGoods" :key="b">
+                    <div class="info flex_c flex_jb">
+                        <p class="pt">{{ a.product_name }}</p>
+                        <p class="p">{{ a.number }}间</p>
+                        <p class="p">原价 ￥{{ i.order_amount }}</p>
+                    </div>
+                    <image class="poster" mode="aspectFill" :src="a.product_img" />
+                </div>
+            </div>
             <div class="p3">下单时间：{{ i.create_time }}</div>
         </div>
     </div>
@@ -72,6 +82,7 @@ export default {
             if (i.type == 0) this.goto('/pagesB/orderingfood/detail', { trade_no: i.trade_no, brand_id: i.brand_id })
             else if (i.type == 1) this.goto('/pagesB/cinema/cinemaTicket', { tradeNo: i.trade_no })
             else if ([2,3].includes(i.type)) this.goto('/pagesB/directCharge/orderDetail', { trade_no: i.trade_no })
+            else if (i.type == 4 && [1,2].includes(i.status)) this.goto('/pagesB/hotel/orderDetail', { trade_no: i.trade_no })
         },
         seatInfos(va,type){
             if(va&&type==1){

src/utils/myfun.js

@@ -52,7 +52,7 @@ export function goto(url, json) {
     let params = "";
     if (json) {
         params = [];
-        let da = Object.keys(json).map(function(key) {
+        let da = Object.keys(json).map(function (key) {
             if (json[key]) return encodeURIComponent(key) + "=" + encodeURIComponent(json[key]);
         });
         da.forEach(e => {
@@ -92,12 +92,9 @@ export function hotelStarf(va) {
     }
 }
 
-/**
- * json对象数组按照某个属性排序:降序排列
- * @param {Object} propertyName
- */
+// json对象数组按照某个属性排序:降序排列
 let compareDesc = (propertyName) => {
-    return function(object1, object2) {
+    return function (object1, object2) {
         var value1 = object1[propertyName];
         var value2 = object2[propertyName];
         if (value2 < value1) {
@@ -109,13 +106,9 @@ let compareDesc = (propertyName) => {
         }
     }
 }
-
-/**
- * json对象数组按照某个属性排序:升序排列
- * @param {Object} propertyName
- */
+// json对象数组按照某个属性排序:升序排列
 let compareAsc = (propertyName) => {
-    return function(object1, object2) {
+    return function (object1, object2) {
         var value1 = object1[propertyName];
         var value2 = object2[propertyName];
         if (value2 < value1) {
@@ -133,4 +126,35 @@ export function Desc(arr = [], key = "id") {
 }
 export function Asc(arr = [], key = "id") {
     return arr.sort(compareAsc(key));
+}
+
+// 判断今明后天
+export function getThatDay(d) {
+    var td = new Date();
+    td = new Date(td.getFullYear(), td.getMonth(), td.getDate());
+    var od = new Date(d);
+    od = new Date(od.getFullYear(), od.getMonth(), od.getDate());
+    var xc = (od - td) / 1000 / 60 / 60 / 24;
+    if (xc == 0) {
+        return "今天";
+    } else if (xc < 2) {
+        return "明天";
+    } else if (xc < 3) {
+        return "后天";
+    } else {
+        return "";
+    }
+}
+// 计算两个日期之间的天数
+export function getDaysBetween(dateString1, dateString2) {
+    var startDate = Date.parse(dateString1);
+    var endDate = Date.parse(dateString2);
+    if (startDate > endDate) {
+        return 0;
+    }
+    if (startDate == endDate) {
+        return 1;
+    }
+    var days = (endDate - startDate) / (1 * 24 * 60 * 60 * 1000);
+    return days;
 }