|
|
@@ -144,6 +144,11 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <view class="load-more" v-if="splitRecords.length > 0">
|
|
|
+ <text class="load-more-text" v-if="splitLoadMoreStatus === 'more'">上拉加载更多</text>
|
|
|
+ <text class="load-more-text" v-else-if="splitLoadMoreStatus === 'loading'">正在加载...</text>
|
|
|
+ <text class="load-more-text" v-else>没有更多数据了</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -164,6 +169,7 @@
|
|
|
<script setup>
|
|
|
import CustomTabBar from '../../components/CustomTabBar.vue'
|
|
|
import { ref, onMounted } from 'vue'
|
|
|
+import { onReachBottom } from '@dcloudio/uni-app'
|
|
|
import { getStationAccounts, getSplitRecords } from '../../api/finance.js'
|
|
|
import { getDashboardData } from '../../api/stat.js'
|
|
|
import { formatTime, showToast, formatAmount, storage, fmtDictName, getDictColor } from '../../utils/index.js'
|
|
|
@@ -187,6 +193,13 @@ const tabOptions = ['站点账户', '分账记录']
|
|
|
const stationAccounts = ref([])
|
|
|
const splitRecords = ref([])
|
|
|
|
|
|
+// 分页状态
|
|
|
+const splitPage = ref(1)
|
|
|
+const splitPageSize = ref(10)
|
|
|
+const splitHasMore = ref(true)
|
|
|
+const splitLoadMoreStatus = ref('more')
|
|
|
+const splitLoading = ref(false)
|
|
|
+
|
|
|
onMounted(async () => {
|
|
|
await loadDicts()
|
|
|
loadFinanceData()
|
|
|
@@ -230,23 +243,50 @@ const loadStationAccounts = async () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-const loadSplitRecords = async () => {
|
|
|
- loading.value = true
|
|
|
+const loadSplitRecords = async (isLoadMore = false) => {
|
|
|
+ if (!isLoadMore) {
|
|
|
+ splitPage.value = 1
|
|
|
+ splitRecords.value = []
|
|
|
+ splitHasMore.value = true
|
|
|
+ splitLoadMoreStatus.value = 'more'
|
|
|
+ } else {
|
|
|
+ splitLoadMoreStatus.value = 'loading'
|
|
|
+ }
|
|
|
+ splitLoading.value = true
|
|
|
try {
|
|
|
- const res = await getSplitRecords({ page: 1, pageSize: 10 })
|
|
|
-
|
|
|
+ const res = await getSplitRecords({ pageNum: splitPage.value, pageSize: splitPageSize.value })
|
|
|
if (res && res.code === 200) {
|
|
|
const data = res.data
|
|
|
- // 适配不同的数据结构
|
|
|
- splitRecords.value = data.records || data.list || data
|
|
|
+ const records = data.records || data.list || data
|
|
|
+ const total = data.total || 0
|
|
|
+ const totalPages = Math.ceil(total / splitPageSize.value)
|
|
|
+ splitHasMore.value = splitPage.value < totalPages
|
|
|
+ splitLoadMoreStatus.value = splitHasMore.value ? 'more' : 'noMore'
|
|
|
+ if (isLoadMore) {
|
|
|
+ splitRecords.value = [...splitRecords.value, ...records]
|
|
|
+ splitPage.value++
|
|
|
+ } else {
|
|
|
+ splitRecords.value = records
|
|
|
+ splitPage.value = 2
|
|
|
+ }
|
|
|
}
|
|
|
} catch (error) {
|
|
|
- showToast('获取分账记录失败')
|
|
|
+ showToast('获取分账记录失败')
|
|
|
} finally {
|
|
|
- loading.value = false
|
|
|
+ splitLoading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const loadMoreSplitRecords = () => {
|
|
|
+ if (activeTab.value === 1 && splitHasMore.value && !splitLoading.value && splitLoadMoreStatus.value !== 'loading') {
|
|
|
+ loadSplitRecords(true)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+onReachBottom(() => {
|
|
|
+ loadMoreSplitRecords()
|
|
|
+})
|
|
|
+
|
|
|
const handleTabChange = (index) => {
|
|
|
activeTab.value = index
|
|
|
}
|
|
|
@@ -578,8 +618,6 @@ const getSplitTypeStyle = (type) => {
|
|
|
|
|
|
/* ===== 分账记录列表 ===== */
|
|
|
.split-list {
|
|
|
- max-height: 1000rpx;
|
|
|
- overflow-y: auto;
|
|
|
}
|
|
|
|
|
|
.split-item {
|
|
|
@@ -645,5 +683,11 @@ const getSplitTypeStyle = (type) => {
|
|
|
word-break: break-all;
|
|
|
}
|
|
|
|
|
|
+.load-more {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 30rpx 0;
|
|
|
+}
|
|
|
+.load-more-text { font-size: 26rpx; color: #999999; }
|
|
|
|
|
|
</style>
|