描述:优惠卷

miniprogram/app.json

@@ -54,7 +54,8 @@
     "pages/meeting/meetingRoom/meetingRoom",
     "pages/meeting/meetingRoom/meetingFacilities/meetingFacilities",
     "pages/meeting/meetingRoom/meetingOrder/meetingOrder",
-    "pages/meeting/meetingRoom/meetingProtocol/meetingProtocol"
+    "pages/meeting/meetingRoom/meetingProtocol/meetingProtocol",
+    "pages/meeting/meetingRoom/meetingCoupon/meetingCoupon"
   ],
   "window": {
     "backgroundTextStyle": "light",

miniprogram/app.wxss

@@ -345,3 +345,11 @@ image {
 .flex {
   display: flex;
 }
+
+.containerView.public {
+    height: 100vh;
+    width: 100vw;
+    overflow: auto;
+    padding-bottom: 100rpx;
+    background: #ffffff;
+}

miniprogram/pages/meeting/meetingRoom/meetingCoupon/meetingCoupon.js

@@ -0,0 +1,75 @@
+const app = getApp()
+
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        IMG_NAME: app.IMG_NAME,
+        couponId: '',
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+
+    },
+
+    // 选择优惠卷
+    couponChange(event) {
+        this.setData({
+            couponId: event.detail,
+        });
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage() {
+
+    }
+})

miniprogram/pages/meeting/meetingRoom/meetingCoupon/meetingCoupon.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {
+    "van-radio": "@vant/weapp/radio/index",
+    "van-radio-group": "@vant/weapp/radio-group/index"
+  },
+  "navigationBarTitleText": "优惠卷"
+}

miniprogram/pages/meeting/meetingRoom/meetingCoupon/meetingCoupon.wxml

@@ -0,0 +1,28 @@
+<view class="containerView public">
+
+    <!-- 优惠卷列表 -->
+    <view class="couponView">
+        <van-radio-group value="{{ couponId }}" bind:change="couponChange">
+            <view class="item" wx:for="{{3}}" wx:for-index="idx">
+                <view class="imgView">
+                    <view class="img"></view>
+                    <view class="timeView">
+                        <view class="title">4小时</view>
+                        <view class="type">抵用券</view>
+                    </view>
+                </view>
+
+                <view class="contentView">
+                    <view class="title">会议室预约抵用券</view>
+                    <view class="platform">适用平台: xxx楼</view>
+                    <view class="validityTime">有效期至: 2024-01-01</view>
+                </view>
+
+                 <van-radio name="{{idx}}"></van-radio>
+            </view>
+        </van-radio-group>
+    </view>
+
+    <view class="submitBtn">确认</view>
+
+</view>

miniprogram/pages/meeting/meetingRoom/meetingCoupon/meetingCoupon.wxss

@@ -0,0 +1,82 @@
+.couponView {
+    margin: 24rpx;
+}
+
+.couponView .item {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    padding: 20rpx 0;    
+    border-top: 1px solid rgb(126, 126, 126, 0.2);
+}
+
+.couponView .item:first-of-type {
+    border-top: none;
+}
+
+.couponView .item .imgView {
+    position: relative;
+    width: 260rpx;
+    height: 260rpx;
+}
+
+.couponView .item .imgView .img {
+    width: 100%;
+    height: 100%;
+    background: red;
+}
+
+.couponView .item .imgView .timeView {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    color: white;
+}
+
+.couponView .item .imgView .timeView .title {
+    font-size: 46rpx;
+    font-weight: bold;
+}
+
+.couponView .item .imgView .timeView .type {
+    font-size: 26rpx;
+}
+
+.couponView .item .contentView {
+    flex: 1;
+    margin: 0 20rpx;
+    color: gray;
+}
+
+.couponView .item .contentView .title {
+    font-size: 26rpx;
+    font-weight: bold;
+}
+
+.couponView .item .contentView .platform,
+.couponView .item .contentView .validityTime {
+    margin-top: 20rpx;
+    font-size: 24rpx;
+    opacity: 0.6;
+}
+
+.submitBtn{
+    box-sizing: border-box;
+    position: absolute;
+    width: 600rpx;
+    left: 50%;
+    margin-left: -300rpx;
+    bottom: 120rpx;
+    border-radius: 10rpx;
+    padding: 20rpx;
+    background: #4e96f8;
+    color: white;
+    font-size: 30rpx;
+    text-align: center;
+}

miniprogram/pages/meeting/meetingRoom/meetingOrder/meetingOrder.js

@@ -28,6 +28,20 @@ Page({
 
     },
 
+    // 跳转-空间设施
+    jumpMeetingFacilities() {
+        wx.navigateTo({
+            url: '/pages/meeting/meetingRoom/meetingFacilities/meetingFacilities',
+        })
+    },
+
+    // 跳转-优惠卷
+    jumpMeetingCoupon() {
+        wx.navigateTo({
+            url: "/pages/meeting/meetingRoom/meetingCoupon/meetingCoupon",
+        })
+    },
+
     // 协议点击
     protocolChange() {
         let _this = this;
@@ -40,7 +54,7 @@ Page({
     jumpProtocol() {
         let _this = this;
         wx.navigateTo({
-          url: "/pages/meeting/meetingRoom/meetingProtocol/meetingProtocol?title=" + _this.data.protocolTitle,
+            url: "/pages/meeting/meetingRoom/meetingProtocol/meetingProtocol?title=" + _this.data.protocolTitle,
         })
     },
 

miniprogram/pages/meeting/meetingRoom/meetingOrder/meetingOrder.wxml

@@ -47,13 +47,13 @@
                 <van-field value="{{ username3 }}"  placeholder="请输入会议主题" input-align="right"  border="{{ false }}"/>
             </view>
         </view>
-        <view class="itemView">
+        <view class="itemView" bind:tap="jumpMeetingFacilities">
             <view class="label">会议服务</view>
             <view class="content">
                 <van-icon name="arrow" size="44rpx"/>
             </view>
         </view>
-        <view class="itemView">
+        <view class="itemView" bind:tap="jumpMeetingCoupon">
             <view class="label">优惠券</view>
             <view class="content">
                 <view class="coupon">5张可用</view>