sai/swimmingUni
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

'提交'

Browse Source
This commit is contained in:
Ls
2026-03-31 08:40:11 +08:00
parent b8c05d23ae
commit a4bcd5ae1f
12 changed files with 3883 additions and 1255 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
src/pages/dataAnalyze/grades.vue
View File

@@ -23,22 +23,6 @@
</picker>
</view>
<!-- ==================== 空状态提示 ==================== -->
<!-- 未选择项目时的提示 -->
<view class="hint-state" v-if="!selectedProjectId">
<view class="hint-icon">
<u-icon name="list" size="80" color="#eb2f96"></u-icon>
</view>
<text class="hint-text">请先选择项目</text>
</view>
<!-- 无数据时的提示 -->
<view class="hint-state" v-else-if="gradeList.length === 0">
<view class="hint-icon">
<u-icon name="file-text" size="80" color="#eb2f96"></u-icon>
</view>
<text class="hint-text">该项目暂无排名数据</text>
</view>
<!-- ==================== 排名列表区域 ==================== -->
<!-- 仅在选择了项目且有数据时显示 -->
@@ -70,11 +54,6 @@
<text class="rank-number">{{ index + 1 }}</text>
</view>
<!-- 学生头像 -->
<view class="student-avatar">
<text class="avatar-text">{{ item.name.charAt(0) }}</text>
</view>
<!-- 学生信息 -->
<view class="student-info">
<text class="student-name">{{ item.name }}</text>
@@ -308,9 +287,23 @@
.project-select-section {
background-color: #fff;
margin: 0 20rpx 20rpx;
border-radius: 16rpx;
border-radius: 20rpx;
padding: 28rpx;
box-shadow: 0 2rpxrpx 12rpx rgba(0, 0, 0, 0.05);
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
position: relative;
overflow: hidden;
transition: all 0.3s ease;
&::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6rpx;
// background: linear-gradient(180deg, #1890ff 0%, #096dd9 100%);
border-radius: 20rpx 0 0 20rpx;
}
.picker-wrapper {
display: flex;
@@ -323,8 +316,9 @@
transition: all 0.3s ease;
&:active {
background-color: #f0f0f0;
border-color: #eb2f96;
background-color: #fff0f5;
border-color: #1890ff;
transform: scale(0.98);
}
.picker-text {
@@ -334,24 +328,7 @@
}
}
/* ==================== 提示状态容器 ==================== */
.hint-state {
margin: 0 20rpx;
background-color: #fff;
border-radius: 16rpx;
padding: 80rpx 40rpx;
text-align: center;
box-shadow: 0 2rpxrpx 12rpx rgba(0, 0, 0, 0.05);
.hint-icon {
margin-bottom: 24rpx;
}
.hint-text {
font-size: 28rpx;
color: #999;
}
}
/* ==================== 排名列表区域 ==================== */
.ranking-section {
@@ -360,13 +337,26 @@
// 统计卡片
.stats-card {
background-color: #fff;
border-radius: 16rpx;
border-radius: 20rpx;
padding: 24rpx;
margin-bottom: 20rpx;
display: flex;
align-items: center;
justify-content: space-around;
box-shadow: 0 2rpxrpx 12rpx rgba(0, 0, 0, 0.05);
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
position: relative;
overflow: hidden;
&::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6rpx;
// background: linear-gradient(180deg, #1890ff 0%, #096dd9 100%);
border-radius: 20rpx 0 0 20rpx;
}
.stat-item {
text-align: center;
@@ -381,7 +371,7 @@
.stat-value {
font-size: 32rpx;
font-weight: 700;
color: #eb2f96;
color: #1890ff;
}
}
@@ -398,32 +388,36 @@
// 排名项
.ranking-item {
background-color: #fff;
border-radius: 16rpx;
border-radius: 20rpx;
padding: 24rpx;
margin-bottom: 16rpx;
display: flex;
align-items: center;
gap: 20rpx;
box-shadow: 0 2rpxrpx 12rpx rgba(0, 0, 0, 0.05);
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
position: relative;
overflow: hidden;
&::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6rpx;
// background: linear-gradient(180deg, #1890ff 0%, #096dd9 100%);
opacity: 0;
transition: opacity 0.3s ease;
border-radius: 20rpx 0 0 20rpx;
}
&:active {
transform: scale(0.98);
box-shadow: 0 4rpx 16rpx rgba(235, 47, 150, 0.15);
}
// 前三名特殊样式
&.top-three {
&::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6rpx;
background: linear-gradient(180deg, #eb2f96 0%, #f759ab 100%);
border-radius: 16rpx 0 0 16rpx;
opacity: 1;
}
}
@@ -437,7 +431,7 @@
justify-content: center;
flex-shrink: 0;
background-color: #f0f0f0;
box-shadow: 0 2rpxrpx 8rpx rgba(0, 0, 0, 0.1);
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
.rank-number {
font-size: 24rpx;
@@ -448,7 +442,7 @@
// 前三名特殊颜色
&.rank-1 {
background: linear-gradient(135deg, #ffd700 0%, #ffec3d 100%);
box-shadow: 0 2rpxrpx 8rpx rgba(255, 215, 0, 0.4);
box-shadow: 0 2rpx 8.6rpx rgba(255, 215, 0, 0.4);
.rank-number {
color: #fff;
@@ -458,7 +452,7 @@
&.rank-2 {
background: linear-gradient(135deg, #c0c0c0 0%, #d9d9d9 100%);
box-shadow: 0 2rpxrpx 8rpx rgba(192, 192, 192, 0.4);
box-shadow: 0 2rpx 8rpx rgba(192, 192, 192, 0.4);
.rank-number {
color: #fff;
@@ -467,7 +461,7 @@
&.rank-3 {
background: linear-gradient(135deg, #cd7f32 0%, #e6963d 100%);
box-shadow: 0 2rpxrpx 8rpx rgba(205, 127, 50, 0.4);
box-shadow: 0 2rpx 8rpx rgba(205, 127, 50, 0.4);
.rank-number {
color: #fff;
@@ -479,13 +473,13 @@
.student-avatar {
width: 70rpx;
height: 70rpx;
background: linear-gradient(135deg, #eb2f96 0%, #f759ab 100%);
background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
box-shadow: 0 2rpxrpx 8rpx rgba(235, 47, 150, 0.3);
box-shadow: 0 2rpx 8rpx rgba(235, 47, 150, 0.3);
.avatar-text {
font-size: 28rpx;
@@ -509,7 +503,7 @@
.student-speed {
font-size: 26rpx;
color: #eb2f96;
color: #1890ff;
font-weight: 500;
}
}