101 lines
1.8 KiB
Vue
101 lines
1.8 KiB
Vue
<!-- 我的成绩 -->
|
||
<template>
|
||
<view class="achievement">
|
||
<!-- 学生信息 -->
|
||
<view class="userinfo">
|
||
<text>平均学分绩班级排名：{{credit}}</text>
|
||
<text>学年综合素质测评班级排名：{{ranking}}</text>
|
||
<text>学年：{{year}}</text>
|
||
</view>
|
||
<!-- 成绩信息 -->
|
||
<view class="score">
|
||
<view class="scoreList" v-for="(item,index) in scoreList" :key="item.index">
|
||
<text class="title"> {{item.title}}</text>
|
||
<text>成绩:{{item.achievement}}</text>
|
||
<text>是否通过:{{item.ture}}</text>
|
||
<text>学年:{{item.studyear}}</text>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
// 学分
|
||
credit: "1",
|
||
ranking: "1",
|
||
year: "2023-2024",
|
||
scoreList: [{
|
||
title: "习近平新时代中国特色社会主义思想概论",
|
||
achievement:"优秀",
|
||
ture: "是",
|
||
studyear: "2022-2023-1 学期"
|
||
},
|
||
{
|
||
title: "WINFORM应用技术项目实战",
|
||
achievement:"良好",
|
||
ture: "是",
|
||
studyear: "2022-2023-1 学期"
|
||
}
|
||
|
||
]
|
||
}
|
||
},
|
||
methods: {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.achievement {
|
||
|
||
.userinfo {
|
||
|
||
padding: 10rpx 40rpx;
|
||
// width: 100%;
|
||
height: 160rpx;
|
||
background-color: #3388CC;
|
||
display: flex;
|
||
flex-direction: column;
|
||
color: white;
|
||
|
||
text {
|
||
/* 强制文本内部换行 */
|
||
white-space: pre-wrap;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
}
|
||
|
||
.score {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
margin-top: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
|
||
.scoreList {
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 90%;
|
||
height: 240rpx;
|
||
border-bottom: 1px solid #D8D8D8;
|
||
|
||
.title {
|
||
font-size: 35rpx;
|
||
font-weight: bold;
|
||
color: black;
|
||
}
|
||
|
||
text {
|
||
margin-top: 10rpx;
|
||
color: #9C9C9C;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |