From be7b91ac20c5ae29d913bbd7b0dd8e6a231a6b8e Mon Sep 17 00:00:00 2001
From: yangbin <1796443586@qq.com>
Date: Thu, 27 Aug 2026 17:02:32 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=A8=E5=B1=80=E6=93=8D=E4=BD=9C=E6=A0=8F?=
 =?UTF-8?q?=E5=9B=BA=E5=AE=9A=E4=BF=AE=E5=A4=8D=20=E5=92=8C=E5=88=87?=
 =?UTF-8?q?=E6=8D=A2=E5=AD=A6=E6=9C=9F=E9=85=8D=E8=89=B2=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/assets/styles/roomroot.scss      | 20 +++++++
 .../src/layout/components/SemesterBar.vue     | 56 +++++++++++--------
 frontend/src/views/classHour/plan/index.vue   | 45 ++++++++++++---
 3 files changed, 90 insertions(+), 31 deletions(-)

diff --git a/frontend/src/assets/styles/roomroot.scss b/frontend/src/assets/styles/roomroot.scss
index de603b39..a73d1537 100644
--- a/frontend/src/assets/styles/roomroot.scss
+++ b/frontend/src/assets/styles/roomroot.scss
@@ -98,6 +98,15 @@
   -ms-user-select: none;
   user-select: none;
 
+  // 教学管理系统的列表字段统一居中，避免各业务页面单独声明后出现视觉错位。
+  .el-table__cell,
+  .el-table__cell.is-left,
+  .el-table__cell.is-right,
+  .el-table__cell.is-center,
+  .el-table__cell > .cell {
+    text-align: center;
+  }
+
   .el-table__header-wrapper, .el-table__fixed-header-wrapper {
     th {
       word-break: break-word;
@@ -129,6 +138,17 @@
   .el-table__fixed-body-wrapper.is-dragging {
     cursor: default;
   }
+
+  // 横向滚动条被隐藏后，Element UI 仍会为右侧固定列预留滚动条高度。
+  // 仅在宽表格发生横向溢出时补齐该高度，保证“操作”列与普通数据行底部对齐。
+  &.el-table--scrollable-x .el-table__fixed-right {
+    height: 100% !important; // 组件通过行内样式写入高度，只能在此处覆盖。
+  }
+
+  &.el-table--scrollable-x .el-table__fixed-right .el-table__fixed-body-wrapper {
+    bottom: 0;
+    height: auto !important; // 组件通过行内样式写入高度，只能在此处覆盖。
+  }
 }
 
 /* 表格横拖期间锁定整页光标与文本选中：
diff --git a/frontend/src/layout/components/SemesterBar.vue b/frontend/src/layout/components/SemesterBar.vue
index 5f99f3a5..6c69a63a 100644
--- a/frontend/src/layout/components/SemesterBar.vue
+++ b/frontend/src/layout/components/SemesterBar.vue
@@ -247,28 +247,40 @@ export default {
       line-height: normal;
     }
 
-    ::v-deep .el-input__inner {
-      background: rgba(255, 255, 255, 0.12);
-      border: 1px solid rgba(255, 255, 255, 0.35);
-      color: #fff;
-      border-radius: 7px;
-      height: 36px;
-      padding: 0 12px;
-      display: flex;
-      align-items: center;
-
-      &::placeholder {
-        color: rgba(255, 255, 255, 0.7);
-      }
-    }
-
-    ::v-deep .el-input__inner:hover {
-      border-color: rgba(255, 255, 255, 0.6);
-    }
-
-    ::v-deep .el-input__icon {
-      color: rgba(255, 255, 255, 0.85);
-    }
+  }
+}
+</style>
+
+<style lang="scss">
+/* 顶部学期选择器使用导航栏色系，避免被全局白色表单控件样式覆盖。 */
+#app .semester-bar__switch .semester-select {
+  .el-input__inner {
+    height: 36px;
+    padding: 0 34px 0 13px;
+    border: 1px solid rgba(255, 255, 255, 0.22);
+    border-radius: 7px;
+    color: #ffffff;
+    background: rgba(255, 255, 255, 0.10);
+    box-shadow: none;
+
+    &::placeholder {
+      color: rgba(255, 255, 255, 0.68);
+    }
+
+    &:hover {
+      border-color: rgba(255, 255, 255, 0.38);
+      background: rgba(255, 255, 255, 0.14);
+    }
+
+    &:focus {
+      border-color: rgba(255, 255, 255, 0.55);
+      background: rgba(255, 255, 255, 0.14);
+      box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
+    }
+  }
+
+  .el-input__icon {
+    color: rgba(255, 255, 255, 0.82);
   }
 }
 </style>
diff --git a/frontend/src/views/classHour/plan/index.vue b/frontend/src/views/classHour/plan/index.vue
index 626e0e2e..8fbe7a3a 100644
--- a/frontend/src/views/classHour/plan/index.vue
+++ b/frontend/src/views/classHour/plan/index.vue
@@ -23,7 +23,15 @@
     <!-- ==================== 2. 数据表格 ==================== -->
     <el-card shadow="never" class="table-card">
       <!-- 课时费方案 -->
-      <el-table v-if="activeTab === 'fee'" v-loading="feeState.loading" :data="feeState.list" border stripe style="width: 100%">
+      <el-table
+        v-if="activeTab === 'fee'"
+        v-loading="feeState.loading"
+        :data="feeState.list"
+        border
+        stripe
+        class="plan-data-table"
+        style="width: 100%"
+      >
         <el-table-column type="index" label="序号" width="55" align="center" />
         <el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
         <el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
@@ -55,17 +63,27 @@
           <template slot-scope="{ row }">{{ fmtValue(row.jxbjgbz) }}</template>
         </el-table-column>
         <el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
-        <el-table-column label="操作" width="160" align="center" fixed="right">
+        <el-table-column label="操作" width="180" align="center" fixed="right">
           <template slot-scope="{ row }">
-            <el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
-            <el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
-            <el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
+            <div class="table-actions">
+              <el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
+              <el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
+              <el-button type="text" size="small" class="text-danger" @click="handleDelete(row)">删除</el-button>
+            </div>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 课时方案 -->
-      <el-table v-else v-loading="coeffState.loading" :data="coeffState.list" border stripe style="width: 100%">
+      <el-table
+        v-else
+        v-loading="coeffState.loading"
+        :data="coeffState.list"
+        border
+        stripe
+        class="plan-data-table"
+        style="width: 100%"
+      >
         <el-table-column type="index" label="序号" width="55" align="center" />
         <el-table-column prop="bh" label="编号" width="150" align="center" show-overflow-tooltip />
         <el-table-column prop="mc" label="名称" min-width="130" show-overflow-tooltip />
@@ -100,10 +118,12 @@
           <template slot-scope="{ row }">{{ fmtValue(row.hbxssx) }}</template>
         </el-table-column>
         <el-table-column prop="sm" label="说明" min-width="120" show-overflow-tooltip />
-        <el-table-column label="操作" width="120" align="center" fixed="right">
+        <el-table-column label="操作" width="140" align="center" fixed="right">
           <template slot-scope="{ row }">
-            <el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
-            <el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
+            <div class="table-actions">
+              <el-button type="text" size="small" @click="handleDetail(row)">详情</el-button>
+              <el-button type="text" size="small" @click="handleEdit(row)">修改</el-button>
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -654,6 +674,13 @@ export default {
 
   // ==================== 2. 数据表格 ====================
   .table-card {
+    .table-actions {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      white-space: nowrap;
+    }
+
     .pagination {
       display: flex;
       justify-content: flex-end;