FE-lab-xcx/pages_safetyEducationExamination/views/exam/scoresList.vue

<template>
	<view class="scoreList">
		<scroll-view scroll-y class="scroll-content" @scrolltolower="onScrollToLower">
			
			<view v-if="!scoreList[0] && !scoreLoading" class="empty-tip">暂无考试记录</view>
			<view v-if="scoreLoading" class="loading-tip">加载中...</view>
			<view v-if="scoreNoMore && scoreList[0]" class="loading-tip">没有更多了</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		parseTime
	} from '@/component/public.js'
	import {
		examElUserExamAttemptAttemptRecord,
	} from '@/pages_safetyEducationExamination/api/index.js'
	export default {
		data() {
			return {
				scoreList: [],
				scoreLoading: false,
				scorePage: 1,
				scorePageSize: 10,
				scoreTotal: 0,
				scoreNoMore: false,
			}
		},
		created() {
			
		},
		onShow() {
			
		},
		methods: {
			// 滚动到底部加载更多
			onScrollToLower() {
				this.loadScoreList();
			},
			// 考试列表（支持分页）
			async loadScoreList() {
				if (this.scoreLoading || this.scoreNoMore) return;
				this.scoreLoading = true;
				try {
					const obj = {
						page: this.scorePage,
						pageSize: this.scorePageSize,
						examId: '',
					};
					const { data } = await examElUserExamAttemptAttemptRecord(obj);
					if (data.code === 200) {
						for(let i=0;i<data.data.records.length;i++){
							data.data.records[i].startTime = parseTime(data.data.records[i].startTime, "{y}-{m}-{d}")
						}
						const records = data.data.records || [];
						const newList = this.scorePage === 1 ? records : [...this.scoreList, ...records];
						this.$set(this, 'scoreList', newList);
						this.scoreTotal = data.data.total;
						if (newList.length >= this.scoreTotal) {
							this.scoreNoMore = true;
						} else {
							this.scorePage++;
						}
					}
				} catch (e) {
					console.error('获取成绩列表失败', e);
				} finally {
					this.scoreLoading = false;
				}
			},
		}
	}
</script>

<style lang="stylus" scoped>
	.scoreList{
		height 100%
		display flex
		flex-direction column
		overflow hidden
		background-color #f0f4fb
	}
</style>