refactor(frontend): 更新项目视图和文本分割页面

- App.vue: 更新样式和路由配置
- ProjectView.vue: 布局调整
- TextSplit.vue: 分割功能完善

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/App.vue

@@ -33,12 +33,12 @@ const locale = ref(zhCn)
 @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
 
 :root {
-  /* Core Colors - Deep Space */
+  /* Core Colors - Deep Space with Gradient */
-  --bg-primary: #030407;
+  --bg-primary: #0a0a14;
-  --bg-secondary: #0a0a0f;
+  --bg-secondary: #12121f;
-  --bg-tertiary: #12121a;
+  --bg-tertiary: #1a1a2a;
-  --bg-elevated: #1a1a24;
+  --bg-elevated: #222233;
-  --bg-hover: #22222e;
+  --bg-hover: #2a2a3d;
 
   /* Accent - Cyan Violet */
   --accent-primary: #00d4ff;
@@ -69,8 +69,8 @@ const locale = ref(zhCn)
   /* Effects */
   --glow-primary: 0 0 30px rgba(0, 212, 255, 0.25);
   --glow-secondary: 0 0 30px rgba(124, 58, 237, 0.25);
-  --glass-bg: rgba(18, 18, 26, 0.6);
+  --glass-bg: rgba(26, 26, 42, 0.65);
-  --glass-border: rgba(255, 255, 255, 0.06);
+  --glass-border: rgba(255, 255, 255, 0.08);
 
   /* Spacing */
   --radius-sm: 6px;
@@ -110,6 +110,12 @@ html, body, #app {
   min-height: 100vh;
   position: relative;
   overflow: hidden;
+  background:
+    radial-gradient(ellipse 100% 80% at 50% 120%, rgba(99, 102, 241, 0.15), transparent 50%),
+    radial-gradient(ellipse 80% 60% at 80% 10%, rgba(0, 212, 255, 0.12), transparent 40%),
+    radial-gradient(ellipse 70% 50% at 10% 80%, rgba(124, 58, 237, 0.1), transparent 40%),
+    radial-gradient(ellipse 60% 40% at 90% 90%, rgba(236, 72, 153, 0.08), transparent 40%),
+    linear-gradient(180deg, var(--bg-primary) 0%, #0f0f1a 100%);
 }
 
 .bg-mesh {
@@ -123,50 +129,50 @@ html, body, #app {
 .mesh-gradient {
   position: absolute;
   border-radius: 50%;
-  filter: blur(120px);
+  filter: blur(80px);
-  opacity: 0.5;
+  opacity: 0.6;
-  animation: float 25s ease-in-out infinite;
+  animation: float 20s ease-in-out infinite;
 }
 
 .mesh-1 {
-  width: 700px;
+  width: 800px;
-  height: 700px;
+  height: 800px;
-  background: radial-gradient(circle, rgba(0, 212, 255, 0.35) 0%, transparent 70%);
+  background: radial-gradient(circle, rgba(0, 212, 255, 0.4) 0%, rgba(6, 182, 212, 0.2) 40%, transparent 70%);
-  top: -250px;
+  top: -300px;
-  right: -150px;
+  right: -200px;
   animation-delay: 0s;
 }
 
 .mesh-2 {
-  width: 600px;
+  width: 700px;
-  height: 600px;
+  height: 700px;
-  background: radial-gradient(circle, rgba(124, 58, 237, 0.3) 0%, transparent 70%);
+  background: radial-gradient(circle, rgba(124, 58, 237, 0.4) 0%, rgba(139, 92, 246, 0.2) 40%, transparent 70%);
-  bottom: -200px;
+  bottom: -250px;
-  left: -150px;
+  left: -200px;
-  animation-delay: -8s;
+  animation-delay: -7s;
 }
 
 .mesh-3 {
-  width: 500px;
+  width: 600px;
-  height: 500px;
+  height: 600px;
-  background: radial-gradient(circle, rgba(6, 182, 212, 0.2) 0%, transparent 70%);
+  background: radial-gradient(circle, rgba(236, 72, 153, 0.3) 0%, rgba(168, 85, 247, 0.15) 40%, transparent 70%);
-  top: 40%;
+  top: 30%;
-  left: 30%;
+  left: 25%;
-  animation-delay: -16s;
+  animation-delay: -14s;
 }
 
 @keyframes float {
   0%, 100% { transform: translate(0, 0) scale(1); }
-  25% { transform: translate(40px, -40px) scale(1.08); }
+  25% { transform: translate(60px, -50px) scale(1.1); }
-  50% { transform: translate(-30px, 30px) scale(0.95); }
+  50% { transform: translate(-40px, 40px) scale(0.95); }
-  75% { transform: translate(-40px, -25px) scale(1.03); }
+  75% { transform: translate(-50px, -30px) scale(1.05); }
 }
 
 .noise-overlay {
   position: absolute;
   inset: 0;
-  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
+  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
-  opacity: 0.025;
+  opacity: 0.035;
 }
 
 .app-content {

frontend/src/views/ProjectView.vue

@@ -64,7 +64,7 @@ const project = ref({ name: '加载中...', description: '' })
 
 const navItems = [
   { path: 'files', label: '文件管理', icon: 'Folder' },
-  { path: 'split', label: '文本分割', icon: 'Operation' },
+  { path: 'split', label: '分割生成', icon: 'Operation' },
   { path: 'questions', label: '问答管理', icon: 'ChatDotSquare' },
   { path: 'datasets', label: '数据集', icon: 'Collection' },
   { path: 'eval', label: '评估系统', icon: 'DataAnalysis' },