Merge pull request #2305 from xinnan-tech/his_download

add:首页智能体添加搜索记录

main/manager-web/src/components/HeaderBar.vue

@@ -66,10 +66,29 @@
       <!-- 右侧元素 -->
       <div class="header-right">
         <div class="search-container" v-if="$route.path === '/home' && !(isSuperAdmin && isSmallScreen)">
-          <el-input v-model="search" :placeholder="$t('header.searchPlaceholder')" class="custom-search-input"
-            @keyup.enter.native="handleSearch">
-            <i slot="suffix" class="el-icon-search search-icon" @click="handleSearch"></i>
-          </el-input>
+          <div class="search-wrapper">
+            <el-input v-model="search" :placeholder="$t('header.searchPlaceholder')" class="custom-search-input"
+              @keyup.enter.native="handleSearch" @focus="showSearchHistory" @blur="hideSearchHistory" clearable
+              ref="searchInput">
+              <i slot="suffix" class="el-icon-search search-icon" @click="handleSearch"></i>
+            </el-input>
+            <!-- 搜索历史下拉框 -->
+            <div v-if="showHistory && searchHistory.length > 0" class="search-history-dropdown">
+              <div class="search-history-header">
+                <span>{{ $t('header.searchHistory') }}</span>
+                <el-button type="text" size="small" class="clear-history-btn" @click="clearSearchHistory">
+                  {{ $t('header.clearHistory') }}
+                </el-button>
+              </div>
+              <div class="search-history-list">
+                <div v-for="(item, index) in searchHistory" :key="index" class="search-history-item"
+                  @click.stop="selectSearchHistory(item)">
+                  <span class="history-text">{{ item }}</span>
+                  <i class="el-icon-close clear-item-icon" @click.stop="removeSearchHistory(index)"></i>
+                </div>
+              </div>
+            </div>
+          </div>
         </div>
 
         <!-- 语言切换下拉菜单 -->
@@ -99,7 +118,7 @@
           </span>
           <el-dropdown-menu slot="dropdown">
             <el-dropdown-item @click.native="showChangePasswordDialog">{{ $t('header.changePassword')
-              }}</el-dropdown-item>
+            }}</el-dropdown-item>
             <el-dropdown-item @click.native="handleLogout">{{ $t('header.logout') }}</el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
@@ -134,7 +153,12 @@ export default {
       userDropdownVisible: false,
       paramDropdownVisible: false,
       languageDropdownVisible: false,
-      isSmallScreen: false
+      isSmallScreen: false,
+      // 搜索历史相关
+      searchHistory: [],
+      showHistory: false,
+      SEARCH_HISTORY_KEY: 'xiaozhi_search_history',
+      MAX_HISTORY_COUNT: 3
     }
   },
   computed: {
@@ -165,6 +189,8 @@ export default {
     this.fetchUserInfo();
     this.checkScreenSize();
     window.addEventListener('resize', this.checkScreenSize);
+    // 从localStorage加载搜索历史
+    this.loadSearchHistory();
   },
   //移除事件监听器
   beforeDestroy() {
@@ -222,6 +248,9 @@ export default {
         return;
       }
 
+      // 保存搜索历史
+      this.saveSearchHistory(searchValue);
+
       try {
         // 创建不区分大小写的正则表达式
         const regex = new RegExp(searchValue, 'i');
@@ -234,6 +263,85 @@ export default {
           showClose: true
         });
       }
+
+      // 搜索完成后让输入框失去焦点，从而触发blur事件隐藏搜索历史
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.blur();
+      }
+    },
+
+    // 显示搜索历史
+    showSearchHistory() {
+      this.showHistory = true;
+    },
+
+    // 隐藏搜索历史
+    hideSearchHistory() {
+      // 延迟隐藏，以便点击事件能够执行
+      setTimeout(() => {
+        this.showHistory = false;
+      }, 200);
+    },
+
+    // 加载搜索历史
+    loadSearchHistory() {
+      try {
+        const history = localStorage.getItem(this.SEARCH_HISTORY_KEY);
+        if (history) {
+          this.searchHistory = JSON.parse(history);
+        }
+      } catch (error) {
+        console.error('加载搜索历史失败:', error);
+        this.searchHistory = [];
+      }
+    },
+
+    // 保存搜索历史
+    saveSearchHistory(keyword) {
+      if (!keyword || this.searchHistory.includes(keyword)) {
+        return;
+      }
+
+      // 添加到历史记录开头
+      this.searchHistory.unshift(keyword);
+
+      // 限制历史记录数量
+      if (this.searchHistory.length > this.MAX_HISTORY_COUNT) {
+        this.searchHistory = this.searchHistory.slice(0, this.MAX_HISTORY_COUNT);
+      }
+
+      // 保存到localStorage
+      try {
+        localStorage.setItem(this.SEARCH_HISTORY_KEY, JSON.stringify(this.searchHistory));
+      } catch (error) {
+        console.error('保存搜索历史失败:', error);
+      }
+    },
+
+    // 选择搜索历史项
+    selectSearchHistory(keyword) {
+      this.search = keyword;
+      this.handleSearch();
+    },
+
+    // 移除单个搜索历史项
+    removeSearchHistory(index) {
+      this.searchHistory.splice(index, 1);
+      try {
+        localStorage.setItem(this.SEARCH_HISTORY_KEY, JSON.stringify(this.searchHistory));
+      } catch (error) {
+        console.error('更新搜索历史失败:', error);
+      }
+    },
+
+    // 清空所有搜索历史
+    clearSearchHistory() {
+      this.searchHistory = [];
+      try {
+        localStorage.removeItem(this.SEARCH_HISTORY_KEY);
+      } catch (error) {
+        console.error('清空搜索历史失败:', error);
+      }
     },
     // 显示修改密码弹窗
     showChangePasswordDialog() {
@@ -371,6 +479,77 @@ export default {
   max-width: none;
 }
 
+.search-wrapper {
+  position: relative;
+}
+
+.search-history-dropdown {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  background: white;
+  border: 1px solid #e4e6ef;
+  border-radius: 4px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+  margin-top: 2px;
+}
+
+.search-history-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 12px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #909399;
+}
+
+.clear-history-btn {
+  color: #909399;
+  font-size: 11px;
+  padding: 0;
+  height: auto;
+}
+
+.clear-history-btn:hover {
+  color: #606266;
+}
+
+.search-history-list {
+  max-height: 200px;
+  overflow-y: auto;
+}
+
+.search-history-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 12px;
+  cursor: pointer;
+  font-size: 12px;
+  color: #606266;
+}
+
+.search-history-item:hover {
+  background-color: #f5f7fa;
+}
+
+.clear-item-icon {
+  font-size: 10px;
+  color: #909399;
+  visibility: hidden;
+}
+
+.search-history-item:hover .clear-item-icon {
+  visibility: visible;
+}
+
+.clear-item-icon:hover {
+  color: #ff4949;
+}
+
 .custom-search-input>>>.el-input__inner {
   height: 18px;
   border-radius: 9px;

main/manager-web/src/i18n/en.js

@@ -15,6 +15,8 @@ export default {
   'header.paramManagement': 'Params Management',
   'header.dictManagement': 'Dict Management',
   'header.agentTemplate': 'Default Role Templates', // 添加这一行
+  'header.searchHistory': 'Search History',
+  'header.clearHistory': 'Clear History',
 
   // McpToolCallDialog component text
   'mcpToolCall.title': 'Tool Call',

main/manager-web/src/i18n/zh_CN.js

@@ -15,6 +15,8 @@ export default {
   'header.paramManagement': '参数管理',
   'header.dictManagement': '字典管理',
   'header.agentTemplate': '默认角色模板',
+  'header.searchHistory': '搜索历史',
+  'header.clearHistory': '清空历史',
 
   // McpToolCallDialog组件文本
   'mcpToolCall.title': '工具调用',

main/manager-web/src/i18n/zh_TW.js

@@ -15,6 +15,8 @@ export default {
   'header.paramManagement': '參數管理',
   'header.dictManagement': '字典管理',
   'header.agentTemplate': '預設角色模板', // 添加这一行
+  'header.searchHistory': '搜索歷史',
+  'header.clearHistory': '清空歷史',
 
   // McpToolCallDialog组件文本
   'mcpToolCall.title': '工具調用',