refactor: 重构搜索页

- 提取页面部分为SearchHeader与SearchTabs组件

app/components/pages/search/SearchHeader.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="search-header">
+    <h1 class="page-title">{{ $t('search.title') }}</h1>
+    <div class="search-bar">
+      <el-input
+        v-model="keyword"
+        class="search-input"
+        :placeholder="$t('search-placeholder')"
+        :prefix-icon="Search"
+        clearable
+        @keyup.enter="navigateToQuery(keyword)"
+        @clear="handleClear"
+      />
+      <el-button
+        type="primary"
+        class="search-button"
+        @click="navigateToQuery(keyword)"
+      >
+        {{ $t('search.search-button') }}
+      </el-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { Search } from '@element-plus/icons-vue';
+
+  const keyword = defineModel<string>({ default: '' });
+  const localePath = useLocalePath();
+  const router = useRouter();
+
+  const navigateToQuery = (value: string) => {
+    const trimmed = value.trim();
+    if (!trimmed) return;
+    navigateTo({
+      path: localePath('/search'),
+      query: { query: trimmed },
+    });
+  };
+
+  const handleClear = () => {
+    keyword.value = '';
+    router.replace(localePath({ path: '/search' }));
+  };
+</script>
+
+<style scoped>
+  .search-header {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    margin-bottom: 2rem;
+  }
+
+  .page-title {
+    font-size: 2.25rem;
+    font-weight: 600;
+    color: var(--el-text-color-primary);
+  }
+
+  .search-bar {
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+    font-size: 16px;
+  }
+
+  .search-input {
+    flex: 1;
+    height: 50px;
+  }
+
+  .search-button {
+    height: 50px;
+    width: 100px;
+    font-size: 16px;
+  }
+</style>