yanghao 1 tydzień temu
rodzic
commit
3a8c7d6541

BIN
src/assets/images/flwoBanner_white.png


+ 8 - 0
src/assets/style/main.css

@@ -6,6 +6,7 @@
   --bg-primary: #e8f1f8;
   --bg-secondary: #f5f7fa;
   --bg-card: #ffffff;
+  --bg-total-card: transparent;
   --bg-table:#f5f7fa;
   --bg-tab:#e4e7ed;
   --tab-text: #303133;
@@ -16,6 +17,7 @@
   --border-color: #dcdfe6;
   
   
+  
   /* 品牌色 */
   --primary-color: #02409b;
   --primary-hover: #02307a;
@@ -34,6 +36,12 @@
   --bg-primary: #0b0f2e; /* 对应您代码中的 rgb(11, 15, 46) */
   --bg-secondary: #131928;
   --bg-card: #131928;
+   --bg-total-card: rgba(
+    5,
+    15,
+    46,
+    0.92
+  );
   --bg-table:#091126;
   --bg-tab:#070e24;
   --tab-text: rgba(220, 229, 255, 0.78);

+ 14 - 12
src/views/flow/index.vue

@@ -2,14 +2,17 @@
   <div class="ehr-page">
     <Header />
 
-    <div class="banner pt-2">
+    <div
+      class="banner pt-2"
+      :style="{ backgroundImage: `url(${currentBanner})` }"
+    >
       <section class="hero">
         <div class="hero-inner">
           <!-- 判断上下午 -->
           <h1 class="hero-title pt-5">
             {{ getGreeting() }},{{ userStore.getUser.nickname }}
           </h1>
-          <p class="hero-desc">
+          <p class="hero-desc text-var(--text-secondary)!">
             今天是 {{ new Date().toLocaleDateString() }}。您有
             {{ stats[0].number }}条流程待处理。
           </p>
@@ -278,6 +281,10 @@ const handleTabScroll = () => {
   updateArrowState();
 };
 
+const currentBanner = computed(() => {
+  return themeStore.theme === "light" ? banner_white : banner;
+});
+
 const getGreeting = () => {
   const hour = new Date().getHours();
   if (hour < 12) return "早上好";
@@ -839,11 +846,11 @@ onBeforeUnmount(() => {
   height: auto; /* 允许高度自适应,或者设置一个最小高度 */
   min-height: 300px;
   /* 设置背景图 */
-  background: url("../../assets//images/flwoBanner.png"); /* 或者使用变量 if defined in script */
+
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
-  border: 2px solid #061338;
+  /* border: 2px solid #061338; */
 }
 
 .hero {
@@ -870,7 +877,7 @@ onBeforeUnmount(() => {
 
 .hero-desc {
   font-size: 16px;
-  color: #a7a0b1;
+  /* color: #a7a0b1; */
   max-width: 720px;
   line-height: 1.8;
 }
@@ -1303,7 +1310,7 @@ onBeforeUnmount(() => {
   position: relative; /* 必须设置为 relative,作为伪元素的定位基准 */
   width: 300px;
   /* 内部背景保持深色半透明 */
-  background: rgba(5, 15, 46, 0.85);
+  /* background: rgba(5, 15, 46, 0.85); */
   border-radius: 16px;
   padding: 20px;
   backdrop-filter: blur(8px);
@@ -1345,12 +1352,7 @@ onBeforeUnmount(() => {
   content: "";
   position: absolute;
   inset: 1px; /* 这里控制边框宽度,2px 即边框宽 */
-  background: rgba(
-    5,
-    15,
-    46,
-    0.92
-  ); /* 与卡片背景一致,稍微不透明一点以遮盖旋转背景 */
+  background: var(--bg-total-card);
   border-radius: 14px; /* 比父容器小一点 */
   z-index: -1;
 }