From 17efddc6a667670dca682bf36b51a43e99615e6d Mon Sep 17 00:00:00 2001
From: k94314517 <8417338+k94314517@user.noreply.gitee.com>
Date: 星期三, 16 十月 2024 15:59:38 +0800
Subject: [PATCH] 代码初始化

---
 h5/pages/applicationRecord/applicationRecord.vue |  432 ++++++++++++++++++++++++++++++++---------------------
 1 files changed, 263 insertions(+), 169 deletions(-)

diff --git a/h5/pages/applicationRecord/applicationRecord.vue b/h5/pages/applicationRecord/applicationRecord.vue
index f8dd3a1..6a17869 100644
--- a/h5/pages/applicationRecord/applicationRecord.vue
+++ b/h5/pages/applicationRecord/applicationRecord.vue
@@ -1,177 +1,271 @@
 <template>
-	<view class="box">
-		<scroll-view scroll-x class="box_head">
-			<view class="box_head_list">
-				<view class="box_head_item active">鍏ㄩ儴</view>
-				<view class="box_head_item">寰呭鏍�</view>
-				<view class="box_head_item">瀹℃牳閫氳繃</view>
-				<view class="box_head_item">瀹℃牳椹冲洖</view>
-			</view>
-		</scroll-view>
-		<view class="box_list">
-			<view class="box_list_item" v-for="(item, index) in 3" :key="index">
-				<view class="box_list_item_head">
-					<text>涓佹仼鍑殑鍔冲姟鍏ュ巶鐢宠</text>
-					<text class="loading">寰呭鏍�</text>
-				</view>
-				<view class="box_list_item_nr">
-					<view class="box_list_item_nr_item">
-						<text>琚闂汉锛�</text>
-						<text>浜轰簨閮�-鐜嬩簹钃�</text>
-					</view>
-					<view class="box_list_item_nr_item">
-						<text>杩涘巶鏃堕棿锛�</text>
-						<text>12-12 09:00</text>
-					</view>
-					<view class="box_list_item_nr_item">
-						<text>绂诲巶鏃堕棿锛�</text>
-						<text>12-12 12:00</text>
-					</view>
-					<view class="box_list_item_nr_item">
-						<text>鍏ュ巶浜烘暟锛�</text>
-						<text>10</text>
-					</view>
-					<view class="box_list_item_nr_item">
-						<text>鏉ヨ浜嬬敱锛�</text>
-						<text>涓氬姟鏉ュ線</text>
-					</view>
-					<view class="box_list_item_nr_x"></view>
-					<view class="box_list_item_nr_text">
-						2023-12-12 09:00鎻愪氦
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="box">
+    <scroll-view scroll-x class="box_head">
+      <view class="box_head_list">
+        <view
+          class="box_head_item"
+          :class="{ active: status == '' }"
+          @click="tabsClick('')"
+          >鍏ㄩ儴</view
+        >
+        <view
+          class="box_head_item"
+          @click="tabsClick('0')"
+          :class="{ active: status == '0' }"
+          >寰呭鏍�</view
+        >
+        <view
+          class="box_head_item"
+          @click="tabsClick('2')"
+          :class="{ active: status == '2' }"
+          >瀹℃牳閫氳繃</view
+        >
+        <view
+          class="box_head_item"
+          @click="tabsClick('3')"
+          :class="{ active: status == '3' }"
+          >瀹℃牳椹冲洖</view
+        >
+      </view>
+    </scroll-view>
+    <view class="box_list">
+      <view
+        @click="handleDetail(item.id)"
+        class="box_list_item"
+        v-for="(item, index) in list"
+        :key="index"
+      >
+        <view class="box_list_item_head">
+          <text>{{ item.name }}鎻愪氦鐨勮瀹㈢敵璇�</text>
+          <text class="loading" :class="{error: item.status == 3}">{{ statusMap[item.status] }}</text>
+        </view>
+        <view class="box_list_item_nr">
+          <view class="box_list_item_nr_item">
+            <text>琚闂汉锛�</text>
+            <text
+              >{{ item.receptMemberDepartment }}-{{
+                item.receptMemberName
+              }}</text
+            >
+          </view>
+          <view class="box_list_item_nr_item">
+            <text>杩涘巶鏃堕棿锛�</text>
+            <text v-if="item.starttime">{{ item.starttime.slice(5, 16) }}</text>
+          </view>
+          <view class="box_list_item_nr_item">
+            <text>绂诲洯鏃堕棿锛�</text>
+            <text v-if="item.endtime">{{ item.endtime.slice(5, 16) }}</text>
+          </view>
+          <view class="box_list_item_nr_item">
+            <text>鏉ヨ浜嬬敱锛�</text>
+            <text>{{ item.reason }}</text>
+          </view>
+          <view class="box_list_item_nr_x"></view>
+          <view v-if="item.createDate" class="box_list_item_nr_text">{{ item.createDate.slice(0, 16) }} 鎻愪氦</view>
+        </view>
+      </view>
+      <view v-if="list.length === 0" style="text-align: center">
+        <image
+          src="@/static/empty.png"
+          style="width: 320rpx; margin: 120rpx auto 0"
+          mode="widthFix"
+        />
+        <view class="placeholder9 fs24">鏆傛棤鏁版嵁</view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			};
-		}
-	}
+import { getVisitedRecord } from '@/api'
+export default {
+  data() {
+    return {
+      pagination: {
+        page: 0,
+        capacity: 10
+      },
+      list: [],
+      total: 0,
+      status: '',
+
+      statusMap: {
+        0: '寰呭鎵�',
+        1: '瀹℃壒涓�',
+        2: '瀹℃牳閫氳繃',
+        3: '瀹℃牳椹冲洖',
+        4: '鍙栨秷',
+        5: '涓嬪彂鎴愬姛',
+        6: '涓嬪彂澶辫触',
+        7: '鎷滆涓�',
+        8: '宸茬绂�',
+        9: '宸插け鏁�',
+      }
+    }
+  },
+  onLoad() {
+    this.getList()
+  },
+  onReachBottom() {
+    if (this.total > 10) {
+      this.getList()
+    }
+  },
+  methods: {
+    handleDetail(id) {
+      uni.navigateTo({
+        url: "/pages/appointmentDetails/appointmentDetails?detail=1&id=" + id
+      })
+    },
+    tabsClick(val) {
+      this.pagination.page = 0
+      this.list = []
+      this.status = val
+      this.getList()
+    },
+    getList() {
+      const { pagination, status, list } = this
+      pagination.page = pagination.page + 1
+      getVisitedRecord({
+        ...pagination,
+        model: {
+          openid: this.$store.state.openId,
+          status
+        },
+      }).then(res => {
+        if (res.data.records.length > 0) {
+          if (pagination.page === 1) {
+            this.list = res.data.records
+          } else {
+            this.list = [...list, ...res.data.records]
+          }
+          this.total = res.data.total
+        }
+      })
+    }
+
+  }
+}
 </script>
-<style>
-	page {
-		background-color: #F7F7F7 !important;
-	}
+<style lang="scss">
+page {
+  background-color: #f7f7f7 !important;
+}
 </style>
 <style lang="scss" scoped>
-	.box {
-		width: 100%;
-		.box_head {
-			width: 100%;
-			height: 108rpx;
-			padding: 0 30rpx;
-			box-sizing: border-box;
-			background: #FFFFFF;
-			position: sticky;
-			top: 0;
-			left: 0;
-			.box_head_list {
-				width: 100%;
-				height: 100%;
-				display: flex;
-				align-items: center;
-				.active {
-					border: 1rpx solid #025EEF !important;
-					color: #025EEF !important;
-				}
-				.box_head_item {
-					padding: 0 30rpx;
-					height: 60rpx;
-					line-height: 60rpx;
-					box-sizing: border-box;
-					border-radius: 30rpx;
-					border: 1rpx solid #999999;
-					font-size: 26rpx;
-					font-weight: 400;
-					color: #333333;
-					margin-right: 20rpx;
-				}
-			}
-		}
-		.box_list {
-			width: 100%;
-			padding: 30rpx;
-			box-sizing: border-box;
-			.box_list_item {
-				width: 100%;
-				margin-bottom: 20rpx;
-				&:last-child {
-					margin: 0 !important;
-				}
-				.box_list_item_head {
-					width: 100%;
-					height: 100rpx;
-					padding: 0 30rpx;
-					box-sizing: border-box;
-					background: linear-gradient(270deg, #FEFEFF 0%, #E1F7FE 100%);
-					border-radius: 8rpx 8rpx 0rpx 0rpx;
-					display: flex;
-					align-items: center;
-					justify-content: space-between;
-					.loading {
-						color: #025EEF;
-					}
-					.success {
-						color: #03C68F;
-					}
-					.error {
-						color: #E0312A;
-					}
-					text {
-						&:nth-child(1) {
-							font-size: 32rpx;
-							font-weight: 500;
-							color: #222222;
-						}
-						&:nth-child(2) {
-							font-size: 26rpx;
-							font-weight: 400;
-						}
-					}
-				}
-				.box_list_item_nr {
-					padding: 30rpx;
-					width: 100%;
-					box-sizing: border-box;
-					background-color: #FFFFFF;
-					.box_list_item_nr_x {
-						width: 100%;
-						height: 1rpx;
-						background-color: #E5E5E5;
-					}
-					.box_list_item_nr_text {
-						width: 100%;
-						font-size: 26rpx;
-						font-weight: 400;
-						color: #999999;
-						margin-top: 32rpx;
-					}
-					.box_list_item_nr_item {
-						width: 100%;
-						display: flex;
-						align-items: center;
-						margin-bottom: 20rpx;
-						text {
-							&:nth-child(1) {
-								font-size: 26rpx;
-								font-weight: 400;
-								color: #666666;
-							}
-							&:nth-child(2) {
-								font-size: 26rpx;
-								font-weight: 400;
-								color: #333333;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
+.box {
+  width: 100%;
+  .box_head {
+    width: 100%;
+    height: 108rpx;
+    padding: 0 30rpx;
+    box-sizing: border-box;
+    background: #ffffff;
+    position: sticky;
+    top: 0;
+    left: 0;
+    .box_head_list {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .active {
+        border: 1rpx solid $uni-color-primary !important;
+        color: $uni-color-primary !important;
+      }
+      .box_head_item {
+        width: 156rpx;
+        text-align: center;
+        height: 60rpx;
+        line-height: 60rpx;
+        box-sizing: border-box;
+        border-radius: 30rpx;
+        border: 1rpx solid #999999;
+        font-size: 26rpx;
+        font-weight: 400;
+        color: #333333;
+      }
+    }
+  }
+  .box_list {
+    width: 100%;
+    padding: 30rpx;
+    box-sizing: border-box;
+    .box_list_item {
+      width: 100%;
+      margin-bottom: 20rpx;
+      &:last-child {
+        margin: 0 !important;
+      }
+      .box_list_item_head {
+        width: 100%;
+        height: 100rpx;
+        padding: 0 30rpx;
+        box-sizing: border-box;
+        background: linear-gradient(270deg, #fefeff 0%, #e1f7fe 100%);
+        border-radius: 8rpx 8rpx 0rpx 0rpx;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .loading {
+          color: $uni-color-primary;
+        }
+        .success {
+          color: #03c68f;
+        }
+        .error {
+          color: #e0312a;
+        }
+        text {
+          &:nth-child(1) {
+            font-size: 32rpx;
+            font-weight: 600;
+            color: #222222;
+          }
+          &:nth-child(2) {
+            font-size: 26rpx;
+            font-weight: 400;
+          }
+        }
+      }
+      .box_list_item_nr {
+        padding: 30rpx;
+        width: 100%;
+        box-sizing: border-box;
+        background-color: #ffffff;
+        /* .box_list_item_nr_x {
+          width: 100%;
+          height: 1rpx;
+          background-color: #e5e5e5;
+        } */
+        .box_list_item_nr_text {
+          width: 100%;
+          font-size: 26rpx;
+          font-weight: 400;
+          color: #999999;
+          /* margin-top: 32rpx; */
+        }
+        .box_list_item_nr_item {
+          width: 100%;
+          display: flex;
+          align-items: center;
+          margin-bottom: 20rpx;
+          text {
+            &:nth-child(1) {
+              font-size: 26rpx;
+              font-weight: 400;
+              color: #666666;
+            }
+            &:nth-child(2) {
+              font-size: 26rpx;
+              font-weight: 400;
+              color: #333333;
+            }
+          }
+        }
+      }
+    }
+  }
+}
 </style>

--
Gitblit v1.9.3