release: v0.4.0

source_clean/frontend-src/src/App.vue

@@ -1,28 +1,8 @@
 <template>
   <router-view />
-  <button class="theme-toggle" @click="toggleTheme" :title="isDark ? '切换亮色' : '切换暗色'">
-    {{ isDark ? '☀️' : '🌙' }}
-  </button>
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
-
-const isDark = ref(false)
-
-function toggleTheme() {
-  isDark.value = !isDark.value
-  document.documentElement.setAttribute('data-theme', isDark.value ? 'dark' : '')
-  localStorage.setItem('theme', isDark.value ? 'dark' : 'light')
-}
-
-onMounted(() => {
-  const saved = localStorage.getItem('theme')
-  if (saved === 'dark' || (!saved && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
-    isDark.value = true
-    document.documentElement.setAttribute('data-theme', 'dark')
-  }
-})
 </script>
 
 <style>
@@ -68,86 +48,6 @@ onMounted(() => {
   --sidebar-w: 240px;
 }
 
-[data-theme="dark"] {
-  --bg: #141414;
-  --bg-card: #1d1d1d;
-  --bg-input: #2a2a2a;
-  --bg-page: #0f0f0f;
-  --bg-card-header: linear-gradient(135deg, #1d1d1d 0%, #1a1a1a 100%);
-
-  --text: #e5e5e5;
-  --text-secondary: #999999;
-  --text-tertiary: #666666;
-  --text-placeholder: #555555;
-
-  --border: #333333;
-  --border-light: #2a2a2a;
-
-  --primary: #409eff;
-  --primary-hover: #66b1ff;
-  --primary-light: rgba(64, 158, 255, 0.15);
-  --primary-soft: rgba(64, 158, 255, 0.1);
-
-  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.2);
-  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
-  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
-}
-
-[data-theme="dark"] body { background: var(--bg); color: var(--text); }
-[data-theme="dark"] .el-card,
-[data-theme="dark"] .el-dialog,
-[data-theme="dark"] .el-menu,
-[data-theme="dark"] .el-table,
-[data-theme="dark"] .el-select-dropdown,
-[data-theme="dark"] .el-popover {
-  --el-bg-color: var(--bg-card) !important;
-  --el-border-color: var(--border) !important;
-  --el-text-color-primary: var(--text) !important;
-}
-[data-theme="dark"] .el-dialog__body,
-[data-theme="dark"] .el-table__body td {
-  background-color: var(--bg-card) !important;
-}
-[data-theme="dark"] .el-table__header th {
-  background-color: #262626 !important;
-}
-[data-theme="dark"] .el-input__wrapper,
-[data-theme="dark"] .el-select .el-input__wrapper {
-  background-color: var(--bg-input) !important;
-  border-color: var(--border) !important;
-  box-shadow: 0 0 0 1px var(--border) inset !important;
-}
-[data-theme="dark"] .el-input__inner,
-[data-theme="dark"] .el-textarea__inner {
-  background-color: var(--bg-input) !important;
-  color: var(--text) !important;
-}
-[data-theme="dark"] .el-button--default {
-  background: var(--bg-card);
-  border-color: var(--border);
-  color: var(--text);
-}
-
-.theme-toggle {
-  position: fixed;
-  bottom: 24px;
-  right: 24px;
-  z-index: 99;
-  width: 44px;
-  height: 44px;
-  border-radius: 50%;
-  border: 1px solid var(--border);
-  background: var(--bg-card);
-  cursor: pointer;
-  font-size: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  box-shadow: var(--shadow-md);
-  transition: all 0.3s;
-}
-.theme-toggle:hover { transform: scale(1.1); border-color: var(--primary); }
-
 #app { min-height: 100vh; background: var(--bg-page); color: var(--text); }
 
 /* ── Global element-plus overrides ── */
@@ -157,35 +57,19 @@ onMounted(() => {
   box-shadow: var(--shadow-sm) !important;
   transition: box-shadow 0.2s ease;
 }
-.el-card:hover {
-  box-shadow: var(--shadow-md) !important;
-}
+.el-card:hover { box-shadow: var(--shadow-md) !important; }
 .el-card__header {
   padding: 16px 20px !important;
   border-bottom: 1px solid var(--border-light) !important;
-  font-weight: 600;
-  font-size: 14px;
+  font-weight: 600; font-size: 14px;
   background: var(--bg-card-header);
 }
-.el-card__body {
-  padding: 20px !important;
-}
+.el-card__body { padding: 20px !important; }
 
 /* ── Typography helpers ── */
-.form-tip {
-  font-size: 12px;
-  color: var(--text-tertiary);
-  line-height: 1.6;
-}
-.page-title {
-  font-size: 20px;
-  font-weight: 700;
-  color: var(--text);
-}
-.section-divider {
-  border-top: 1px solid var(--border-light);
-  margin: 20px 0;
-}
+.form-tip { font-size: 12px; color: var(--text-tertiary); line-height: 1.6; }
+.page-title { font-size: 20px; font-weight: 700; color: var(--text); }
+.section-divider { border-top: 1px solid var(--border-light); margin: 20px 0; }
 
 /* ── Fade transition ── */
 .fade-enter-active, .fade-leave-active { transition: opacity 0.2s ease; }

source_clean/frontend-src/src/App.vue.bak

@@ -0,0 +1,193 @@
+<template>
+  <router-view />
+  <button class="theme-toggle" @click="toggleTheme" :title="isDark ? '切换亮色' : '切换暗色'">
+    {{ isDark ? '☀️' : '🌙' }}
+  </button>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+
+const isDark = ref(false)
+
+function toggleTheme() {
+  isDark.value = !isDark.value
+  document.documentElement.setAttribute('data-theme', isDark.value ? 'dark' : '')
+  localStorage.setItem('theme', isDark.value ? 'dark' : 'light')
+}
+
+onMounted(() => {
+  const saved = localStorage.getItem('theme')
+  if (saved === 'dark' || (!saved && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
+    isDark.value = true
+    document.documentElement.setAttribute('data-theme', 'dark')
+  }
+})
+</script>
+
+<style>
+/* =============================================
+   CloudSearch Design System — Global Tokens
+   ============================================= */
+:root {
+  /* ── Backgrounds ── */
+  --bg: #f0f2f5;
+  --bg-card: #ffffff;
+  --bg-input: #f5f7fa;
+  --bg-page: #f0f2f5;
+  --bg-card-header: linear-gradient(135deg, #f8f9fc 0%, #eef1f8 100%);
+
+  /* ── Text ── */
+  --text: #1d2129;
+  --text-secondary: #4e5969;
+  --text-tertiary: #86909c;
+  --text-placeholder: #c9cdd4;
+
+  /* ── Borders ── */
+  --border: #e5e6eb;
+  --border-light: #f2f3f5;
+
+  /* ── Primary ── */
+  --primary: #409eff;
+  --primary-hover: #66b1ff;
+  --primary-light: rgba(64, 158, 255, 0.08);
+  --primary-soft: #ecf5ff;
+
+  /* ── Shadows ── */
+  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.04);
+  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
+  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.08);
+
+  /* ── Radius ── */
+  --radius-sm: 6px;
+  --radius-md: 10px;
+  --radius-lg: 14px;
+  --radius-xl: 20px;
+
+  /* ── Sizing ── */
+  --sidebar-w: 240px;
+}
+
+[data-theme="dark"] {
+  --bg: #141414;
+  --bg-card: #1d1d1d;
+  --bg-input: #2a2a2a;
+  --bg-page: #0f0f0f;
+  --bg-card-header: linear-gradient(135deg, #1d1d1d 0%, #1a1a1a 100%);
+
+  --text: #e5e5e5;
+  --text-secondary: #999999;
+  --text-tertiary: #666666;
+  --text-placeholder: #555555;
+
+  --border: #333333;
+  --border-light: #2a2a2a;
+
+  --primary: #409eff;
+  --primary-hover: #66b1ff;
+  --primary-light: rgba(64, 158, 255, 0.15);
+  --primary-soft: rgba(64, 158, 255, 0.1);
+
+  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.2);
+  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
+  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
+}
+
+[data-theme="dark"] body { background: var(--bg); color: var(--text); }
+[data-theme="dark"] .el-card,
+[data-theme="dark"] .el-dialog,
+[data-theme="dark"] .el-menu,
+[data-theme="dark"] .el-table,
+[data-theme="dark"] .el-select-dropdown,
+[data-theme="dark"] .el-popover {
+  --el-bg-color: var(--bg-card) !important;
+  --el-border-color: var(--border) !important;
+  --el-text-color-primary: var(--text) !important;
+}
+[data-theme="dark"] .el-dialog__body,
+[data-theme="dark"] .el-table__body td {
+  background-color: var(--bg-card) !important;
+}
+[data-theme="dark"] .el-table__header th {
+  background-color: #262626 !important;
+}
+[data-theme="dark"] .el-input__wrapper,
+[data-theme="dark"] .el-select .el-input__wrapper {
+  background-color: var(--bg-input) !important;
+  border-color: var(--border) !important;
+  box-shadow: 0 0 0 1px var(--border) inset !important;
+}
+[data-theme="dark"] .el-input__inner,
+[data-theme="dark"] .el-textarea__inner {
+  background-color: var(--bg-input) !important;
+  color: var(--text) !important;
+}
+[data-theme="dark"] .el-button--default {
+  background: var(--bg-card);
+  border-color: var(--border);
+  color: var(--text);
+}
+
+.theme-toggle {
+  position: fixed;
+  bottom: 24px;
+  right: 24px;
+  z-index: 99;
+  width: 44px;
+  height: 44px;
+  border-radius: 50%;
+  border: 1px solid var(--border);
+  background: var(--bg-card);
+  cursor: pointer;
+  font-size: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: var(--shadow-md);
+  transition: all 0.3s;
+}
+.theme-toggle:hover { transform: scale(1.1); border-color: var(--primary); }
+
+#app { min-height: 100vh; background: var(--bg-page); color: var(--text); }
+
+/* ── Global element-plus overrides ── */
+.el-card {
+  border-radius: var(--radius-lg) !important;
+  border: 1px solid var(--border) !important;
+  box-shadow: var(--shadow-sm) !important;
+  transition: box-shadow 0.2s ease;
+}
+.el-card:hover {
+  box-shadow: var(--shadow-md) !important;
+}
+.el-card__header {
+  padding: 16px 20px !important;
+  border-bottom: 1px solid var(--border-light) !important;
+  font-weight: 600;
+  font-size: 14px;
+  background: var(--bg-card-header);
+}
+.el-card__body {
+  padding: 20px !important;
+}
+
+/* ── Typography helpers ── */
+.form-tip {
+  font-size: 12px;
+  color: var(--text-tertiary);
+  line-height: 1.6;
+}
+.page-title {
+  font-size: 20px;
+  font-weight: 700;
+  color: var(--text);
+}
+.section-divider {
+  border-top: 1px solid var(--border-light);
+  margin: 20px 0;
+}
+
+/* ── Fade transition ── */
+.fade-enter-active, .fade-leave-active { transition: opacity 0.2s ease; }
+.fade-enter-from, .fade-leave-to { opacity: 0; }
+</style>

source_clean/frontend-src/src/pages/HomePage.vue

@@ -6,354 +6,117 @@
         <div v-else class="logo-text">{{ siteName || 'CloudSearch' }}</div>
       </template>
       <div class="search-box">
-        <el-input
-          v-model="query"
-          placeholder="搜索网盘资源，或粘贴视频/网盘链接..."
-          size="large"
-          clearable
-          @keyup.enter="handleSearch"
-        >
-          <template #prefix>
-            <el-icon><Search /></el-icon>
-          </template>
+        <el-input v-model="query" placeholder="搜索网盘资源..." size="large" clearable @keyup.enter="handleSearch">
+          <template #prefix><el-icon><Search /></el-icon></template>
         </el-input>
-        <el-button type="primary" size="large" @click="handleSearch" class="search-btn">
-          搜 索
-        </el-button>
+        <el-button type="primary" size="large" @click="handleSearch" class="search-btn">搜索</el-button>
       </div>
-      <div class="quote-section" v-if="currentQuote">
-        <span class="quote-text">「 {{ currentQuote }} 」</span>
-        <span class="quote-author">---{{ quoteAuthor }}</span>
+      <div class="quote-line" v-if="currentQuote">「 {{ currentQuote }} 」 ---{{ quoteAuthor }}</div>
+    </div>
+
+    <div class="cloud-zone" v-if="words.length > 0">
+      <p class="cloud-title">大家都在搜</p>
+      <div class="word-cloud">
+        <span v-for="w in words" :key="w.k" class="wc-word" :style="{fontSize:w.s+'px',color:w.c,fontWeight:w.w,transform:'rotate('+w.r+'deg)',opacity:w.o,animationDelay:w.d+'s'}" @click="searchTag(w.k)">{{ w.k }}</span>
       </div>
     </div>
 
-    <div class="content-section">
-      <div v-if="categories.length > 0" class="rankings-grid">
-        <div
-          v-for="cat in categories"
-          :key="cat.category"
-          class="rank-panel"
-        >
-          <div class="panel-header">
-            <span class="panel-title">{{ getCategoryIcon(cat.category) }} {{ cat.label }}</span>
-            <div class="panel-tabs">
-              <span class="panel-tab" :class="{ active: activeTab[cat.category] === 'hot' }" @click="switchTab(cat.category, 'hot')">热榜</span>
-              <span class="panel-tab" :class="{ active: activeTab[cat.category] === 'newest' }" @click="switchTab(cat.category, 'newest')">最新</span>
-            </div>
-          </div>
-          <div class="panel-body">
-            <div
-              v-for="(item, idx) in visibleItems(cat)"
-              :key="cat.category + '-' + idx"
-              class="rank-item"
-              @click="searchTag(item.keyword)"
-            >
-              <span class="rank-idx" :class="{ 'top-three': idx < 3 }">{{ idx + 1 }}</span>
-              <span class="rank-name">{{ item.keyword }}</span>
-              <span class="rank-cnt">{{ formatCount(item) }}</span>
-            </div>
-            <!-- 展开按钮 -->
-            <div v-if="hasMoreItems(cat)" class="rank-expand" @click="expandCategory(cat.category)">
-              展开全部 ▼
-            </div>
-          </div>
-          <div class="panel-footer">
-            <span v-if="cat.category === 'hotsite'">基于本站搜索数据</span>
-            <span v-else-if="cat.category === 'donghua' || cat.category === 'global_anime'">数据来源：Bilibili</span>
-            <span v-else-if="cat.category === 'movie' || cat.category === 'tv'">数据来源：百度</span>
-            <span v-else>数据来源：TMDB</span>
-            <span class="footer-time">{{ fetchedAt }}</span>
-          </div>
-        </div>
-      </div>
-    </div>
+    <div v-else-if="configLoaded" class="empty-area"><p>搜索脉搏采集中...</p></div>
+
     <div v-if="siteDisclaimer" class="site-footer">
       <div class="footer-inner">{{ siteDisclaimer }}</div>
-      <div class="footer-actions">
-        <el-button class="footer-disclaimer-btn" size="small" @click="openDisclaimer">📜 免责声明</el-button>
-      </div>
+      <el-button class="footer-btn" size="small" @click="openDisclaimer">免责声明</el-button>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
+import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { Search } from '@element-plus/icons-vue'
 import { getCategorizedRankings, getSiteConfig } from '../api'
 
 const router = useRouter()
-
 const query = ref('')
-const categories = ref<any[]>([])
-const expanded = reactive<Record<string, boolean>>({})
-const activeTab = reactive<Record<string, string>>({})
+const configLoaded = ref(false)
 const siteLogo = ref('')
 const siteName = ref('')
 const siteDisclaimer = ref('')
-const configLoaded = ref(false)
 const currentQuote = ref('')
 const quoteAuthor = ref('')
-const QUOTES = ['学而时习之，不亦说乎。','温故而知新，可以为师矣。','三人行，必有我师焉。','学而不思则罔，思而不学则殆。','博学之，审问之，慎思之，明辨之，笃行之。','千里之行，始于足下。','不积跬步，无以至千里。','知之为知之，不知为不知，是知也。','工欲善其事，必先利其器。','玉不琢，不成器；人不学，不知道。','学以致用，知行合一。','学海无涯，勤作舟。','书山有路，勤为径。','宝剑锋从磨砺出，梅花香自苦寒来。','锲而不舍，金石可镂。','业精于勤，荒于嬉。','读书破万卷，下笔如有神。','路漫漫其修远兮，吾将上下而求索。','采菊东篱下，悠然见南山。','海内存知己，天涯若比邻。','长风破浪会有时，直挂云帆济沧海。','会当凌绝顶，一览众山小。','山重水复疑无路，柳暗花明又一村。']
+const words = ref<any[]>([])
 
-const fetchedAt = ref('')
+const QS = ['学而时习之，不亦说乎。', '温故而知新，可以为师矣。', '千里之行，始于足下。', '书山有路，勤为径。', '学以致用，知行合一。', '路漫漫其修远兮，吾将上下而求索。']
+const CS = ['#e74c3c', '#e67e22', '#f39c12', '#27ae60', '#2980b9', '#8e44ad', '#2c3e50', '#16a085', '#d35400', '#c0392b', '#1abc9c', '#3498db', '#9b59b6', '#34495e', '#e91e63', '#009688', '#ff5722', '#795548', '#607d8b', '#673ab7']
+const SS = [48,42,38,34,30,28,26,24,22,20,18,17,16,15,14,13,12]
 
-const INITIAL_SHOW = 8
-
-const CATEGORY_ICONS: Record<string, string> = {
-  movie: '🎬', western_movie: '🎥', western_tv: '🌍',
-  donghua: '🐉', global_anime: '🌐',
-  tv: '📺',
-  niche: '💎', hotsite: '🏆',
-}
-
-function getCategoryIcon(cat: string): string {
-  return CATEGORY_ICONS[cat] || '📋'
-}
-
-function formatCount(item: any): string {
-  const parts: string[] = []
-  if (item.rating) {
-    parts.push(`⭐${item.rating}`)
-  }
-  if (item.searchCount > 0) {
-    const n = item.searchCount
-    if (n >= 100000000) {
-      parts.push(`${(n / 100000000).toFixed(1)}亿`)
-    } else if (n >= 10000) {
-      parts.push(`${(n / 10000).toFixed(0)}万`)
-    } else {
-      parts.push(String(n))
-    }
-  }
-  return parts.join(' ') || ''
-}
-
-function getItems(cat: any): any[] {
-  const tab = activeTab[cat.category] || 'hot'
-  return tab === 'hot' ? (cat.hot || []) : (cat.newest || [])
-}
-
-function visibleItems(cat: any): any[] {
-  const items = getItems(cat)
-  return expanded[cat.category] ? items : items.slice(0, INITIAL_SHOW)
-}
-
-function hasMoreItems(cat: any): boolean {
-  const items = getItems(cat)
-  return items.length > INITIAL_SHOW && !expanded[cat.category]
-}
-
-function expandCategory(category: string) {
-  expanded[category] = true
-}
-
-function switchTab(category: string, tab: string) {
-  activeTab[category] = tab
-  // 切换标签时收起展开
-  expanded[category] = false
-}
-
-function openDisclaimer() {
-  window.open('/disclaimer/', '_blank')
-}
+function handleSearch() { const q = query.value.trim(); if(q) router.push('/search?q='+encodeURIComponent(q)) }
+function searchTag(t:string) { router.push('/search?q='+encodeURIComponent(t)) }
+function openDisclaimer() { window.open('/disclaimer/', '_blank') }
 
 onMounted(async () => {
-  // 一言（内置格言）
-  const q = QUOTES[Math.floor(Math.random() * QUOTES.length)]
-  currentQuote.value = q
+  currentQuote.value = QS[Math.floor(Math.random()*QS.length)]
   quoteAuthor.value = '古籍经典'
-
   try {
-    const [catsData, siteCfg] = await Promise.all([
-      getCategorizedRankings(),
-      getSiteConfig(),
-    ])
-    // 新格式: { fetchedAt, categories }
-    if (catsData.fetchedAt) {
-      fetchedAt.value = catsData.fetchedAt
-      categories.value = catsData.categories || []
-    } else {
-      // 兼容旧格式
-      categories.value = Array.isArray(catsData) ? catsData : []
+    const [catsData, siteCfg] = await Promise.all([getCategorizedRankings(), getSiteConfig()])
+    if(siteCfg.site_logo) siteLogo.value=siteCfg.site_logo
+    if(siteCfg.site_name) siteName.value=siteCfg.site_name
+    if(siteCfg.site_disclaimer) siteDisclaimer.value=siteCfg.site_disclaimer
+    configLoaded.value=true
+    if(catsData?.categories){
+      const hotCat=catsData.categories.find((c:any)=>c.category==='hot')
+      if(hotCat?.hot?.length){
+        const arr=hotCat.hot.slice(0,25).map((item:any,idx:number)=>({
+          k:item.keyword, s:SS[Math.min(idx,SS.length-1)],
+          c:CS[idx%CS.length], w:idx<5?800:idx<10?600:400,
+          r:(Math.random()-.5)*6, o:1-idx*.02, d:idx*.08
+        }))
+        for(let i=arr.length-1;i>0;i--){const j=Math.floor(Math.random()*(i+1));[arr[i],arr[j]]=[arr[j],arr[i]]}
+        words.value=arr
+      }
     }
-    for (const cat of categories.value) {
-      activeTab[cat.category] = 'hot'
-      expanded[cat.category] = false
-    }
-    if (siteCfg.site_logo) {
-      siteLogo.value = siteCfg.site_logo
-    }
-    if (siteCfg.site_name) {
-      siteName.value = siteCfg.site_name
-    }
-    if (siteCfg.site_disclaimer) {
-      siteDisclaimer.value = siteCfg.site_disclaimer
-    }
-    configLoaded.value = true
-  } catch (e) {
-    console.error('加载首页数据失败', e)
-  }
+  }catch(e){console.error(e)}
 })
-
-function handleSearch() {
-  const q = query.value.trim()
-  if (q) router.push('/search?q=' + encodeURIComponent(q))
-}
-
-function searchTag(tag: string) {
-  router.push('/search?q=' + encodeURIComponent(tag))
-}
 </script>
 
 <style scoped>
-.home-page { min-height: 100vh; display: flex; flex-direction: column; }
+.home-page{min-height:100vh;background:#f5f7fa}
+.hero-section{text-align:center;padding:56px 24px 36px;background:#f5f7fa}
+.logo-text{font-size:48px;font-weight:700;color:#1d2129;margin-bottom:24px}
+.logo-img{display:block;max-width:400px;max-height:100px;margin:0 auto 24px}
+.search-box{display:inline-flex;align-items:center;width:100%;max-width:600px;border-radius:28px;background:#fff;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.08)}
+.search-box :deep(.el-input__wrapper){border:none;box-shadow:none;background:transparent;padding:4px 20px}
+.search-box :deep(.el-input__inner){font-size:15px}
+.search-btn{flex-shrink:0;border:none;border-radius:24px;padding:0 28px;height:40px;font-size:14px;font-weight:600;background:#409eff;color:#fff;margin:4px;cursor:pointer;transition:all .2s}
+.search-btn:hover{background:#337ecc;transform:scale(1.02)}
+.quote-line{margin-top:14px;font-size:13px;color:#86909c;font-style:italic}
+.cloud-zone{max-width:1100px;margin:0 auto;padding:32px 24px 60px}
+.cloud-title{text-align:center;font-size:14px;color:#86909c;letter-spacing:4px;margin-bottom:40px}
+.word-cloud{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px;padding:20px;line-height:1.4}
+.wc-word{display:inline-block;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);animation:pop-in .8s ease-out both;padding:2px 6px;border-radius:6px;user-select:none}
+.wc-word:hover{transform:scale(1.3) rotate(0deg)!important;opacity:1!important}
+@keyframes pop-in{from{opacity:0;transform:translateY(20px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}
+.empty-area{text-align:center;padding:80px 20px;color:#c0c4cc}
+.site-footer{text-align:center;padding:20px 16px 32px;background:#f5f7fa;border-top:1px solid #e5e6eb}
+.footer-inner{max-width:800px;margin:0 auto 12px;font-size:12px;line-height:1.8;color:#86909c;white-space:pre-line}
+.footer-btn{font-size:12px!important;color:#86909c!important}
 
-.hero-section {
-  display: flex; flex-direction: column; align-items: center; justify-content: center;
-  padding: 60px 24px 40px;
+/* Responsive */
+@media(max-width:768px){
+  .hero-section{padding:36px 16px 24px}
+  .logo-text{font-size:28px}
+  .search-box{border-radius:24px}
+  .search-btn{padding:0 18px;height:36px;font-size:13px}
+  .quote-line{font-size:12px}
+  .cloud-zone{padding:24px 12px 40px}
+  .cloud-title{margin-bottom:24px;font-size:13px;letter-spacing:2px}
+  .word-cloud{gap:8px 16px;padding:12px}
+  .wc-word{padding:1px 4px}
 }
-.logo-text { font-size: 64px; font-weight: 700; color: var(--primary-color); margin-bottom: 32px; letter-spacing: -2px; }
-.logo-img { max-width: 500px; max-height: 120px; width: auto; height: auto; object-fit: contain; margin-bottom: 32px; }
-.search-box {
-  display: flex;
-  align-items: center;
-  width: 100%; max-width: 640px;
-  border: 1px solid #dfe1e5;
-  border-radius: 24px;
-  background: #fff;
-  box-shadow: none;
-  transition: box-shadow .2s, border-color .2s;
-  overflow: hidden;
+@media(max-width:480px){
+  .hero-section{padding:28px 12px 20px}
+  .logo-text{font-size:22px;margin-bottom:16px}
+  .search-box{max-width:100%}
+  .search-box :deep(.el-input__inner){font-size:13px}
 }
-.search-box:focus-within {
-  box-shadow: 0 1px 6px rgba(32,33,36,.28);
-  border-color: rgba(223,225,229,0);
-}
-.search-box :deep(.el-input__wrapper) {
-  border: none; box-shadow: none; background: transparent;
-  padding: 4px 20px; border-radius: 0;
-}
-.search-box :deep(.el-input__inner) {
-  font-size: 15px;
-}
-.search-btn {
-  flex-shrink: 0;
-  border: none;
-  border-radius: 999px;
-  padding: 0 24px;
-  height: 38px;
-  line-height: 38px;
-  margin: 4px;
-  font-size: 14px; font-weight: 600;
-  background: var(--primary-color); color: #fff;
-  cursor: pointer; transition: all .2s;
-  letter-spacing: 1px;
-}
-.search-btn:hover {
-  background: #3a7be0;
-}
-.search-btn:active {
-  background: #2d6ccf;
-}
-
-.quote-section { margin-top: 18px; max-width: 640px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.quote-text { font-size: 14px; color: #aab0b8; font-style: italic; letter-spacing: 0.5px; }
-.quote-author { font-size: 12px; color: #c0c4cc; display: inline-block; margin-left: 4px; }
-
-.content-section { max-width: 1500px; width: 100%; margin: 0 auto; padding: 0 16px 60px; }
-
-.rankings-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
-  gap: 14px;
-  margin-top: 8px;
-}
-
-.rank-panel {
-  background: var(--bg-white,#fff);
-  border-radius: 12px; padding: 14px; border: 1px solid #ebeef5;
-  box-shadow: 0 1px 4px rgba(0,0,0,0.04); display: flex; flex-direction: column;
-}
-
-.panel-header {
-  display: flex; align-items: center; justify-content: space-between;
-  padding-bottom: 10px; border-bottom: 2px solid #f0f0f0; margin-bottom: 4px;
-}
-.panel-title { font-size: 15px; font-weight: 700; color: #303133; white-space: nowrap; }
-.panel-tabs { display: flex; gap: 2px; background: #f0f2f5; border-radius: 6px; padding: 2px; }
-.panel-tab {
-  font-size: 11px; padding: 3px 10px; border-radius: 5px; cursor: pointer;
-  color: #909399; font-weight: 500; transition: all .2s; user-select: none;
-}
-.panel-tab.active { background: #fff; color: var(--primary-color); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
-
-.panel-body { flex: 1; display: flex; flex-direction: column; gap: 1px; }
-
-.rank-item {
-  display: flex; align-items: center; gap: 8px; padding: 5px 6px;
-  border-radius: 6px; cursor: pointer; transition: background .15s;
-}
-.rank-item:hover { background: #f0f5ff; }
-.rank-item:active { background: #e6f0ff; }
-
-.rank-idx {
-  width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center;
-  justify-content: center; font-size: 12px; font-weight: 700;
-  color: #909399; background: #f0f0f0; flex-shrink: 0;
-}
-.rank-idx.top-three { background: var(--primary-color); color: #fff; }
-.rank-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 500; color: #303133; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.rank-cnt { font-size: 11px; color: #c0c4cc; white-space: nowrap; flex-shrink: 0; }
-
-.rank-expand {
-  text-align: center; padding: 6px; margin-top: 2px; font-size: 12px;
-  color: var(--primary-color); cursor: pointer; border-radius: 6px;
-  transition: background .15s; user-select: none;
-}
-.rank-expand:hover { background: #ecf5ff; }
-
-.panel-footer {
-  margin-top: 8px; padding-top: 8px; border-top: 1px solid #f0f0f0;
-  display: flex; align-items: center; justify-content: space-between;
-  font-size: 11px; color: #c0c4cc;
-}
-.footer-time { font-family: monospace; font-size: 10px; }
-
-@media (max-width: 900px) {
-  .hero-section { padding: 36px 16px 24px; }
-  .logo-text { font-size: 36px; margin-bottom: 20px; }
-  .logo-img { max-width: 360px; max-height: 100px; margin-bottom: 20px; }
-  .rankings-scroll { gap: 12px; }
-}
-
-.site-footer {
-  margin-top: auto;
-  padding: 20px 16px 32px;
-  background: #f9fafb;
-  border-top: 1px solid #ebeef5;
-}
-.footer-inner {
-  max-width: 800px;
-  margin: 0 auto;
-  font-size: 12px;
-  line-height: 1.8;
-  color: #909399;
-  text-align: center;
-  white-space: pre-line;
-}
-.footer-actions {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  gap: 12px;
-  margin-top: 12px;
-}
-.footer-disclaimer-btn {
-  font-size: 12px !important;
-  color: #909399 !important;
-}
-.footer-disclaimer-btn:hover {
-  color: #409eff !important;
-}
-</style>
+</style>

source_clean/frontend-src/src/pages/SearchResult.vue

@@ -28,14 +28,6 @@
           <el-button type="primary" size="large" @click="handleSearch" class="result-search-btn">搜 索</el-button>
         </div>
       </div>
-      <!-- 右上角登录/用户信息，独立于搜索栏 -->
-      <div class="top-right-user">
-        <template v-if="userInfo">
-          <span class="user-badge">{{ userInfo.username }}</span>
-          <el-button size="small" text @click="handleLogout">退出</el-button>
-        </template>
-        <el-button v-else size="small" @click="showLogin = true">登录</el-button>
-      </div>
     </div>
 
     <!-- 滚动通知条（跑马灯） -->
@@ -151,7 +143,7 @@
               :data="item"
               :fallbackTags="contentTags"
               :fallbackImage="fallbackImage"
-              :loggedIn="userInfo !== null"
+              :loggedIn="false"
               :cloudTypeMap="cloudTypeMap"
               @save="handleSave"
             />
@@ -183,7 +175,7 @@
               :data="item"
               :fallbackTags="contentTags"
               :fallbackImage="fallbackImage"
-              :loggedIn="userInfo !== null"
+              :loggedIn="false"
               :cloudTypeMap="cloudTypeMap"
               @save="handleSave"
             />
@@ -346,21 +338,6 @@
     </el-dialog>
   </div>
 
-  <!-- 登录弹窗 -->
-  <el-dialog v-model="showLogin" title="登录" width="380px" :close-on-click-modal="false" top="25vh">
-    <el-form ref="loginFormRef" :model="loginForm" :rules="loginRules" label-width="0" @keyup.enter="handleLogin">
-      <el-form-item prop="username">
-        <el-input v-model="loginForm.username" placeholder="用户名" prefix-icon="User" />
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" placeholder="密码" prefix-icon="Lock" show-password />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" :loading="loginLoading" style="width: 100%" @click="handleLogin">登录</el-button>
-      </el-form-item>
-    </el-form>
-    <p v-if="loginError" class="login-error">{{ loginError }}</p>
-  </el-dialog>
   <div v-if="siteDisclaimer" class="site-footer">
     <div class="footer-inner">{{ siteDisclaimer }}</div>
     <div class="footer-actions">
@@ -376,7 +353,7 @@ import { Search, Loading, CircleCheckFilled } from '@element-plus/icons-vue'
 import QRCode from 'qrcode'
 import ResultCard from '../components/ResultCard.vue'
 import VideoResultCard from '../components/VideoResultCard.vue'
-import { query as searchQuery, saveToCloud, saveVideoToCloud, getSystemConfigs, getCloudTypes, streamSearch, adminLogin, getMe } from '../api'
+import { query as searchQuery, saveToCloud, saveVideoToCloud, getSystemConfigs, getCloudTypes, streamSearch, getSiteConfig } from '../api'
 import { ElMessage } from 'element-plus'
 import type { FormInstance } from 'element-plus'
 import type { SearchResult, VideoParseResult, SaveResult, IntentType, CloudType, ChannelGroup } from '../types'
@@ -417,17 +394,6 @@ const siteDisclaimer = ref('')
 const siteMarquee = ref('')
 const coverError = ref(false)
 
-// 登录状态
-const userInfo = ref<{ username: string } | null>(null)
-const showLogin = ref(false)
-const loginFormRef = ref<FormInstance>()
-const loginForm = reactive({ username: '', password: '' })
-const loginLoading = ref(false)
-const loginError = ref('')
-const loginRules = {
-  username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
-  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
-}
 
 const allResultsMap = ref(new Map<string, any>())
 const validResults = ref<any[]>([])
@@ -456,43 +422,22 @@ async function loadCloudTypes() {
 }
 
 onMounted(async () => {
+  // 预加载网站配置（logo/名称/公告等）
+  try {
+    const sc = await getSiteConfig()
+    if (sc.site_logo) siteLogo.value = sc.site_logo
+    if (sc.site_name) siteName.value = sc.site_name
+    if (sc.site_disclaimer) siteDisclaimer.value = sc.site_disclaimer
+    if (sc.site_marquee) siteMarquee.value = sc.site_marquee
+  } catch {}
   const q = (route.query.q as string) || ''
   if (q) {
     query.value = q
     doSearch(q)
   }
-  // 检查登录状态
-  const me: any = await getMe().catch(() => ({ loggedIn: false }))
-  if (me.loggedIn && me.username) {
-    userInfo.value = { username: me.username }
-  }
   loadCloudTypes()
 })
 
-async function handleLogin() {
-  const valid = await loginFormRef.value?.validate().catch(() => false)
-  if (!valid) return
-  loginLoading.value = true
-  loginError.value = ''
-  try {
-    const res = await adminLogin(loginForm.username, loginForm.password)
-    localStorage.setItem('admin_token', res.token)
-    userInfo.value = { username: loginForm.username }
-    showLogin.value = false
-    loginForm.password = ''
-    ElMessage.success('登录成功')
-  } catch (e: any) {
-    loginError.value = e?.response?.data?.error || e?.message || '登录失败'
-  } finally {
-    loginLoading.value = false
-  }
-}
-
-function handleLogout() {
-  localStorage.removeItem('admin_token')
-  userInfo.value = null
-  ElMessage.success('已退出')
-}
 
 // 网盘分类标签 — 始终展示所有已知云盘类型（0 也显示）
 const cloudTabs = computed(() => {

source_clean/frontend-src/src/pages/admin/AdminDashboard.vue

@@ -237,6 +237,7 @@ watch(() => stats.value.trendTrend, () => {
 }, { deep: true })
 
 // Reload chart when switching back to dashboard
+const activeMenu = ref("dashboard")
 watch(() => activeMenu.value, (val, oldVal) => {
   if (val === 'dashboard' && oldVal !== 'dashboard') {
     nextTick(() => {

source_clean/frontend-src/src/pages/admin/AdminLayout.vue

@@ -2,7 +2,10 @@
   <div class="admin-layout">
     <aside class="admin-sidebar">
       <div class="sidebar-brand">
-        <div class="sidebar-logo">☁️</div>
+        <div class="sidebar-logo">
+          <img v-if="siteLogo" :src="siteLogo" :alt="siteName || 'CloudSearch'" class="sidebar-logo-img" @error="(e: any) => { (e.target as HTMLElement).style.display='none'; siteLogo='' }" />
+          <span v-else class="sidebar-logo-fallback">☁️</span>
+        </div>
         <div class="sidebar-brand-text">
           <h2>{{ siteName || 'CloudSearch' }}</h2>
           <p>管理控制台</p>
@@ -86,6 +89,7 @@ const router = useRouter()
 const route = useRoute()
 
 const siteName = ref('')
+const siteLogo = ref('')
 const appVersion = ref('')
 
 const pageTitles: Record<string, string> = {
@@ -142,6 +146,7 @@ onMounted(async () => {
   try {
     const cfg = await getSiteConfig()
     siteName.value = cfg.site_name || ''
+    siteLogo.value = cfg.site_logo || ''
   } catch {}
   try {
     const h = await fetch('/health')
@@ -180,7 +185,14 @@ onMounted(async () => {
   font-size: 28px;
   line-height: 1;
   flex-shrink: 0;
+  width: 36px;
+  height: 36px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
+.sidebar-logo-img { width: 36px; height: 36px; object-fit: contain; border-radius: 6px; }
+.sidebar-logo-fallback { font-size: 28px; }
 .sidebar-brand-text h2 {
   font-size: 16px;
   font-weight: 700;

source_clean/frontend-src/src/pages/admin/SystemConfig.vue

@@ -828,6 +828,7 @@ const searchAllChannels = computed({
   set: (val: boolean) => { configs.search_all_channels = val ? 'true' : 'false' },
 })
 
+const autoUpdateEnabled = computed({
   get: () => String(configs.auto_update_enabled) === 'true',
   set: (val: boolean) => { configs.auto_update_enabled = val ? 'true' : 'false' },
 })