web-资源中心修改

schoolNewsWeb/src/components/base/FloatingSidebar.vue

@@ -8,7 +8,10 @@
           v-for="menu in menus"
           :key="menu.menuID || menu.url"
           class="sidebar-item"
-          :class="{ active: isActive(menu) }"
+          :class="{ 
+            active: isActive(menu),
+            'theme-resource': props.theme === 'resource'
+          }"
           @click="handleClick(menu)"
         >
           <div class="sidebar-link">
@@ -28,9 +31,12 @@ import { useRouter, useRoute } from 'vue-router';
 interface Props {
   menus: SysMenu[];
   activePath?: string;
+  theme?: 'default' | 'resource'; // 新增主题属性
 }
 
-const props = withDefaults(defineProps<Props>(), {});
+const props = withDefaults(defineProps<Props>(), {
+  theme: 'default'
+});
 
 // Emits
 const emit = defineEmits<{
@@ -113,7 +119,7 @@ function handleClick(menu: SysMenu) {
   display: flex;
   align-items: center;
   cursor: pointer;
-  transition: all 0.2s;
+  transition: all 0.3s;
 
   &::before {
     content: '';
@@ -142,6 +148,42 @@ function handleClick(menu: SysMenu) {
       color: #C62828;
     }
   }
+  
+  // Resource theme - 红色背景高亮
+  &.theme-resource {
+    padding: 0 10px;
+    
+    &:hover {
+      background: rgba(198, 40, 40, 0.05);
+    }
+    
+    &.active {
+      background: #C62828;
+      border-radius: 8px;
+      margin: 5px 10px;
+      height: 44px;
+      
+      &::before {
+        display: none; // 隐藏左侧指示条
+      }
+      
+      .sidebar-link {
+        color: #FFFFFF;
+      }
+      
+      &::after {
+        content: '';
+        position: absolute;
+        right: -103px;
+        top: 3px;
+        width: 48.53px;
+        height: 50.54px;
+        background: linear-gradient(134deg, rgba(255, 255, 255, 1) 26%, rgba(255, 255, 255, 0) 86%);
+        opacity: 0.23;
+        pointer-events: none;
+      }
+    }
+  }
 }
 
 .sidebar-link {
@@ -156,12 +198,16 @@ function handleClick(menu: SysMenu) {
   font-weight: 500;
   font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
   line-height: 1.5;
-  transition: color 0.2s;
+  transition: color 0.3s;
   user-select: none;
 
   .link-text {
     text-align: center;
   }
+  
+  .theme-resource & {
+    margin-left: 32px; // Resource theme 文字左移
+  }
 }
 
 /* 响应式设计 */