主题切换

src/api/user.ts

@@ -198,6 +198,13 @@ export const getSRMNotifyMessageList = async (id) => {
   });
 };
 
+// SRM 标为已读
+export const markSRMNotifyMessageRead = async (id) => {
+  return await request.get({
+    url: "/admin-api/portal/todo/srm/notice/readed?workcode=" + id,
+  });
+};
+
 // 首页公告
 export const getNotices = async (params) => {
   return await request.get({

src/assets/style/main.css

@@ -8,11 +8,19 @@
   --bg-card: #ffffff;
   --bg-total-card: transparent;
   --bg-table:#f5f7fa;
+  --bg-table-head:#e9f7ff;
   --bg-tab:#e4e7ed;
   --bg-flow-card:#9ecdf2;
   --color-skeleton: #cfd2f4;
   --bg-flow-tab: transparent;
   --bg-flow-item: #5e98f8;
+  --bg-drive-tab:linear-gradient(
+    360deg,
+    rgb(9, 67, 225, .3) 0%,
+    rgba(10, 65, 227, 0.5) 10%,
+    rgb(10, 37, 119, .5) 40%,
+    rgba(0, 12, 51, .5) 80%
+  ) !important;
   --tab-text: #303133;
   --text-primary: #303133;
   --text-primary-down: #dcdfe6;
@@ -69,7 +77,15 @@
     #69b5f8 70%,
     #5887f8 100%
   );
+  --bg-drive-tab:linear-gradient(
+    360deg,
+    #003be0 0%,
+    rgba(10, 65, 227, 0.6) 10%,
+    #001c71 40%,
+    #000c33 80%
+  ) !important;
   --bg-table:#091126;
+  --bg-table-head:#091126;
   --color-skeleton:#0a193d;
   --bg-tab:#070e24;
   --tab-text: rgba(220, 229, 255, 0.78);

src/components/home/header.vue

@@ -89,7 +89,6 @@
         <button
           @click="themeStore.toggleTheme()"
           class="p-2 rounded-full mt-1 hover:bg-gray-500/60 transition-colors cursor-pointer"
-          title="切换主题"
         >
           <Icon v-if="themeStore.theme === 'light'" icon="ri:moon-fill" />
           <Icon v-else icon="ri:sun-fill" />
@@ -98,7 +97,9 @@
         <el-dropdown trigger="click" placement="bottom-end">
           <div class="flex items-center gap-2 cursor-pointer pr-6 pt-1">
             <el-badge
-              :value="unreadMessageCount + oaUnreadCount"
+              :value="
+                unreadMessageCount + oaUnreadCount + Number(unreadSRMCount)
+              "
               class="item"
               v-if="hasUnreadMessages || oaHasUnreadCount"
             >
@@ -229,7 +230,7 @@
                         <span
                           v-if="hasUnreadSRMCount"
                           class="cursor-pointer text-blue-500"
-                          @click="markAllAsRead"
+                          @click="markSRMAsRead"
                           >全部标为已读</span
                         >
                       </div>
@@ -247,7 +248,7 @@
                               v-if="item.status === '0'"
                               class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
                             ></span
-                            >{{ item.contentMajor }}
+                            >{{ item.title }}
                           </p>
                           <p class="message-desc">
                             {{ timestampToDateTime(item.createTime) }}
@@ -306,7 +307,6 @@
         <button
           @click="themeStore.toggleTheme()"
           class="rounded-full relative top-1 right-4 hover:bg-gray-500/60 transition-colors cursor-pointer"
-          title="切换主题"
         >
           <Icon v-if="themeStore.theme === 'light'" icon="ri:moon-fill" />
           <Icon v-else icon="ri:sun-fill" />
@@ -314,7 +314,9 @@
         <el-dropdown trigger="click" placement="bottom-end">
           <div class="flex items-center gap-2 cursor-pointer pr-6 pt-1">
             <el-badge
-              :value="unreadMessageCount + oaUnreadCount"
+              :value="
+                unreadMessageCount + oaUnreadCount + Number(unreadSRMCount)
+              "
               class="item"
               v-if="hasUnreadMessages || oaHasUnreadCount"
             >
@@ -442,7 +444,7 @@
                         <span
                           v-if="hasUnreadSRMCount"
                           class="cursor-pointer text-blue-500"
-                          @click="markAllAsRead"
+                          @click="markSRMAsRead"
                           >全部标为已读</span
                         >
                       </div>
@@ -460,7 +462,7 @@
                               v-if="item.status === '0'"
                               class="w-2 h-2 bg-[#f56c6c] rounded-full text-var(--tab-text)!"
                             ></span
-                            >{{ item.contentMajor }}
+                            >{{ item.title }}
                           </p>
                           <p class="message-desc">
                             {{ timestampToDateTime(item.createTime) }}
@@ -606,6 +608,7 @@ import {
   markOAMessageAsRead,
   getSRMNotifyMessages,
   getSRMNotifyMessageList,
+  markSRMNotifyMessageRead,
 } from "@api/user";
 
 import {
@@ -798,7 +801,7 @@ function timestampToDateTime(timestamp) {
 const router = useRouter();
 const drawer = ref(false);
 
-// 全部标为已读
+// CRM标为已读
 const markAllAsRead = async () => {
   await markMessageAsRead(userStore.getUser.username);
   // 刷新消息列表
@@ -814,6 +817,13 @@ const oaMarkAllAsRead = async () => {
   oaMessagesList.value = messageList.filter((msg: any) => msg.status === "0");
 };
 
+// srm全部标为已读
+const markSRMAsRead = async () => {
+  await markSRMNotifyMessageRead(userStore.getUser.username);
+  const messageList = await getSRMNotifyMessageList(userStore.getUser.username);
+  srmMessageList.value = messageList.filter((msg: any) => msg.status === "0");
+};
+
 const goHome = () => {
   router.push({ path: "/" });
 };

src/views/drive/index.vue

@@ -17,7 +17,7 @@
         </div>
       </section>
 
-      <section class="drive-tabs px-10">
+      <section class="drive-tabs px-10 mt-2!">
         <button
           v-for="tab in tabs"
           :key="tab.value"
@@ -518,13 +518,7 @@ const openDrive = async (option: DriveCard) => {
 .drive-tab--active {
   color: #fff !important;
 
-  background: linear-gradient(
-    360deg,
-    #003be0 0%,
-    rgba(10, 65, 227, 0.6) 10%,
-    #001c71 40%,
-    #000c33 80%
-  ) !important;
+  background: var(--bg-drive-tab);
 
   padding-bottom: 22px;
   padding-top: 22px;

src/views/flow/crmDoneList.vue

@@ -3,10 +3,8 @@
     <Header />
 
     <div class="content-wrapper mt-15 max-w-[1200px] mx-auto">
-      <div
-        class="flex gap-5 items-center mb-4 bg-[#091126] py-2 pl-4 rounded-sm"
-      >
-        <p class="flex items-center text-white/90">
+      <div class="nav flex gap-5 items-center mb-4 py-2 pl-4 rounded-sm">
+        <p class="flex items-center text-var(--text-primary)">
           <Icon
             icon="mynaui:arrow-up-down"
             class="icon pr-1 h-8 w-8"
@@ -37,13 +35,10 @@
           element-loading-text="加载中..."
           :empty-text="loading ? '' : '暂无数据'"
           :header-cell-style="{
-            backgroundColor: '#091126',
-            color: '#b8bfd0',
+            backgroundColor: 'var(--bg-table-head) !important',
+            color: 'var(--text-primary)',
             fontWeight: '400',
           }"
-          :cell-style="{
-            color: 'black',
-          }"
         >
           <el-table-column
             type="index"
@@ -419,6 +414,94 @@ onMounted(async () => {
 </script>
 
 <style scoped>
+.todo-list {
+  --portal-text: #17345f;
+  --portal-text-muted: #5f6f83;
+  --portal-text-soft: #7f8fa6;
+  --portal-title: #163867;
+  --portal-subtitle: rgba(61, 92, 135, 0.86);
+  --portal-line: rgba(126, 156, 201, 0.24);
+  --portal-card: rgba(255, 255, 255, 0.82);
+  --portal-card-2: rgba(248, 251, 255, 0.94);
+  --portal-card-3: rgba(240, 246, 255, 0.88);
+  --portal-card-4: rgba(231, 239, 251, 0.92);
+  --portal-nav-bg: rgba(255, 255, 255, 0.72);
+  --portal-nav-hover: rgba(219, 232, 252, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.7);
+  --portal-input-hover: rgba(255, 255, 255, 0.92);
+  --portal-shadow: 0 18px 40px rgba(23, 52, 95, 0.12);
+  --portal-shadow-strong: 0 24px 60px rgba(23, 52, 95, 0.16);
+  --portal-accent: #245edb;
+  --portal-accent-2: #4e8cff;
+  --portal-accent-soft: rgba(36, 94, 219, 0.14);
+  --portal-todo-bg: rgba(242, 247, 255, 0.94);
+  --portal-todo-hover: rgba(228, 238, 252, 0.95);
+  --portal-number-todo: #e15a5a;
+  --portal-number-done: #2da04d;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(83, 126, 255, 0.14),
+      transparent 22%
+    ),
+    radial-gradient(
+      circle at 82% 20%,
+      rgba(71, 148, 255, 0.14),
+      transparent 20%
+    ),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(97, 142, 247, 0.12),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
+}
+
+:global([data-theme="dark"] .todo-list) {
+  --portal-text: #eaf1ff;
+  --portal-text-muted: rgba(234, 241, 255, 0.95);
+  --portal-text-soft: #8a9ab0;
+  --portal-title: #f4f7ff;
+  --portal-subtitle: rgba(188, 205, 255, 0.82);
+  --portal-line: rgba(97, 129, 206, 0.28);
+  --portal-card: rgba(10, 19, 43, 0.8);
+  --portal-card-2: rgba(12, 24, 52, 0.92);
+  --portal-card-3: rgba(17, 25, 48, 0.8);
+  --portal-card-4: rgba(15, 24, 45, 0.82);
+  --portal-nav-bg: rgba(10, 19, 43, 0.8);
+  --portal-nav-hover: rgba(28, 40, 72, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.08);
+  --portal-input-hover: rgba(255, 255, 255, 0.12);
+  --portal-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
+  --portal-shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.38);
+  --portal-accent: #6e7dff;
+  --portal-accent-2: #8d4dff;
+  --portal-accent-soft: rgba(110, 125, 255, 0.16);
+  --portal-todo-bg: #070e20;
+  --portal-todo-hover: rgba(28, 40, 72, 0.8);
+  --portal-number-todo: #f56c6c;
+  --portal-number-done: #ffffff;
+  --bg-table: #091126;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(79, 82, 221, 0.34),
+      transparent 22%
+    ),
+    radial-gradient(circle at 82% 20%, rgba(28, 95, 255, 0.2), transparent 20%),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(103, 46, 255, 0.16),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #040814 0%, #060d1d 46%, #040814 100%);
+}
+
+.nav {
+  background-color: var(--bg-table);
+}
 .todo-list {
   min-height: 100vh;
   display: flex;
@@ -484,44 +567,44 @@ onMounted(async () => {
 }
 
 :deep(.el-table) {
-  background-color: #091126 !important;
-  color: white !important;
+  background-color: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.table-wrapper) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
 }
 
 :deep(.el-table__header-wrapper thead) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__header-wrapper .el-table__header) {
   border-bottom: none;
 }
 :deep(.el-table__inner-wrapper) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 :deep(.el-table__body-wrapper .el-table__row) {
-  background: #091126;
-  color: white !important;
+  background: var(--bg-table);
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__body-wrapper .el-table__row .hover-row) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
-  background: #091126 !important;
-  color: white !important;
-  border-bottom: 1px solid #313849;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+  border-bottom: 1px solid var(--border-color) !important;
 }
 
 :deep(.el-loading-mask) {
-  background-color: rgba(9, 17, 38, 0.8) !important; /* 半透明深色遮罩 */
+  background-color: var(--bg-table) !important; /* 半透明深色遮罩 */
 }
 
 :deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
@@ -529,20 +612,21 @@ onMounted(async () => {
 }
 
 :deep(.el-pagination is-background) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
 }
 
 :deep(.el-pagination .el-pager li) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
-:deep(.el-pagination .el-pager li.active) {
-  background: #2d8cf0 !important;
+:deep(.el-pagination .el-pager li.is-active) {
+  /* background: #2d8cf0 !important; */
+  color: var(--portal-accent) !important;
 }
 
 :deep(.el-select .el-select__wrapper) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
   border: 1px solid #313849 !important;
   outline: none !important;
 }
@@ -553,34 +637,34 @@ onMounted(async () => {
 }
 
 :deep(.btn-next) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
 :deep(.btn-prev) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
 /* 下拉菜单弹出层的背景 */
 :deep(.el-select-dropdown) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   border: 1px solid #313849 !important;
 }
 
 /* 下拉菜单项 */
 :deep(.el-select-dropdown__item) {
-  color: #fff !important;
+  color: var(--bg-table) !important;
 }
 
 :deep(.el-select-dropdown__item.hover),
 :deep(.el-select-dropdown__item:hover) {
-  background-color: #111a35 !important; /* 悬停深色背景 */
+  background-color: var(--bg-table) !important; /* 悬停深色背景 */
 }
 
 /* 关键：修复下拉选择框 (PageSize) 的白色边框/背景 */
 :deep(.el-pagination .el-select .el-select__wrapper) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   box-shadow: none !important; /* 去掉可能的阴影 */
   border: 1px solid #313849 !important; /* 统一边框颜色 */
 }
@@ -594,12 +678,12 @@ onMounted(async () => {
 
 /* 通用输入框边框修复 (如果其他地方也有) */
 :deep(.el-input__wrapper) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   box-shadow: none !important; /* 去掉默认的白色/灰色阴影边框 */
   border: 1px solid #313849 !important;
 }
 
 :deep(.el-input__inner) {
-  color: #fff !important;
+  color: var(--bg-primary) !important;
 }
 </style>

src/views/flow/crmTodoList.vue

@@ -3,10 +3,8 @@
     <Header />
 
     <div class="content-wrapper mt-15 max-w-[1200px] mx-auto">
-      <div
-        class="flex gap-5 items-center mb-4 bg-[#091126] py-2 pl-4 rounded-sm"
-      >
-        <p class="flex items-center text-white/90">
+      <div class="nav flex gap-5 items-center mb-4 py-2 pl-4 rounded-sm">
+        <p class="flex items-center text-var(--text-primary)">
           <Icon
             icon="mynaui:arrow-up-down"
             class="icon pr-1 h-6 w-6"
@@ -38,13 +36,10 @@
           element-loading-text="加载中..."
           :empty-text="loading ? '' : '暂无数据'"
           :header-cell-style="{
-            backgroundColor: '#091126',
-            color: '#b8bfd0',
+            backgroundColor: 'var(--bg-table-head) !important',
+            color: 'var(--text-primary)',
             fontWeight: '400',
           }"
-          :cell-style="{
-            color: 'black',
-          }"
         >
           <el-table-column
             type="index"
@@ -420,6 +415,94 @@ onMounted(async () => {
 </script>
 
 <style scoped>
+.todo-list {
+  --portal-text: #17345f;
+  --portal-text-muted: #5f6f83;
+  --portal-text-soft: #7f8fa6;
+  --portal-title: #163867;
+  --portal-subtitle: rgba(61, 92, 135, 0.86);
+  --portal-line: rgba(126, 156, 201, 0.24);
+  --portal-card: rgba(255, 255, 255, 0.82);
+  --portal-card-2: rgba(248, 251, 255, 0.94);
+  --portal-card-3: rgba(240, 246, 255, 0.88);
+  --portal-card-4: rgba(231, 239, 251, 0.92);
+  --portal-nav-bg: rgba(255, 255, 255, 0.72);
+  --portal-nav-hover: rgba(219, 232, 252, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.7);
+  --portal-input-hover: rgba(255, 255, 255, 0.92);
+  --portal-shadow: 0 18px 40px rgba(23, 52, 95, 0.12);
+  --portal-shadow-strong: 0 24px 60px rgba(23, 52, 95, 0.16);
+  --portal-accent: #245edb;
+  --portal-accent-2: #4e8cff;
+  --portal-accent-soft: rgba(36, 94, 219, 0.14);
+  --portal-todo-bg: rgba(242, 247, 255, 0.94);
+  --portal-todo-hover: rgba(228, 238, 252, 0.95);
+  --portal-number-todo: #e15a5a;
+  --portal-number-done: #2da04d;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(83, 126, 255, 0.14),
+      transparent 22%
+    ),
+    radial-gradient(
+      circle at 82% 20%,
+      rgba(71, 148, 255, 0.14),
+      transparent 20%
+    ),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(97, 142, 247, 0.12),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
+}
+
+:global([data-theme="dark"] .todo-list) {
+  --portal-text: #eaf1ff;
+  --portal-text-muted: rgba(234, 241, 255, 0.95);
+  --portal-text-soft: #8a9ab0;
+  --portal-title: #f4f7ff;
+  --portal-subtitle: rgba(188, 205, 255, 0.82);
+  --portal-line: rgba(97, 129, 206, 0.28);
+  --portal-card: rgba(10, 19, 43, 0.8);
+  --portal-card-2: rgba(12, 24, 52, 0.92);
+  --portal-card-3: rgba(17, 25, 48, 0.8);
+  --portal-card-4: rgba(15, 24, 45, 0.82);
+  --portal-nav-bg: rgba(10, 19, 43, 0.8);
+  --portal-nav-hover: rgba(28, 40, 72, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.08);
+  --portal-input-hover: rgba(255, 255, 255, 0.12);
+  --portal-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
+  --portal-shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.38);
+  --portal-accent: #6e7dff;
+  --portal-accent-2: #8d4dff;
+  --portal-accent-soft: rgba(110, 125, 255, 0.16);
+  --portal-todo-bg: #070e20;
+  --portal-todo-hover: rgba(28, 40, 72, 0.8);
+  --portal-number-todo: #f56c6c;
+  --portal-number-done: #ffffff;
+  --bg-table: #091126;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(79, 82, 221, 0.34),
+      transparent 22%
+    ),
+    radial-gradient(circle at 82% 20%, rgba(28, 95, 255, 0.2), transparent 20%),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(103, 46, 255, 0.16),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #040814 0%, #060d1d 46%, #040814 100%);
+}
+
+.nav {
+  background-color: var(--bg-table);
+}
 .todo-list {
   min-height: 100vh;
   display: flex;
@@ -485,44 +568,44 @@ onMounted(async () => {
 }
 
 :deep(.el-table) {
-  background-color: #091126 !important;
-  color: white !important;
+  background-color: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.table-wrapper) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
 }
 
 :deep(.el-table__header-wrapper thead) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__header-wrapper .el-table__header) {
   border-bottom: none;
 }
 :deep(.el-table__inner-wrapper) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 :deep(.el-table__body-wrapper .el-table__row) {
-  background: #091126;
-  color: white !important;
+  background: var(--bg-table);
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__body-wrapper .el-table__row .hover-row) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
 }
 
 :deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
-  background: #091126 !important;
-  color: white !important;
-  border-bottom: 1px solid #313849;
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+  border-bottom: 1px solid var(--border-color) !important;
 }
 
 :deep(.el-loading-mask) {
-  background-color: rgba(9, 17, 38, 0.8) !important; /* 半透明深色遮罩 */
+  background-color: var(--bg-table) !important; /* 半透明深色遮罩 */
 }
 
 :deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
@@ -530,20 +613,21 @@ onMounted(async () => {
 }
 
 :deep(.el-pagination is-background) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
 }
 
 :deep(.el-pagination .el-pager li) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
-:deep(.el-pagination .el-pager li.active) {
-  background: #2d8cf0 !important;
+:deep(.el-pagination .el-pager li.is-active) {
+  /* background: #2d8cf0 !important; */
+  color: var(--portal-accent) !important;
 }
 
 :deep(.el-select .el-select__wrapper) {
-  background: #091126 !important;
+  background: var(--bg-table) !important;
   border: 1px solid #313849 !important;
   outline: none !important;
 }
@@ -554,34 +638,34 @@ onMounted(async () => {
 }
 
 :deep(.btn-next) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
 :deep(.btn-prev) {
-  background: #091126 !important;
-  color: white !important;
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
 }
 
 /* 下拉菜单弹出层的背景 */
 :deep(.el-select-dropdown) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   border: 1px solid #313849 !important;
 }
 
 /* 下拉菜单项 */
 :deep(.el-select-dropdown__item) {
-  color: #fff !important;
+  color: var(--bg-table) !important;
 }
 
 :deep(.el-select-dropdown__item.hover),
 :deep(.el-select-dropdown__item:hover) {
-  background-color: #111a35 !important; /* 悬停深色背景 */
+  background-color: var(--bg-table) !important; /* 悬停深色背景 */
 }
 
 /* 关键：修复下拉选择框 (PageSize) 的白色边框/背景 */
 :deep(.el-pagination .el-select .el-select__wrapper) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   box-shadow: none !important; /* 去掉可能的阴影 */
   border: 1px solid #313849 !important; /* 统一边框颜色 */
 }
@@ -595,12 +679,12 @@ onMounted(async () => {
 
 /* 通用输入框边框修复 (如果其他地方也有) */
 :deep(.el-input__wrapper) {
-  background-color: #091126 !important;
+  background-color: var(--bg-table) !important;
   box-shadow: none !important; /* 去掉默认的白色/灰色阴影边框 */
   border: 1px solid #313849 !important;
 }
 
 :deep(.el-input__inner) {
-  color: #fff !important;
+  color: var(--bg-primary) !important;
 }
 </style>

src/views/flow/oaDoneList.vue

@@ -36,7 +36,7 @@
           element-loading-text="加载中..."
           :empty-text="loading ? '' : '暂无数据'"
           :header-cell-style="{
-            backgroundColor: 'var(--bg-table)',
+            backgroundColor: 'var(--bg-table-head) !important',
             color: 'var(--text-primary)',
             fontWeight: '400',
           }"

src/views/flow/todoList.vue

@@ -36,7 +36,7 @@
           element-loading-text="加载中..."
           :empty-text="loading ? '' : '暂无数据'"
           :header-cell-style="{
-            backgroundColor: 'var(--bg-table)',
+            backgroundColor: 'var(--bg-table-head) !important',
             color: 'var(--text-primary)',
             fontWeight: '400',
           }"
@@ -440,12 +440,13 @@ onMounted(async () => {
 }
 
 :deep(.el-table__header-wrapper thead) {
-  background: var(--bg-table) !important;
+  background: var(--bg-table-head) !important;
   color: var(--text-primary) !important;
 }
 
 :deep(.el-table__header-wrapper .el-table__header) {
   border-bottom: none;
+  background: var(--bg-table-head) !important;
 }
 :deep(.el-table__inner-wrapper) {
   background: var(--bg-table) !important;

src/views/index.vue

@@ -1385,7 +1385,8 @@ onUnmounted(() => {
     ),
     linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
   background-image:
-    linear-gradient(rgba(245, 249, 255, 0.82), rgba(237, 244, 253, 0.92)),
+    /* linear-gradient(rgba(245, 249, 255, 0.82), rgba(237, 244, 253, 0.92)), */
+    linear-gradient(rgba(245, 249, 255, 0.9), rgba(218, 233, 251, 0.82)),
     url("../assets//images/bg666.png");
   background-position:
     center center,

src/views/news/index.vue

@@ -32,13 +32,10 @@
           :empty-text="loading ? '' : '暂无数据'"
           stripe
           :header-cell-style="{
-            backgroundColor: '#e9f7ff',
-            color: 'black',
+            backgroundColor: 'var(--bg-table-head) !important',
+            color: 'var(--text-primary)',
             fontWeight: '400',
           }"
-          :cell-style="{
-            color: 'black',
-          }"
         >
           <!-- 序号列 -->
           <el-table-column
@@ -86,7 +83,7 @@
           v-model:page-size="pagination.pageSize"
           :page-sizes="[10, 20, 50, 100]"
           :total="pagination.total"
-          layout="total, sizes, prev, pager, next, jumper"
+          layout="total, sizes, prev, pager, next"
           @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
         />
@@ -211,6 +208,111 @@ onMounted(() => {
 </script>
 
 <style scoped>
+.news-container {
+  --portal-text: #17345f;
+  --portal-text-muted: #5f6f83;
+  --portal-text-soft: #7f8fa6;
+  --portal-title: #163867;
+  --portal-subtitle: rgba(61, 92, 135, 0.86);
+  --portal-line: rgba(126, 156, 201, 0.24);
+  --portal-card: rgba(255, 255, 255, 0.82);
+  --portal-card-2: rgba(248, 251, 255, 0.94);
+  --portal-card-3: rgba(240, 246, 255, 0.88);
+  --portal-card-4: rgba(231, 239, 251, 0.92);
+  --portal-nav-bg: rgba(255, 255, 255, 0.72);
+  --portal-nav-hover: rgba(219, 232, 252, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.7);
+  --portal-input-hover: rgba(255, 255, 255, 0.92);
+  --portal-shadow: 0 18px 40px rgba(23, 52, 95, 0.12);
+  --portal-shadow-strong: 0 24px 60px rgba(23, 52, 95, 0.16);
+  --portal-accent: #245edb;
+  --portal-accent-2: #4e8cff;
+  --portal-accent-soft: rgba(36, 94, 219, 0.14);
+  --portal-todo-bg: rgba(242, 247, 255, 0.94);
+  --portal-todo-hover: rgba(228, 238, 252, 0.95);
+  --portal-number-todo: #e15a5a;
+  --portal-number-done: #2da04d;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(83, 126, 255, 0.14),
+      transparent 22%
+    ),
+    radial-gradient(
+      circle at 82% 20%,
+      rgba(71, 148, 255, 0.14),
+      transparent 20%
+    ),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(97, 142, 247, 0.12),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
+}
+
+:global([data-theme="dark"] .news-container) {
+  --portal-text: #eaf1ff;
+  --portal-text-muted: rgba(234, 241, 255, 0.95);
+  --portal-text-soft: #8a9ab0;
+  --portal-title: #f4f7ff;
+  --portal-subtitle: rgba(188, 205, 255, 0.82);
+  --portal-line: rgba(97, 129, 206, 0.28);
+  --portal-card: rgba(10, 19, 43, 0.8);
+  --portal-card-2: rgba(12, 24, 52, 0.92);
+  --portal-card-3: rgba(17, 25, 48, 0.8);
+  --portal-card-4: rgba(15, 24, 45, 0.82);
+  --portal-nav-bg: rgba(10, 19, 43, 0.8);
+  --portal-nav-hover: rgba(28, 40, 72, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.08);
+  --portal-input-hover: rgba(255, 255, 255, 0.12);
+  --portal-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
+  --portal-shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.38);
+  --portal-accent: #6e7dff;
+  --portal-accent-2: #8d4dff;
+  --portal-accent-soft: rgba(110, 125, 255, 0.16);
+  --portal-todo-bg: #070e20;
+  --portal-todo-hover: rgba(28, 40, 72, 0.8);
+  --portal-number-todo: #f56c6c;
+  --portal-number-done: #ffffff;
+  --bg-table: #091126;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(79, 82, 221, 0.34),
+      transparent 22%
+    ),
+    radial-gradient(circle at 82% 20%, rgba(28, 95, 255, 0.2), transparent 20%),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(103, 46, 255, 0.16),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #040814 0%, #060d1d 46%, #040814 100%);
+}
+
+.nav {
+  background-color: var(--bg-table);
+}
+.todo-list {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+.content {
+  padding: 16px 20px;
+  margin-top: 100px;
+}
+
+.pagination-wrap {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+}
+
 .news-container {
   min-height: 100vh;
   display: flex;
@@ -229,11 +331,8 @@ onMounted(() => {
 
 .page-title {
   margin-bottom: 20px;
-  color: #303133;
   border-left: 5px solid #409eff;
   padding-left: 10px;
-  display: flex;
-  gap: 20px;
 }
 
 .table-wrapper {
@@ -245,7 +344,7 @@ onMounted(() => {
 
 .table-title {
   font-weight: 500;
-  color: #303133;
+  /* color: #303133; */
 }
 
 .table-summary {
@@ -256,7 +355,128 @@ onMounted(() => {
 .pagination-container {
   display: flex;
   justify-content: center;
-  margin-top: 10px;
+  margin-top: 0px;
   padding: 20px 0;
 }
+
+:deep(.el-table) {
+  background-color: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.table-wrapper) {
+  background: var(--bg-table) !important;
+}
+
+:deep(.el-table__header-wrapper thead) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__header-wrapper .el-table__header) {
+  border-bottom: none;
+}
+:deep(.el-table__inner-wrapper) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+:deep(.el-table__body-wrapper .el-table__row) {
+  background: var(--bg-table);
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__body-wrapper .el-table__row .hover-row) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+  border-bottom: 1px solid var(--border-color) !important;
+}
+
+:deep(.el-loading-mask) {
+  background-color: var(--bg-table) !important; /* 半透明深色遮罩 */
+}
+
+:deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
+  border-bottom: 1px solid #313849;
+}
+
+:deep(.el-pagination is-background) {
+  background: var(--bg-table) !important;
+}
+
+:deep(.el-pagination .el-pager li) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+:deep(.el-pagination .el-pager li.is-active) {
+  /* background: #2d8cf0 !important; */
+  color: var(--portal-accent) !important;
+}
+
+:deep(.el-select .el-select__wrapper) {
+  background: var(--bg-table) !important;
+  border: 1px solid #313849 !important;
+  outline: none !important;
+}
+
+:deep(.el-input) {
+  border: 1px solid #313849 !important;
+  outline: none !important;
+}
+
+:deep(.btn-next) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+:deep(.btn-prev) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+/* 下拉菜单弹出层的背景 */
+:deep(.el-select-dropdown) {
+  background-color: var(--bg-table) !important;
+  border: 1px solid #313849 !important;
+}
+
+/* 下拉菜单项 */
+:deep(.el-select-dropdown__item) {
+  color: var(--bg-table) !important;
+}
+
+:deep(.el-select-dropdown__item.hover),
+:deep(.el-select-dropdown__item:hover) {
+  background-color: var(--bg-table) !important; /* 悬停深色背景 */
+}
+
+/* 关键：修复下拉选择框 (PageSize) 的白色边框/背景 */
+:deep(.el-pagination .el-select .el-select__wrapper) {
+  background-color: var(--bg-table) !important;
+  box-shadow: none !important; /* 去掉可能的阴影 */
+  border: 1px solid #313849 !important; /* 统一边框颜色 */
+}
+
+/* 去掉聚焦时的白色/蓝色轮廓 */
+:deep(.el-pagination .el-select .el-select__wrapper.is-focused),
+:deep(.el-pagination .el-select .el-select__wrapper:hover) {
+  box-shadow: none !important;
+  border-color: #409eff !important; /* 聚焦时变为主题蓝，或者保持 #313849 */
+}
+
+/* 通用输入框边框修复 (如果其他地方也有) */
+:deep(.el-input__wrapper) {
+  background-color: var(--bg-table) !important;
+  box-shadow: none !important; /* 去掉默认的白色/灰色阴影边框 */
+  border: 1px solid #313849 !important;
+}
+
+:deep(.el-input__inner) {
+  color: var(--bg-primary) !important;
+}
 </style>

src/views/notices/index.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="news-container">
+  <div class="todo-list">
     <Header />
 
     <div class="content-wrapper mt-15 max-w-[1200px] mx-auto">
-      <h2 class="page-title">
+      <h2 class="page-title text-var(--text-primary)! flex items-center gap-2">
         {{ route.query.tabKey === "notice" ? "通知公告" : "红头文件" }}
 
         <el-button
@@ -32,13 +32,10 @@
           :empty-text="loading ? '' : '暂无数据'"
           stripe
           :header-cell-style="{
-            backgroundColor: '#e9f7ff',
-            color: 'black',
+            backgroundColor: 'var(--bg-table-head) !important',
+            color: 'var(--text-primary)',
             fontWeight: '400',
           }"
-          :cell-style="{
-            color: 'black',
-          }"
         >
           <!-- 序号列 -->
           <el-table-column
@@ -86,7 +83,7 @@
           v-model:page-size="pagination.pageSize"
           :page-sizes="[10, 20, 50, 100]"
           :total="pagination.total"
-          layout="total, sizes, prev, pager, next, jumper"
+          layout="total, sizes, prev, pager, next"
           @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
         />
@@ -214,6 +211,111 @@ onMounted(() => {
 </script>
 
 <style scoped>
+.todo-list {
+  --portal-text: #17345f;
+  --portal-text-muted: #5f6f83;
+  --portal-text-soft: #7f8fa6;
+  --portal-title: #163867;
+  --portal-subtitle: rgba(61, 92, 135, 0.86);
+  --portal-line: rgba(126, 156, 201, 0.24);
+  --portal-card: rgba(255, 255, 255, 0.82);
+  --portal-card-2: rgba(248, 251, 255, 0.94);
+  --portal-card-3: rgba(240, 246, 255, 0.88);
+  --portal-card-4: rgba(231, 239, 251, 0.92);
+  --portal-nav-bg: rgba(255, 255, 255, 0.72);
+  --portal-nav-hover: rgba(219, 232, 252, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.7);
+  --portal-input-hover: rgba(255, 255, 255, 0.92);
+  --portal-shadow: 0 18px 40px rgba(23, 52, 95, 0.12);
+  --portal-shadow-strong: 0 24px 60px rgba(23, 52, 95, 0.16);
+  --portal-accent: #245edb;
+  --portal-accent-2: #4e8cff;
+  --portal-accent-soft: rgba(36, 94, 219, 0.14);
+  --portal-todo-bg: rgba(242, 247, 255, 0.94);
+  --portal-todo-hover: rgba(228, 238, 252, 0.95);
+  --portal-number-todo: #e15a5a;
+  --portal-number-done: #2da04d;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(83, 126, 255, 0.14),
+      transparent 22%
+    ),
+    radial-gradient(
+      circle at 82% 20%,
+      rgba(71, 148, 255, 0.14),
+      transparent 20%
+    ),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(97, 142, 247, 0.12),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #eef3f9 0%, #f7faff 46%, #eef3f9 100%);
+}
+
+:global([data-theme="dark"] .todo-list) {
+  --portal-text: #eaf1ff;
+  --portal-text-muted: rgba(234, 241, 255, 0.95);
+  --portal-text-soft: #8a9ab0;
+  --portal-title: #f4f7ff;
+  --portal-subtitle: rgba(188, 205, 255, 0.82);
+  --portal-line: rgba(97, 129, 206, 0.28);
+  --portal-card: rgba(10, 19, 43, 0.8);
+  --portal-card-2: rgba(12, 24, 52, 0.92);
+  --portal-card-3: rgba(17, 25, 48, 0.8);
+  --portal-card-4: rgba(15, 24, 45, 0.82);
+  --portal-nav-bg: rgba(10, 19, 43, 0.8);
+  --portal-nav-hover: rgba(28, 40, 72, 0.8);
+  --portal-input-bg: rgba(255, 255, 255, 0.08);
+  --portal-input-hover: rgba(255, 255, 255, 0.12);
+  --portal-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
+  --portal-shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.38);
+  --portal-accent: #6e7dff;
+  --portal-accent-2: #8d4dff;
+  --portal-accent-soft: rgba(110, 125, 255, 0.16);
+  --portal-todo-bg: #070e20;
+  --portal-todo-hover: rgba(28, 40, 72, 0.8);
+  --portal-number-todo: #f56c6c;
+  --portal-number-done: #ffffff;
+  --bg-table: #091126;
+  color: var(--portal-text);
+  background:
+    radial-gradient(
+      circle at 18% 12%,
+      rgba(79, 82, 221, 0.34),
+      transparent 22%
+    ),
+    radial-gradient(circle at 82% 20%, rgba(28, 95, 255, 0.2), transparent 20%),
+    radial-gradient(
+      circle at 50% 100%,
+      rgba(103, 46, 255, 0.16),
+      transparent 28%
+    ),
+    linear-gradient(180deg, #040814 0%, #060d1d 46%, #040814 100%);
+}
+
+.nav {
+  background-color: var(--bg-table);
+}
+.todo-list {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+.content {
+  padding: 16px 20px;
+  margin-top: 100px;
+}
+
+.pagination-wrap {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+}
+
 .news-container {
   min-height: 100vh;
   display: flex;
@@ -232,11 +334,8 @@ onMounted(() => {
 
 .page-title {
   margin-bottom: 20px;
-  color: #303133;
   border-left: 5px solid #409eff;
   padding-left: 10px;
-  display: flex;
-  gap: 20px;
 }
 
 .table-wrapper {
@@ -248,7 +347,7 @@ onMounted(() => {
 
 .table-title {
   font-weight: 500;
-  color: #303133;
+  /* color: #303133; */
 }
 
 .table-summary {
@@ -259,7 +358,128 @@ onMounted(() => {
 .pagination-container {
   display: flex;
   justify-content: center;
-  margin-top: 10px;
+  margin-top: 0px;
   padding: 20px 0;
 }
+
+:deep(.el-table) {
+  background-color: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.table-wrapper) {
+  background: var(--bg-table) !important;
+}
+
+:deep(.el-table__header-wrapper thead) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__header-wrapper .el-table__header) {
+  border-bottom: none;
+}
+:deep(.el-table__inner-wrapper) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+:deep(.el-table__body-wrapper .el-table__row) {
+  background: var(--bg-table);
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__body-wrapper .el-table__row .hover-row) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+}
+
+:deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
+  background: var(--bg-table) !important;
+  color: var(--text-primary) !important;
+  border-bottom: 1px solid var(--border-color) !important;
+}
+
+:deep(.el-loading-mask) {
+  background-color: var(--bg-table) !important; /* 半透明深色遮罩 */
+}
+
+:deep(.el-table__body-wrapper .el-table__row .el-table__cell) {
+  border-bottom: 1px solid #313849;
+}
+
+:deep(.el-pagination is-background) {
+  background: var(--bg-table) !important;
+}
+
+:deep(.el-pagination .el-pager li) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+:deep(.el-pagination .el-pager li.is-active) {
+  /* background: #2d8cf0 !important; */
+  color: var(--portal-accent) !important;
+}
+
+:deep(.el-select .el-select__wrapper) {
+  background: var(--bg-table) !important;
+  border: 1px solid #313849 !important;
+  outline: none !important;
+}
+
+:deep(.el-input) {
+  border: 1px solid #313849 !important;
+  outline: none !important;
+}
+
+:deep(.btn-next) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+:deep(.btn-prev) {
+  background: var(--bg-table) !important;
+  color: var(--text-tertiary) !important;
+}
+
+/* 下拉菜单弹出层的背景 */
+:deep(.el-select-dropdown) {
+  background-color: var(--bg-table) !important;
+  border: 1px solid #313849 !important;
+}
+
+/* 下拉菜单项 */
+:deep(.el-select-dropdown__item) {
+  color: var(--bg-table) !important;
+}
+
+:deep(.el-select-dropdown__item.hover),
+:deep(.el-select-dropdown__item:hover) {
+  background-color: var(--bg-table) !important; /* 悬停深色背景 */
+}
+
+/* 关键：修复下拉选择框 (PageSize) 的白色边框/背景 */
+:deep(.el-pagination .el-select .el-select__wrapper) {
+  background-color: var(--bg-table) !important;
+  box-shadow: none !important; /* 去掉可能的阴影 */
+  border: 1px solid #313849 !important; /* 统一边框颜色 */
+}
+
+/* 去掉聚焦时的白色/蓝色轮廓 */
+:deep(.el-pagination .el-select .el-select__wrapper.is-focused),
+:deep(.el-pagination .el-select .el-select__wrapper:hover) {
+  box-shadow: none !important;
+  border-color: #409eff !important; /* 聚焦时变为主题蓝，或者保持 #313849 */
+}
+
+/* 通用输入框边框修复 (如果其他地方也有) */
+:deep(.el-input__wrapper) {
+  background-color: var(--bg-table) !important;
+  box-shadow: none !important; /* 去掉默认的白色/灰色阴影边框 */
+  border: 1px solid #313849 !important;
+}
+
+:deep(.el-input__inner) {
+  color: var(--bg-primary) !important;
+}
 </style>