fix(ui): 页面补通道卡片骨架，白卡与分页恢复正常

- App 不统一包卡片（会与页面级卡片叠加），改由各页面根节点提供，与 Notice 一致
- 25 个视图套 .page-wrapper.yh-fill > .main-container；日志管理重写为
  .search-wrap + .table-region + .page-panel 规范结构（卡片自动转 flex 纵向）
- 新增 element_height mixin：ResizeObserver 实测 .table-region 高度喂 Table，
  替代视口高度减常量的旧模型
- self_viewport 高度基准扣除卡片留白 64px，避免表格溢出被卡片裁切
- .env.dev 恢复真实后端地址

.env.dev

@@ -6,5 +6,5 @@
 # serviceHost 留空 → API 走同源相对 /api/*，由 vite proxy 转发到本地后端（规避 CAS 不回 CORS 头）
 VITE_BASE_HOST=http://base.yunhaixingtong.com
 VITE_SSO_HOST=http://sso.yunhaixingtong.com
-VITE_SERVICE_HOST=
+VITE_SERVICE_HOST=http://base.yunhaixingtong.com/userclass
 VITE_IS_MOCK=false

src/App.vue

@@ -129,6 +129,7 @@ onMounted(async () => {
                 <h3>暂无权限</h3>
                 <h6>如需查看，请联络管理员为您分配权限</h6>
             </div>
+            <!-- 卡片由各页面根节点提供：.page-wrapper.yh-fill > .main-container（通道 §4.4） -->
             <router-view v-else-if="isRouterAlive" :key="$route.fullPath" />
         </div>
     </div>

src/mixins/element_height.js

@@ -0,0 +1,39 @@
+/**
+ * 卡片内表格高度实测（Vue3）
+ * 用法：mixin + 在表格容器上写 class="table-region" ref="tableRegion"
+ *       Table 用 :height="tableRegionHeight"
+ */
+export const element_height = {
+    data() {
+        return {
+            tableRegionHeight: 0,
+        };
+    },
+    mounted() {
+        this.__measureTableRegion();
+        if (typeof ResizeObserver !== "undefined") {
+            this.__tableRegionRO = new ResizeObserver(() => this.__measureTableRegion());
+            const el = this.$refs.tableRegion;
+            if (el) this.__tableRegionRO.observe(el);
+        }
+        window.addEventListener("resize", this.__measureTableRegion);
+    },
+    beforeUnmount() {
+        if (this.__tableRegionRO) {
+            this.__tableRegionRO.disconnect();
+            this.__tableRegionRO = null;
+        }
+        window.removeEventListener("resize", this.__measureTableRegion);
+    },
+    methods: {
+        __measureTableRegion() {
+            const el = this.$refs.tableRegion;
+            if (!el) return;
+            const h = Math.floor(el.clientHeight);
+            // 0 常见于隐藏容器/首帧，保留上次有效值
+            if (h > 0) this.tableRegionHeight = h;
+        },
+    },
+};
+
+export default element_height;

src/mixins/self_viewport.js

@@ -1,3 +1,6 @@
+// 卡片留白预算（通道 §4.4）：.main-container 上下各 16 外边距 + 16 内边距
+const CARD_OVERHEAD = 64;
+
 export const self_viewport = {
     data() {
         return {
@@ -26,11 +29,16 @@ export const self_viewport = {
         }
     },
     mounted() {
-        this.tableHeight = document.body.clientHeight;
+        const sync = () => {
-        window.onresize = () => {
+            // 页面已包在 .main-container 卡片内：从视口高度里扣掉卡片留白，
-            return (() => {
+            // 否则沿用旧视口基准会多算 64px，表格溢出被卡片裁切
-                this.tableHeight = document.body.clientHeight;
+            this.tableHeight = document.body.clientHeight - CARD_OVERHEAD;
-            })();
         };
+        sync();
+        window.addEventListener("resize", sync);
+        this.__syncTableHeight = sync;
+    },
+    beforeUnmount() {
+        if (this.__syncTableHeight) window.removeEventListener("resize", this.__syncTableHeight);
     }
 };

src/views/areaOperateDaily.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <!-- 外层全屏容器，用于高度自适应 -->
     <div class="page-wrap">
       <!-- 顶部搜索栏 -->
@@ -38,6 +40,8 @@
         />
       </div>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/classManage/Christianity.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="container-full-height">
     <div class="layout-flex-row">
       <!-- 左侧树形容器 高度撑满、内部滚动 -->
@@ -141,6 +143,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/classManage/ChristianityDetail.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="outer-wrap">
       <!-- 顶部栏：Tab + 班级名称 + 返回 -->
       <div class="header-bar">
@@ -81,6 +83,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/classManage/HigherEducation.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="outer-wrap">
       <div class="page-container">
         <!-- 左侧年级树形 -->
@@ -145,6 +147,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/dailySearch.vue

@@ -1,178 +1,143 @@
 <template>
-    <div class="oper-log-wrap">
+  <!-- 内容卡片骨架（通道 §4.4）：page-wrapper.yh-fill > main-container
-      <!-- 顶部搜索栏 -->
+       卡片直接被 .page-panel（分页脚）识别为「表格卡」，转 flex 纵向；
-      <div class="top-search-bar">
+       工具/筛选/分页固定高，.table-region 撑满剩余高度 -->
-        <div></div>
+  <div class="page-wrapper yh-fill">
-        <div class="search-box">
+    <div class="main-container">
-          <Input
+      <!-- 搜索区（卡片内 filterbar 语义） -->
-            v-model="searchKeyword"
+      <div class="search-wrap fix">
-            placeholder="请输入用户名、IP、模块或详细操作"
+        <Input
-            search
+          class="fr"
-            style="width:460px"
+          style="width:460px"
-            @on-search="handleSearch"
+          v-model="searchKeyword"
-          />
+          placeholder="请输入用户名、IP、模块或详细操作"
-        </div>
+          search
+          suffix="ios-search"
+          @on-search="handleSearch"
+          @on-clear="handleSearch"
+        />
       </div>
 
-      <!-- 自适应滚动表格容器 -->
+      <!-- 表格区：实测高度喂 Table，避免卡内溢出 -->
-      <div class="table-scroll-wrap">
+      <div class="table-region" ref="tableRegion">
         <Table
           stripe
           :columns="tableColumns"
           :data="tableData"
-          :height="useTableHeight()+32"
+          :height="tableRegionHeight"
         ></Table>
       </div>
 
-      <!-- 底部分栏：分页固定底部 -->
+      <!-- 分页脚：正常流贴底，不再绝对定位 -->
-      <div class="page-bottom-bar">
+      <div class="page-panel">
-        <div></div>
+        <span class="total-text">共 {{ total }} 条</span>
-        <div class="page-wrap">
+        <Page
-          <span style="margin-right:12px">共 {{ total }} 条</span>
+          v-model="pageNum"
-          <Page
+          :page-size="pageSize"
-            v-model="pageNum"
+          :total="total"
-            :page-size="pageSize"
+          :page-size-opts="[10,20,50,100]"
-            :total="total"
+          show-sizer
-            :page-size-opts="[10,20,50,100]"
+          @on-change="pageChange"
-            show-sizer
+          @on-page-size-change="sizeChange"
-            @on-change="pageChange"
+        ></Page>
-            @on-page-size-change="sizeChange"
-          ></Page>
-        </div>
       </div>
     </div>
+  </div>
 </template>
 
-  <script>
+<script>
-  import { self_viewport } from "@/mixins/self_viewport";
+import { element_height } from "@/mixins/element_height";
-  export default {
-    name: 'OperationLogPage',
-    data() {
-      return {
-        // 搜索关键词
-        searchKeyword: '',
 
-        // 分页参数
+export default {
-        pageNum: 1,
+  name: "OperationLogPage",
-        pageSize: 10,
+  mixins: [element_height],
-        total: 0,
+  data() {
+    return {
+      // 搜索关键词
+      searchKeyword: "",
 
-        // 表格配置列
+      // 分页参数
-        tableColumns: [],
+      pageNum: 1,
-        // 模拟表格数据
+      pageSize: 10,
-        tableData: []
+      total: 0,
-      }
-    },
-    mixins: [self_viewport],
-    created() {
-      this.initTableColumn()
-      this.loadLogData()
-    },
-    methods: {
-      // 初始化配置式表格列
-      initTableColumn() {
-        this.tableColumns = [
-          { title: '序号', type: 'index', align: 'center', width: 70 },
-          { title: '模块', key: 'module', align: 'center', width: 160 },
-          { title: '详细操作', key: 'content', align: 'left' },
-          { title: '用户', key: 'operator', align: 'center', width: 130 },
-          { title: 'IP', key: 'ip', align: 'center', width: 150 },
-          { 
-            title: '时间',
-            key: 'operateTime',
-            align: 'center',
-            width: 190,
-            render: (h, params) => {
-              return h("div", { style: "line-height: 56px" }, this.$utils.dateFormat(params.row.operateTime,'yyyy-MM-dd HH:mm:ss'));
-            }
-           }
-        ]
-      },
 
-      // 请求日志列表
+      // 表格配置列
-      loadLogData() {
+      tableColumns: [],
-        const _this = this;
+      // 表格数据
-        var item = {
+      tableData: []
-          keyword:_this.searchKeyword,
+    };
-          page:_this.pageNum-1,
+  },
-          size:_this.pageSize
+  created() {
-        };
+    this.initTableColumn();
-        _this.$api.get(APIConfig.BschClassSystem.getlogsearch, item, resp => {
+    this.loadLogData();
-          if (resp.code == 0) {
+  },
-            _this.tableData = resp.data.content;
+  methods: {
-            _this.total=resp.data.total;
+    // 初始化配置式表格列
-          } else {
+    initTableColumn() {
-            _this.tableData = [];
+      this.tableColumns = [
+        { title: "序号", type: "index", align: "center", width: 70 },
+        { title: "模块", key: "module", align: "center", width: 160 },
+        { title: "详细操作", key: "content", align: "left" },
+        { title: "用户", key: "operator", align: "center", width: 130 },
+        { title: "IP", key: "ip", align: "center", width: 150 },
+        {
+          title: "时间",
+          key: "operateTime",
+          align: "center",
+          width: 190,
+          render: (h, params) => {
+            return h(
+              "div",
+              { style: "line-height: 56px" },
+              this.$utils.dateFormat(params.row.operateTime, "yyyy-MM-dd HH:mm:ss")
+            );
           }
-        });
+        }
-      },
+      ];
+    },
 
-      // 搜索
+    // 请求日志列表
-      handleSearch() {
+    loadLogData() {
-        this.pageNum = 1
+      const _this = this;
-        this.loadLogData()
+      var item = {
-      },
+        keyword: _this.searchKeyword,
+        page: _this.pageNum - 1,
+        size: _this.pageSize
+      };
+      _this.$api.get(APIConfig.BschClassSystem.getlogsearch, item, resp => {
+        if (resp.code == 0) {
+          _this.tableData = resp.data.content;
+          _this.total = resp.data.total;
+        } else {
+          _this.tableData = [];
+        }
+      });
+    },
 
-      // 页码切换
+    // 搜索
-      pageChange(page) {
+    handleSearch() {
-        this.pageNum = page
+      this.pageNum = 1;
-        this.loadLogData()
+      this.loadLogData();
-      },
+    },
-      // 每页条数修改
+
-      sizeChange(size) {
+    // 页码切换
-        this.pageSize = size
+    pageChange(page) {
-        this.pageNum = 1
+      this.pageNum = page;
-        this.loadLogData()
+      this.loadLogData();
-      }
+    },
+    // 每页条数修改
+    sizeChange(size) {
+      this.pageSize = size;
+      this.pageNum = 1;
+      this.loadLogData();
     }
   }
-  </script>
+};
+</script>
 
-  <style scoped>
+<style scoped>
-  .oper-log-wrap {
+.total-text {
-    width: 100%;
+  color: var(--text-2, #666);
-    height: 100%;
+  font-size: 13px;
-    display: flex;
+}
-    flex-direction: column;
+</style>
-    box-sizing: border-box;
-    padding: 12px;
-  }
-  
-  /* 顶部搜索栏 */
-  .top-search-bar {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-bottom: 14px;
-    flex-shrink: 0;
-  }
-  .search-box {
-    width: 100%;
-    background: #f7f7f7;
-    padding: 10px 16px;
-    height: 52px;
-    text-align: right;
-  }
-  
-  /* 表格自适应滚动区域 */
-  .table-scroll-wrap {
-    flex: 1;
-    min-height: 0;
-  }
-  .table-scroll-wrap :deep(.ivu-table) {
-    height: 100%;
-  }
-  
-  /* 底部分页固定栏 */
-  .page-bottom-bar {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-top: 14px;
-    flex-shrink: 0;
-  }
-  .page-wrap {
-    display: flex;
-    align-items: center;
-  }
-  </style>

src/views/electiveClassManage.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="page-container">
       <!-- 顶部标签栏 + 新增分组按钮 + 校本Tab编辑按钮 -->
       <div class="tab-header">
@@ -281,6 +283,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/electiveClassManageDetail.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="student-class-page">
       <!-- 顶部标题栏 -->
       <div class="page-top-bar">
@@ -104,6 +106,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/historySearch.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="class-history-wrap">
       <!-- 左侧树形区域：固定高度纵向滚动、单选、默认首班级选中 -->
       <div class="left-tree-box">
@@ -58,6 +60,8 @@
         
       </div>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/historySearchDetail.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="student-teach-detail-wrap">
       <!-- 顶部标题栏 -->
       <div class="top-header-bar">
@@ -29,6 +31,8 @@
         </div>
       </div>
       
+    </div>
+        </div>
     </div>
 </template>
   

src/views/itemSet.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="page-container">
     <div class="btn-top-wrap">
       <Button type="primary" @click="openAddModal">添加学年学期</Button>
@@ -199,6 +201,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 <script>
   import { Button } from "view-ui-plus";

src/views/schoolSetting.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="page-wrap">
     <Tabs v-model="activeTab">
       <TabPane label="校区管理" name="campus"></TabPane>
@@ -140,6 +142,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/studentManage/Christianity.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="student-manage-wrap">
       <!-- 左侧树形区域 固定高度滚动 -->
       <div class="left-tree-box">
@@ -291,6 +293,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/studentManage/HigherEducation.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="student-manage-wrap">
     <!-- 左侧树形区域 固定高度滚动 -->
     <div class="left-tree-box">
@@ -277,6 +279,8 @@
         </div></template>
       </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/studentYDManage/Christianity.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="student-manage-wrap">
       <!-- 左侧树形区域 固定高度滚动 -->
       <div class="left-tree-box">
@@ -77,6 +79,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/studentYDManage/HigherEducation.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="student-manage-wrap">
     <!-- 左侧树形区域 固定高度滚动 -->
     <div class="left-tree-box">
@@ -77,6 +79,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/studySystemChoice.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="edu-layout-wrap">
     <Row :gutter="10" class="layout-row">
       <!-- 左侧：学校树形 -->
@@ -64,6 +66,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/subjectManForZy.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <!-- 最外层整体边框容器（和校区/系部/专业页面统一外壳样式） -->
     <div class="outer-wrap">
       <!-- 顶部筛选+操作栏 -->
@@ -93,6 +95,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/subjectSetzhi.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="outer-wrap">
       <!-- 顶部年级下拉 -->
       <div class="top-select-wrap">
@@ -69,6 +71,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/teacherManage/Teachergrouping.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="group-manage-page">
       <!-- 顶部操作栏 -->
       <div class="top-header">
@@ -136,6 +138,8 @@
       <user-check ref="userCheck" :treeData="treeData" :userids="userids" @change="v => (userids = v)" @on-submit="submit" :isDisabled="isAddto" />
       <user-check ref="userCheck2" :treeData="treeData" :userids="userids2" @change="v => (userids2 = v)" @on-submit="submit2" :isDisabled="isAddto" />
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/teacherManage/Teachertransfer.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="page-wrap">
     <!-- 顶部搜索区域 -->
     <div class="top-search-bar">
@@ -39,6 +41,8 @@
       ></Page>
     </div>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/teacherManage/teacherinfo.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="outer-wrap">
     <div class="page-flex-layout">
       <!-- 左侧分组树形栏 -->
@@ -325,6 +327,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/teacherManage/teachseeting.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="teach-manage-page">
     <!-- 顶部筛选栏 -->
     <div class="top-filter-bar">
@@ -93,6 +95,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/zhuanruinfo.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
     <div class="teacher-transfer-wrap">
       <!-- 顶部筛选栏 -->
       <div class="top-filter-bar">
@@ -73,6 +75,8 @@
         </div></template>
       </Modal>
     </div>
+        </div>
+    </div>
 </template>
   
   <script>

src/views/zhuanruinfostu/Christianity.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="student-move-wrap">
     <!-- 顶部筛选栏 -->
     <div class="top-filter-bar">
@@ -80,6 +82,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>

src/views/zhuanruinfostu/HigherEducation.vue

@@ -1,4 +1,6 @@
 <template>
+    <div class="page-wrapper yh-fill">
+        <div class="main-container">
   <div class="student-move-wrap">
     <!-- 顶部筛选栏 -->
     <div class="top-filter-bar">
@@ -91,6 +93,8 @@
       </div></template>
     </Modal>
   </div>
+        </div>
+    </div>
 </template>
 
 <script>