@@ -1,25 +1,22 @@
< template >
< view class = "content-class" >
<!-- 首次加载遮罩 -- >
< view class = "loading-mask" v-if = "!pageReady" >
< view class = "loading-bg" > < / view >
< / view >
<!-- 固定头部 -- >
< view class = "header-fixed" >
< view class = "header-fixed" v-if = "pageReady" >
< 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 = "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'"
@@ -31,7 +28,7 @@
< / view >
<!-- 滚动内容区 -- >
< scroll-view class = "main-scroll" scroll -y >
< scroll-view class = "main-scroll" v-if = "pageReady" scroll -y >
<!-- banner -- >
< view class = "bannarClass" >
< up-swiper :key = "bannerSwiperKey" :list = "bannerList" indicator indicatorMode = "dot" radius = "10" >
@@ -107,7 +104,6 @@
< view style = "color: #fff;font-size: 28rpx;" > 邻里便民服务 即将上线 < / view >
< / view >
< / up-col >
< / up-row >
< / view >
< / view >
@@ -121,7 +117,6 @@
< 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"
@click ="goToActivityDetail(activity)" >
@@ -155,7 +150,6 @@
< / up -col >
< / up-row >
< / view >
< / view >
< / view >
<!-- 空状态 -- >
@@ -163,15 +157,12 @@
< 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 >
< script setup >
@@ -196,85 +187,77 @@
// 列表数据状态
const isDropdownOpen = ref ( false )
const scrollTop = ref ( 0 )
const activityList = ref ( [ ] ) // 活动列表数据
const activityList = ref ( [ ] )
const currentCommunity = ref ( '请绑定房屋' )
const currentVillageId = ref ( '' )
const statusBarHeight = ref ( 0 )
const bannerList = ref ( [ ] )
const bannerRawData = ref ( [ ] ) // 保留原始数据（ ）
const bannerRawData = ref ( [ ] )
const bannerSwiperKey = ref ( 0 )
const noticeText = ref ( '暂无公告' )
const noticeKey = ref ( 0 )
const noticeId = ref ( '' )
const lastUserId = ref ( '' ) // 用于检测是否切换账号
const lastUserId = ref ( '' )
const pageReady = ref ( false )
// =======工具方法=======
const requireLogin = ( ) => {
const token = uni . getStorageSync ( 'token' )
if ( ! token ) {
uni . showToast ( { title : '请先登录' , icon : 'none' } )
setTimeout ( ( ) => {
uni . navigateTo ( { url : '/pageSubPack/loginSub/login?mode=pwd' } )
} , 1000 )
return false
}
return true
}
// =======方法=======
// 格式化时间
const formatDate = ( date ) => {
if ( ! date ) return ''
return moment ( date ) . format ( 'YYYY-MM-DD HH:mm' )
}
// 公告跳转
const getNoticeMore = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : "/pageSubPack/notice-list/noticeList"
} )
uni . navigateTo ( { url : "/pageSubPack/notice-list/noticeList" } )
}
// 获取bannar列表
const getbannarData = async ( ) => {
try {
const res = await getBannarList ( {
villageId : uni . getStorageSync ( 'currentVillageId' )
} )
const res = await getBannarList ( { villageId : uni . getStorageSync ( 'currentVillageId' ) } )
if ( res . code === 200 ) {
bannerRawData . value = res . data || [ ]
const newList = ( res . data || [ ] ) . map ( item => item . url )
// 只有 banner 数据真正变化时才更新，避免 swiper 反复重建
if ( JSON . stringify ( newList ) !== JSON . stringify ( bannerList . value ) ) {
bannerList . value = newList
await nextTick ( )
bannerSwiperKey . value ++
}
} else {
uni . showToast ( {
title : '获取失败' ,
icon : 'none'
} )
}
} catch ( err ) {
const msg = err ? . msg || ( typeof err === 'string' ? err : '获取失败' )
uni . showToast ( {
title : msg ,
icon : 'none'
} )
// 静默失败
}
}
// banner点击跳转
const bannerClick = ( index ) => {
if ( ! requireLogin ( ) ) return
const item = bannerRawData . value [ index ]
if ( item && item . link ) {
uni . navigateTo ( {
url : item . link
} )
uni . navigateTo ( { url : item . link } )
}
}
// 接收选择小区返回的参数
const slelctHomeData = ( data ) => {
// console.log('收到B页面返回的数据：
if ( data . name ) {
currentCommunity . value = data . name
}
if ( data . villageId ) {
currentVillageId . value = data . villageId
}
if ( data . name ) currentCommunity . value = data . name
if ( data . villageId ) currentVillageId . value = data . villageId
getCurrentCommunityData ( )
getNoticeData ( )
noticeKey . value ++
getNewActivityList ( )
}
// 获取当前认证小区的方法
const getCurrentCommunityData = ( ) => {
getCurrentVillage ( ) . then ( res => {
if ( res . code === 200 && res . data && res . data . villageId ) {
@@ -286,15 +269,10 @@
currentVillageId . value = ''
}
} ) . catch ( err => {
uni . showToast ( {
title : err . msg || '网络异常' ,
icon : 'error'
} ) ;
uni . showToast ( { title : err . msg || '网络异常' , icon : 'error' } )
} )
}
// 获取首页最新小区公告
const getNoticeData = async ( ) => {
try {
const res = await getNoticeLatest ( )
@@ -306,54 +284,38 @@
noticeText . value = '暂无公告'
noticeId . value = ''
}
} else {
uni . showToast ( {
title : res . msg || '获取通知失败' ,
icon : 'none' ,
duration : 2000
} )
}
} catch ( err ) {
uni . showToast ( {
title : err . msg || '网络异常' ,
icon : 'none' ,
duration : 1000
} )
noticeText . value = '暂无公告'
noticeId . value = ''
}
}
// 刷新所有数据（提取公共方法）
const refreshAllData = async ( ) => {
const token = uni . getStorageSync ( 'token' ) || '' ;
const needReload = uni . getStorageSync ( 'needReloadUserInfo' ) ;
// 只有从绑定房屋返回首页时，
const token = uni . getStorageSync ( 'token' ) || ''
const needReload = uni . getStorageSync ( 'needReloadUserInfo' )
if ( token && needReload ) {
try {
const res = await getReloadUserInfo ( ) ;
const res = await getReloadUserInfo ( )
if ( res . code === 200 && res . data ) {
if ( res . data . userId ) {
uni . setStorageSync ( 'userId' , res . data . userId ) ;
}
const reloadedVillageId = res . data . currentVillageId || 0 ;
uni . setStorageSync ( 'currentVillageId' , reloadedVillageId ) ;
if ( res . data . userId ) uni . setStorageSync ( 'userId' , res . data . userId )
const reloadedVillageId = res . data . currentVillageId || 0
uni . setStorageSync ( 'currentVillageId' , reloadedVillageId )
}
} catch ( err ) {
console . error ( '重新加载用户信息失败' , err ) ;
console . error ( '重新加载用户信息失败' , err )
} finally {
uni . removeStorageSync ( 'needReloadUserInfo' ) ;
uni . removeStorageSync ( 'needReloadUserInfo' )
}
}
getCurrentCommunityData ( ) ;
getCurrentCommunityData ( )
getNoticeData ( )
noticeKey . value ++
getNewActivityList ( )
getbannarData ( )
pageReady . value = true
}
// 切换账号时重置页面数据
const resetPageData = ( ) => {
currentCommunity . value = '请先绑定房屋'
currentVillageId . value = ''
@@ -366,131 +328,84 @@
onShow ( ( ) => {
const currentUserId = uni . getStorageSync ( 'userId' ) || ''
// 检测到切换账号：重置数据并重新加载
if ( lastUserId . value && lastUserId . value !== currentUserId ) {
resetPageData ( )
refreshAllData ( )
} else {
// 首次显示 或 非切换账号的普通返回，直接刷新数据（不清空已有数据）
refreshAllData ( )
}
lastUserId . value = currentUserId
} )
onLoad ( ( ) => {
const info = uni . getSystemInfoSync ( )
statusBarHeight . value = info . statusBarHeight || 0
// 绑定全局事件监听
uni . $on ( 'confirm' , slelctHomeData )
// 记录当前用户ID，
lastUserId . value = uni . getStorageSync ( 'userId' ) || ''
// 数据刷新统一放到 onShow，
} )
// 页面销毁时移除监听（防止内存泄漏）
onUnload ( ( ) => {
uni . $off ( 'confirm' , slelctHomeData )
} )
// 方法逻辑
const openDoorClick = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : "/pageSubPack/notice-list/oneClickOpen"
} )
uni . navigateTo ( { url : "/pageSubPack/notice-list/oneClickOpen" } )
}
// 生活缴费
const payMentClick = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : "/pageSubPack/payment-list/paymentIndex"
} )
uni . navigateTo ( { url : "/pageSubPack/payment-list/paymentIndex" } )
}
// 点击小区选择
const navigateToPage = ( ) => {
// const token = uni.getStorageSync('token') || '';
const cachedVillageId = uni . getStorageSync ( 'currentVillageId' ) ;
// 未登录 或 未绑定小区 → 去我的页面认证
cachedVillageId = uni . getStorageSync ( 'currentVillageId' )
if ( ! cachedVillageId || cachedVillageId === '0' || cachedVillageId === 0 ) {
currentCommunity . value = '请先绑定房屋' ;
uni . setStorageSync ( 'currentCommunity' , '请先绑定房屋' ) ;
uni . showToast ( {
title : '请先绑定小区' ,
icon : 'none' ,
duration : 1500
} ) ;
setTimeout ( ( ) => {
uni . switchTab ( {
url : '/pages/myIndex/myIndex' ,
} ) ;
} , 1500 ) ;
currentCommunity . value = '请先绑定房屋'
uni . setStorageSync ( 'currentCommunity' , '请先绑定房屋' )
uni . showToast ( { title : '请先绑定小区' , icon : 'none' , duration : 1500 } )
setTimeout ( ( ) => { uni . switchTab ( { url : '/pages/myIndex/myIndex' } ) } , 1500 )
} else {
// 已登录且已绑定小区 → 去选择小区
uni . navigateTo ( {
url : ` /pageSubPack/notice-list/selectHome?villageId= ${ cachedVillageId } `
} ) ;
uni . navigateTo ( { url : ` /pageSubPack/notice-list/selectHome?villageId= ${ cachedVillageId } ` } )
}
} ;
// 获取首页最新活动
}
const getNewActivityList = async ( ) => {
try {
let params = {
villageId : uni . getStorageSync ( 'currentVillageId' )
}
const res = await getActivitylatest ( params )
const res = await getActivitylatest ( { villageId : uni . getStorageSync ( 'currentVillageId' ) } )
if ( res . code === 200 ) {
if ( res . data ) {
activityList . value = res . data || [ ]
} else {
activityList . value = [ ]
}
activityList . value = res . data || [ ]
} else {
activityList . value = [ ]
uni . showToast ( {
title : res . msg ,
icon : 'error' ,
duration : 1000
} )
}
} catch ( err ) {
uni . showToast ( {
title : err . msg || '网络异常' ,
icon : 'error' ,
duration : 1000
} )
activityList . value = [ ]
}
}
const onlineRepairClick = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : '/pageSubPack/online-repair/onlineRepair'
} )
uni . navigateTo ( { url : '/pageSubPack/online-repair/onlineRepair' } )
}
// 访客邀请
const visitorClick = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : "/pageSubPack/visitor/visitor-list"
} )
uni . navigateTo ( { url : "/pageSubPack/visitor/visitor-list" } )
}
// 跳转到活动详情页
const goToActivityDetail = ( activity ) => {
if ( ! requireLogin ( ) ) return
uni . navigateTo ( {
url : ` /pageSubPack/activity-list/activityListDetails?id= ${ activity . id } &title= ${ activity . title } &applied= ${ activity . applied || '' } &statusText= ${ activity . statusText || '' } `
} )
}
// 活动列表的查看更多
const moreClick = ( ) => {
if ( ! requireLogin ( ) ) return
uni . setStorageSync ( 'sourcePage' , "index" )
uni . navigateTo ( {
url : "/pageSubPack/activity-list/activityList"
} )
uni . navigateTo ( { url : "/pageSubPack/activity-list/activityList" } )
}
< / script >
@@ -505,6 +420,22 @@
display : flex ;
flex - direction : column ;
/* 加载遮罩 */
. loading - mask {
position : absolute ;
top : 0 ;
left : 0 ;
right : 0 ;
bottom : 0 ;
z - index : 999 ;
}
. loading - bg {
width : 100 % ;
height : 100 % ;
background : repeating - linear - gradient ( to right , # EDF4FA , # C0E4FB ) ;
}
/* 固定头部 */
. header - fixed {
position : relative ;
@@ -539,34 +470,12 @@
height : 40 rpx ;
}
. status _bar {
width : 100 % ;
flex - shrink : 0 ;
position : relative ;
z - index : 1 ;
}
/* 导航栏 */
. nav - bar {
height : 44 px ;
line - height : 44 px ;
text - align : center ;
position : relative ;
z - index : 1 ;
}
. nav - title {
font - size : 32 rpx ;
font - weight : 500 ;
}
. header - container {
display : flex ;
align - items : center ;
justify - content : space - between ;
padding : 4 rpx 30 rpx ;
padding : 20 rpx 30 rpx ;
box - sizing : border - box ;
// border-bottom: 1rpx solid #f0f0f0;
position : relative ;
z - index : 10 ;
}
@@ -607,7 +516,6 @@
. bannarClass {
position : relative ;
padding : 20 rpx 40 rpx ;
// margin-bottom: 20rpx;
height : 300 rpx ;
: : v - deep . u - swiper {
@@ -634,7 +542,6 @@
margin - bottom : 20 rpx ;
}
// 修改通知栏样式
: : v - deep . uni - noticebar _ _content - wrapper -- scrollable {
margin - right : 20 px ;
}
@@ -643,10 +550,6 @@
padding : 4 px 12 px ;
}
. notice - bar : : after {
color : # 3 E8EFF ;
}
. bg - card - open {
padding : 20 rpx ;
background - color : # fff ;
@@ -664,8 +567,6 @@
width : 88 rpx ;
height : 88 rpx ;
border - radius : 10 rpx ;
// opacity: 0.4;
}
. iconClass - img {
@@ -682,31 +583,24 @@
}
. adCardClass {
// width: 100%;
height : 200 rpx ;
margin : 0 30 rpx 20 rpx ;
background - color : # 3 E8EFF ;
// margin-top: 30rpx;
border - radius : 28 rpx ;
. titleLeft {
text - align : left ;
line - height : 2 ;
// margin-top: 32rpx;
// margin-left: 30rpx;
}
. iconRightClass {
width : 120 rpx ;
height : 120 rpx ;
border - radius : 50 % ;
// margin-top: 20rpx;
margin : 36 rpx ;
}
}
. activity - card { }
. uni - card {
margin : 0 18 px 20 rpx ! important ;
}
@@ -722,20 +616,16 @@
font - size : 32 rpx ;
font - weight : 600 ;
color : # 222 ;
}
. eventListCard {
// min-height:200rpx ;
position : relative ;
margin : 30 rpx 0 rpx ;
// overflow: hidden;
. activity - img {
width : 170 rpx ;
height : 230 rpx ;
position : relative ;
// background-color: #333333;
}
. status - tag {
@@ -806,4 +696,4 @@
font - size : 28 rpx ;
}
}
< / style >
< / style >
zhouyanli