更新全局样式

web/src/App.vue

@@ -12,8 +12,8 @@ const showFooter = computed(() => route.name !== 'doc') // 在文档页面不显
 
 <template>
   <div class="app-container">
-    <Header />
-    <!--<NewHeader />-->
+    <!--<Header />-->
+    <NewHeader />
 
     <!-- 主要内容区域 -->
     <main class="main-content">
@@ -32,5 +32,6 @@ const showFooter = computed(() => route.name !== 'doc') // 在文档页面不显
 
 .main-content {
   flex: 1;
+  margin-top: var(--header-height, 64px); /* 使用margin-top而不是padding-top */
 }
 </style>

web/src/assets/icons/logo.svg

@@ -1 +1,26 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120">
+  <style>
+    @keyframes swing {
+      0% { transform: rotate(0deg); }
+      25% { transform: rotate(15deg); }
+      75% { transform: rotate(-15deg); }
+      100% { transform: rotate(0deg); }
+    }
+    #pendulum { transform-origin: 60px 10px; animation: swing 3s ease-in-out infinite; }
+  </style>
+
+  <!-- 顶部固定点 -->
+  <circle cx="60" cy="10" r="5" fill="#34495e"/>
+
+  <g id="pendulum">
+    <!-- 摆线 -->
+    <line x1="60" y1="10" x2="60" y2="100" stroke="#41b883" stroke-width="2"/>
+
+    <!-- 摆锤主体 -->
+    <path d="M40,90 L60,70 L80,90 L60,110 Z" fill="#41b883"/>
+
+    <!-- 摆锤装饰 -->
+    <circle cx="60" cy="90" r="10" fill="#34495e"/>
+    <path d="M50,90 L70,90 M60,80 L60,100" stroke="#41b883" stroke-width="2"/>
+  </g>
+</svg>

web/src/assets/styles/variables.scss

@@ -40,14 +40,17 @@ $spacing-xxl: 40px;
 $spacing-xxxl: 60px;
 
 // Layout
-$header-height: 60px;
+$header-height: 64px;
+:root {
+  --header-height: #{$header-height};
+}
 $footer-height: 60px;
 $container-width: 1200px;
 $sidebar-width: 256px;
 $content-max-width: 800px;
 
 // Typography
-$font-family-base: Open Sans, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
+$font-family-base: -apple-system, Open Sans, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif, Apple Color Emoji, Segoe UI Emoji;
 $font-size-xs: 0.75rem;   // 12px
 $font-size-sm: 0.875rem;  // 14px
 $font-size-md: 1rem;      // 16px

web/src/layout/NewHeader/index.vue

@@ -82,8 +82,8 @@ const handleMenuLeave = (index: number) => {
     <div class="header-container">
       <!-- Logo 区域 -->
       <div class="logo-section">
-        <img src="@/assets/icons/logo.svg" alt="DJI Logo" class="logo" />
-        <span class="logo-text">大疆行业应用</span>
+        <img src="@/assets/icons/logo.svg" alt="Pendulum Logo" class="logo" />
+        <span class="logo-text">Pendulum 开放平台</span>
       </div>
 
       <!-- 导航菜单 -->
@@ -136,6 +136,7 @@ const handleMenuLeave = (index: number) => {
 <style scoped lang="scss">
 @use '@/assets/styles/variables' as v;
 @use '@/assets/styles/mixins' as m;
+@use "sass:color";
 
 .new-header {
   position: fixed;
@@ -161,8 +162,15 @@ const handleMenuLeave = (index: number) => {
   gap: v.$spacing-sm;
 
   .logo {
-    height: 24px;
+    height: 42px;
     width: auto;
+    transition: transform 0.3s ease;
+    transform-origin: center;
+
+    &:hover {
+      transform: scale(1.1);
+      animation-play-state: paused;
+    }
   }
 
   .logo-text {
@@ -218,38 +226,48 @@ const handleMenuLeave = (index: number) => {
 .submenu {
   position: absolute;
   top: 100%;
-  left: 50%;
-  transform: translateX(-50%);
-  min-width: 200px;
+  left: 0;
+  right: 0;
+  width: 100%;
   background: v.$background-light;
-  border-radius: v.$border-radius-md;
-  box-shadow: v.$shadow-lg;
+  border-radius: 0;
+  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
   opacity: 0;
   visibility: hidden;
   transition: all v.$transition-fast;
-  padding: v.$spacing-md;
+  padding: 0;
+  border-top: 2px solid #000;
+  transform: translateY(-2px);
+  display: flex;
+  justify-content: center;
 
   &.show {
     opacity: 1;
     visibility: visible;
+    transform: translateY(0);
   }
 }
-
 .submenu-container {
   display: flex;
   gap: v.$spacing-xl;
   padding: v.$spacing-lg;
+  background-color: #fff;
+  width: 100%;
+  max-width: 1200px;
 }
 
 .submenu-group {
   min-width: 160px;
+  padding: v.$spacing-md;
 }
 
 .submenu-title {
   font-size: v.$font-size-sm;
-  font-weight: v.$font-weight-medium;
+  font-weight: v.$font-weight-bold;
   color: v.$text-primary;
-  margin: 0 0 v.$spacing-sm;
+  margin: 0 0 v.$spacing-md;
+  padding-bottom: v.$spacing-xs;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
 }
 
 .submenu-list {
@@ -259,7 +277,7 @@ const handleMenuLeave = (index: number) => {
 }
 
 .submenu-item {
-  margin: v.$spacing-xs 0;
+  margin: v.$spacing-sm 0;
 }
 
 .submenu-link {
@@ -306,7 +324,7 @@ const handleMenuLeave = (index: number) => {
   transition: background-color v.$transition-fast;
 
   &:hover {
-    background-color: darken(v.$primary-color, 10%);
+    background-color: color.adjust(v.$primary-color, $lightness: -10%);
   }
 }
 </style>

web/src/router/index.ts

@@ -4,12 +4,16 @@ import HomeView from '@/views/Home/index.vue'
 import EnterpriseView from '@/views/Enterprise/index.vue'
 import DocView from '@/views/Doc/index.vue'
 
-export interface NavItem extends RouteRecordRaw {
+export interface NavItem {
+  path: string
+  name: string
+  component: any
   title: string
   showInNav: boolean
+  meta?: Record<string, any>
 }
 
-const routes: NavItem[] = [
+const routes: (NavItem & RouteRecordRaw)[] = [
   {
     path: '/',
     name: 'home',
@@ -19,7 +23,7 @@ const routes: NavItem[] = [
   },
   {
     path: '/enterprise',
-    nema: 'enterprise',
+    name: 'enterprise',
     component: EnterpriseView,
     title: '行业案例',
     showInNav: true
@@ -38,7 +42,7 @@ const routes: NavItem[] = [
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
-  routes: routes as RouteRecordRaw[]
+  routes
 })
 
 export default router