feat: 完成网站前端的基本建设

- 网站内容展示：首页， 产品页， 解决方案， 联系信息等
- 网站跳转逻辑：通过Vue-Router实现路由跳转
- 后端通信： 通过Nuxt Strapi与后端Strapi服务进行通信

app/components/JinshenHeader.vue

@@ -0,0 +1,153 @@
+<template>
+    <div class="header-container">
+        <div class="logo-section">
+            <NuxtLink :to="$localePath('/')" class="logo-link">
+                <el-image class="website-logo" src="/jinshen-logo.png" alt="Jinshen Logo" fit="contain" />
+            </NuxtLink>
+        </div>
+
+        <!-- 导航菜单 -->
+        <el-menu
+:default-active="activeName" class="header-menu" mode="horizontal" :ellipsis="false"
+            :persistent="false" router>
+            <el-menu-item index="productions" :route="$localePath('/productions')">
+                <span class="title">{{ $t('navigation.productions') }}</span>
+            </el-menu-item>
+            <el-menu-item index="solutions" :route="$localePath('/solutions')">
+                <span class="title">{{ $t('navigation.solutions') }}</span>
+            </el-menu-item>
+            <el-menu-item index="support" :route="$localePath('/support')">
+                <span class="title">{{ $t('navigation.support') }}</span>
+            </el-menu-item>
+            <el-menu-item index="about" :route="$localePath('/about')">
+                <span class="title">{{ $t('navigation.about-us') }}</span>
+            </el-menu-item>
+        </el-menu>
+
+        <!-- 右侧功能区 -->
+        <div class="header-actions">
+            <el-input
+v-model="searchQuery" class="search-input" :placeholder="$t('search-placeholder')"
+                :prefix-icon="Search" clearable @keyup.enter="handleSearch" />
+            <el-dropdown @command="setLocale">
+                <el-link type="info" :underline="false">
+                    <el-icon class="mdi mdi-translate translate-link" />
+                </el-link>
+                <template #dropdown>
+                    <el-dropdown-menu>
+                        <el-dropdown-item command="zh">简体中文</el-dropdown-item>
+                        <el-dropdown-item command="en">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 router = useRouter();
+
+const { setLocale } = useI18n();
+
+const searchQuery = ref('')
+
+const activeName = ref<string | undefined>(undefined)
+
+const handleSearch = () => {
+    if (searchQuery.value.trim()) {
+        // 这里可以添加搜索逻辑，例如导航到搜索结果页面
+        console.log('Searching for:', searchQuery.value);
+        // 示例：导航到搜索结果页面
+        // router.push({ path: '/search', query: { q: searchQuery.value } });
+    }
+}
+
+const refreshMenu = () => {
+    const path = router.currentRoute.value.path;
+    if (path.startsWith('/productions')) {
+        activeName.value = 'productions';
+    } else if (path.startsWith('/solutions')) {
+        activeName.value = 'solutions';
+    } else if (path.startsWith('/support')) {
+        activeName.value = 'support';
+    } else if (path.startsWith('/about')) {
+        activeName.value = 'about';
+    } else {
+        activeName.value = undefined; // 默认不激活任何菜单项
+    }
+}
+
+onMounted(() => {
+    refreshMenu();
+    // 监听路由变化以更新激活状态
+    router.afterEach(() => {
+        refreshMenu();
+    });
+})
+</script>
+
+<style scoped>
+.header-container {
+    margin: 0 auto;
+    padding: 0 10px;
+    display: flex;
+    height: 80px;
+    align-items: center;
+    border-bottom: 1px solid #e0e0e0;
+}
+
+.logo-section {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    margin-left: 20px;
+}
+
+.logo-link {
+    display: flex;
+    align-items: center;
+    text-decoration: none;
+}
+
+.website-logo {
+    height: 64px;
+    width: auto;
+}
+
+.header-menu {
+    margin-right: 40px;
+    border-bottom: none !important;
+    width: auto;
+    --el-menu-horizontal-height: 100%;
+}
+
+.header-menu .el-menu-item {
+    font-size: 16px;
+    background-color: transparent !important;
+}
+
+.header-menu .el-menu-item.is-active {
+    border-bottom: 2.5px solid var(--el-color-primary-dark-2);
+    color: var(--el-color-primary);
+}
+
+.header-menu .el-menu-item:hover {
+    border-bottom: 2.5px solid var(--el-color-primary);
+}
+
+.header-actions {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+}
+
+.search-input {
+    width: 200px;
+}
+
+.translate-link {
+    font-size: 20px;
+}
+</style>