diff --git a/src/components/widgets/WeekplanWidget.vue b/src/components/widgets/WeekplanWidget.vue index 476d28f..01bfae6 100644 --- a/src/components/widgets/WeekplanWidget.vue +++ b/src/components/widgets/WeekplanWidget.vue @@ -45,16 +45,19 @@ rel="noopener" >查看概览 › - -
{{ currentDayLabel }}
+ +
+ +
{{ currentDayLabel }}
+
@@ -282,7 +285,7 @@ function reportHeight() { gap: 8px; margin: 0 15px; padding: 6px 0 10px; - font-size: 14px; + font-size: 15px; font-weight: 700; color: #344449; > span { @@ -308,28 +311,37 @@ function reportHeight() { margin: 0 15px 6px; gap: 4px; .d { + position: relative; flex: 1 1 0; text-align: center; - font-size: 12px; + font-size: 14px; color: #6e7c87; border-radius: 4px; - padding: 4px 0; + // 底部留出圆点位置:整周无安排时也占位,日期条高度恒定 + padding: 4px 0 11px; cursor: pointer; b { display: block; - font-size: 13px; + font-size: 15px; color: #344449; margin-top: 2px; font-weight: 600; } - &.has b::after { + // 圆点绝对定位在单元格底部(今日的蓝底方块不会把它盖住) + b::after { content: ""; - display: block; + position: absolute; + left: 50%; + bottom: 3px; + transform: translateX(-50%); width: 4px; height: 4px; border-radius: 50%; background: #2d8cf0; - margin: 2px auto 0; + visibility: hidden; + } + &.has b::after { + visibility: visible; } // 休息日(周六 / 周日)弱化日期数字 &.rest b { @@ -343,7 +355,7 @@ function reportHeight() { &.is-on { color: #1d4ed8; b { - width: 26px; + width: 28px; margin: 2px auto 0; padding: 1px 0; background: #2d8cf0; @@ -361,13 +373,13 @@ function reportHeight() { margin: 8px 15px 0; } .wk-tips { - font-size: 14px; + font-size: 16px; font-weight: 700; color: #1f2329; } .wk-overview { flex: 0 0 auto; - font-size: 12px; + font-size: 13px; color: #2d8cf0; text-decoration: none; cursor: pointer; @@ -375,15 +387,33 @@ function reportHeight() { color: #1d6fd0; } } +/* 列表区:固定高度 = 5 条(旧版实测行距 ≈54px × 5 ≈ 268px,与「内容+地点」两行条目 5 条相当); + 多条滚动、空态占位同高,避免切到「休/节假日」时卡片高度跳变 */ +.wk-list-area { + height: 268px; + overflow-y: auto; + overflow-x: hidden; + scrollbar-width: thin; + &::-webkit-scrollbar { + width: 6px; + } + &::-webkit-scrollbar-thumb { + background: #d3d8de; + border-radius: 3px; + } + &::-webkit-scrollbar-track { + background: transparent; + } +} .wk-list { list-style: none; margin: 0; padding: 0; li { margin: 0 15px; - padding: 5px 0; + padding: 6px 0; border-bottom: 1px solid #f2f4f7; - font-size: 12.5px; + font-size: 15px; color: #344449; &:last-child { border-bottom: 0; @@ -406,17 +436,22 @@ function reportHeight() { } .meta { margin-top: 2px; - font-size: 11.5px; + font-size: 12.5px; color: #98a2b0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } +/* 备注:与「安排数据」区分——上方一条分割线 + 浅底块,跟白色列表拉开层次 */ .wk-remark { margin: 8px 15px 0; - font-size: 12px; - color: #6e7c87; + padding: 8px 10px; + background: #f7f8fa; + border-top: 1px solid #eef1f5; + border-radius: 6px; + font-size: 13px; + color: #5b6672; .rk-txt { line-height: 1.6; // 备注可能是含换行的多行文本:pre-line 保留换行;折叠态截断 2 行 @@ -433,7 +468,7 @@ function reportHeight() { .rk-more { display: inline-block; margin-top: 2px; - font-size: 12px; + font-size: 13px; color: #2d8cf0; cursor: pointer; user-select: none; @@ -443,12 +478,12 @@ function reportHeight() { } } .no-data { - min-height: 90px; + height: 100%; display: flex; align-items: center; justify-content: center; color: #b9c2cc; - font-size: 13px; + font-size: 14px; } /* ---------- 空态(模板内联 SVG,不依赖外部图片 / CSS 背景) ---------- */