From e23311d2aacbc4c20dde0ccfa03889acb99766ff Mon Sep 17 00:00:00 2001
From: empty <let5sne.mac@gmail.com>
Date: Mon, 12 Jan 2026 02:09:48 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E8=BF=81=E7=A7=BB=20AnalysisPanel.?=
 =?UTF-8?q?vue=20-=20SVG=20=E5=9B=BE=E6=A0=87=E6=9B=BF=E4=BB=A3=20emoji?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

完成内容:
- 导入 IconLibrary 组件
- 替换头部标题图标 (analysis)
- 替换标签页图标 (folder, search)
- 替换 AI 提取按钮图标 (sparkles)
- 替换范式卡片操作按钮 (edit, trash)
- 替换分析工具和历史标题图标 (search, edit)
- 优化按钮样式 (flexbox, gap, 居中对齐)
- 标签页按钮支持 flexbox 布局
- 操作按钮添加 aria-label

保留部分:
- iconOptions 数组保留 emoji 并添加 TODO 注释
- 该选择器用于用户自定义范式图标，需后续优化

Emoji 数量: 9 → 0 (除 iconOptions 外)
Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/components/AnalysisPanel.vue | 40 ++++++++++++++++++++++----------
 1 file changed, 28 insertions(+), 12 deletions(-)

diff --git a/src/components/AnalysisPanel.vue b/src/components/AnalysisPanel.vue
index 07dfb77..a88e493 100644
--- a/src/components/AnalysisPanel.vue
+++ b/src/components/AnalysisPanel.vue
@@ -3,24 +3,27 @@
     <!-- 头部 -->
     <header class="analysis-header">
       <h1 class="analysis-header-title">
-        <span style="font-size: var(--text-xl)">🎯</span> 写作范式分析
+        <IconLibrary name="analysis" :size="20" />
+        <span>写作范式分析</span>
       </h1>
       <span class="badge badge-primary">Pro版</span>
     </header>
 
     <!-- 标签页切换 -->
     <div class="analysis-tabs">
-        <button 
+        <button
           :class="['analysis-tab', activeTab === 'paradigms' ? 'active' : '']"
           @click="activeTab = 'paradigms'"
         >
-          📚 范式库
+          <IconLibrary name="folder" :size="16" class="mr-1.5" />
+          <span>范式库</span>
         </button>
-        <button 
+        <button
           :class="['analysis-tab', activeTab === 'tools' ? 'active' : '']"
           @click="activeTab = 'tools'"
         >
-          🔍 分析工具
+          <IconLibrary name="search" :size="16" class="mr-1.5" />
+          <span>分析工具</span>
         </button>
       </div>
 
@@ -33,10 +36,11 @@
             <div class="flex items-center gap-2">
               <button
                 @click="openRequirementParser"
-                class="btn btn-analysis btn-primary flex items-center gap-1"
+                class="btn btn-analysis btn-primary flex items-center gap-1.5"
                 title="根据需求文档自动提取范式"
               >
-                <span>🎯</span> AI 提取
+                <IconLibrary name="sparkles" :size="14" />
+                <span>AI 提取</span>
               </button>
               <button
                 @click="openAddModal"
@@ -68,16 +72,18 @@
                   @click.stop="openEditModal(paradigm)"
                   class="btn-action"
                   title="编辑范式"
+                  aria-label="编辑范式"
                 >
-                  ✏️
+                  <IconLibrary name="edit" :size="14" />
                 </button>
                 <button
                   v-if="isCustomParadigm(paradigm)"
                   @click.stop="deleteParadigm(paradigm)"
                   class="btn-action danger"
                   title="删除范式"
+                  aria-label="删除范式"
                 >
-                  🗑️
+                  <IconLibrary name="trash" :size="14" />
                 </button>
                 <button
                   v-if="selectedParadigm?.id === paradigm.id"
@@ -104,7 +110,10 @@
 
         <!-- 范式分析工具 -->
         <section v-show="activeTab === 'tools'" class="analysis-section">
-          <h3 class="text-sm font-medium text-secondary mb-4">🔍 范式分析工具</h3>
+          <h3 class="text-sm font-medium text-secondary mb-4 flex items-center gap-2">
+            <IconLibrary name="search" :size="16" />
+            <span>范式分析工具</span>
+          </h3>
           <textarea
             v-model="analysisText"
             class="analysis-textarea"
@@ -128,7 +137,10 @@
 
           <!-- 分析历史 -->
           <div v-if="analysisHistory.length > 0" class="mt-6">
-            <h4 class="text-xs font-medium text-muted mb-3">📝 分析历史</h4>
+            <h4 class="text-xs font-medium text-muted mb-3 flex items-center gap-2">
+              <IconLibrary name="edit" :size="14" />
+              <span>分析历史</span>
+            </h4>
             <div class="space-y-2">
               <div
                 v-for="(item, index) in analysisHistory"
@@ -164,6 +176,7 @@ import { useDatabaseStore } from '../stores/database.js'
 import DeepSeekAPI from '../api/deepseek.js'
 import { getParadigmList } from '../config/paradigms.js'
 import RequirementParserPanel from './RequirementParserPanel.vue'
+import IconLibrary from './icons/IconLibrary.vue'
 
 const appStore = useAppStore()
 const { analysisText, isAnalyzing } = storeToRefs(appStore)
@@ -198,7 +211,7 @@ const editForm = reactive({
   specializedPrompt: ''
 })
 
-// 图标选项
+// 图标选项 (保留 emoji 用于用户自定义范式图标选择器，TODO: 后续优化为 IconLibrary 选择器)
 const iconOptions = ['📝', '💻', '📊', '🚀', '📚', '🏛️', '🔥', '🏢', '💡', '🎯', '📋', '✨']
 
 // 颜色选项
@@ -608,6 +621,9 @@ onUnmounted(() => {
   border: none;
   cursor: pointer;
   transition: all var(--transition-fast);
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .analysis-tab:hover {