feat：增加 .page-container 全局样式，并替换相关的 vue 界面

2025-12-15 11:34:04 +08:00
parent ce3cc228e5
commit 7235595361
38 changed files with 45 additions and 39 deletions
--- a/src/pages-bpm/processInstance/create/index.vue
+++ b/src/pages-bpm/processInstance/create/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="发起申请"
--- a/src/pages-bpm/processInstance/detail/audit/index.vue
+++ b/src/pages-bpm/processInstance/detail/audit/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- TODO @芋艿：还有一些细节，在审批通过没搞完！ -->
    <!-- 顶部导航栏 -->
    <wd-navbar
--- a/src/pages-bpm/processInstance/detail/index.vue
+++ b/src/pages-bpm/processInstance/detail/index.vue
@@ -1,6 +1,6 @@
 <template>
  <!-- TODO @芋艿：功能待 review；先从老版本迁移过来！ -->
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="审批详情"
--- a/src/pages-infra/apiAccessLog/detail/index.vue
+++ b/src/pages-infra/apiAccessLog/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="访问日志详情"
--- a/src/pages-infra/apiAccessLog/index.vue
+++ b/src/pages-infra/apiAccessLog/index.vue
@@ -1,6 +1,6 @@
 <template>
  <!-- TODO @芋艿：【优化：全局样式】后续要全局样式么 -->
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="API 访问日志"
--- a/src/pages-infra/apiErrorLog/detail/index.vue
+++ b/src/pages-infra/apiErrorLog/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="错误日志详情"
--- a/src/pages-infra/apiErrorLog/index.vue
+++ b/src/pages-infra/apiErrorLog/index.vue
@@ -1,6 +1,6 @@
 <template>
  <!-- TODO @芋艿：【优化：全局样式】后续要全局样式么 -->
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="API 错误日志"
--- a/src/pages-infra/webSocket/index.vue
+++ b/src/pages-infra/webSocket/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="WebSocket 测试"
--- a/src/pages-system/dept/detail/index.vue
+++ b/src/pages-system/dept/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="部门详情"
--- a/src/pages-system/dept/form/index.vue
+++ b/src/pages-system/dept/form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      :title="getTitle"
--- a/src/pages-system/dept/index.vue
+++ b/src/pages-system/dept/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="部门管理"
--- a/src/pages-system/menu/detail/index.vue
+++ b/src/pages-system/menu/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="菜单详情"
--- a/src/pages-system/menu/form/index.vue
+++ b/src/pages-system/menu/form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      :title="getTitle"
--- a/src/pages-system/menu/index.vue
+++ b/src/pages-system/menu/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="菜单管理"
--- a/src/pages-system/post/detail/index.vue
+++ b/src/pages-system/post/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="岗位详情"
--- a/src/pages-system/post/form/index.vue
+++ b/src/pages-system/post/form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      :title="getTitle"
--- a/src/pages-system/post/index.vue
+++ b/src/pages-system/post/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="岗位管理"
--- a/src/pages-system/role/detail/index.vue
+++ b/src/pages-system/role/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="角色详情"
--- a/src/pages-system/role/form/index.vue
+++ b/src/pages-system/role/form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      :title="getTitle"
--- a/src/pages-system/role/index.vue
+++ b/src/pages-system/role/index.vue
@@ -1,6 +1,5 @@
 <template>
-  <!-- TODO @芋艿：【优化：全局样式】后续要全局样式么 -->
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="角色管理"
--- a/src/pages-system/user/detail/index.vue
+++ b/src/pages-system/user/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="用户详情"
--- a/src/pages-system/user/form/index.vue
+++ b/src/pages-system/user/form/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      :title="getTitle"
--- a/src/pages-system/user/index.vue
+++ b/src/pages-system/user/index.vue
@@ -1,6 +1,5 @@
 <template>
-  <!-- TODO @芋艿：【优化：全局样式】后续要全局样式么 -->
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="用户管理"
--- a/src/pages/bpm/index.vue
+++ b/src/pages/bpm/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="审批"
--- a/src/pages/contact/index.vue
+++ b/src/pages/contact/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="通讯录"
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-#f5f5f5">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="工作台"
--- a/src/pages/index/settings/index.vue
+++ b/src/pages/index/settings/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-#f5f5f5">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="编辑工作台"
--- a/src/pages/message/index.vue
+++ b/src/pages/message/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <!-- TODO @AI：待修复 -->
    <wd-navbar
--- a/src/pages/user/contact/index.vue
+++ b/src/pages/user/contact/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-gray-100">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="联系客服"
--- a/src/pages/user/faq/index.vue
+++ b/src/pages/user/faq/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen flex flex-col bg-white">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="常见问题"
--- a/src/pages/user/feedback/index.vue
+++ b/src/pages/user/feedback/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="意见反馈"
--- a/src/pages/user/index.vue
+++ b/src/pages/user/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部背景区域 -->
    <view class="header-bg h-120rpx w-full flex items-center justify-center" />

--- a/src/pages/user/profile/index.vue
+++ b/src/pages/user/profile/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="个人资料"
--- a/src/pages/user/security/index.vue
+++ b/src/pages/user/security/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="账号安全"
--- a/src/pages/user/settings/agreement/index.vue
+++ b/src/pages/user/settings/agreement/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-white">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="用户协议"
--- a/src/pages/user/settings/index.vue
+++ b/src/pages/user/settings/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-[#f5f5f5]">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="应用设置"
--- a/src/pages/user/settings/privacy/index.vue
+++ b/src/pages/user/settings/privacy/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="min-h-screen bg-white">
+  <view class="page-container">
    <!-- 顶部导航栏 -->
    <wd-navbar
      title="隐私协议"
--- a/src/style/index.scss
+++ b/src/style/index.scss
@@ -9,6 +9,14 @@
  color: red;
 }

+// ==================== 全局公共样式 ====================
+
+// 页面容器：灰色背景 + 最小全屏高度
+.page-container {
+  @apply min-h-screen;
+  background-color: #f5f5f5;
+}
+
 :root,
 page {
  // 修改按主题色