You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

100 lines
2.4 KiB
Vue

6 months ago
<template>
<view class="index-page">
<ch-nav-bar title="学生个人中心" :height="66" :backFn="quitApp">
<template v-slot:right>
<uni-icons type="gear-filled" size="56" color="#fff" @click="enterSetting"/>
</template>
</ch-nav-bar>
<view class="top-container">
<uni-row :gutter="10">
<uni-col :span="8">
<view class="user__info-item">
<text>姓名</text>
<text>{{ userInfo.studentname }}</text>
</view>
</uni-col>
<uni-col :span="8">
<view class="user__info-item">
<text>学号</text>
<text>{{ userInfo.studentno }}</text>
</view>
</uni-col>
<uni-col :span="8">
<view class="user__info-item">
<text>班级</text>
<text>{{ userInfo.gradename }}{{ userInfo.classname }}</text>
</view>
</uni-col>
</uni-row>
</view>
<uni-grid :column="4" :showBorder="false">
<uni-grid-item v-for="item in gridList" :key="item.id" @click="clickMenuItem(item.url)">
<ch-flex class="grid-menu__item" direction="column" justify="center" items="center">
<image class="grid-menu__image" :src="item.icon" mode="aspectFit"></image>
<text>{{ item.name }}</text>
</ch-flex>
</uni-grid-item>
</uni-grid>
</view>
</template>
<script setup>
import ChFlex from '@/components/ch-flex/ch-flex.vue';
import ChNavBar from '@/components/ch-nav-bar/ch-nav-bar.vue';
import { quitApp } from '@/useModules/useNavigate.js';
import { reactive, toRefs } from 'vue';
import userIndex from '@/assets/images/icons/userIndex_order.png';
import myStudy from '@/assets/images/icons/my_study.png';
import task from '@/assets/images/icons/task.png';
import { onLoad } from '@dcloudio/uni-app';
import { useUserStore } from '@/store/user.js';
const userStore = useUserStore()
const data = reactive({
userInfo: {},
gridList: [
{
id: '001',
name: '考试/练习',
icon: userIndex,
url: '/pages/exam/exam'
},
{
id: '002',
name: '试 题',
icon: myStudy,
url: '/pages/subjectSelect/subjectSelect'
},
{
id: '003',
name: '作 业',
icon: task,
url: '/pages/task/task'
}
]
})
const { gridList, userInfo } = toRefs(data);
onLoad(() => {
userInfo.value = userStore.userInfo;
})
function clickMenuItem(url) {
uni.navigateTo({
url
})
}
function enterSetting () {
uni.navigateTo({
url: '/pages/setting/setting'
})
}
</script>
<style lang="scss" scoped>
@import './index.scss';
</style>