smart_campus_uni/pages/exam/exam.vue

<template>
	<view class="exam-page">
		<ch-nav-bar title="考试" :height="66"></ch-nav-bar>
		<uni-segmented-control class="exam-type__bar" :current="current" :values="items" @clickItem="examTypeChange" />
		<uni-list :border="true">
			<template v-for="item in examList" :key="item.id">
				<uni-list-item
					showExtraIcon="true"
					:clickable="true" 
					:showArrow="true" 
					:extraIcon="iconObj"
					:title="item.examname" 
					:note="item.starttime" 
					@click="clickExam(item.examid)">
				</uni-list-item>
			</template>
		</uni-list>
		<ch-empty v-if="!examList.length"></ch-empty>
	</view>
</template>

<script setup>
import { onMounted, reactive, toRefs } from 'vue';
import ChNavBar from '@/components/ch-nav-bar/ch-nav-bar.vue'
import { useUserStore } from '@/store/user.js'
import { getExamList } from '@/api/exam.js';

const userStore = useUserStore();
const userId = userStore.userId;
const params = {
	id: userId,
	status: 1,
}

console.log('id', userId, params)

const data = reactive({
	current: 0,
	items: ['进行中', '已结束'],
	examList: [],
	iconObj: {
		color: '#4cd964',
		size: '64',
		type: 'medal-filled'
	},
})

const { current, items, iconObj, examList } = toRefs(data);

onMounted(() => {
	getExamListData();
})

function examTypeChange (e) {
	params.status = ++e.currentIndex;
	getExamListData();
}

function clickExam (examId) {
	uni.navigateTo({
		url: `/pages/examDetails/examDetails?id=${examId}`
	})
}

function getExamListData () {
	return getExamList(params, { loading: true }).then(list => {
		return examList.value = list;
	})
}
</script>

<style lang="scss" scoped>
@import './exam.scss';
</style>