Feature: 导入MDI图标库 & Jinshen网站页头

app/components/JinshenHeader.vue

@@ -0,0 +1,101 @@
+<template>
+    <div class="header-container">
+        <NuxtLink to="/" class="logo-section">
+            <el-image class="website-logo" src="/jinshen-logo.png" alt="Jinshen Logo" fit="contain" />
+        </NuxtLink>
+
+        <!-- 导航菜单 -->
+        <el-menu default-active="productions" class="header-menu" mode="horizontal" :ellipsis="false" router>
+            <el-menu-item index="/productions">
+                <span class="title">产品中心</span>
+            </el-menu-item>
+            <el-menu-item index="/solutions">
+                <span class="title">解决方案</span>
+            </el-menu-item>
+            <el-menu-item index="/support">
+                <span class="title">服务支持</span>
+            </el-menu-item>
+            <el-menu-item index="/about">
+                <span class="title">关于我们</span>
+            </el-menu-item>
+        </el-menu>
+
+        <!-- 右侧功能区 -->
+        <div class="header-actions">
+            <el-input
+v-model="searchQuery" class="search-input" placeholder="搜索..." :prefix-icon="Search" clearable
+                @keyup.enter="handleSearch" />
+            <el-dropdown>
+                <el-link type="info" :underline="false">
+                    <el-icon class="mdi mdi-translate translate-link" />
+                </el-link>
+                <template #dropdown>
+                    <el-dropdown-menu>
+                        <el-dropdown-item>中文</el-dropdown-item>
+                        <el-dropdown-item>English</el-dropdown-item>
+                    </el-dropdown-menu>
+                </template>
+            </el-dropdown>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { Search } from '@element-plus/icons-vue';
+
+const searchQuery = ref('')
+
+const handleSearch = () => {
+    if (searchQuery.value.trim()) {
+        // 这里可以添加搜索逻辑，例如导航到搜索结果页面
+        console.log('Searching for:', searchQuery.value);
+        // 示例：导航到搜索结果页面
+        // router.push({ path: '/search', query: { q: searchQuery.value } });
+    }
+}
+</script>
+
+<style scoped>
+.header-container {
+    margin: 0 auto;
+    padding: 0 10px;
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid #e0e0e0;
+}
+
+.logo-section {
+    display: flex;
+    flex: 1;
+    align-items: center;
+}
+
+.website-logo {
+    height: 64px;
+    width: auto;
+}
+
+.header-menu {
+    margin-right: 40px;
+    border-bottom: none !important;
+    width: auto;
+}
+
+.header-menu .el-menu-item {
+    border-bottom: none !important;
+}
+
+.header-actions {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+}
+
+.search-input {
+    width: 200px;
+}
+
+.translate-link {
+    font-size: 20px;
+}
+</style>