优化全局下拉刷新

This commit is contained in:
zhouyanli
2026-08-20 15:41:27 +08:00
parent 325813c67e
commit ec66ed3076
19 changed files with 258 additions and 338 deletions

View File

@@ -2,8 +2,8 @@
"name" : "花开物业", "name" : "花开物业",
"appid" : "__UNI__29C3D60", "appid" : "__UNI__29C3D60",
"description" : "智慧社区居民端面向小区业主使用,支持注册、验证码、账号密码多种登录方式,提供密码找回功能,账号使用安全便捷。支持多小区切换,首页设有轮播 banner、社区公告集成远程开门、生活缴费、在线报修、访客邀请、社区活动常用服务。全服务板块统一涵盖门禁开门、线上缴费、报修申报、访客预约、投诉反馈、问卷调研、活动报名、社区公示、一键联系物业功能。个人中心可管理房屋、住户、车位、车辆信息支持更换手机号、修改密码、消息通知设置、版本更新及账号退出一站式满足业主居家生活、社区服务、房产车辆管理需求实现社区生活数字化、便捷化。", "description" : "智慧社区居民端面向小区业主使用,支持注册、验证码、账号密码多种登录方式,提供密码找回功能,账号使用安全便捷。支持多小区切换,首页设有轮播 banner、社区公告集成远程开门、生活缴费、在线报修、访客邀请、社区活动常用服务。全服务板块统一涵盖门禁开门、线上缴费、报修申报、访客预约、投诉反馈、问卷调研、活动报名、社区公示、一键联系物业功能。个人中心可管理房屋、住户、车位、车辆信息支持更换手机号、修改密码、消息通知设置、版本更新及账号退出一站式满足业主居家生活、社区服务、房产车辆管理需求实现社区生活数字化、便捷化。",
"versionName" : "1.1.7", "versionName" : "1.1.8",
"versionCode" : 130, "versionCode" : 131,
"transformPx" : false, "transformPx" : false,
"uniCloud" : { "uniCloud" : {
"provider" : "aliyun", "provider" : "aliyun",

View File

@@ -1,15 +1,8 @@
<template> <template>
<view class="container"> <view class="container">
<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"
@clickLeft="narBack" />
</view>
<!-- 滚动区域从banner开始滚动 --> <!-- 滚动区域从banner开始滚动 -->
<scroll-view class="scroll-container" scroll-y="true" @scrolltolower="loadMoreData" <view class="scroll-container">
:lower-threshold="100">
<!-- 顶部图片 --> <!-- 顶部图片 -->
<view class="top-img"> <view class="top-img">
<image class="banner-img" src="http://47.104.199.163:9090/images/home/banner.png" mode="aspectFill"></image> <image class="banner-img" src="http://47.104.199.163:9090/images/home/banner.png" mode="aspectFill"></image>
@@ -121,13 +114,13 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref, watch } from 'vue' import { ref, watch } from 'vue'
import { onLoad, onUnload, onShow } from '@dcloudio/uni-app' import { onLoad, onUnload, onShow, onPullDownRefresh, onReachBottom, onBackPress } from '@dcloudio/uni-app'
import moment from 'moment'; import moment from 'moment';
import { getActivityList,getMyActivityList} from '../api/api.js' import { getActivityList,getMyActivityList} from '../api/api.js'
@@ -140,7 +133,6 @@ const currentPage = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
const total = ref(0) const total = ref(0)
const displayedActivities = ref([]) // 当前显示的活动列表 const displayedActivities = ref([]) // 当前显示的活动列表
const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight || 0)
// 筛选条件status ''全部, '0'未开始, '1'进行中, '2'已结束 // 筛选条件status ''全部, '0'未开始, '1'进行中, '2'已结束
const filters = ref([ const filters = ref([
@@ -161,19 +153,17 @@ const resetAndLoad = () => {
getActivityListData(1) getActivityListData(1)
} }
/** // 页面返回拦截:根据来源页返回对应 tab否则走默认返回
* 返回上一级页面 onBackPress(() => {
*/
const narBack = () => {
const sourcePage = uni.getStorageSync('sourcePage') const sourcePage = uni.getStorageSync('sourcePage')
if (sourcePage === "index") { if (sourcePage === "index") {
uni.switchTab({ url: "/pages/index/index" }) uni.switchTab({ url: "/pages/index/index" })
return true
} else if (sourcePage === "serviceIndex") { } else if (sourcePage === "serviceIndex") {
uni.switchTab({ url: "/pages/serviceIndex/serviceIndex" }) uni.switchTab({ url: "/pages/serviceIndex/serviceIndex" })
} else { return true
uni.navigateBack()
}
} }
})
/** /**
* 切换选项卡(活动列表/我的活动) * 切换选项卡(活动列表/我的活动)
@@ -249,6 +239,7 @@ const getActivityListData = async (pageNum = 1) => {
if (pageNum === 1) displayedActivities.value = [] if (pageNum === 1) displayedActivities.value = []
} finally { } finally {
isLoading.value = false isLoading.value = false
uni.stopPullDownRefresh();
} }
} }
@@ -294,6 +285,7 @@ const getMyActivityListData = async (pageNum = 1) => {
if (pageNum === 1) displayedActivities.value = [] if (pageNum === 1) displayedActivities.value = []
} finally { } finally {
isLoading.value = false isLoading.value = false
uni.stopPullDownRefresh();
} }
} }
@@ -407,7 +399,21 @@ onLoad(() => {
*/ */
onUnload(() => { onUnload(() => {
uni.$off('refreshActivityList') uni.$off('refreshActivityList')
}) });
// 下拉刷新
onPullDownRefresh(() => {
if (activeTab.value === 'list') {
resetAndLoad();
} else {
resetAndLoadMy();
}
});
// 上拉加载更多
onReachBottom(() => {
loadMoreData();
});
/** /**
* 监听我的活动筛选条件变化 * 监听我的活动筛选条件变化
@@ -423,33 +429,14 @@ watch(() => myFilter.value, () => {
/* 页面容器 */ /* 页面容器 */
.container { .container {
width: 100%; width: 100%;
height: 100vh; min-height: 100vh;
background-color: #fff; background-color: #fff;
display: flex;
flex-direction: column;
padding: 0; padding: 0;
} }
/* 状态栏 - 自适应设备状态栏高度 */
.status-bar {
/* height: var(--status-bar-height); */
/* height: 46px; */
width: 100%;
flex-shrink: 0;
}
/* 顶部标题 固定 */
.top-bar {
width: 100%;
flex-shrink: 0;
background: #fff;
}
/* 滚动区域 */ /* 滚动区域 */
.scroll-container { .scroll-container {
flex: 1;
width: 100%; width: 100%;
overflow-y: auto;
padding: 0 30rpx; padding: 0 30rpx;
box-sizing: border-box; box-sizing: border-box;
} }

View File

@@ -2,8 +2,8 @@ import { navigateToLogin } from '@/common/checkLogin.js'
let baseUrl = ''; let baseUrl = '';
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
// baseUrl = 'http://192.168.1.6:8080'; // 开发环境 baseUrl = 'http://192.168.1.6:8080'; // 开发环境
baseUrl = 'http://192.168.1.222:8080'; // baseUrl = 'http://192.168.1.222:8080';
} else { } else {
baseUrl = 'https://wuyeapi.ckdzkj.com'; // 生产环境 baseUrl = 'https://wuyeapi.ckdzkj.com'; // 生产环境
} }

View File

@@ -1,7 +1,5 @@
<template> <template>
<view class="contentStyle"> <view class="contentStyle">
<view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
<uni-nav-bar title="巡检记录" backgroundColor="transparent" :border="false" left-icon="left" @click-left="goBack" />
<view class="content-wrap"> <view class="content-wrap">
<!-- 时间选择器 --> <!-- 时间选择器 -->
<view class="timebox"> <view class="timebox">
@@ -18,7 +16,7 @@
</view> </view>
</view> </view>
<!-- 巡检列表 --> <!-- 巡检列表 -->
<scroll-view scroll-y class="scroll-view"> <view class="scroll-view">
<view class="list-container" v-if="listData.length > 0"> <view class="list-container" v-if="listData.length > 0">
<view class="card-item" v-for="(item, index) in listData" :key="index" @click="goToInspectionDetail(item)"> <view class="card-item" v-for="(item, index) in listData" :key="index" @click="goToInspectionDetail(item)">
<view class="card-head"> <view class="card-head">
@@ -35,7 +33,7 @@
<uni-icons type="info" size="30" color="#ccc"></uni-icons> <uni-icons type="info" size="30" color="#ccc"></uni-icons>
<text class="empty-text">暂无数据</text> <text class="empty-text">暂无数据</text>
</view> </view>
</scroll-view> </view>
</view> </view>
</view> </view>
@@ -111,14 +109,11 @@
// ---------- 日期变更(使用 moment ---------- // ---------- 日期变更(使用 moment ----------
const handleChangeTime = (e) => { const handleChangeTime = (e) => {
if (e) { if (e) {
// e 格式为 YYYY-MM-DD用 moment 解析并格式化为 MM-DD
showDate.value = moment(e).format('MM-DD') showDate.value = moment(e).format('MM-DD')
datetime.value = e datetime.value = e
} else { } else {
// 用户清空日期,可根据业务设置默认值或置空
showDate.value = '选择日期' showDate.value = '选择日期'
datetime.value = '' datetime.value = ''
// 如果希望清空时不请求,可 return否则也重置列表
} }
// 重置分页并刷新 // 重置分页并刷新
pageNum.value = 1 pageNum.value = 1
@@ -140,11 +135,6 @@
fetchList(true) fetchList(true)
}) })
// ---------- 返回 ----------
const goBack = () => {
uni.navigateBack()
}
// ---------- 页面返回拦截 ---------- // ---------- 页面返回拦截 ----------
onBackPress(() => { onBackPress(() => {
const pages = getCurrentPages() const pages = getCurrentPages()
@@ -165,9 +155,9 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.contentStyle { .contentStyle {
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
height: 100vh; min-height: 100vh;
background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%); background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%);
} }
@@ -180,11 +170,6 @@
overflow: hidden; overflow: hidden;
} }
.status-bar {
width: 100%;
flex-shrink: 0;
}
.timebox { .timebox {
width: 188rpx; width: 188rpx;
height: 48rpx; height: 48rpx;
@@ -249,10 +234,10 @@
} }
} }
//滚动容器 App重点高度自适应 \*/ //滚动容器 App重点高度自适应 \*/
.scroll-view { // .scroll-view {
flex: 1; // flex: 1;
height: 0; // height: 0;
} // }
.list-container { .list-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View File

@@ -1,20 +1,8 @@
<template> <template>
<view class="page"> <view class="page">
<!-- 滚动区域 -->
<pull-refresh-scroll
custom-class="scroll-box"
:refreshing="refreshing"
:loading-more="loadingMore"
:no-more-data="noMoreData"
:empty="revenueList.length === 0 && !loading"
empty-text="暂无通知"
no-more-text="没有更多通知了"
@refresh="onRefresh"
@load-more="loadMore"
>
<view class="list-wrap">
<!-- 列表 --> <!-- 列表 -->
<view class="list-wrap">
<view <view
v-for="revenue in revenueList" v-for="revenue in revenueList"
:key="revenue.noticeId" :key="revenue.noticeId"
@@ -31,17 +19,15 @@
</view> </view>
</view> </view>
</view> </view>
</pull-refresh-scroll>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { onLoad ,onShow,onUnload} from '@dcloudio/uni-app' import { onLoad, onShow, onUnload, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'
import { getRevenueList } from '../api/apiSub.js' import { getRevenueList } from '../api/apiSub.js'
const revenueList = ref([]) const revenueList = ref([])
const refreshing = ref(false)
const loadingMore = ref(false) const loadingMore = ref(false)
const noMoreData = ref(false) const noMoreData = ref(false)
const loading = ref(false) const loading = ref(false)
@@ -73,8 +59,8 @@ const loadRevenue = async (isRefresh = false) => {
} catch (e) {} } catch (e) {}
finally { finally {
loading.value = false loading.value = false
refreshing.value = false
loadingMore.value = false loadingMore.value = false
uni.stopPullDownRefresh()
} }
} }
// 更新单条已读状态 // 更新单条已读状态
@@ -93,10 +79,13 @@ onShow(() =>{
loadRevenue(true) loadRevenue(true)
}) })
const onRefresh = () => { onPullDownRefresh(() => {
refreshing.value = true
loadRevenue(true) loadRevenue(true)
} })
onReachBottom(() => {
loadMore()
})
const loadMore = () => { const loadMore = () => {
if (noMoreData.value || loadingMore.value) return if (noMoreData.value || loadingMore.value) return
@@ -123,21 +112,7 @@ page {
background: #f9f9f9; background: #f9f9f9;
} }
.page { .page {
position: fixed; min-height: 100vh;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
}
.status_bar {
width: 100%;
flex-shrink: 0;
}
.scroll-box {
flex: 1;
height: 0; /* 让滚动区域生效 */
} }
.list-wrap { .list-wrap {
padding: 50rpx 40rpx; padding: 50rpx 40rpx;

View File

@@ -1,7 +1,7 @@
<template> <template>
<view class="contentStyle" style=""> <view class="contentStyle" style="">
<scroll-view class="page" scroll-y="true" @scrolltolower="getList" refresher-enabled="true" :refresher-triggered="isRefreshing" @refresherrefresh="onRefresh"> <view class="page">
<view v-if="carList.length === 0" class="empty-state"> <view v-if="carList.length === 0" class="empty-state">
<uni-icons type="info" size="60" color="#ccc"></uni-icons> <uni-icons type="info" size="60" color="#ccc"></uni-icons>
<text class="empty-text">暂无数据</text> <text class="empty-text">暂无数据</text>
@@ -22,7 +22,7 @@
{{ item.certificationStatus }} {{ item.certificationStatus }}
</view> --> </view> -->
</view> </view>
</scroll-view> </view>
<view class="bottom-btn"> <view class="bottom-btn">
<button class="confirm-btn" @click="addCar">添加车辆</button> <button class="confirm-btn" @click="addCar">添加车辆</button>
</view> </view>
@@ -38,27 +38,27 @@
getMyCarList getMyCarList
} from '@/pageSubPack/api/apiSub.js' } from '@/pageSubPack/api/apiSub.js'
import { import {
onShow onShow,
onPullDownRefresh,
onReachBottom
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
const statusBarHeight = ref(20) const statusBarHeight = ref(20)
const defaultCarImg = "http://47.104.199.163:9090/images/propertyImgs/defaultCarImg.png" const defaultCarImg = "http://47.104.199.163:9090/images/propertyImgs/defaultCarImg.png"
const carList = ref([]) const carList = ref([])
const loadingMore = ref(false) const loadingMore = ref(false)
const noMoreData = ref(false) const noMoreData = ref(false)
const isRefreshing = ref(false)
const pageNum = ref(1) const pageNum = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
// ==================== 下拉刷新 ==================== // ==================== 下拉刷新 ====================
const onRefresh = () => { onPullDownRefresh(() => {
isRefreshing.value = true
pageNum.value = 1 pageNum.value = 1
noMoreData.value = false noMoreData.value = false
carList.value = [] carList.value = []
loadingMore.value = false loadingMore.value = false
getList() getList()
} })
// 页面加载时请求第一页 // 页面加载时请求第一页
onMounted(() => { onMounted(() => {
@@ -107,14 +107,16 @@
console.error('列表接口报错:', err) console.error('列表接口报错:', err)
} finally { } finally {
loadingMore.value = false loadingMore.value = false
// 关闭 refresher 下拉刷新状态 uni.stopPullDownRefresh()
if (isRefreshing.value) {
isRefreshing.value = false
}
} }
} }
// ==================== 上拉加载更多 ====================
onReachBottom(() => {
getList()
})
const getStatusText = (status) => { const getStatusText = (status) => {
if (status === 0) return '未绑定' if (status === 0) return '未绑定'
if (status === 1) return '已绑定' if (status === 1) return '已绑定'
@@ -144,24 +146,16 @@
<style lang="scss"> <style lang="scss">
page { page {
background: #F3F8FD; background: #F3F8FD;
overflow: hidden;
} }
</style> </style>
<style scoped> <style scoped>
.contentStyle { .contentStyle {
display: flex; min-height: 100vh;
flex-direction: column;
height: 100vh;
overflow: hidden;
background-color: #f5f7fa; background-color: #f5f7fa;
} }
.page { .page {
flex: 1;
min-height: 0;
height: 0;
overflow-y: auto;
padding: 0px 40rpx 140rpx; padding: 0px 40rpx 140rpx;
box-sizing: border-box; box-sizing: border-box;
} }

View File

@@ -1,7 +1,7 @@
<template> <template>
<view class="contentStyle" style=""> <view class="contentStyle" style="">
<scroll-view class="page" scroll-y :refresher-enabled="true" :refresher-triggered="isRefreshing" @refresherrefresh="onRefresh" @scrolltolower="loadMore"> <view class="page">
<!-- 空状态 --> <!-- 空状态 -->
<view v-if="houseList.length === 0" class="empty-state"> <view v-if="houseList.length === 0" class="empty-state">
<uni-icons type="info" size="30" color="#ccc"></uni-icons> <uni-icons type="info" size="30" color="#ccc"></uni-icons>
@@ -46,7 +46,7 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view> </view>
<!-- 底部添加按钮 --> <!-- 底部添加按钮 -->
<view class="bottom-btn"> <view class="bottom-btn">
<button class="add-btn" @click="addHouse">添加房屋</button> <button class="add-btn" @click="addHouse">添加房屋</button>
@@ -62,7 +62,9 @@
onMounted, onMounted,
} from 'vue' } from 'vue'
import { import {
onShow onShow,
onPullDownRefresh,
onReachBottom
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
import { import {
getMyHouseList, getMyHouseList,
@@ -74,17 +76,15 @@
const pageNum = ref(1) const pageNum = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
const noMoreData = ref(false) const noMoreData = ref(false)
const isRefreshing = ref(false)
// ==================== 下拉刷新 ==================== // ==================== 下拉刷新 ====================
const onRefresh = () => { onPullDownRefresh(() => {
isRefreshing.value = true
pageNum.value = 1 pageNum.value = 1
noMoreData.value = false noMoreData.value = false
houseList.value = [] houseList.value = []
loading.value = false loading.value = false
getList() getList()
} })
// ==================== 获取列表数据 ==================== // ==================== 获取列表数据 ====================
const getList = async () => { const getList = async () => {
@@ -113,7 +113,6 @@
console.error('列表接口报错:', err) console.error('列表接口报错:', err)
} finally { } finally {
loading.value = false loading.value = false
isRefreshing.value = false
uni.stopPullDownRefresh() uni.stopPullDownRefresh()
} }
} }
@@ -125,6 +124,11 @@
getList() getList()
} }
// ==================== 上拉加载更多 ====================
onReachBottom(() => {
loadMore()
})
// 页面加载时请求第一页 // 页面加载时请求第一页
onMounted(() => { onMounted(() => {
pageNum.value = 1 pageNum.value = 1
@@ -211,16 +215,11 @@
<style scoped> <style scoped>
.contentStyle { .contentStyle {
display: flex; min-height: 100vh;
flex-direction: column;
height: 100vh;
/* 关键:固定高度,底部按钮不动 */
background-color: #f5f7fa; background-color: #f5f7fa;
} }
.page { .page {
flex: 1;
overflow-y: auto;
padding: 0px 40rpx 120rpx; padding: 0px 40rpx 120rpx;
box-sizing: border-box; box-sizing: border-box;
} }

View File

@@ -3,7 +3,7 @@
<!-- <view class="status-bar"></view> <!-- <view class="status-bar"></view>
<uni-nav-bar title="我的车位" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false"> <uni-nav-bar title="我的车位" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
</uni-nav-bar> --> </uni-nav-bar> -->
<scroll-view class="page" scroll-y="true" @scrolltolower="getList" refresher-enabled="true" :refresher-triggered="isRefreshing" @refresherrefresh="onRefresh"> <view class="page">
<view v-if="parkingSpaceList.length === 0" class="empty-state"> <view v-if="parkingSpaceList.length === 0" class="empty-state">
<uni-icons type="info" size="60" color="#ccc"></uni-icons> <uni-icons type="info" size="60" color="#ccc"></uni-icons>
<text class="empty-text">暂无数据</text> <text class="empty-text">暂无数据</text>
@@ -54,7 +54,7 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view> </view>
<view class="bottom-btn"> <view class="bottom-btn">
<button class="add-btn" @click="addParkingSpace">添加车位</button> <button class="add-btn" @click="addParkingSpace">添加车位</button>
</view> </view>
@@ -66,7 +66,9 @@
ref ref
} from 'vue' } from 'vue'
import { import {
onShow onShow,
onPullDownRefresh,
onReachBottom
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
import { import {
getCarList getCarList
@@ -76,14 +78,13 @@
const parkingSpaceList = ref([]) const parkingSpaceList = ref([])
// ==================== 下拉刷新 ==================== // ==================== 下拉刷新 ====================
const onRefresh = () => { onPullDownRefresh(() => {
isRefreshing.value = true
pageNum.value = 1 pageNum.value = 1
noMoreData.value = false noMoreData.value = false
parkingSpaceList.value = [] parkingSpaceList.value = []
loadingMore.value = false loadingMore.value = false
getList() getList()
} })
// 页面显示时请求第一页(首次进入和从详情/修改页返回时都会刷新) // 页面显示时请求第一页(首次进入和从详情/修改页返回时都会刷新)
onShow(() => { onShow(() => {
@@ -96,7 +97,6 @@
const loadingMore = ref(false) const loadingMore = ref(false)
const noMoreData = ref(false) const noMoreData = ref(false)
const isRefreshing = ref(false)
const pageNum = ref(1) const pageNum = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
@@ -148,13 +148,15 @@
console.error('列表接口报错:', err) console.error('列表接口报错:', err)
} finally { } finally {
loadingMore.value = false loadingMore.value = false
// 关闭 refresher 下拉刷新状态 uni.stopPullDownRefresh()
if (isRefreshing.value) {
isRefreshing.value = false
}
} }
} }
// ==================== 上拉加载更多 ====================
onReachBottom(() => {
getList()
})
const tapParkingSpace = (item) => { const tapParkingSpace = (item) => {
console.log(item); console.log(item);
uni.navigateTo({ uni.navigateTo({
@@ -187,15 +189,11 @@
} }
.contentStyle { .contentStyle {
display: flex; min-height: 100vh;
flex-direction: column;
height: 100vh;
background-color: #f5f7fa; background-color: #f5f7fa;
} }
.page { .page {
flex: 1;
overflow-y: auto;
padding: 0px 40rpx 140rpx; padding: 0px 40rpx 140rpx;
box-sizing: border-box; box-sizing: border-box;
} }

View File

@@ -1,30 +1,7 @@
<template> <template>
<view class="page"> <view class="page">
<view class="status_bar"></view>
<!-- 固定导航栏 -->
<uni-nav-bar
left-icon="left"
title="通知公告"
background-color="#F9F9F9"
@clickLeft="narBack"
/>
<!-- 滚动区域 -->
<scroll-view
scroll-y
class="scroll-box"
:refresher-enabled="true"
:refresher-triggered="refreshing"
@refresherrefresh="onRefresh"
@scrolltolower="loadMore"
>
<view class="list-wrap">
<!-- 下拉刷新 -->
<view class="refresh" v-if="refreshing">
<uni-icons type="spinner-cycle" class="spin"/> 刷新中...
</view>
<!-- 列表 --> <!-- 列表 -->
<view class="list-wrap">
<view <view
v-for="notice in noticeList" v-for="notice in noticeList"
:key="notice.noticeId" :key="notice.noticeId"
@@ -49,17 +26,15 @@
<text class="empty-text">暂无通知</text> <text class="empty-text">暂无通知</text>
</view> </view>
</view> </view>
</scroll-view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { onLoad ,onShow,onUnload} from '@dcloudio/uni-app' import { onLoad, onShow, onUnload, onBackPress, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'
import { getNoticeList } from '../api/api.js' import { getNoticeList } from '../api/api.js'
const noticeList = ref([]) const noticeList = ref([])
const refreshing = ref(false)
const loadingMore = ref(false) const loadingMore = ref(false)
const noMoreData = ref(false) const noMoreData = ref(false)
const loading = ref(false) const loading = ref(false)
@@ -90,8 +65,8 @@ const loadNotices = async (isRefresh = false) => {
} catch (e) {} } catch (e) {}
finally { finally {
loading.value = false loading.value = false
refreshing.value = false
loadingMore.value = false loadingMore.value = false
uni.stopPullDownRefresh()
} }
} }
// 更新单条已读状态 // 更新单条已读状态
@@ -107,10 +82,13 @@ onShow(() =>{
loadNotices(true) loadNotices(true)
}) })
const onRefresh = () => { onPullDownRefresh(() => {
refreshing.value = true
loadNotices(true) loadNotices(true)
} })
onReachBottom(() => {
loadMore()
})
const loadMore = () => { const loadMore = () => {
if (noMoreData.value || loadingMore.value) return if (noMoreData.value || loadingMore.value) return
@@ -119,12 +97,18 @@ const loadMore = () => {
loadNotices() loadNotices()
} }
const narBack = () => { onBackPress(() => {
const page = uni.getStorageSync('sourcePage') const page = uni.getStorageSync('sourcePage')
if (page === 'index') uni.switchTab({ url: '/pages/index/index' })
if (page === 'serviceIndex') uni.switchTab({ url: '/pages/serviceIndex/serviceIndex' })
uni.removeStorageSync('sourcePage') uni.removeStorageSync('sourcePage')
if (page === 'index') {
uni.switchTab({ url: '/pages/index/index' })
return true
} }
if (page === 'serviceIndex') {
uni.switchTab({ url: '/pages/serviceIndex/serviceIndex' })
return true
}
})
onLoad(() => { onLoad(() => {
isFirstShow.value = false isFirstShow.value = false
@@ -140,23 +124,6 @@ onUnload(()=>{
page { page {
background: #f9f9f9; background: #f9f9f9;
} }
.page {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
}
.status_bar {
height: 46px;
width: 100%;
}
.scroll-box {
flex: 1;
height: 0; /* 让滚动区域生效 */
}
.list-wrap { .list-wrap {
padding: 40rpx; padding: 40rpx;
} }
@@ -217,7 +184,7 @@ page {
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.refresh, .load-more, .no-more { .load-more, .no-more {
text-align: center; text-align: center;
padding: 20rpx; padding: 20rpx;
color: #999; color: #999;
@@ -245,11 +212,4 @@ page {
padding: 10rpx 30rpx; padding: 10rpx 30rpx;
margin-top: 20rpx; margin-top: 20rpx;
} }
.spin {
animation: rotate 1s linear infinite;
}
@keyframes rotate {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style> </style>

View File

@@ -1,18 +1,8 @@
<template> <template>
<view class="repair-page"> <view class="repair-page">
<!-- <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" style="width: 18px; height: 18px;"></image>
</view>
<view class="nav-title">在线报修</view>
<view class="nav-right"></view>
</view> -->
<!-- 报修类型Tab --> <!-- 报修类型Tab -->
<scroll-view class="scroll-container" scroll-y="true" <view class="scroll-container">
:lower-threshold="100" @scrolltolower="loadMore">
<view class="repair-type-tabs"> <view class="repair-type-tabs">
<view <view
class="type-tab" class="type-tab"
@@ -108,13 +98,13 @@
<text v-if="loading">加载中...</text> <text v-if="loading">加载中...</text>
<text v-else-if="!hasMoreData">没有更多数据了</text> <text v-else-if="!hasMoreData">没有更多数据了</text>
</view> </view>
</scroll-view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref, watch, computed } from 'vue'; import { ref, watch, computed } from 'vue';
import { onLoad, onShow, onUnload } from '@dcloudio/uni-app'; import { onLoad, onShow, onUnload, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app';
import { getQueryRepair } from '../api/api.js'; import { getQueryRepair } from '../api/api.js';
// 报修类型public:公共报修personal:个人报修) // 报修类型public:公共报修personal:个人报修)
@@ -192,6 +182,7 @@ const fetchRepairList = async (reset = false) => {
uni.showToast({ title: '网络异常', icon: 'none' }); uni.showToast({ title: '网络异常', icon: 'none' });
} finally { } finally {
loading.value = false; loading.value = false;
uni.stopPullDownRefresh();
} }
}; };
@@ -202,6 +193,16 @@ const loadMore = () => {
fetchRepairList(); fetchRepairList();
}; };
// 下拉刷新
onPullDownRefresh(() => {
fetchRepairList(true);
});
// 上拉加载更多
onReachBottom(() => {
loadMore();
});
// 监听状态变化自动刷新(切换 tab 时重置到第一页) // 监听状态变化自动刷新(切换 tab 时重置到第一页)
watch(activeStatus, () => { watch(activeStatus, () => {
fetchRepairList(true); fetchRepairList(true);
@@ -259,10 +260,8 @@ onUnload(() =>{
/* 页面整体样式 */ /* 页面整体样式 */
.repair-page { .repair-page {
background: linear-gradient(to bottom left, #E2F0FF 0%, #f9f9f9 50%); background: linear-gradient(to bottom left, #E2F0FF 0%, #f9f9f9 50%);
height: 100vh; min-height: 100vh;
padding: 0 40rpx; padding: 0 40rpx;
display: flex;
flex-direction: column;
} }
.status_bar { .status_bar {
height: var(--status-bar-height); height: var(--status-bar-height);
@@ -307,9 +306,7 @@ onUnload(() =>{
} }
/* 滚动区域 */ /* 滚动区域 */
.scroll-container { .scroll-container {
flex: 1;
width: 100%; width: 100%;
overflow-y: auto;
box-sizing: border-box; box-sizing: border-box;
} }
/* 报修类型Tab */ /* 报修类型Tab */
@@ -324,7 +321,7 @@ onUnload(() =>{
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100px; height: 85px;
border-radius: 8px; border-radius: 8px;
color: #fff; color: #fff;
font-size: 14px; font-size: 14px;
@@ -474,10 +471,10 @@ onUnload(() =>{
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin: -6rpx; margin: -6rpx;
margin-bottom: 4px; margin-bottom: 16px;
} }
.img-placeholder { .img-placeholder {
width: 80px; width: 95px;
height: 80px; height: 80px;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 4px; border-radius: 4px;

View File

@@ -654,9 +654,10 @@ textarea {
.time-item { .time-item {
height: 80rpx; height: 80rpx;
line-height: 80rpx; line-height: 80rpx;
font-size: 28rpx; font-size: 26rpx;
color: #BBBCBE; color: #BBBCBE;
position: relative; position: relative;
white-space: nowrap;
} }
/* 选中项样式(高亮) */ /* 选中项样式(高亮) */

View File

@@ -274,7 +274,7 @@ const previewImage = (url) => {
} }
.photo-item { .photo-item {
width: 80px; width: 95px;
height: 80px; height: 80px;
border-radius: 4px; border-radius: 4px;
display: flex; display: flex;

View File

@@ -13,7 +13,7 @@
<view class="page"> <view class="page">
<view class="container"> <view class="container">
<!-- /电费列表 --> <!-- /电费列表 -->
<scroll-view class="details-scroll" scroll-y="true" @scrolltolower="onPayLoadMore" :style="{ height: paymentList.length ? '550rpx' : '180rpx' }"> <scroll-view class="details-scroll" scroll-y="true" @scrolltolower="onPayLoadMore">
<view class="bill-list"> <view class="bill-list">
<template v-if="paymentList.length != 0"> <template v-if="paymentList.length != 0">
<view class="bill-item" @click="goToBill(item)" v-for="item,index in paymentList" :key="index"> <view class="bill-item" @click="goToBill(item)" v-for="item,index in paymentList" :key="index">
@@ -45,7 +45,7 @@
</view> </view>
</scroll-view> </scroll-view>
<!-- 物业费/垃圾处理费列表 --> <!-- 物业费/垃圾处理费列表 -->
<scroll-view class="details-scroll-bill" scroll-y="true" @scrolltolower="onLoadMore" :style="{ height: detailslist.length ? '550rpx' : '180rpx' }"> <scroll-view class="details-scroll-bill" scroll-y="true" @scrolltolower="onLoadMore">
<view class="bill-list"> <view class="bill-list">
<template v-if="detailslist.length != 0"> <template v-if="detailslist.length != 0">
<view class="bill-item" :class="{ 'bill-paid': !item.amount }" @click="!item.amount ? null : goToBill(item)" v-for="item,index in detailslist" :key="index"> <view class="bill-item" :class="{ 'bill-paid': !item.amount }" @click="!item.amount ? null : goToBill(item)" v-for="item,index in detailslist" :key="index">
@@ -100,7 +100,7 @@
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { onShow, onLoad, onBackPress, onUnload } from '@dcloudio/uni-app' import { onShow, onLoad, onBackPress, onUnload, onPullDownRefresh } from '@dcloudio/uni-app'
import { getTopUpDetails, getTopUpSelectByResident } from '/pageSubPack/api/apiSub.js' import { getTopUpDetails, getTopUpSelectByResident } from '/pageSubPack/api/apiSub.js'
import { getCurrentVillage } from '/pageSubPack/api/api.js' import { getCurrentVillage } from '/pageSubPack/api/api.js'
@@ -266,6 +266,8 @@ const getBillDetails = (isLoadMore = false) => {
pageNum.value-- pageNum.value--
loadingMore.value = false loadingMore.value = false
} }
}).finally(() => {
uni.stopPullDownRefresh();
}) })
} }
const onLoadMore = () => { const onLoadMore = () => {
@@ -307,12 +309,20 @@ const getPayList = async (isLoadMore = false) => {
title: err.msg || '网络异常', title: err.msg || '网络异常',
icon: 'none' icon: 'none'
}) })
} finally {
uni.stopPullDownRefresh();
} }
} }
const onPayLoadMore = () => { const onPayLoadMore = () => {
getPayList(true) getPayList(true)
} }
// 下拉刷新:同时刷新水电费和物业费列表
onPullDownRefresh(() => {
getBillDetails();
getPayList();
});
</script> </script>
<style lang="scss"> <style lang="scss">
@@ -391,6 +401,8 @@ page {
background-color: #fff; background-color: #fff;
padding: 30rpx; padding: 30rpx;
border-radius: 10rpx; border-radius: 10rpx;
min-height: 550rpx;
box-sizing: border-box;
} }
.bill-item { .bill-item {
@@ -576,7 +588,7 @@ page {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 120rpx; height: 490rpx;
} }
.empty-text { .empty-text {

View File

@@ -1,8 +1,8 @@
<template> <template>
<view class="contentStyle" style=""> <view class="contentStyle" style="">
<view class="status-bar"></view> <!-- <view class="status-bar"></view>
<uni-nav-bar title="缴费记录" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false"> <uni-nav-bar title="缴费记录" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
</uni-nav-bar> </uni-nav-bar> -->
<view class="page"> <view class="page">
<!-- 累计缴费 --> <!-- 累计缴费 -->

View File

@@ -9,7 +9,7 @@
</view> </view>
<!-- 列表区域 --> <!-- 列表区域 -->
<scroll-view class="page" scroll-y> <view class="page">
<view class="page-container"> <view class="page-container">
<view v-if="dataList.length === 0" class="empty-state"> <view v-if="dataList.length === 0" class="empty-state">
<uni-icons type="info" size="30" color="#ccc"></uni-icons> <uni-icons type="info" size="30" color="#ccc"></uni-icons>
@@ -42,7 +42,7 @@
</view> </view>
</view> </view>
</view> </view>
</scroll-view> </view>
<!-- 底部按钮 --> <!-- 底部按钮 -->
<view class="bottom-btn-wrap"> <view class="bottom-btn-wrap">
@@ -53,7 +53,7 @@
<script setup> <script setup>
import { ref, onMounted } from 'vue' import { ref, onMounted } from 'vue'
import {onLoad, onShow} from '@dcloudio/uni-app' import {onLoad, onShow, onPullDownRefresh} from '@dcloudio/uni-app'
import {getComplainList} from '../api/apiSub.js' import {getComplainList} from '../api/apiSub.js'
// 分段器 // 分段器
@@ -111,6 +111,8 @@ const getComplainListData = async () =>{
}catch(err){ }catch(err){
// console.log('dess',err) // console.log('dess',err)
uni.showToast({title:err.msg || '网络异常',icon:'error'}) uni.showToast({title:err.msg || '网络异常',icon:'error'})
}finally{
uni.stopPullDownRefresh();
} }
} }
onLoad(() =>{ onLoad(() =>{
@@ -118,7 +120,11 @@ onLoad(() =>{
}) })
onShow(() => { onShow(() => {
getComplainListData() getComplainListData()
}) });
onPullDownRefresh(() => {
getComplainListData();
});
// 跳转到详情 // 跳转到详情
const turnToDetail = (item) => { const turnToDetail = (item) => {
@@ -149,16 +155,12 @@ const addComplaintsSuggestions = () => {
<style scoped> <style scoped>
.contentStyle { .contentStyle {
display: flex; min-height: 100vh;
flex-direction: column;
height: 100%;
background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%); background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%);
} }
.page { .page {
flex: 1; padding: 0px 40rpx 200rpx;
overflow-y: auto;
padding: 0px 40rpx;
box-sizing: border-box; box-sizing: border-box;
} }
@@ -183,6 +185,10 @@ const addComplaintsSuggestions = () => {
} }
.tab-wrap { .tab-wrap {
position: sticky;
top: 0;
z-index: 10;
background: #e2efff;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
@@ -310,9 +316,15 @@ const addComplaintsSuggestions = () => {
} }
.bottom-btn-wrap { .bottom-btn-wrap {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 10;
padding: 20rpx 30rpx 40rpx; padding: 20rpx 30rpx 40rpx;
display: flex; display: flex;
gap: 20rpx; gap: 20rpx;
background: #f9f9f9;
} }
.next-btn { .next-btn {

View File

@@ -6,7 +6,7 @@
</view> </view>
<!-- 表单区域 --> <!-- 表单区域 -->
<scroll-view class="page" scroll-y> <view class="page">
<view class="list-container"> <view class="list-container">
<view v-if="currentList.length === 0" class="empty-state"> <view v-if="currentList.length === 0" class="empty-state">
<uni-icons type="info" size="30" color="#ccc"></uni-icons> <uni-icons type="info" size="30" color="#ccc"></uni-icons>
@@ -43,13 +43,13 @@
</view> </view>
</view> </view>
<view style="width: 100%;height:2rpx;"></view> <view style="width: 100%;height:2rpx;"></view>
</scroll-view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref, computed } from 'vue' import { ref, computed } from 'vue'
import { onShow } from '@dcloudio/uni-app' import { onShow,onPullDownRefresh } from '@dcloudio/uni-app'
import {getQuestionnaireList} from '../api/apiSub.js' import {getQuestionnaireList} from '../api/apiSub.js'
// 状态栏高度 // 状态栏高度
@@ -102,6 +102,8 @@
} }
}catch(err){ }catch(err){
uni.showToast({ title: err.msg ||'网络异常', icon: 'none' }) uni.showToast({ title: err.msg ||'网络异常', icon: 'none' })
}finally{
uni.stopPullDownRefresh();
} }
} }
@@ -131,10 +133,13 @@
}) })
} }
// 生命周期:每次显示时刷新数据
onShow(() => { onShow(() => {
getDataList() getDataList()
}) })
// 下拉刷新
onPullDownRefresh(() => {
getDataList();
});
</script> </script>
<style lang="scss"> <style lang="scss">
@@ -145,9 +150,10 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.contentStyle { .contentStyle {
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
height: 100%; min-height: 100%;
// height: 100%;
background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%); background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%);
} }

View File

@@ -19,7 +19,7 @@
</view> </view>
<!-- 访客列表 --> <!-- 访客列表 -->
<scroll-view class="list-container" scroll-y> <view class="list-container">
<view <view
class="visitor-item" class="visitor-item"
v-for="(item, index) in filterdList" v-for="(item, index) in filterdList"
@@ -79,7 +79,7 @@
<!-- 底部占位防止最后一项贴底 --> <!-- 底部占位防止最后一项贴底 -->
<view class="list-bottom-space"></view> <view class="list-bottom-space"></view>
</scroll-view> </view>
<!-- 新增邀请按钮 --> <!-- 新增邀请按钮 -->
<view class="add-btn-wrapper"> <view class="add-btn-wrapper">
@@ -92,7 +92,7 @@
<script setup> <script setup>
import { ref, computed } from "vue"; import { ref, computed } from "vue";
import { onShow } from "@dcloudio/uni-app"; import { onShow, onPullDownRefresh } from "@dcloudio/uni-app";
import { getVisitorList } from "../api/api.js"; import { getVisitorList } from "../api/api.js";
const activeTab = ref("waiting"); const activeTab = ref("waiting");
@@ -124,12 +124,18 @@ const fetchVisitorList = async () => {
visitorList.value = mapData(res.data || []); visitorList.value = mapData(res.data || []);
} catch (err) { } catch (err) {
uni.showToast({ title: err.msg, icon: "none" }); uni.showToast({ title: err.msg, icon: "none" });
} finally {
uni.stopPullDownRefresh();
} }
}; };
onShow(() => { onShow(() => {
fetchVisitorList(); fetchVisitorList();
}) });
onPullDownRefresh(() => {
fetchVisitorList();
});
const filterdList = computed(() => { const filterdList = computed(() => {
return visitorList.value.filter((item) => item.status === activeTab.value); return visitorList.value.filter((item) => item.status === activeTab.value);
@@ -149,10 +155,7 @@ const addInvitation = () => {
<style scoped> <style scoped>
/* 页面根容器 */ /* 页面根容器 */
.visitor-page { .visitor-page {
display: flex; min-height: 100vh;
flex-direction: column;
height: 100vh;
overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
background: linear-gradient(135deg, #e2f0ff 0%, #f9f9f9 50%); background: linear-gradient(135deg, #e2f0ff 0%, #f9f9f9 50%);
padding: 0 30rpx; padding: 0 30rpx;
@@ -160,7 +163,11 @@ const addInvitation = () => {
/* 标签切换栏 */ /* 标签切换栏 */
.tab-bar { .tab-bar {
position: sticky;
top: 0;
z-index: 10;
display: flex; display: flex;
background: #e2f0ff;
} }
.tab-item { .tab-item {
@@ -190,9 +197,6 @@ const addInvitation = () => {
/* 列表区域 */ /* 列表区域 */
.list-container { .list-container {
flex: 1;
height: 0;
overflow: hidden;
} }
/* 访客卡片 */ /* 访客卡片 */
@@ -332,10 +336,3 @@ const addInvitation = () => {
} }
</style> </style>
<style>
/* 页面容器撑满并禁止整体滚动,让内部 scroll-view 单独滚动 */
page {
height: 100%;
overflow: hidden;
}
</style>

View File

@@ -4,7 +4,8 @@
"path": "pages/index/index", "path": "pages/index/index",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "",
"navigationStyle": "custom" "navigationStyle": "custom",
"enablePullDownRefresh": true
} }
}, },
{ {
@@ -79,7 +80,8 @@
"pages": [{ "pages": [{
"path": "onlineRepair", "path": "onlineRepair",
"style": { "style": {
"navigationBarTitleText": "在线报修" "navigationBarTitleText": "在线报修",
"enablePullDownRefresh": true
} }
}, },
{ {
@@ -125,7 +127,8 @@
"pages": [{ "pages": [{
"path": "visitor-list", "path": "visitor-list",
"style": { "style": {
"navigationBarTitleText": "访客邀请" "navigationBarTitleText": "访客邀请",
"enablePullDownRefresh": true
} }
}, },
{ {
@@ -154,7 +157,7 @@
"path": "activityList", "path": "activityList",
"style": { "style": {
"navigationBarTitleText": "活动列表", "navigationBarTitleText": "活动列表",
"navigationStyle": "custom" "enablePullDownRefresh": true
} }
}, },
{ {
@@ -179,7 +182,8 @@
"path": "noticeList", "path": "noticeList",
"style": { "style": {
"navigationBarTitleText": "通知公告", "navigationBarTitleText": "通知公告",
"navigationStyle": "custom" "navigationBarBackgroundColor": "#F9F9F9",
"enablePullDownRefresh": true
} }
}, },
{ {
@@ -287,9 +291,8 @@
}, { }, {
"path": "myParkingSpaceIndex", "path": "myParkingSpaceIndex",
"style": { "style": {
"navigationBarTitleText": "我的车位" "navigationBarTitleText": "我的车位",
// "enablePullDownRefresh ": true "enablePullDownRefresh": true
// "navigationStyle": "custom"
} }
}, },
{ {
@@ -334,7 +337,8 @@
{ {
"path": "myCarIndex", "path": "myCarIndex",
"style": { "style": {
"navigationBarTitleText": "我的车辆" "navigationBarTitleText": "我的车辆",
"enablePullDownRefresh": true
} }
@@ -396,8 +400,8 @@
{ {
"path": "paymentRecord", "path": "paymentRecord",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "缴费记录"
"navigationStyle": "custom" // "navigationStyle": "custom"
} }
}, },
{ {
@@ -413,6 +417,7 @@
"navigationBarTitleText": "生活缴费", "navigationBarTitleText": "生活缴费",
"navigationBarBackgroundColor": "#dfedfd", "navigationBarBackgroundColor": "#dfedfd",
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"enablePullDownRefresh": true,
"app-plus": { "app-plus": {
"titleNView": { "titleNView": {
"autoBackButton": true "autoBackButton": true
@@ -453,7 +458,8 @@
"pages": [{ "pages": [{
"path": "complaintsSuggestionsIndex", "path": "complaintsSuggestionsIndex",
"style": { "style": {
"navigationBarTitleText": "投诉建议" "navigationBarTitleText": "投诉建议",
"enablePullDownRefresh": true
} }
}, { }, {
"path": "complaintsDetail", "path": "complaintsDetail",
@@ -469,7 +475,8 @@
}, { }, {
"path": "questionnaireSurveyIndex", "path": "questionnaireSurveyIndex",
"style": { "style": {
"navigationBarTitleText": "问卷调查" "navigationBarTitleText": "问卷调查",
"enablePullDownRefresh": true
} }
}, },
{ {
@@ -498,7 +505,7 @@
"path": "inspection", "path": "inspection",
"style": { "style": {
"navigationBarTitleText": "巡检记录", "navigationBarTitleText": "巡检记录",
"navigationStyle": "custom" "enablePullDownRefresh": true
} }
}, },
{ {
@@ -510,7 +517,8 @@
{ {
"path": "public-revenue", "path": "public-revenue",
"style": { "style": {
"navigationBarTitleText": "公区收益" "navigationBarTitleText": "公区收益",
"enablePullDownRefresh": true
} }
}, },
{ {

View File

@@ -6,9 +6,11 @@
</view> </view>
<!-- 顶部渐变背景固定在内容下方 -->
<view class="nar-top" v-if="pageReady"></view>
<!-- 固定头部 --> <!-- 固定头部 -->
<view class="header-fixed" v-if="pageReady"> <view class="header-fixed" v-if="pageReady">
<view class="nar-top"></view>
<view class="status-bar"></view> <view class="status-bar"></view>
<view class="header-content"> <view class="header-content">
<!-- 小区选择 --> <!-- 小区选择 -->
@@ -29,11 +31,9 @@
</view> </view>
<!-- 滚动内容区 --> <!-- 滚动内容区 -->
<pull-refresh-scroll <view
custom-class="main-scroll" class="main-scroll"
v-if="pageReady" v-if="pageReady">
:refreshing="refreshing"
@refresh="onRefresh">
<!-- banner --> <!-- banner -->
<view class="bannarClass"> <view class="bannarClass">
<up-swiper :key="bannerSwiperKey" :list="bannerList" indicator indicatorMode="dot" radius="10" circular> <up-swiper :key="bannerSwiperKey" :list="bannerList" indicator indicatorMode="dot" radius="10" circular>
@@ -138,7 +138,7 @@
<!-- 底部占位 --> <!-- 底部占位 -->
<view class="scroll-bottom-space"></view> <view class="scroll-bottom-space"></view>
</pull-refresh-scroll> </view>
</view> </view>
</template> </template>
@@ -150,7 +150,8 @@
import { import {
onLoad, onLoad,
onUnload, onUnload,
onShow onShow,
onPullDownRefresh
} from '@dcloudio/uni-app' } from '@dcloudio/uni-app'
import moment from 'moment' import moment from 'moment'
import { import {
@@ -165,7 +166,6 @@
// 列表数据状态 // 列表数据状态
const isDropdownOpen = ref(false) const isDropdownOpen = ref(false)
const refreshing = ref(false)
const activityList = ref([]) const activityList = ref([])
const serviceItems = [ const serviceItems = [
@@ -354,16 +354,12 @@
getNoticeData() getNoticeData()
getNewActivityList() getNewActivityList()
getbannarData() getbannarData()
refreshing.value = false uni.stopPullDownRefresh()
} }
const onRefresh = async () => { onPullDownRefresh(() => {
refreshing.value = true refreshAllData()
await nextTick() })
await refreshAllData()
await nextTick()
refreshing.value = false
}
const resetPageData = () => { const resetPageData = () => {
currentCommunity.value = '请绑定房屋' currentCommunity.value = '请绑定房屋'
@@ -381,7 +377,6 @@
const currentUserId = uni.getStorageSync('userId') || '' const currentUserId = uni.getStorageSync('userId') || ''
const userIdChanged = lastUserId.value !== currentUserId const userIdChanged = lastUserId.value !== currentUserId
const needReload = uni.getStorageSync('needReloadUserInfo') const needReload = uni.getStorageSync('needReloadUserInfo')
refreshing.value = false
if (userIdChanged) { if (userIdChanged) {
resetPageData() resetPageData()
refreshAllData() refreshAllData()
@@ -477,13 +472,7 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.content-class { .content-class {
background-color: #f9f9f9; background-color: #f9f9f9;
position: absolute; min-height: 100vh;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
/* 加载遮罩 */ /* 加载遮罩 */
.loading-mask { .loading-mask {
@@ -501,21 +490,24 @@
background: repeating-linear-gradient(to right, #EDF4FA, #C0E4FB); background: repeating-linear-gradient(to right, #EDF4FA, #C0E4FB);
} }
/* 固定头部 */ /* 顶部渐变背景(固定在内容下方) */
.header-fixed {
position: relative;
flex-shrink: 0;
.nar-top { .nar-top {
height: 400rpx; height: 400rpx;
width: 100%; width: 100%;
background: repeating-linear-gradient(to right, #EDF4FA, #C0E4FB); background: repeating-linear-gradient(to right, #EDF4FA, #C0E4FB);
position: absolute; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
z-index: 0; z-index: 0;
} }
/* 固定头部 */
.header-fixed {
position: sticky;
top: 0;
z-index: 10;
background: repeating-linear-gradient(to right, #EDF4FA, #C0E4FB);
.status-bar { .status-bar {
height: var(--status-bar-height); height: var(--status-bar-height);
width: 100%; width: 100%;
@@ -530,9 +522,6 @@
/* 滚动区域 */ /* 滚动区域 */
.main-scroll { .main-scroll {
flex: 1;
min-height: 0;
overflow: hidden;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }