From 5d7b8526f4100c28908ab61429760fd761d304ac Mon Sep 17 00:00:00 2001
From: chenxing <chenxing@bestsch.com>
Date: Fri, 16 Oct 2026 09:50:39 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E4=B8=80=E5=91=A8=E5=AE=89=E6=8E=92?=
 =?UTF-8?q?=E5=B0=8F=E7=BB=84=E4=BB=B6):=20=E9=9D=A2=E6=9D=BF=E5=85=B3?=
 =?UTF-8?q?=E6=A8=AA=E5=90=91=E6=BB=9A=E5=8A=A8=EF=BC=88=E4=BF=AE=E5=A4=96?=
 =?UTF-8?q?=E6=A1=86=20X=20=E8=BD=B4=E6=BB=9A=E5=8A=A8=E6=9D=A1=E3=80=81?=
 =?UTF-8?q?=E6=97=A5=E6=9C=9F=E6=9D=A1=E8=A2=AB=E8=A3=81=EF=BC=89+=20?=
 =?UTF-8?q?=E8=89=B2=E7=B3=BB=20#5979ea=E3=80=81=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E5=8C=BA=E5=9B=BA=E5=AE=9A=203=20=E6=9D=A1=E3=80=81=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF=E8=A1=8C=E5=85=A8=E7=A9=BA=E8=90=BD=E3=80=8C-?=
 =?UTF-8?q?=E3=80=8D=E3=80=81=E5=A4=87=E6=B3=A8=E6=97=A0=E5=88=99=E4=B8=8D?=
 =?UTF-8?q?=E6=B8=B2=E6=9F=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 色系：#2d8cf0 / #1d4ed8 整族换 #5979ea（hover #4864d8），覆盖今日方块、圆点、查看概览、展开、今日星期
- 列表区：268px(≈5 条) → calc(var(--wk-row) * 3) = 171px（正好 3 条 + 滚动），新增 --wk-row: 57px
- 条目等高 57px；信息行（地点 · 负责人 · 出席对象）恒渲染，三者全空落「-」，不再留白
- 备注：无备注整块不渲染；超 2 行才出「展开」且贴第二行末尾；remarkText 加 trim；换周重置 remarkOverflow
- 「查看概览 ›」→「查看概览」（去掉箭头字符）
- 修 X 轴滚动条根因（views/index.vue）：widgetOptions 的 scrollPanel 关掉 scrollingX
  原 scrollingX=true 时 vuescroll 给 .__view 内联 width:fit-content，包含块被最长文本撑到 ≈425px
  ⇒ 面板 scrollWidth 561 > clientWidth 391，外框出 #333 横向条、日期条 7 列被裁成 5 列、长条目省略号失效
  同时 .content { min-width: 0 } 兜底（flex 项默认 min-width:auto 会让 nowrap 文本不收缩）
---
 src/components/widgets/WeekplanWidget.vue | 67 +++++++++++++++++------
 src/views/index.vue                       | 13 ++++-
 2 files changed, 61 insertions(+), 19 deletions(-)

diff --git a/src/components/widgets/WeekplanWidget.vue b/src/components/widgets/WeekplanWidget.vue
index 01bfae6..657572a 100644
--- a/src/components/widgets/WeekplanWidget.vue
+++ b/src/components/widgets/WeekplanWidget.vue
@@ -43,9 +43,9 @@
                     :href="overviewUrl"
                     target="_blank"
                     rel="noopener"
-                >查看概览 ›</a>
+                >查看概览</a>
             </div>
-            <!-- 列表区固定高度（≈5 条单行）：超出滚动；空态（休/节假日/无安排）同高，卡片高度不跳 -->
+            <!-- 列表区固定高度（= 3 条 × --wk-row）：超出滚动；空态（休/节假日/无安排）同高，卡片高度不跳 -->
             <div class="wk-list-area">
                 <ul v-if="currentList.length > 0" class="wk-list">
                     <li v-for="(item, index) in currentList" :key="index">
@@ -53,14 +53,16 @@
                             <span class="content" :title="item.contents">{{ item.contents }}</span>
                             <span class="time">{{ item.times }}</span>
                         </div>
-                        <div v-if="metaOf(item)" class="meta">{{ metaOf(item) }}</div>
+                        <!-- 信息行恒渲染：地点 / 负责人 / 出席对象全空时落「-」，不留白（条目保持等高） -->
+                        <div class="meta">{{ metaOf(item) || "-" }}</div>
                     </li>
                 </ul>
                 <div v-else class="no-data">{{ currentDayLabel }}</div>
             </div>
 
-            <!-- 备注：默认 2 行截断，超出才给「展开/收起」；空备注整块不渲染 -->
-            <div v-if="remarkText" class="wk-remark">
+            <!-- 备注：无备注整块不渲染（不占位，卡片高度随内容）；
+                 默认 2 行截断，溢出才给「展开」（折叠态按钮贴第二行末尾） -->
+            <div v-if="remarkText" class="wk-remark" :class="{ collapsed: !remarkExpanded }">
                 <div ref="refRemark" class="rk-txt" :class="{ expanded: remarkExpanded }">{{ remarkText }}</div>
                 <span v-if="remarkOverflow" class="rk-more" @click="toggleRemark">{{ remarkExpanded ? "收起" : "展开" }}</span>
             </div>
@@ -139,7 +141,8 @@ const titleFull = computed<string>(() => {
  * 真正无周对象（oapi 降级返回 {}）才走大图标空态。
  */
 const hasWeek = computed(() => titleStr.value !== "");
-const remarkText = computed<string>(() => weekData.value.remark || "");
+// trim：备注尾部换行/空格会多出一个空行，让「展开」在只有 2 行内容时也误判溢出
+const remarkText = computed<string>(() => String(weekData.value.remark || "").trim());
 const canPrev = computed(() => weekOffset.value > minWeek.value);
 const canNext = computed(() => weekOffset.value < maxWeek.value);
 
@@ -185,6 +188,7 @@ async function loadWeek(week: number) {
         loading.value = false;
         // 换周/换数据后重置备注折叠态并重测溢出
         remarkExpanded.value = false;
+        remarkOverflow.value = false;
         nextTick(measureRemark);
         reportHeight();
     }
@@ -246,7 +250,7 @@ function monthDay(day: any) {
     return String((day && day.dateText) || "");
 }
 
-/** 次要信息行：地点 / 负责人 / 参与人员，全部为空则不显示 */
+/** 次要信息行：地点 / 负责人 / 参与人员；三者全空时落「-」，不留白（条目保持等高） */
 function metaOf(item: any) {
     if (!item) return "";
     const parts: string[] = [];
@@ -275,7 +279,15 @@ function reportHeight() {
 </script>
 
 <style lang="scss" scoped>
+/* 主色（2026-10-16 指定）：今日方块 / 七日条圆点 / 「查看概览」/「展开」/ 今日星期 */
+$wk-primary: #5979ea;
+$wk-primary-dark: #4864d8;
+
 .wg-weekplan {
+    /* 一条安排的高度：内容行(15px × 1.5 = 22.5) + 信息行(12.5px × 1.5 = 18.75)
+       + 上下 padding 12 + 分隔线 1 ≈ 56.25px ⇒ 取 57px 留余量。
+       有/无「地点·负责人·参与人」的条目都占这个高度，标题行始终对齐。 */
+    --wk-row: 57px;
     padding: 6px 0 10px;
 }
 .wk-title {
@@ -337,7 +349,7 @@ function reportHeight() {
             width: 4px;
             height: 4px;
             border-radius: 50%;
-            background: #2d8cf0;
+            background: $wk-primary;
             visibility: hidden;
         }
         &.has b::after {
@@ -353,12 +365,12 @@ function reportHeight() {
         }
         // 今日：蓝底白字方块（置最后，压过 rest / holiday 的日期字色）
         &.is-on {
-            color: #1d4ed8;
+            color: $wk-primary;
             b {
                 width: 28px;
                 margin: 2px auto 0;
                 padding: 1px 0;
-                background: #2d8cf0;
+                background: $wk-primary;
                 color: #fff;
                 border-radius: 4px;
             }
@@ -380,17 +392,17 @@ function reportHeight() {
 .wk-overview {
     flex: 0 0 auto;
     font-size: 13px;
-    color: #2d8cf0;
+    color: $wk-primary;
     text-decoration: none;
     cursor: pointer;
     &:hover {
-        color: #1d6fd0;
+        color: $wk-primary-dark;
     }
 }
-/* 列表区：固定高度 = 5 条（旧版实测行距 ≈54px × 5 ≈ 268px，与「内容+地点」两行条目 5 条相当）；
-   多条滚动、空态占位同高，避免切到「休/节假日」时卡片高度跳变 */
+/* 列表区：固定高度 = 3 条（3 × --wk-row，即 171px）；多条滚动、空态占位同高，
+   避免切到「休/节假日」时卡片高度跳变 */
 .wk-list-area {
-    height: 268px;
+    height: calc(var(--wk-row) * 3);
     overflow-y: auto;
     overflow-x: hidden;
     scrollbar-width: thin;
@@ -411,6 +423,10 @@ function reportHeight() {
     padding: 0;
     li {
         margin: 0 15px;
+        // 条目等高：有/无「地点·负责人·参与人」都占一行高度（无信息落「-」占位，不留白），
+        // 保证标题行纵向对齐；overflow 兜住固定高度可能带来的亚像素裁切
+        height: var(--wk-row);
+        overflow: hidden;
         padding: 6px 0;
         border-bottom: 1px solid #f2f4f7;
         font-size: 15px;
@@ -425,6 +441,9 @@ function reportHeight() {
     }
     .content {
         flex: 1 1 auto;
+        // ⚠️ 必须显式 min-width:0：flex 项默认 min-width:auto，遇 nowrap 长文本
+        // 会以 max-content 为下限而不收缩 ⇒ text-overflow 永不触发
+        min-width: 0;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
@@ -443,8 +462,9 @@ function reportHeight() {
         white-space: nowrap;
     }
 }
-/* 备注：与「安排数据」区分——上方一条分割线 + 浅底块，跟白色列表拉开层次 */
+/* 备注：与「安排数据」区分——上方一条分割线 + 浅底块，跟白色列表拉开层次；无备注整块不渲染 */
 .wk-remark {
+    position: relative;
     margin: 8px 15px 0;
     padding: 8px 10px;
     background: #f7f8fa;
@@ -465,15 +485,26 @@ function reportHeight() {
             overflow: visible;
         }
     }
+    // 折叠态：正文右侧给「展开」留位（第二行以省略号收尾），按钮贴第二行末尾（右端）
+    &.collapsed .rk-txt {
+        padding-right: 34px;
+    }
+    &.collapsed .rk-more {
+        position: absolute;
+        right: 10px;
+        bottom: 8px;
+        // 与备注块同底色，压住可能蹭到的正文尾部
+        background: #f7f8fa;
+    }
     .rk-more {
         display: inline-block;
         margin-top: 2px;
         font-size: 13px;
-        color: #2d8cf0;
+        color: $wk-primary;
         cursor: pointer;
         user-select: none;
         &:hover {
-            color: #1d6fd0;
+            color: $wk-primary-dark;
         }
     }
 }
diff --git a/src/views/index.vue b/src/views/index.vue
index 7c59525..253d4ea 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -216,9 +216,20 @@ const dragObj = reactive({
     parentH: 0,
 });
 
+/**
+ * vuescroll 面板参数。
+ * ⚠️ scrollingX 必须显式 false：vuescroll 默认 true，此时 native-panel 会给 .__view 内联
+ * `width: fit-content; min-width: 100%`，`.widget-item` 的包含块就被「最长的 nowrap 文本」
+ * 撑宽（白卡 357px → 内容 ≈425px）⇒ 列表条目 text-overflow 永不触发（文字顶到卡边被硬裁）、
+ * 七日条按更宽容器等分（六/日被裁），面板 scrollWidth > clientWidth ⇒ 外框出横向滚动条。
+ * 关掉后 .__view 走 `width: 100%` 分支。面板内组件均不依赖横向滚动：
+ * 课表自带 .tt-scroll（纵向）、自定义片段是 iframe width:100%。
+ */
 const widgetOps = {
     vuescroll: {},
-    scrollPanel: {},
+    scrollPanel: {
+        scrollingX: false,
+    },
     rail: {},
     bar: {
         background: "#333",