描述:访客预约

miniprogram/pages/index/index.js

@@ -97,7 +97,7 @@ Page({
             {
                 name: "访客预约",
                 img: "/profile/static/index/menu-fkyy.png",
-                path: "/pages/meeting/visitorIinvitation/visitorIinvitation"
+                path: "/pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord"
             },
             {
                 name: "预约记录",

miniprogram/pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord.js

@@ -1,11 +1,10 @@
-// pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord.js
 Page({
 
     /**
      * 页面的初始数据
      */
     data: {
-    active: 'a',
+
     },
 
     /**
@@ -15,6 +14,14 @@ Page({
         
     },
 
+    // tab 切换
+    tabClickSwitch(event) {
+        wx.showToast({
+            title: `切换到标签 ${event.detail.title}`,
+            icon: 'none',
+        });
+    },
+
     /**
      * 生命周期函数--监听页面初次渲染完成
      */

miniprogram/pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord.json

@@ -1,5 +1,5 @@
 {
-  "navigationBarTitleText":"预约记录",
+    "navigationBarTitleText": "访客预约",
     "usingComponents": {
         "van-tab": "@vant/weapp/tab/index",
         "van-tabs": "@vant/weapp/tabs/index",

miniprogram/pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord.wxml

@@ -1,53 +1,28 @@
-<view class="container">
+<view class="containerView public">
-  <van-tabs active="{{ active }}" bind:change="onChange" color="#0079fe">
+    <van-tabs bind:click="tabClickSwitch" color="#4e96f8" border animated title-active-color="black" title-inactive-color="gray">
-    <van-tab title="访客记录" name="a">
+        <van-tab title="预约记录">
-      <view class="visitorView">
+            <view class="itemView" wx:for="{{3}}">
-        <view class="visitListView">
+                <view class="topView">
-          <view class="itemView">
+                    <view class="name">访客：张三</view>
-            <view class="itemTop">
+                    <view class="status">待审核</view>
-              <view>访客：张三</view>
-              <view>待审核</view>
                 </view>
-            <view class="itemBottom">
+                <view class="contentView">
-              <view>
+                    <view class="dataView">
-                <view class="infoView">
+                        <van-icon name="manager" color="#cccccc" size="40rpx"/>
-                  <van-icon name="user-o" />
+                        <view class="msg">访问事由: 参观会议参观会议参观会议参观会议参观会议参观会议参观会议参观会议参观会议参观会议参观会议</view>
-                  <view>访问事由: 拜访刘总</view>
                     </view>
-                <view class="infoView">
+                    <view class="dataView">
-                  <van-icon name="clock-o" />
+                        <van-icon name="clock-o" color="#cccccc" size="40rpx"/>
-                  <view>2024-02-02 14:00</view>
+                        <view class="msg">2024-02-02 14:00</view>
-                </view>
-              </view>
-              <view>访客预约</view>
                     </view>
+                    <view class="btnView">
+                        <view class="btn">查看详情</view>
                     </view>
                 </view>
             </view>
         </van-tab>
-    <van-tab title="预约审核" name="b">
+        <van-tab title="预约审核" disabled="{{false}}">
-      <view class="visitorView" bind:tap="toCheckFn">
+
-        <view class="visitListView">
+        </van-tab>
-          <view class="itemView">
-            <view class="itemTop">
-              <view>访客：张三</view>
-              <view>待审核</view>
-            </view>
-            <view class="checkBottom">
-              <view>
-                <view class="infoView">
-                  <van-icon name="user-o" />
-                  <view>访问事由: 拜访刘总</view>
-                </view>
-                <view class="infoView">
-                  <van-icon name="clock-o" />
-                  <view>2024-02-02 14:00</view>
-                </view>
-              </view>
-              <van-button round type="info" size="small" bind:click="toCheckFn">去审核</van-button>
-            </view>
-          </view>
-        </view>
-      </view></van-tab>
     </van-tabs>
 </view>

miniprogram/pages/meeting/visitorIinvitation/appointmentRecord/appointmentRecord.wxss

@@ -1,60 +1,65 @@
-.container{
+.containerView.public {
-	width: 100%;
-	position: absolute;
-	height: 100vh;
-	background-color: #f6f6f6;
-}
-.visitorView{
-  width: 100%;
     background-color: #f6f7fb;
 }
-.visitListView{
-  width: 710rpx;
-  margin: 0 auto;
 
-}
 .itemView {
-  width: 100%;
+    margin: 20rpx;
-  background-color: #ffffff;
+    padding: 20rpx 0;
-  margin-top: 20rpx;
+    background: #ffffff;
-  font-size: 28rpx;
-  color: #666666;
 }
-.itemTop{
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  height: 80rpx;
-  border-bottom: 1px solid #f2f2f2;
-  align-items: center;
-  padding: 10rpx 30rpx;
-  box-sizing: border-box;
-}
-.itemBottom{
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  padding:20rpx 30rpx;
-  box-sizing: border-box;
-  color: #a4a4a4;
-  font-size: 28rpx;
-}
-.infoView{
-  display: flex;
-  height: 60rpx;
-  align-items: baseline;
 
-}
+.itemView .topView {
-.infoView view{
+    border-bottom: 1px solid rgb(126, 126, 126, 0.2);
-  margin-left: 10rpx;
-}
-.checkBottom{
-  width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: center;
-  padding:20rpx 30rpx;
-  box-sizing: border-box;
-  color: #a4a4a4;
     font-size: 28rpx;
+    padding: 0 20rpx 20rpx;
+}
+
+.itemView .topView .name {
+    color: #000000;
+}
+
+.itemView .topView .status {
+    color: red;
+}
+
+.itemView .contentView {
+    padding: 0 20rpx;
+}
+
+.itemView .contentView .dataView {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    margin-top: 20rpx;
+}
+
+.itemView .contentView .dataView .msg {
+    margin-left: 20rpx;
+    font-size: 28rpx;
+
+    text-overflow: ellipsis;
+    overflow: hidden;
+    word-break: break-all;
+    white-space: nowrap;
+}
+
+.itemView .contentView .btnView {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    margin-top: 20rpx;
+}
+
+
+.itemView .contentView .btnView .btn {
+    border: 1px solid #4e96f8;
+    position: relative;
+    border-radius: 10rpx;
+    margin-left: 16rpx;
+    padding: 10rpx 24rpx;
+    font-size: 24rpx;
+    color: #4e96f8;
 }