From 88ef0b4a0aefc13f1d026e235ecbdd15f3d969b4 Mon Sep 17 00:00:00 2001
From: cc500 <2014434568@qq.com>
Date: Wed, 9 Jul 2025 10:32:09 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=EF=BC=9A=E5=85=A8=E5=B1=80div=20=E9=BB=98=E8=AE=A4=E5=85=89?=
 =?UTF-8?q?=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/styles/base/index.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/assets/styles/base/index.scss b/src/assets/styles/base/index.scss
index a585ef3..4dbcb7a 100644
--- a/src/assets/styles/base/index.scss
+++ b/src/assets/styles/base/index.scss
@@ -22,4 +22,8 @@
 ::-webkit-scrollbar-thumb:hover {
   background-color: var(--o-scrollbar-thumb) !important;
   /* 鼠标悬停时的滚动条按钮颜色 */
+}
+div{
+  // 全局 div 默认光标
+  cursor: default !important;
 }
\ No newline at end of file
-- 
Gitee


From bf8c8a1f4187d9d80b456ac93ea17e5cf5db22e4 Mon Sep 17 00:00:00 2001
From: cc500 <2014434568@qq.com>
Date: Wed, 9 Jul 2025 17:12:52 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=EF=BC=9A=E7=9F=A5=E8=AF=86=E5=BA=93=E6=8F=8F=E8=BF=B0=E8=B6=85?=
 =?UTF-8?q?=E5=87=BA=E4=B8=A4=E8=A1=8C=E4=BD=BF=E7=94=A8=E6=B0=94=E6=B3=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/textMoreTootip/index.vue       | 29 ++++++-
 .../dialogue/components/MultiSelectTags.vue   | 81 +++++++++++++------
 2 files changed, 82 insertions(+), 28 deletions(-)

diff --git a/src/components/textMoreTootip/index.vue b/src/components/textMoreTootip/index.vue
index bc0db17..5da8d59 100644
--- a/src/components/textMoreTootip/index.vue
+++ b/src/components/textMoreTootip/index.vue
@@ -12,7 +12,7 @@
       class="box-item"
       effect="dark"
       :content="value"
-      placement="top"
+      :placement="placement"
     >
       {{ value }}
     </el-tooltip>
@@ -33,6 +33,11 @@ export default {
       type: [Number, String],
       default: 0,
     },
+     placement: {
+      //tooltip显示位置
+      type: String,
+      default: 'top',
+    },
   },
   data() {
     return {
@@ -60,10 +65,28 @@ export default {
         this.getStyle(this.row - 0);
       });
     },
+    placement: function () {
+      this.isShowHover = false;
+      this.textStyle = {
+        cursor: 'text',
+      };
+      this.$nextTick(() => {
+        this.getStyle(this.row - 0);
+      });
+    },
   },
   mounted() {
-    this.init();
-  },
+   this.observer = new ResizeObserver(() => {
+    // 监听窗口变化并保证div已经渲染完成
+    if (getComputedStyle(this.text).height !== 'auto') {
+        this.init();
+        this.getStyle(this.row - 0);
+        //及时关闭
+        this.observer?.disconnect();
+      }
+  });
+  this.observer.observe(this.text);
+},
   methods: {
     init() {
       this.div = document.querySelector('.hover-wrap');
diff --git a/src/views/dialogue/components/MultiSelectTags.vue b/src/views/dialogue/components/MultiSelectTags.vue
index 69b10d3..82e06de 100644
--- a/src/views/dialogue/components/MultiSelectTags.vue
+++ b/src/views/dialogue/components/MultiSelectTags.vue
@@ -1,9 +1,14 @@
 <script setup>
 import { api } from 'src/apis';
-import { IconCheckBold, IconXSolid,IconCaretRight} from '@computing/opendesign-icons';
+import {
+  IconCheckBold,
+  IconXSolid,
+  IconCaretRight,
+} from '@computing/opendesign-icons';
 import { ref, computed, onMounted, watch } from 'vue';
 import { useHistorySessionStore, useChangeThemeStore } from 'src/store';
 import { storeToRefs } from 'pinia';
+import TextMoreTootip from '@/components/textMoreTootip/index.vue';
 const themeStore = useChangeThemeStore();
 const { currentSelectedSession } = storeToRefs(useHistorySessionStore());
 const isModalOpen = ref(false);
@@ -11,6 +16,7 @@ const searchKey = ref('');
 const activeNames = ref([]);
 const emit = defineEmits(['updateValue']);
 const isTagsOverflow = ref(false);
+const popoverVisible = ref(false);
 const filterKnowledgeList = computed(() => {
   // filter by searchKey
   if (!searchKey.value) return availableitems.value;
@@ -80,6 +86,12 @@ const handleKnowledgeList = async () => {
       selectedTags.value.map((item) => item.kbId),
     );
     activeNames.value = res.result.teamKbList.map((item) => item.teamName);
+    popoverVisible.value = true;
+    document.querySelectorAll('.item-description').forEach((el) => {
+      if (isOverflow(el, 2)) {
+        el.classList.add('text-overflow-ellipsis');
+      }
+    });
   }
 };
 
@@ -198,28 +210,31 @@ const checkTagsOverflow = () => {
           <ul v-if="filterKnowledgeList.length">
             <el-collapse v-model="activeNames">
               <template v-for="item in filterKnowledgeList" :key="item.key">
-                <el-collapse-item :name="item.key" icon="CaretLeft" >
-                  <template #title="{ isActive }"> 
+                <el-collapse-item :name="item.key" icon="CaretLeft">
+                  <template #title="{ isActive }">
                     <el-icon
-                    class="el-collapse-item__arrow"
-                    :class="{ 'is-active': isActive }">{{isActive}}
+                      class="el-collapse-item__arrow"
+                      :class="{ 'is-active': isActive }"
+                    >
+                      {{ isActive }}
                       <IconCaretRight></IconCaretRight>
-                    </el-icon>{{activeNames.includes(item.key) }}
+                    </el-icon>
+                    {{ activeNames.includes(item.key) }}
                     <span>
                       {{ item.teamName }}
                     </span>
                   </template>
                   <template #icon="{ isActive }">
-                     <el-icon
-                    class="el-collapse-item__arrow"
-                    :class="{ 'is-active': isActive }">{{isActive}}
+                    <el-icon
+                      class="el-collapse-item__arrow"
+                      :class="{ 'is-active': isActive }"
+                    >
+                      {{ isActive }}
                       <IconCaretRight></IconCaretRight>
-                    </el-icon>{{activeNames.includes(item.key) }}{{activeNames}}
+                    </el-icon>
+                    {{ activeNames.includes(item.key) }}{{ activeNames }}
                   </template>
-                  <template
-                    v-for="(item, index) in item.kb_list"
-                    :key="index"
-                  >
+                  <template v-for="(item, index) in item.kb_list" :key="index">
                     <div
                       class="list-item"
                       :class="{ selected: isSelected(item) }"
@@ -232,9 +247,17 @@ const checkTagsOverflow = () => {
                             <el-icon>
                               <IconCheckBold />
                             </el-icon>
-                          </span> 
+                          </span>
+                        </div>
+                        <!-- <p class="item-description">{{ item.description }}</p> -->
+                        <div class="item-description">
+                          <TextMoreTootip
+                            v-if="popoverVisible"
+                            :value="item.description"
+                            :row="2"
+                            :placement="left"
+                          />
                         </div>
-                        <p class="item-description">{{ item.description }}</p>
                         <div class="item-id">ID: {{ item.kbId }}</div>
                       </div>
                     </div>
@@ -458,7 +481,7 @@ const checkTagsOverflow = () => {
   width: 342px;
   background-color: var(--el-bg-color);
   box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
-  z-index: 9999; /* 非常高的z-index确保在最上层 */
+  z-index: 99; /* 非常高的z-index确保在最上层 */
   display: flex;
   flex-direction: column;
   overflow: hidden;
@@ -525,9 +548,9 @@ const checkTagsOverflow = () => {
   }
 
   &.selected {
-    border-color: #6395FD;
-    background-color: #6395FD;
-    outline: 2px solid #6395FD;
+    border-color: #6395fd;
+    background-color: #6395fd;
+    outline: 2px solid #6395fd;
 
     &::after {
       content: '';
@@ -538,7 +561,7 @@ const checkTagsOverflow = () => {
       height: 0;
       border-style: solid;
       border-width: 0 24px 24px 0;
-      border-color: transparent #6395FD transparent transparent;
+      border-color: transparent #6395fd transparent transparent;
       border-radius: 0px 4px;
     }
   }
@@ -582,10 +605,14 @@ const checkTagsOverflow = () => {
 }
 
 .item-description {
-  font-size: 12px !important;
-  margin: 0;
-  color: var(--o-text-color-secondary);
-  font-size: 14px;
+  width: 100%;
+  min-height: 42.45px;
+  .vue-text {
+    font-size: 12px !important;
+    margin: 0;
+    color: var(--o-text-color-secondary) !important;
+    font-size: 14px;
+  }
 }
 
 .item-id {
@@ -622,4 +649,8 @@ const checkTagsOverflow = () => {
 .slide-leave-from {
   transform: translateX(0);
 }
+
+.popover {
+  z-index: 999999;
+}
 </style>
-- 
Gitee