From 40c9e75b2e0b83f991ead8d495e5e4c532972a59 Mon Sep 17 00:00:00 2001
From: zhouyanli <593579392@qq.com>
Date: Wed, 20 May 2026 17:30:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A6=96=E9=A1=B5=E3=80=81?=
 =?UTF-8?q?=E8=AE=BF=E5=AE=A2=E5=8F=AF=E8=A7=86=E6=BB=9A=E5=8A=A8=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../activity-list/activityList.vue            |   5 +-
 .../pageSubPack/activity-list/live-add.vue    |   5 +-
 .../pageSubPack/notice-list/oneClickOpen.vue  |   5 +-
 .../online-repair/onlineRepair.vue            |   3 +-
 .../pageSubPack/visitor/visitor-list.vue      | 437 +++++-----
 property-uniapp-project/pages/index/index.vue | 773 +++++++++---------
 6 files changed, 642 insertions(+), 586 deletions(-)

diff --git a/property-uniapp-project/pageSubPack/activity-list/activityList.vue b/property-uniapp-project/pageSubPack/activity-list/activityList.vue
index 0546cc6..7abef88 100644
--- a/property-uniapp-project/pageSubPack/activity-list/activityList.vue
+++ b/property-uniapp-project/pageSubPack/activity-list/activityList.vue
@@ -1,6 +1,6 @@
 <template>
 	<view class="container">
-		<view class="status-bar"></view>
+		<view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
 		<!-- 顶部标题栏 固定 -->
 		<view class="top-bar">
 			<uni-nav-bar left-icon="left" title="活动列表" backgroundColor="none" :border="false" :statusBar="false"
@@ -134,6 +134,7 @@ const currentPage = ref(1)
 const pageSize = ref(5)
 const total = ref(0)
 const displayedActivities = ref([]) // 当前显示的活动列表
+const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight || 0)
 
 // 筛选条件
 const filters = ref([
@@ -337,7 +338,7 @@ watch(() => myFilter.value, () => {
 /* 状态栏 - 自适应设备状态栏高度 */
 .status-bar {
 	/* height: var(--status-bar-height); */
-	height: 46px;
+	/* height: 46px; */
 	width: 100%;
 	flex-shrink: 0;
 }
diff --git a/property-uniapp-project/pageSubPack/activity-list/live-add.vue b/property-uniapp-project/pageSubPack/activity-list/live-add.vue
index 9cd995f..9d1f356 100644
--- a/property-uniapp-project/pageSubPack/activity-list/live-add.vue
+++ b/property-uniapp-project/pageSubPack/activity-list/live-add.vue
@@ -139,7 +139,7 @@ const reLocate = () => {
       } else {
         uni.hideLoading();
         uni.showToast({ title: '定位失败，请重试', icon: 'none' });
-        console.error('定位失败：', err);
+        // console.error('定位失败：', err);
       }
     }
   });
@@ -289,7 +289,8 @@ const submitStatus = async () => {
 .upload-btn {
   width: 80px;
   height: 80px;
-  border: 1px dashed #ddd;
+  /* border: 1px dashed #ddd; */
+  background-color: #F3F3F3;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
diff --git a/property-uniapp-project/pageSubPack/notice-list/oneClickOpen.vue b/property-uniapp-project/pageSubPack/notice-list/oneClickOpen.vue
index e345d67..811cd26 100644
--- a/property-uniapp-project/pageSubPack/notice-list/oneClickOpen.vue
+++ b/property-uniapp-project/pageSubPack/notice-list/oneClickOpen.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- 页面主容器 -->
   <view class="door-open-page">
-	  <view class="status_bar"></view>
+	  <view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
     <!-- 顶部标题栏 -->
     <view class="top-bar">
 		  <uni-nav-bar left-icon="left"  title="远程开门" backgroundColor ="none" :border="false" @clickLeft="narBack" />
@@ -60,6 +60,7 @@ import {getAccessDevices,getAccessOpen} from '../api/api.js'
 // 响应式数据：选中的门索引、开门成功提示
 const selectedDoor = ref(-1) // -1表示未选中
 const showSuccess = ref(false)
+const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight || 0)
 
 // 门列表数据
 const doorList = ref([])
@@ -163,7 +164,7 @@ onLoad(() =>{
   box-sizing: border-box;
 }
   .status_bar {
-	height: var(--status-bar-height);
+	/* height: var(--status-bar-height); */
 	width: 100%;
 	flex-shrink: 0;
  }
diff --git a/property-uniapp-project/pageSubPack/online-repair/onlineRepair.vue b/property-uniapp-project/pageSubPack/online-repair/onlineRepair.vue
index 6da8120..cf05a16 100644
--- a/property-uniapp-project/pageSubPack/online-repair/onlineRepair.vue
+++ b/property-uniapp-project/pageSubPack/online-repair/onlineRepair.vue
@@ -1,6 +1,6 @@
 <template>
   <view class="repair-page">
-	<view class="status_bar"></view>
+	<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
     <!-- 顶部导航栏 -->
 	<view class="nav-bar">
 	  <view class="nav-left" @tap="goBack">
@@ -121,6 +121,7 @@ const loading = ref(false);
 const pageNum = ref(1);
 const pageSize = ref(10);
 const maintenanceItemId = ref('');
+const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight || 0)
 
 // 状态映射
 const statusMap = {
diff --git a/property-uniapp-project/pageSubPack/visitor/visitor-list.vue b/property-uniapp-project/pageSubPack/visitor/visitor-list.vue
index 0ca17d8..6037031 100644
--- a/property-uniapp-project/pageSubPack/visitor/visitor-list.vue
+++ b/property-uniapp-project/pageSubPack/visitor/visitor-list.vue
@@ -1,26 +1,31 @@
 <template>
   <view class="visitor-page">
-	  <view class="status_bar"></view>
-	  <!-- 顶部导航栏 -->
-	  <view class="nav-bar">
-	    <view class="nav-left" @tap="goBack">
-	       <image src="https://wuyeadmin.bugtc.com/images/home/arr-left.png" style="width: 18px; height: 18px;"></image>
-	    </view>
-	    <view class="nav-title">访客邀请</view>
-	    <view class="nav-right"></view>
-	  </view>
+    <!-- 状态栏占位 -->
+    <view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
+
+    <!-- 顶部导航栏 -->
+    <view class="nav-bar">
+      <view class="nav-left" @tap="goBack">
+        <image
+          src="https://wuyeadmin.bugtc.com/images/home/arr-left.png"
+          class="back-icon"
+        />
+      </view>
+      <view class="nav-title">访客邀请</view>
+      <view class="nav-right"></view>
+    </view>
 
     <!-- 标签切换栏 -->
     <view class="tab-bar">
-      <view 
-        class="tab-item" 
+      <view
+        class="tab-item"
         :class="{ active: activeTab === 'waiting' }"
         @click="activeTab = 'waiting'"
       >
         等待来访
       </view>
-      <view 
-        class="tab-item" 
+      <view
+        class="tab-item"
         :class="{ active: activeTab === 'visited' }"
         @click="activeTab = 'visited'"
       >
@@ -28,24 +33,31 @@
       </view>
     </view>
 
-    <!-- 访客列表 -->
-    <scroll-view class="list-container" scroll-y>
-      <!-- 列表项：根据标签切换显示对应数据 -->
-      <view 
-        class="visitor-item" 
-        v-for="(item, index) in filterdList" 
+    <!-- 访客列表 - 固定高度，内部滚动 -->
+    <scroll-view class="list-container" scroll-y :style="{ height: scrollHeight + 'px' }">
+      <view
+        class="visitor-item"
+        v-for="(item, index) in filterdList"
         :key="index"
       >
         <!-- 访客基本信息 -->
         <view class="item-header">
-          <text class="visitor-name" :class="item.status">来访者：{{ item.visitorName }}</text>
-          <text class="status-tag" :class="item.status">{{ item.statusText }}</text>
+          <text class="visitor-name" :class="item.status">
+            来访者：{{ item.visitorName }}
+          </text>
+          <text class="status-tag" :class="item.status">
+            {{ item.statusText }}
+          </text>
         </view>
 
         <!-- 有效期/到访时间 -->
         <view class="item-row">
-          <text class="label" :class="item.status">{{ item.status === 'waiting' ? '有效期' : '到访时间' }}：</text>
-          <text class="value" :class="item.status">{{ item.startTime }}至{{item.endTime}}</text>
+          <text class="label" :class="item.status">
+            {{ item.status === "waiting" ? "有效期" : "到访时间" }}：
+          </text>
+          <text class="value" :class="item.status">
+            {{ item.startTime }}至{{ item.endTime }}
+          </text>
         </view>
 
         <!-- 联系方式 -->
@@ -62,136 +74,132 @@
 
         <!-- 时间+查看详情 -->
         <view class="item-footer">
-          <text class="time-text" :class="item.status">时间：{{ item.createTime }}</text>
+          <text class="time-text" :class="item.status">
+            时间：{{ item.createTime }}
+          </text>
           <view class="detail-btn" @click="viewDetail(item)">
             <text>查看详情</text>
             <uni-icons type="arrowright" size="14"></uni-icons>
           </view>
         </view>
       </view>
-	  <!-- 空状态 -->
-	  <view v-if="filterdList.length === 0" class="empty-state">
-	  	<uni-icons type="info" size="30" color="#ccc"></uni-icons>
-	  	<text class="empty-text">
-	  		{{ activeTab === 'waiting' ? '暂无等待到访数据' : '暂无已到访数据' }}
-	  	</text>
-	  </view>
+
+      <!-- 空状态 -->
+      <view v-if="filterdList.length === 0" class="empty-state">
+        <uni-icons type="info" size="30" color="#ccc"></uni-icons>
+        <text class="empty-text">
+          {{ activeTab === "waiting" ? "暂无等待到访数据" : "暂无已到访数据" }}
+        </text>
+      </view>
+
+      <!-- 底部占位，防止最后一项贴底 -->
+      <view class="list-bottom-space"></view>
     </scroll-view>
 
     <!-- 新增邀请按钮 -->
-    <view class="add-btn" @click="addInvitation">
-      <!-- <uni-icons type="plus" size="18" color="#fff"></uni-icons> -->
-      <text class="add-text">新增邀请+</text>
+    <view class="add-btn-wrapper">
+      <view class="add-btn" @click="addInvitation">
+        <text class="add-text">新增邀请+</text>
+      </view>
     </view>
   </view>
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
-import { onLoad } from '@dcloudio/uni-app'
-import { getVisitorList } from '../api/api.js'
+import { ref, computed } from "vue";
+import { onLoad } from "@dcloudio/uni-app";
+import { getVisitorList } from "../api/api.js";
 
-// 激活的标签（waiting=等待来访，visited=已到访）
-const activeTab = ref('waiting')
+const activeTab = ref("waiting");
+const statusBarHeight = ref(0);
+const scrollHeight = ref(0);
+const visitorList = ref([]);
 
-// 访客列表数据
-const visitorList = ref([])
-
-// 后端数据映射到前端
 const mapData = (list) => {
-  if (!Array.isArray(list)) return []
-  return list.map(item => {
-    const status = item.status === 1 || item.status === '1' ? 'visited' : 'waiting'
+  if (!Array.isArray(list)) return [];
+  return list.map((item) => {
+    const status =
+      item.status === 1 || item.status === "1" ? "visited" : "waiting";
     return {
       ...item,
-      visitorName: item.visitorName,
       status,
-      statusText: status === 'visited' ? '已到访' : '等待来访',
-      startTime: item.startTime,
-      endTime: item.endTime,
+      statusText: status === "visited" ? "已到访" : "等待来访",
       phone: item.visitorPhone,
       carNumber: item.carNum,
-      createTime: item.createTime || ''
-    }
-  })
-}
+      createTime: item.createTime || "",
+    };
+  });
+};
 
-// 获取访客列表
 const fetchVisitorList = async () => {
-	const userId = uni.getStorageSync('userId')
-	let params = {userId:userId}
+  const userId = uni.getStorageSync("userId");
   try {
-    const res = await getVisitorList(params)
-    visitorList.value = mapData(res.data || [])
-	// console.log('222222',visitorList.value)
-
+    const res = await getVisitorList({ userId });
+    visitorList.value = mapData(res.data || []);
   } catch (err) {
-	uni.showToast({title:err.msg,icon:'none'})
+    uni.showToast({ title: err.msg, icon: "none" });
   }
-}
+};
 
 onLoad(() => {
-  fetchVisitorList()
-})
+  const info = uni.getSystemInfoSync();
+  statusBarHeight.value = info.statusBarHeight || 0;
+
+  // rpx 转 px 比例
+  const scale = info.windowWidth / 750;
+
+  // 各固定区域高度（rpx 转 px）
+  const navPx = 90 * scale;   // 导航栏
+  const tabPx = 88 * scale;   // tab栏
+  const btnPx = 148 * scale;  // 底部按钮区域
+
+  // 列表区域可用高度 = 窗口高度 - 状态栏 - 导航栏 - tab栏 - 底部按钮区
+  scrollHeight.value = info.windowHeight - statusBarHeight.value - navPx - tabPx - btnPx;
+
+  fetchVisitorList();
+});
 
-// 根据标签筛选列表
 const filterdList = computed(() => {
-  return visitorList.value.filter(item => item.status === activeTab.value)
-})
-// 返回上一页
-const goBack = () => {
-   if(uni.getStorageSync('sourcePage') === "index"){
-    	uni.switchTab({
-    		url:"/pages/index/index"
-    	})
-    }else if(uni.getStorageSync('sourcePage') === "serviceIndex"){
-    	uni.switchTab({
-    		url:"/pages/serviceIndex/serviceIndex"
-    	})
-    }
-    uni.removeStorageSync('sourcePage')
-  
-}
+  return visitorList.value.filter((item) => item.status === activeTab.value);
+});
+
+const goBack = () => {
+  const source = uni.getStorageSync("sourcePage");
+  if (source === "index") {
+    uni.switchTab({ url: "/pages/index/index" });
+  } else if (source === "serviceIndex") {
+    uni.switchTab({ url: "/pages/serviceIndex/serviceIndex" });
+  }
+  uni.removeStorageSync("sourcePage");
+};
 
-// 查看详情
 const viewDetail = (item) => {
   uni.navigateTo({
-    url: `/pageSubPack/visitor/visitor-detail?id=${item.id}` // 传 id 到详情页
-  })
-}
+    url: `/pageSubPack/visitor/visitor-detail?id=${item.id}`,
+  });
+};
 
-// 新增邀请
 const addInvitation = () => {
-  uni.navigateTo({
-    url: '/pageSubPack/visitor/visitor-add'
-  })
-}
+  uni.navigateTo({ url: "/pageSubPack/visitor/visitor-add" });
+};
 </script>
 
 <style scoped>
-/* 页面整体样式 */
+/* 页面根容器 */
 .visitor-page {
-  background: linear-gradient(to bottom left, #E2F0FF 0%, #f9f9f9 50%);
-  min-height: 100vh;
-  padding: 0 40rpx;
+  background: linear-gradient(135deg, #e2f0ff 0%, #f9f9f9 50%);
+  padding: 0 30rpx;
 }
-  .status_bar {
-	  height: var(--status-bar-height);
-	/* height: 32px; */
-	width: 100%;
-	flex-shrink: 0;
- }
+
+.status-bar {
+  width: 100%;
+}
+
 /* 顶部导航栏 */
 .nav-bar {
-  height: 90rpx;
   display: flex;
   align-items: center;
-  /* padding: 0 30rpx; */
-  color: #fff;
-  position: sticky;
-  top: 44px;
-  z-index: 100;
-  margin-bottom: 20px;
+  height: 90rpx;
 }
 
 .nav-left {
@@ -201,15 +209,16 @@ const addInvitation = () => {
   justify-content: center;
 }
 
+.back-icon {
+  width: 36rpx;
+  height: 36rpx;
+}
+
 .nav-title {
   flex: 1;
   text-align: center;
   font-size: 32rpx;
-  font-weight: 400;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  padding: 0 20rpx;
+  font-weight: 500;
   color: #000;
 }
 
@@ -220,153 +229,163 @@ const addInvitation = () => {
 /* 标签切换栏 */
 .tab-bar {
   display: flex;
+  border-bottom: 1rpx solid rgba(0, 0, 0, 0.04);
 }
+
 .tab-item {
-  /* flex: 1; */
-  display: flex;
-  text-align: left;
-  padding: 20px 40px 0px 0px;
-  font-size: 16px;
-  color: #666;
   position: relative;
+  padding: 24rpx 0;
+  margin-right: 48rpx;
+  font-size: 30rpx;
+  color: #666;
 }
+
 .tab-item.active {
-  color: #007aff;
+  color: #2f77fd;
   font-weight: 500;
 }
-/* 激活标签下划线 */
+
 .tab-item.active::after {
-  content: '';
+  content: "";
   position: absolute;
-  bottom: -7px;
-  left: 33%;
+  bottom: 8rpx;
+  left: 50%;
   transform: translateX(-50%);
-  width: 64px;
-  height: 4px;
-  border-radius: 6rpx;
-  background-color: #2F77FD;
-  /* background-color: linear-gradient(to bottom, #2F77FD, #CEDFFF); */
+  width: 126rpx;
+  height: 8rpx;
+  border-radius: 32rpx;
+  /* background-color: #2f77fd; */
+  background: linear-gradient(to bottom, #2F77FD, #CEDFFF);
 }
 
-/* 列表容器 */
-.list-container {
-  height: calc(100vh - 220px); /* 预留导航、标签、按钮高度 */
-}
-
-/* 访客列表项 */
+/* 访客卡片 */
 .visitor-item {
+  margin-top: 24rpx;
+  padding: 24rpx;
   background-color: #fff;
-  margin: 25px 0px;
-  padding: 15px;
-  border-radius: 8px;
+  border-radius: 16rpx;
+  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04);
 }
-/* 列表项头部（姓名+状态） */
+
 .item-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 10px;
-}
-.visitor-name {
-  font-size: 16px;
-  color: #333;
-  font-weight: 500;
-}
-.visitor-name.visited{
-	color: #999;
-}
-.status-tag {
-  font-size: 14px;
-  padding: 2px 8px;
-  border-radius: 12px;
-}
-.status-tag.waiting {
-  color: #2F77FD;
-  /* background-color: #fff8e6; */
-}
-.status-tag.visited {
-  color: #999999;
-  /* background-color: #e6fffa; */
+  margin-bottom: 16rpx;
 }
 
-/* 列表项行数据 */
+.visitor-name {
+  font-size: 30rpx;
+  font-weight: 500;
+  color: #333;
+}
+
+.visitor-name.visited {
+  color: #999;
+}
+
+.status-tag {
+  font-size: 26rpx;
+}
+
+.status-tag.waiting {
+  color: #2f77fd;
+}
+
+.status-tag.visited {
+  color: #999;
+}
+
+/* 信息行 */
 .item-row {
   display: flex;
-  margin-bottom: 8px;
-  font-size: 14px;
+  margin-bottom: 12rpx;
+  font-size: 26rpx;
+  line-height: 1.6;
 }
+
 .label {
-  color: #222;
-  min-width: 80px;
+  min-width: 140rpx;
+  color: #666;
 }
+
 .value {
-  color: #333;
   flex: 1;
+  color: #333;
 }
-.label.visited{
-	color: #999;
+
+.label.visited,
+.value.visited {
+  color: #999;
 }
-.value.visited{
-	color: #999;
-}
-.time-text.visited{
-	color: #999;
-}
-/* 列表项底部（时间+查看详情） */
+
+/* 底部行 */
 .item-footer {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-top: 10px;
-  padding-top: 10px;
-  /* border-top: 1px solid #f5f5f5; */
+  margin-top: 16rpx;
+  padding-top: 16rpx;
+  border-top: 1rpx solid #f5f5f5;
 }
+
 .time-text {
-  font-size: 28rpx;
-  /* color: #666; */
+  font-size: 24rpx;
+  color: #999;
 }
+
+.time-text.visited {
+  color: #bbb;
+}
+
 .detail-btn {
   display: flex;
   align-items: center;
-  font-size: 14px;
+  font-size: 26rpx;
   color: #666;
 }
+
 /* 空状态 */
 .empty-state {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	padding: 100rpx 0;
-	color: #ccc;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 120rpx 0;
 }
 
 .empty-text {
-	font-size: 32rpx;
-	color: #999;
-	margin-top: 20rpx;
-	margin-bottom: 10rpx;
+  margin-top: 20rpx;
+  font-size: 28rpx;
+  color: #999;
+}
+
+/* 列表底部占位 */
+.list-bottom-space {
+  height: 24rpx;
 }
 
 /* 新增邀请按钮 */
-.add-btn {
-  position: fixed;
-  bottom: 20px;
-  left: 15px;
-  right: 15px;
-  height: 44px;
-  line-height: 44px;
-  background-color: #007aff;
-  color: #fff;
-  border-radius: 8px;
-  text-align: center;
-  font-size: 16px;
+.add-btn-wrapper {
+  height: 148rpx;
   display: flex;
-  justify-content: center;
   align-items: center;
 }
-.add-text {
-  margin-left: 5px;
-  font-size: 28rpx;
+
+.add-btn {
+  width: 100%;
+  height: 88rpx;
+  line-height: 88rpx;
+  background-color: #2f77fd;
+  color: #fff;
+  border-radius: 16rpx;
+  text-align: center;
+  font-size: 30rpx;
+  font-weight: 500;
+  box-shadow: 0 8rpx 24rpx rgba(47, 119, 253, 0.3);
 }
-</style>
\ No newline at end of file
+
+.add-text {
+  font-size: 30rpx;
+}
+</style>
diff --git a/property-uniapp-project/pages/index/index.vue b/property-uniapp-project/pages/index/index.vue
index e40b48a..7cc9eed 100644
--- a/property-uniapp-project/pages/index/index.vue
+++ b/property-uniapp-project/pages/index/index.vue
@@ -1,160 +1,168 @@
 <template>
 	<view class="content-class">
-		<!-- 顶部渐变背景层（仅视觉，不参与文档流） -->
-		<view class="nar-top"></view>
-		<!-- 这里是状态栏占位 -->
-		<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
-		<!-- 导航栏 -->
-		<view class="nav-bar">
-		    <text class="nav-title">首页</text>
-		</view>
-		<!-- 小区选择 -->
-		<view class="header-container" @click="navigateToPage">
-		    <!-- 左侧小区选择区域 -->
-		    <view class="location-area">
-		      <!-- 定位图标 -->
-				<view class="location-icon">
-					<image src="https://wuyeadmin.bugtc.com/images/home/adress.png" style="height: 100%;width: 100%;"></image>
+		<!-- 固定头部 -->
+		<view class="header-fixed">
+			<view class="nar-top"></view>
+			<view class="header-content">
+				<!-- 状态栏占位 -->
+				<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
+				<!-- 导航栏 -->
+				<view class="nav-bar">
+				    <text class="nav-title">首页</text>
 				</view>
-				<!-- 小区名称和下拉箭头 -->
-				<view class="community-selector">
-					<text class="community-name">{{ currentCommunity }}</text>
-					<u-icon
-						name="arrow-down-fill"
-						size="16"
-						:color="isDropdownOpen ? '#2979ff' : '#222222'"
-						:class="['dropdown-arrow', { 'rotate': isDropdownOpen }]"
-					></u-icon>
+				<!-- 小区选择 -->
+				<view class="header-container" @click="navigateToPage">
+				    <!-- 左侧小区选择区域 -->
+				    <view class="location-area">
+				      <!-- 定位图标 -->
+						<view class="location-icon">
+							<image src="https://wuyeadmin.bugtc.com/images/home/adress.png" style="height: 100%;width: 100%;"></image>
+						</view>
+						<!-- 小区名称和下拉箭头 -->
+						<view class="community-selector">
+							<text class="community-name">{{ currentCommunity }}</text>
+							<u-icon
+								name="arrow-down-fill"
+								size="16"
+								:color="isDropdownOpen ? '#2979ff' : '#222222'"
+								:class="['dropdown-arrow', { 'rotate': isDropdownOpen }]"
+							></u-icon>
+						</view>
+					</view>
 				</view>
 			</view>
 		</view>
 
-		<!-- banner -->
-		<view class="bannarClass">
-			  <up-swiper :list="bannerList"   indicator indicatorMode="dot"  ></up-swiper>
-		</view>	
-		  <view class="noticeClass" @click="getNoticeMore">
-			  <uni-notice-bar show-icon :text="noticeText" type="line"
-					show-get-more scrollable color="#000" background-color="#fff" moreColor="#000">
-				<template #noticebarIcon>
-					<image src="https://wuyeadmin.bugtc.com/images/home/notice.png" style="width: 38px;height: 38px;"></image>
-				</template>
-			   </uni-notice-bar>
-		  </view>
-		  <!-- 一键开门 -->
-		  <view class="u-demo-block__content bg-card-open">
-		      <up-row  justify="space-between" gutter="10">
-		          <up-col span="3">
-		              <view class="demo-layout bg-purple openClass" @click="openDoorClick">
+		<!-- 滚动内容区 -->
+		<scroll-view class="main-scroll" scroll-y>
+			<!-- banner -->
+			<view class="bannarClass">
+				  <up-swiper :list="bannerList"   indicator indicatorMode="dot"  ></up-swiper>
+			</view>
+			<!-- 公告 -->
+			<view class="noticeClass" @click="getNoticeMore">
+				  <uni-notice-bar show-icon :text="noticeText" type="line"
+						show-get-more scrollable color="#000" background-color="#fff" moreColor="#000">
+					<template #noticebarIcon>
+						<image src="https://wuyeadmin.bugtc.com/images/home/notice.png" style="width: 38px;height: 38px;"></image>
+					</template>
+				   </uni-notice-bar>
+			</view>
+			<!-- 一键开门 -->
+			<view class="u-demo-block__content bg-card-open">
+			    <up-row  justify="space-between" gutter="10">
+			        <up-col span="3">
+			            <view class="demo-layout bg-purple openClass" @click="openDoorClick">
 						  <view class="iconClass">
-								<image src="https://wuyeadmin.bugtc.com/images/home/openDoor.png" class="iconClass-img"></image> 
+								<image src="https://wuyeadmin.bugtc.com/images/home/openDoor.png" class="iconClass-img"></image>
 						  </view>
 						  <view class="title-dome-calss">一键开门</view>
 					  </view>
-		          </up-col>
-		          <up-col span="3">
-		              <view class="demo-layout bg-purple-light openClass" @click="payMentClick">
+			        </up-col>
+			        <up-col span="3">
+			            <view class="demo-layout bg-purple-light openClass" @click="payMentClick">
 						   <view class="iconClass">
-						  		<image src="https://wuyeadmin.bugtc.com/images/home/lifePay.png" class="iconClass-img"></image> 
+						 		<image src="https://wuyeadmin.bugtc.com/images/home/lifePay.png" class="iconClass-img"></image>
 						  	</view>
-						  <view class="title-dome-calss">生活缴费</view>
+					  <view class="title-dome-calss">生活缴费</view>
 					  </view>
-		          </up-col>
-		          <up-col span="3">
-		              <view class="demo-layout bg-purple openClass" @click="onlineRepairClick">
+			        </up-col>
+			        <up-col span="3">
+			            <view class="demo-layout bg-purple openClass" @click="onlineRepairClick">
 						    <view class="iconClass">
-						   		<image src="https://wuyeadmin.bugtc.com/images/home/repair.png" class="iconClass-img"></image> 
+						   		<image src="https://wuyeadmin.bugtc.com/images/home/repair.png" class="iconClass-img"></image>
 						   	</view>
-						   <view class="title-dome-calss">在线报修</view>
+					   <view class="title-dome-calss">在线报修</view>
 					  </view>
-		          </up-col>
-		          <up-col span="3">
-		              <view class="demo-layout bg-purple-light openClass" @click="visitorClick">
+			        </up-col>
+			        <up-col span="3">
+			            <view class="demo-layout bg-purple-light openClass" @click="visitorClick">
 						 <view class="iconClass">
-							<image src="https://wuyeadmin.bugtc.com/images/home/visitorInvite.png" class="iconClass-img"></image> 
+							<image src="https://wuyeadmin.bugtc.com/images/home/visitorInvite.png" class="iconClass-img"></image>
 						</view>
-						  <view class="title-dome-calss">访客邀请</view>
+					  <view class="title-dome-calss">访客邀请</view>
 					  </view>
-		          </up-col>
-		      </up-row>
-		  </view>
-		  <!-- 广告卡片 -->
-		  <view class="adCardClass">
-				<!-- <uni-card :is-shadow="false" > -->
-					<view class="u-demo-block__content">
-					    <up-row justify="space-between" customStyle="margin-bottom: 10px">
-							<up-col  span="3">
-							    <view class="demo-layout bg-purple iconRightClass">
-									<image src="https://wuyeadmin.bugtc.com/images/home/ad1.png" mode="" style="width: 100%;height: 100%;"></image>			
-								</view>
-							</up-col>
-					        <up-col  span="8">
-					            <view class="demo-layout bg-purple-light titleLeft">
-									<text style="color: #fff;font-size: 40rpx;font-weight: 700;">便民服务</text>
-									<view style="color: #fff;font-size: 28rpx;">邻里便民服务 全新上线</view>
-								</view>
-					        </up-col>
-					       
-					    </up-row>
-					</view>
-					
-				<!-- </uni-card> -->
-		  </view>
-		  <!-- 活动列表 -->
-		  <uni-card class="activity-card">
-			  <view  class="eventListClass">
-			  			  <view>
-							  <text class="activity-name">活动列表</text>
-			  				  <!-- <u-title>活动列表</u-title> -->
-			  			  </view>
-			  			  <view class="nav-more">
-			  				 	<!-- <up-button type="primary" shape="circle" size="small" text="查看更多" @click="moreClick"></up-button> -->
-								<text class="look-more-title" @click="moreClick">查看更多</text>
-			  			  </view>
-			  </view>
-			  <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y">	
-			     <view  class="eventListCard"  v-for="(activity, index) in activityList" :key="activity.id">
-				  	<!-- 状态标签 -->
-				  	<view class="status-tag" :class="{}">
-				  	  {{ activity.statusText }}
-				  	  <!-- 进行中 -->
-				  	</view>
-						<view class="u-demo-block__content ">
+			        </up-col>
+			    </up-row>
+			</view>
+			<!-- 广告卡片 -->
+			<view class="adCardClass">
+					<!-- <uni-card :is-shadow="false" > -->
+						<view class="u-demo-block__content">
 						    <up-row justify="space-between" customStyle="margin-bottom: 10px">
-						        <up-col   span="4">
-						            <view class="demo-layout bg-purple-light activity-img">
-										<image :src="activity.coverImage" style="width: 100%;height: 100%;"></image>
+								<up-col  span="3">
+								    <view class="demo-layout bg-purple iconRightClass">
+										<image src="https://wuyeadmin.bugtc.com/images/home/ad1.png" mode="" style="width: 100%;height: 100%;"></image>
 									</view>
-						        </up-col>
+								</up-col>
 						        <up-col  span="8">
-						            <view class="demo-layout bg-purple activity-info">
-										<view class="activity-title">{{activity.title}}</view>
-										<view class="activity-time">{{formatDate(activity.startTime)}}-{{formatDate(activity.endTime)}}</view>
-										<view class="activity-organizer">
-											<text>{{activity.createName}}</text>
-										</view>
-										<view class="activity-enrollment">
-											<text>活动名额{{activity.quota}}人，已报名{{activity.appliedCount}}人</text>
-										</view>
+							        <view class="demo-layout bg-purple-light titleLeft">
+										<text style="color: #fff;font-size: 40rpx;font-weight: 700;">便民服务</text>
+										<view style="color: #fff;font-size: 28rpx;">邻里便民服务 全新上线</view>
 									</view>
 						        </up-col>
+
 						    </up-row>
 						</view>
-				  	
 
-			    </view>
-			  </scroll-view>
-			  <!-- 空状态 -->
-			  <view v-if="activityList.length === 0" class="empty-state">
-			    <uni-icons type="info" size="30" color="#ccc"></uni-icons>
-			    <text class="empty-text">暂无数据</text>
-			  </view>
-			  
-			
-		  </uni-card>
-		
-		
-		
+					<!-- </uni-card> -->
+			</view>
+			<!-- 活动列表 -->
+			<uni-card class="activity-card">
+				<view  class="eventListClass">
+				  			  <view>
+							  <text class="activity-name">活动列表</text>
+				  			  <!-- <u-title>活动列表</u-title> -->
+				  			  </view>
+				  			  <view class="nav-more">
+				  			 	<!-- <up-button type="primary" shape="circle" size="small" text="查看更多" @click="moreClick"></up-button> -->
+								<text class="look-more-title" @click="moreClick">查看更多</text>
+				  			  </view>
+				</view>
+				<!-- 活动列表内容（去掉内层 scroll-view，由外层统一滚动） -->
+				<view class="activity-list">
+				     <view  class="eventListCard"  v-for="(activity, index) in activityList" :key="activity.id">
+					  	<!-- 状态标签 -->
+					  	<view class="status-tag" :class="{}">
+					  	  {{ activity.statusText }}
+					  	  <!-- 进行中 -->
+					  	</view>
+							<view class="u-demo-block__content ">
+							    <up-row justify="space-between" customStyle="margin-bottom: 10px">
+							        <up-col   span="4">
+							            <view class="demo-layout bg-purple-light activity-img">
+											<image :src="activity.coverImage" style="width: 100%;height: 100%;"></image>
+										</view>
+							        </up-col>
+							        <up-col  span="8">
+							            <view class="demo-layout bg-purple activity-info">
+											<view class="activity-title">{{activity.title}}</view>
+											<view class="activity-time">{{formatDate(activity.startTime)}}-{{formatDate(activity.endTime)}}</view>
+											<view class="activity-organizer">
+												<text>{{activity.createName}}</text>
+											</view>
+											<view class="activity-enrollment">
+												<text>活动名额{{activity.quota}}人，已报名{{activity.appliedCount}}人</text>
+											</view>
+										</view>
+							        </up-col>
+							    </up-row>
+							</view>
+
+				    </view>
+				</view>
+				<!-- 空状态 -->
+				<view v-if="activityList.length === 0" class="empty-state">
+				    <uni-icons type="info" size="30" color="#ccc"></uni-icons>
+				    <text class="empty-text">暂无数据</text>
+				</view>
+
+
+			</uni-card>
+
+			<!-- 底部占位 -->
+			<view class="scroll-bottom-space"></view>
+		</scroll-view>
 	</view>
 
 </template>
@@ -172,12 +180,12 @@ const scrollTop = ref(0)
 const activityList = ref([]) // 活动列表数据
 const currentCommunity = ref('请认证小区')
 const currentVillageId  = ref('')
-const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight || 0)
+const statusBarHeight = ref(0)
 const bannerList = ref([
 	// 'http://47.104.199.163:9090/images/home/banner.png',
 	// "http://47.104.199.163:9090/images/propertyImgs/serviceImg2.png"
-	
-]) 
+
+])
 const noticeText = ref('暂无公告')
 const noticeId = ref('')
 
@@ -212,11 +220,11 @@ const getbannarData = async () =>{
 const slelctHomeData = (data) =>{
 	  // console.log('收到B页面返回的数据：', data)
 	  if(data.name){
-		  currentCommunity.value = data.name 
+		  currentCommunity.value = data.name
 	  }
 	  if(data.villageId){
-			currentVillageId.value = data.villageId  
-	  } 
+			currentVillageId.value = data.villageId
+	  }
 	  getCurrentCommunityData()
 	  getNoticeData()
 	  getNewActivityList()
@@ -239,7 +247,7 @@ const getCurrentCommunityData = () => {
 		});
 	})
 }
-  
+
 
 // 获取首页最新小区公告
 const getNoticeData =  async() =>{
@@ -253,7 +261,7 @@ const getNoticeData =  async() =>{
 					noticeText.value = '暂无公告'
 					noticeId.value = ''
 				}
-		  
+
 		    } else {
 		      uni.showToast({
 		        title: res.msg || '获取通知失败',
@@ -274,19 +282,22 @@ const getNoticeData =  async() =>{
 
 onShow(() =>{
 })
-	
+
 
 onLoad(() => {
-  // 绑定全局事件监听  
+  const info = uni.getSystemInfoSync()
+  statusBarHeight.value = info.statusBarHeight || 0
+
+  // 绑定全局事件监听
   uni.$on('confirm', slelctHomeData)
- 
+
    // 页面加载时，先判断是否有token，有则获取认证小区
     const token = uni.getStorageSync('token') || '';
 	const currentVillageId = uni.getStorageSync('currentVillageId');
     if (token && currentVillageId && currentVillageId !== '0' && currentVillageId !== 0) {
       getCurrentCommunityData(); // 加载时获取认证小区
     }
-	 getNoticeData() 
+	 getNoticeData()
 	 getNewActivityList()
 	 getbannarData()
 })
@@ -334,7 +345,7 @@ const navigateToPage = () => {
       url: `/pageSubPack/notice-list/selectHome?villageId=${cachedVillageId}`
     });
   }
-}; 
+};
 // 获取首页最新活动
 const getNewActivityList = async() =>{
 	try{
@@ -391,248 +402,270 @@ const moreClick = () =>{
 <style lang="scss" scoped>
 	.content-class{
 		background-color: #f9f9f9;
-		 padding-bottom: 40rpx;
-		  box-sizing: border-box; /* 保证padding不会撑大容器 */
-		  min-height: 100vh;
-		  overflow-y: auto;
-		  position: relative;
-		.nar-top{
-			height: 400rpx;
-			width: 100%;
-			background: repeating-linear-gradient(to right, #EDF4FA , #C0E4FB);
-			position: absolute;
-			top: 0;
-			left: 0;
-			z-index: 0;
-		}
-		  .status_bar {
-		    width: 100%;
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		display: flex;
+		flex-direction: column;
+		/* 固定头部 */
+		.header-fixed {
+			position: relative;
 			flex-shrink: 0;
-			position: relative;
-			z-index: 1;
-		  }
-		  /* 导航栏 */
-		  .nav-bar {
-		    height: 44px;
-		    line-height: 44px;
-		    text-align: center;
-			position: relative;
-			z-index: 1;
-		  }
-		  .nav-title {
-		    font-size: 32rpx;
-		    font-weight: 500;
-		  }
-		.header-container{
-			  display: flex;
-			  align-items: center;
-			  justify-content: space-between;
-			  padding: 4rpx 30rpx;
-			  box-sizing: border-box;
-			  // border-bottom: 1rpx solid #f0f0f0;
-			  position: relative;
-			  z-index: 10;
-		}
-		// 左侧区域
-		.location-area {
-		  display: flex;
-		  align-items: center;
-		  position: relative;
-		  flex: 1;
-		  min-width: 0;
-		  .location-icon {
-			  width: 45rpx;
-			  height: 45rpx;
-		    margin-right: 12rpx;
-		    flex-shrink: 0;
-		  }
-		 .community-selector {
-		      display: flex;
-		      align-items: center;
-		      max-width: 300rpx;
-		      cursor: pointer;
-			    .community-name {
-			        font-size: 26rpx;
-			        font-weight: 500;
-			        color: #000;
-			        white-space: nowrap;
-			        overflow: hidden;
-			        text-overflow: ellipsis;
-			        max-width: 200rpx;
-			      }
-			  }
-		}
-		.bannarClass{
-			position: relative;
-			padding: 20rpx 40rpx;
-			// margin-bottom: 20rpx;
-			height: 300rpx;
-			::v-deep .u-swiper{
-				height: 300rpx !important;
-			}
-			::v-deep .u-swiper__wrapper{
-				height: 300rpx !important;
-			}
-			::v-deep .u-swiper__wrapper__item__wrapper__image{
-				height: 300rpx !important;
-			}
-		}
-		.noticeClass{
-			padding: 0rpx 36rpx;
-			margin-bottom: 20rpx;
-		}
-		// 修改通知栏样式
-		::v-deep .uni-noticebar__content-wrapper--scrollable{
-			margin-right: 20px;
-		}
-		::v-deep .uni-noticebar{
-			padding: 4px 12px;
-		}
-		
-		.notice-bar::after {
-		    color: #3E8EFF;
-		}
-		.bg-card-open{
-			padding: 20rpx;
-			background-color: #fff;
-			border-radius: 8rpx;
-			margin: 0 18px 20rpx;
-		}
-		.openClass{
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			margin-top: 20rpx;
-			.iconClass{
-				width: 88rpx;
-				height: 88rpx;
-				border-radius: 10rpx;
-				// opacity: 0.4;
-			
-			}
-			.iconClass-img{
+			.nar-top{
+				height: 400rpx;
 				width: 100%;
-				height: 100%;
-				border-radius: 8px
+				background: repeating-linear-gradient(to right, #EDF4FA , #C0E4FB);
+				position: absolute;
+				top: 0;
+				left: 0;
+				z-index: 0;
 			}
-			.title-dome-calss{
-				margin-top: 10rpx;
-				font-size: 28rpx;
-				color: #000;
+			.header-content {
+				position: relative;
+				z-index: 1;
 			}
 		}
-		.adCardClass{
-			// width: 100%;
-			height: 200rpx;
-			margin: 0 30rpx 20rpx;
-			background-color: #3E8EFF;
-			// margin-top: 30rpx;
-			border-radius: 28rpx;
-			 .titleLeft{
-				text-align: left;
-				line-height: 2;
-				// margin-top: 32rpx;
-				// margin-left: 30rpx;
-			 }
-			 .iconRightClass{
-				 width: 120rpx;
-				 height: 120rpx;
-				 border-radius: 50%;
-				 // margin-top: 20rpx;
-				 margin: 36rpx;
-			 }
+		/* 滚动区域 */
+		.main-scroll {
+			flex: 1;
+			min-height: 0;
+			overflow: hidden;
+			position: relative;
+			z-index: 1;
 		}
-			.activity-card{
-			}
-			.uni-card{
-			margin: 0 18px 20rpx !important;
+		.scroll-bottom-space {
+			height: 40rpx;
 		}
-		.eventListClass{
-			margin: 10rpx 0;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-		}
-		.activity-name{
-			font-size: 32rpx;
-			font-weight: 600;
-			color: #222;
-			
-		}
-		.eventListCard{
-			// min-height:200rpx ;
-			 position: relative;
-			 margin: 30rpx 0rpx;
-			 // overflow: hidden;
-				.status-tag {
-				  position: absolute;
-				  top: 0;
-				  left: 0;
-				  // padding: 6px 18px;
-				  padding: 0px 7px 10px 11px;
-				  border-radius: 10px 0px 10px 0px;
-				  font-size: 12px;
-				  color: #fff;
-				  font-weight: 500;
-				  width: 80rpx;
-				  height: 20rpx;
-				  // background-color: #FD7373 ;
-				  background: repeating-linear-gradient(to right, #FD7373  , #FB3F3F);
-				  }
-			.activity-img{
-				width: 170rpx;
-				height: 230rpx;
-				// background-color: #333333;
-			}
-			.activity-title{
-				font-size: 32rpx;
-				font-weight: bold;
-				color: #333;
-				margin-bottom: 12px;
-				line-height: 1.4;
-			}
-			
-			.activity-time{
-			  display: flex;
-			  align-items: center;
-			  font-size: 22rpx;
-			  color: #999999;
-			  margin-bottom: 8px;
-			}
-			.activity-organizer{
-				font-size: 28rpx;
-				display: flex;
-				align-items: center;
-				color: #999999;
-				margin-bottom: 8px;
-			}
-			.activity-enrollment{
-				display: flex;
-				align-items: center;
-				 font-size: 28rpx;
-				 margin-top: 20rpx;
-				 color: #666666;
-			}	
-		}
-		.empty-state {
+	  .status_bar {
+	    width: 100%;
+		flex-shrink: 0;
+		position: relative;
+		z-index: 1;
+	  }
+	  /* 导航栏 */
+	  .nav-bar {
+	    height: 44px;
+	    line-height: 44px;
+	    text-align: center;
+		position: relative;
+		z-index: 1;
+	  }
+	  .nav-title {
+	    font-size: 32rpx;
+	    font-weight: 500;
+	  }
+	.header-container{
 		  display: flex;
-		  flex-direction: column;
 		  align-items: center;
-		  justify-content: center;
-		  padding: 100rpx 0;
+		  justify-content: space-between;
+		  padding: 4rpx 30rpx;
+		  box-sizing: border-box;
+		  // border-bottom: 1rpx solid #f0f0f0;
+		  position: relative;
+		  z-index: 10;
+	}
+	// 左侧区域
+	.location-area {
+	  display: flex;
+	  align-items: center;
+	  position: relative;
+	  flex: 1;
+	  min-width: 0;
+	  .location-icon {
+		  width: 45rpx;
+		  height: 45rpx;
+	    margin-right: 12rpx;
+	    flex-shrink: 0;
+	  }
+	 .community-selector {
+	      display: flex;
+	      align-items: center;
+	      max-width: 300rpx;
+	      cursor: pointer;
+		    .community-name {
+		        font-size: 26rpx;
+		        font-weight: 500;
+		        color: #000;
+		        white-space: nowrap;
+		        overflow: hidden;
+		        text-overflow: ellipsis;
+		        max-width: 200rpx;
+		      }
+		  }
+	}
+	.bannarClass{
+		position: relative;
+		padding: 20rpx 40rpx;
+		// margin-bottom: 20rpx;
+		height: 300rpx;
+		::v-deep .u-swiper{
+			height: 300rpx !important;
 		}
-		
-		.empty-text {
-		  font-size: 32rpx;
-		  color: #999;
-		  margin-top: 20rpx;
-		  margin-bottom: 10rpx;
+		::v-deep .u-swiper__wrapper{
+			height: 300rpx !important;
 		}
-		.look-more-title{
-			color: #3E8EFF;
+		::v-deep .u-swiper__wrapper__item__wrapper__image{
+			height: 300rpx !important;
+		}
+	}
+	.noticeClass{
+		padding: 0rpx 36rpx;
+		margin-bottom: 20rpx;
+	}
+	// 修改通知栏样式
+	::v-deep .uni-noticebar__content-wrapper--scrollable{
+		margin-right: 20px;
+	}
+	::v-deep .uni-noticebar{
+		padding: 4px 12px;
+	}
+
+	.notice-bar::after {
+	    color: #3E8EFF;
+	}
+	.bg-card-open{
+		padding: 20rpx;
+		background-color: #fff;
+		border-radius: 8rpx;
+		margin: 0 18px 20rpx;
+	}
+	.openClass{
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		margin-top: 20rpx;
+		.iconClass{
+			width: 88rpx;
+			height: 88rpx;
+			border-radius: 10rpx;
+			// opacity: 0.4;
+
+		}
+		.iconClass-img{
+			width: 100%;
+			height: 100%;
+			border-radius: 8px
+		}
+		.title-dome-calss{
+			margin-top: 10rpx;
 			font-size: 28rpx;
+			color: #000;
 		}
 	}
+	.adCardClass{
+		// width: 100%;
+		height: 200rpx;
+		margin: 0 30rpx 20rpx;
+		background-color: #3E8EFF;
+		// margin-top: 30rpx;
+		border-radius: 28rpx;
+		 .titleLeft{
+			text-align: left;
+			line-height: 2;
+			// margin-top: 32rpx;
+			// margin-left: 30rpx;
+		 }
+		 .iconRightClass{
+			 width: 120rpx;
+			 height: 120rpx;
+			 border-radius: 50%;
+			 // margin-top: 20rpx;
+			 margin: 36rpx;
+		 }
+	}
+		.activity-card{
+		}
+		.uni-card{
+		margin: 0 18px 20rpx !important;
+	}
+	.eventListClass{
+		margin: 10rpx 0;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+	.activity-name{
+		font-size: 32rpx;
+		font-weight: 600;
+		color: #222;
+
+	}
+	.eventListCard{
+		// min-height:200rpx ;
+		 position: relative;
+		 margin: 30rpx 0rpx;
+		 // overflow: hidden;
+			.status-tag {
+			  position: absolute;
+			  top: 0;
+			  left: 0;
+			  // padding: 6px 18px;
+			  padding: 0px 7px 10px 11px;
+			  border-radius: 10px 0px 10px 0px;
+			  font-size: 12px;
+			  color: #fff;
+			  font-weight: 500;
+			  width: 80rpx;
+			  height: 20rpx;
+			  // background-color: #FD7373 ;
+			  background: repeating-linear-gradient(to right, #FD7373  , #FB3F3F);
+			  }
+		.activity-img{
+			width: 170rpx;
+			height: 230rpx;
+			// background-color: #333333;
+		}
+		.activity-title{
+			font-size: 32rpx;
+			font-weight: bold;
+			color: #333;
+			margin-bottom: 12px;
+			line-height: 1.4;
+		}
+
+		.activity-time{
+		  display: flex;
+		  align-items: center;
+		  font-size: 22rpx;
+		  color: #999999;
+		  margin-bottom: 8px;
+		}
+		.activity-organizer{
+			font-size: 28rpx;
+			display: flex;
+			align-items: center;
+			color: #999999;
+			margin-bottom: 8px;
+		}
+		.activity-enrollment{
+			display: flex;
+			align-items: center;
+			 font-size: 28rpx;
+			 margin-top: 20rpx;
+			 color: #666666;
+		}
+	}
+	.empty-state {
+	  display: flex;
+	  flex-direction: column;
+	  align-items: center;
+	  justify-content: center;
+	  padding: 100rpx 0;
+	}
+
+	.empty-text {
+	  font-size: 32rpx;
+	  color: #999;
+	  margin-top: 20rpx;
+	  margin-bottom: 10rpx;
+	}
+	.look-more-title{
+		color: #3E8EFF;
+		font-size: 28rpx;
+	}
+	}
 
 
 </style>