浏览代码

feat: 调整历史记录智能体的图标

zhupei@smartai.com 1 年之前
父节点
当前提交
715ad253a3

+ 2 - 0
src/modules/conversation-board/api-conversation-board.js

@@ -148,6 +148,8 @@ export const conversationBoardAgentList = (params) => {
 
               arr.push({
                 name: item.name,
+                icon: item.icon,
+                img: item.img,
                 description: item.desc,
                 id: item.id,
                 agentType: item.agent_type,

+ 5 - 2
src/modules/conversation-history/HistoryItem.vue

@@ -9,7 +9,8 @@
 
   <div v-if="show_current_item" :class="item_klass">
     <div class="history-item-icon" @click="handleClick">
-      <img :src="history_icon" />
+      <!-- <img :src="history_icon" /> -->
+      <img :src="agent_icon" />
     </div>
 
     <div class="history-item-intro">
@@ -36,7 +37,9 @@ import BtnHistoryItemDelete from './BtnHistoryItemDelete.vue';
 
 const props = defineProps({
   history: Object,
-  index: Number
+  index: Number,
+
+  agent_icon: String
 });
 
 const emit = defineEmits(['active', 'delete']);

+ 4 - 1
src/modules/conversation-history/HistoryList.vue

@@ -6,6 +6,7 @@
         :key="item.id"
         :history="item"
         :index="index"
+        :agent_icon="agent_icon"
         @active="handleItemClick"
         @delete="handleItemDelete"
       />
@@ -24,7 +25,9 @@ const props = defineProps({
   list: Array,
 
   // 是否可以加载更多
-  can_loadmore: Boolean
+  can_loadmore: Boolean,
+
+  agent_icon: String
 });
 
 const emit = defineEmits(['active', 'delete', 'loadmore']);

+ 4 - 2
src/modules/conversation-history/HistorySearchInput.vue

@@ -1,8 +1,6 @@
 <template>
   <div class="conversation-search-input">
     <div class="search-input-content">
-      <slot></slot>
-
       <div class="search-input-icon icon-search">
         <icon-search />
       </div>
@@ -22,6 +20,8 @@
       <div class="search-input-icon icon-clear" v-if="show_clear" @click="handleInputClear">
         <icon-close />
       </div>
+
+      <slot></slot>
     </div>
   </div>
 </template>
@@ -102,6 +102,8 @@ const handleInputClear = () => {
 
   width: 26px;
   height: 26px;
+
+  font-size: 22px;
 }
 .search-input-icon.icon-search {
   margin-left: 5px;

+ 48 - 3
src/modules/conversation-history/HistoryTypeDropdown.vue

@@ -1,6 +1,12 @@
 <template>
   <a-dropdown trigger="hover" :defaultValue="btn_label_str">
-    <a-button v-if="api_status === 1" class="history-type-btn" type="text">{{ btn_label_str }}</a-button>
+    <a-button v-if="api_status === 1" class="history-type-btn" type="text">
+      <img :src="btn_label_icon" class="agent-icon-img" />
+
+      <span class="label-text">{{ btn_label_str }}</span>
+
+      <span class="nav-item-icon arrow-down"><img src="../../assets/arrow-down.png" /></span>
+    </a-button>
     <a-button v-if="api_status === 2" class="history-type-btn" type="text"><a-spin :size="16" /></a-button>
     <a-button v-if="api_status === 3" class="history-type-btn" type="text">{{ btn_label_str }}</a-button>
 
@@ -11,8 +17,12 @@
         :disabled="disabled_options"
         :value="item.name"
         @click="handleChatTypeConfirm(item)"
-        >{{ item.name }}</a-doption
       >
+        <div class="dropdown-container">
+          <img :src="getIconIntelligent(item.icon)" class="agent-icon-img" />
+          <span>{{ item.name }}</span>
+        </div>
+      </a-doption>
     </template>
   </a-dropdown>
 </template>
@@ -23,6 +33,8 @@ import { ref, computed, onMounted } from 'vue';
 import useAgentList4History from '../conversation-board/use-agent-list-4-history';
 import { useRecentSearchTypeStore } from '../../base/store/use-recent-history-search-type';
 
+import { getIconIntelligent } from '../common/icon-map';
+
 const props = defineProps({
   /**
    * api状态
@@ -65,6 +77,14 @@ const btn_label_str = computed(() => {
   return recentSearchType?.search_type?.name || '';
 });
 
+const btn_label_icon = computed(() => {
+  if (recentSearchType.search_type && recentSearchType.search_type.icon) {
+    return getIconIntelligent(recentSearchType.search_type.icon);
+  }
+
+  return '';
+});
+
 /**
  * 是否禁用下拉菜单
  * 当列表正在加载时,应该禁用下拉菜单
@@ -92,11 +112,36 @@ onMounted(() => {
 .history-type-btn {
   font-size: 16px;
 
-  max-width: 100px;
+  max-width: 140px;
+
+  display: flex;
+  align-items: center;
+}
+
+.agent-icon-img {
+  width: 20px;
+  display: inline-block;
+  margin-right: 5px;
+}
+
+.label-text {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 1; /* 这里设置显示的行数 */
   line-clamp: 1;
   overflow: hidden;
 }
+
+.dropdown-container {
+  display: flex;
+  align-items: center;
+}
+
+.nav-item-icon.arrow-down {
+  margin-left: 2px;
+}
+
+.nav-item-icon.arrow-down img {
+  width: 14px;
+}
 </style>

+ 9 - 0
src/views/conversation/ConversationHistoryContainer.vue

@@ -13,6 +13,7 @@
         v-if="list_history.length !== 0"
         :list="list_history"
         :can_loadmore="can_loadmore"
+        :agent_icon="agent_icon"
         @loadmore="handleListLoadMore"
         @active="handleListItemActive"
       />
@@ -54,6 +55,8 @@ import HistoryTypeDropdown from '../../modules/conversation-history/HistoryTypeD
 
 import { apiConversationHistoryList } from '../../modules/conversation-history/api-conversation-history';
 
+import { getIconIntelligent } from '../../modules/common/icon-map';
+
 import { getTodayZeroTimestamp, ONE_DAY, ONE_MONTH } from '../../utils/datetime';
 
 const emit = defineEmits(['historyActive']);
@@ -77,6 +80,9 @@ const count_today = ref(0); // 记录今天的数据量
 const count_month = ref(0); // 记录本月的数据量
 const count_earlier = ref(0); // 记录更早的数据量
 
+// 智能体的图标
+const agent_icon = ref('');
+
 const today_zero = getTodayZeroTimestamp(); // 今天零点
 const yesterday_zero = today_zero - ONE_DAY; // 昨天零点
 const last_month_zero = yesterday_zero - ONE_MONTH; // 上个月(30天之前的)零点
@@ -302,6 +308,9 @@ const handleTypeSelected = (type_item) => {
   count_month.value = 0;
   count_earlier.value = 0;
 
+  // 设置智能体的图标
+  agent_icon.value = getIconIntelligent(type_item.icon);
+
   // 记录Agent ID
   agent_id.value = type_item.id;