fix: 首页滚动条防闪烁与颜色标注修正

- v-if 改为容器始终渲染 + min-height,避免数据加载后布局跳动
- 颜色标注改为"学习报告"/"学习残片",准确描述元素类型
This commit is contained in:
2026-05-23 22:55:08 +08:00
parent 4abc316311
commit ad2561981d
+13 -3
View File
@@ -89,11 +89,15 @@ onMounted(() => {
<template>
<section class="welcome-page">
<div class="review-scroll-section surface-card" v-if="sessionGroups.length > 0">
<div
class="review-scroll-section surface-card"
:class="{ 'is-empty': sessionGroups.length === 0 }"
>
<template v-if="sessionGroups.length > 0">
<div class="review-scroll-header">
<span class="color-legend">
<span class="dot dot-report"></span> 学习报告
<span class="dot dot-fragment"></span> 仅有学习残片
<span class="dot dot-report"></span> 学习报告
<span class="dot dot-fragment"></span> 学习残片
</span>
</div>
<div class="review-scroll-track">
@@ -115,6 +119,7 @@ onMounted(() => {
</span>
</div>
</div>
</template>
</div>
<div class="welcome-banner surface-card">
@@ -199,6 +204,11 @@ onMounted(() => {
.review-scroll-section {
padding: 14px 22px;
overflow: hidden;
min-height: 90px;
}
.review-scroll-section.is-empty {
visibility: hidden;
}
.review-scroll-header {