From 0ab2ce814a49f5805b363418b7139c860a94162f Mon Sep 17 00:00:00 2001
From: wangyifeng <812766448@qq.com>
Date: Wed, 21 May 2025 11:41:03 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E6=90=9C=E7=B4=A2=E8=81=8A?=
 =?UTF-8?q?=E5=A4=A9=E8=AE=B0=E5=BD=95=E7=BB=84=E4=BB=B6=E6=90=9C=E7=B4=A2?=
 =?UTF-8?q?=E6=97=B6=EF=BC=8C=E6=94=B9=E5=8F=98=E6=90=9C=E7=B4=A2=E5=85=B3?=
 =?UTF-8?q?=E9=94=AE=E5=AD=97=E6=B2=A1=E6=9C=89=E6=AD=A3=E7=A1=AE=E8=B0=83?=
 =?UTF-8?q?=E7=94=A8=E6=8E=A5=E5=8F=A3=E3=80=81=E5=A4=84=E7=90=86=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E7=BB=93=E6=9E=9C=E6=98=BE=E7=A4=BA=E7=AD=89=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/customModal.vue    |   4 +-
 src/components/group/GroupPanel.vue      |   3 +-
 src/components/search/searchItem.vue     |  59 +++++---
 src/components/search/searchList.vue     |  49 ++++---
 src/utils/auth.js                        |   2 +-
 src/views/message/inner/IndexContent.vue |   2 +-
 src/views/message/inner/IndexSider.vue   | 163 ++++++++++++++++++-----
 7 files changed, 207 insertions(+), 75 deletions(-)

diff --git a/src/components/common/customModal.vue b/src/components/common/customModal.vue
index bfee602..1191784 100644
--- a/src/components/common/customModal.vue
+++ b/src/components/common/customModal.vue
@@ -80,7 +80,7 @@ const props = defineProps({
   }
 })
 
-const emit = defineEmits(['update:show', 'cancel', 'confirm'])
+const emit = defineEmits(['update:show', 'cancel', 'confirm', 'customCloseModal'])
 
 const show = computed({
   get: () => props.show,
@@ -111,7 +111,7 @@ const state = reactive({
 
 const handleCloseModal = () => {
   if (props.customCloseEvent) {
-    emit('closeModal')
+    emit('customCloseModal')
   } else {
     show.value = false
   }
diff --git a/src/components/group/GroupPanel.vue b/src/components/group/GroupPanel.vue
index 2416885..2c11bed 100644
--- a/src/components/group/GroupPanel.vue
+++ b/src/components/group/GroupPanel.vue
@@ -740,7 +740,8 @@ const handleEditGroupNameConfirm = () => {
 
   <UserCardModal
     v-model:show="state.isShowUserCardModal"
-    v-model:uid="(state.userInfo as any).erp_user_id"
+    v-model:uid="(state.userInfo as any).user_id"
+    :euid="(state.userInfo as any).erp_user_id"
   />
 </template>
 <style lang="less" scoped>
diff --git a/src/components/search/searchItem.vue b/src/components/search/searchItem.vue
index 4aac4e4..c88a52e 100644
--- a/src/components/search/searchItem.vue
+++ b/src/components/search/searchItem.vue
@@ -4,7 +4,7 @@
     :class="props?.conditionType ? 'search-item-condition' : ''"
     v-if="resultName"
     :style="{
-      'margin': props.searchResultKey === 'talk_record_infos_receiver' ? '12px 0 0' : '',
+      margin: props.searchResultKey === 'talk_record_infos_receiver' ? '12px 0 0' : '',
       'background-color': props.isClickStay ? '#EEE9F8' : ''
     }"
   >
@@ -70,6 +70,9 @@
           :text="resultDetail"
           :searchText="props.searchText"
         />
+        <div class="searchRecordDetail-fastLocal" v-if="searchRecordDetail">
+          <span>定位到聊天位置</span>
+        </div>
       </div>
     </div>
     <div class="search-item-pointer" v-if="pointerIconSrc">
@@ -270,25 +273,25 @@ const resultDetail = computed(() => {
   cursor: pointer;
   position: relative;
 
-  .search-item-avatar{
+  .search-item-avatar {
     position: relative;
     .info-tag {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        justify-content: center;
-        padding: 0px 6px;
-        border: 1px solid #000;
-        border-radius: 3px;
-        flex-shrink: 0;
-        background-color: #fff;
-        position: absolute;
-        bottom: 0;
-        left: 4px;
-        span {
-          line-height: 14px;
-        }
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      padding: 0px 6px;
+      border: 1px solid #000;
+      border-radius: 3px;
+      flex-shrink: 0;
+      background-color: #fff;
+      position: absolute;
+      bottom: 0;
+      left: 4px;
+      span {
+        line-height: 14px;
       }
+    }
   }
 
   .result-info {
@@ -320,10 +323,24 @@ const resultDetail = computed(() => {
       }
     }
     .info-detail-searchRecordDetail {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
       span {
         color: #191919;
         word-break: break-all;
       }
+      .searchRecordDetail-fastLocal {
+        display: none;
+        line-height: 20px;
+        span {
+          color: #46299d;
+          font-size: 12px;
+          font-weight: 400;
+          line-height: 17px;
+        }
+      }
     }
   }
   .search-item-pointer {
@@ -339,7 +356,7 @@ const resultDetail = computed(() => {
     }
   }
 }
-.search-item::after{
+.search-item::after {
   content: '';
   display: block;
   width: 100%;
@@ -355,5 +372,11 @@ const resultDetail = computed(() => {
 }
 .search-item:hover {
   background-color: #f8f8f8;
+
+  .info-detail-searchRecordDetail {
+    .searchRecordDetail-fastLocal {
+      display: block;
+    }
+  }
 }
 </style>
diff --git a/src/components/search/searchList.vue b/src/components/search/searchList.vue
index cd9e97e..539e26a 100644
--- a/src/components/search/searchList.vue
+++ b/src/components/search/searchList.vue
@@ -2,6 +2,7 @@
   <div class="search-list">
     <n-infinite-scroll
       :style="{ maxHeight: props.searchResultMaxHeight }"
+      :distance="47"
       @load="doLoadMore"
     >
       <div class="search-result">
@@ -19,12 +20,19 @@
                 searchResultKey !== 'group_infos' &&
                 searchResultKey !== 'group_member_infos'
               "
+              :style="{ margin: props.useCustomTitle ? '0' : '' }"
             >
-              <div class="result-title">
+              <!-- <div class="result-title" v-if="!props.useCustomTitle">
                 <span class="text-[14px] font-regular">
                   {{ getResultKeysValue(searchResultKey) }}
                 </span>
-              </div>
+              </div> -->
+              <slot
+                name="result-title"
+                :getResultKeysValue="getResultKeysValue"
+                :searchResultKey="searchResultKey"
+                :searchResultIndex="searchResultIndex"
+              ></slot>
               <div class="result-list">
                 <div
                   class="result-list-each"
@@ -144,7 +152,8 @@ const emits = defineEmits([
   'toMoreResultPage',
   'lastIdChange',
   'clickSearchItem',
-  'clickStayItemChange'
+  'clickStayItemChange',
+  'resultTotalCount'
 ])
 
 const state = reactive({
@@ -201,7 +210,11 @@ const props = defineProps({
   searchResultMaxHeight: {
     type: String,
     default: '677px'
-  } //搜索结果最大高度
+  }, //搜索结果最大高度
+  useCustomTitle: {
+    type: Boolean,
+    default: false
+  } //是否使用自定义标题
 })
 
 onMounted(() => {
@@ -223,6 +236,12 @@ watch(
 watch(
   () => props.searchText,
   (newVal, oldVal) => {
+    // 同步更新 state.searchText
+    state.searchText = newVal
+    // 清空搜索结果
+    state.searchResult = null
+    // 重置页码
+    state.pageNum = 1
     //重置点击停留列表项
     state.clickStayItem = ''
     emits('clickStayItemChange', state.clickStayItem)
@@ -232,18 +251,6 @@ watch(
   }
 )
 
-//输入搜索文本
-const inputSearchText = (e) => {
-  if (e.trim() != state.searchText.trim()) {
-    state.pageNum = 1
-    state.searchResult = null // 清空搜索结果
-  }
-  state.searchText = e.trim()
-  if (!e.trim()) {
-    state.searchResult = null // 清空搜索结果
-  }
-}
-
 // ES搜索聊天记录-主页搜索什么都有、指定用户、指定群、群与用户概览
 const queryAllSearch = (doClearSearchResult) => {
   if (doClearSearchResult) {
@@ -369,6 +376,7 @@ const queryAllSearch = (doClearSearchResult) => {
           } else {
             state.hasMore = true
           }
+          emits('resultTotalCount', total)
           // zPaging.value?.completeByTotal([data], total)
         } else {
           state.searchResult = data
@@ -534,10 +542,9 @@ const doLoadMore = (doClearSearchResult) => {
     return
   }
   state.loading = true
-  queryAllSearch(doClearSearchResult)
-    .finally(() => {
-      state.loading = false
-    })
+  queryAllSearch(doClearSearchResult).finally(() => {
+    state.loading = false
+  })
 }
 </script>
 <style lang="scss" scoped>
@@ -573,7 +580,7 @@ const doLoadMore = (doClearSearchResult) => {
       // padding: 0 10px;
 
       .search-result-part {
-        margin: 18px 0 0;
+        // margin: 18px 0 0;
 
         .result-title {
           padding: 0 10px 5px;
diff --git a/src/utils/auth.js b/src/utils/auth.js
index f9864ce..605aea5 100644
--- a/src/utils/auth.js
+++ b/src/utils/auth.js
@@ -18,7 +18,7 @@ export function isLoggedIn() {
  */
 export function getAccessToken() {
   // return storage.get(AccessToken) || ''
-  return JSON.parse(localStorage.getItem('token'))||'79b5c732d96d2b27a48a99dfd4a5566c43aaa5796242e854ebe3ffc198d6876b9628e7b764d9af65ab5dbb2d517ced88170491b74b048c0ba827c0d3741462cb89dc59ed46653a449af837a8262941caaef1334d640773710f8cd96473bacfb190cba595a5d6a9c87d70f0999a3ebb41147213b31b4bdccffca66a56acf3baab5af0154f0dce360079f37709f78e13711036899344bddb0fb4cf0f2890287cb62c3fcbe33368caa5e213624577be8b8420ab75b1f50775ee16142a4321c5d56995f37354a66a969da98d95ba6e65d142ed097e04b411c1ebad2f62866d0ec7e1838420530a9941dbbcd00490199f8b89a542742bebcc3862e86adbcf9b360820a497764e7432d66963e70eb29f9eab5268ee8efa98eed3c981eea690d977b38b76b3a9a6b51bb685000752d9d26f98a91f4df6970ad165c5299f9eb77d0c40ed'
+  return JSON.parse(localStorage.getItem('token'))||'79b5c732d96d2b27a48a99dfd4a5566c43aaa5796242e854ebe3ffc198d6876b9628e7b764d9af65ab5dbb2d517ced88170491b74b048c0ba827c0d3741462cb89dc59ed46653a449af837a8262941caaef1334d640773710f8cd96473bacfb190cba595a5d6a9c87d70f0999a3ebb41147213b31b4bdccffca66a56acf3baab5af0154f0dce360079f37709f78e13711036899344bddb0fb4cf0f2890287cb62c3fcbe33368caa5e213624577be8b8420ab75b1f50775ee16142a4321c5d56995f37354a66a969da98d95ba6e65d142ed097e04b411c1ebad2f62866d0ec7e1838420530a9941dbbcd00490199f8b89855de0ffae3adff28137845adce8c6b2c8160f779573f4e6553e86ac85dc8e689aa8970c6a4de122173f4db7bf7cdfa3ca7796d181a43b3fdf8ec549a8f33c82fbab7f0175efce75aca5cf6188ccf2a8'
 }
 
 /**
diff --git a/src/views/message/inner/IndexContent.vue b/src/views/message/inner/IndexContent.vue
index f249cea..46b8fb9 100644
--- a/src/views/message/inner/IndexContent.vue
+++ b/src/views/message/inner/IndexContent.vue
@@ -544,7 +544,7 @@ const handleGroupNoticeModalShow = (isAdmin) => {
     @confirm="handleGroupNoticeModalConfirm"
     @cancel="handleGroupNoticeModalCancel"
     :customCloseEvent="state.groupNoticeEditMode === 2 ? true : false"
-    @closeModal="handleGroupNoticeModalClose"
+    @customCloseModal="handleGroupNoticeModalClose"
   >
     <template #content>
       <div class="group-notice-modal-content">
diff --git a/src/views/message/inner/IndexSider.vue b/src/views/message/inner/IndexSider.vue
index 3dc6db6..385e608 100644
--- a/src/views/message/inner/IndexSider.vue
+++ b/src/views/message/inner/IndexSider.vue
@@ -23,7 +23,7 @@ import {
   NButton,
   NPagination
 } from 'naive-ui'
-import { Search, Plus } from '@icon-park/vue-next'
+import { Search, Plus, Right } from '@icon-park/vue-next'
 import TalkItem from './TalkItem.vue'
 import Skeleton from './Skeleton.vue'
 import { ServeClearTalkUnreadNum } from '@/api/chat'
@@ -39,7 +39,7 @@ import { processError, processSuccess } from '@/utils/helper/message.js'
 import chatAppSearchList from '@/components/search/searchList.vue'
 import { ServeSeachQueryAll, ServeQueryTalkRecord, ServeUserGroupChatList } from '@/api/search'
 import { getUserInfoByERPUserId } from '@/api/user'
-
+import HighlightText from '@/components/search/highLightText.vue'
 import { useRouter } from 'vue-router'
 const router = useRouter()
 
@@ -103,7 +103,29 @@ const renderChatAppSearch = () => {
         console.log(searchResultKey, searchText)
       }
     },
-    {}
+    {
+      'result-title': ({ getResultKeysValue, searchResultKey, searchResultIndex }) => {
+        return h(
+          'div',
+          {
+            style: {
+              padding: searchResultIndex === 0 ? '6px 10px 5px' : '18px 10px 5px',
+              borderBottom: '1px solid #f8f8f8'
+            }
+          },
+          [
+            h(
+              'span',
+              {
+                class: 'text-[14px] font-regular',
+                style: 'line-height: 20px; color: #999999;'
+              },
+              getResultKeysValue(searchResultKey)
+            )
+          ]
+        )
+      }
+    }
   )
 }
 
@@ -264,7 +286,8 @@ const state = reactive({
   searchDetailList: {
     searchText: '',
     apiParams: '',
-    lastId: undefined as any
+    lastId: undefined as any,
+    total: 0
   }
 })
 
@@ -320,14 +343,16 @@ watch(
   (newVal, oldVal) => {
     // 重置左侧
     state.searchList.searchText = newVal
-    state.searchList.apiParams = encodeURIComponent(JSON.stringify({
-      talk_type: 0,
-      receiver_id: 0,
-      last_group_id: 0,
-      last_member_id: 0,
-      last_receiver_user_name: '',
-      last_receiver_group_name: ''
-    }))
+    state.searchList.apiParams = encodeURIComponent(
+      JSON.stringify({
+        talk_type: 0,
+        receiver_id: 0,
+        last_group_id: 0,
+        last_member_id: 0,
+        last_receiver_user_name: '',
+        last_receiver_group_name: ''
+      })
+    )
     state.searchList.lastId = undefined
     // 重置右侧
     state.searchDetailList.searchText = newVal
@@ -346,8 +371,8 @@ const indexName = computed(() => dialogueStore.index_name)
 
 // 切换会话
 const onTabTalk = (item: ISession, follow = false) => {
-  console.log('onTabTalk');
-  
+  console.log('onTabTalk')
+
   if (item.index_name === indexName.value) return
 
   searchKeyword.value = ''
@@ -578,12 +603,14 @@ const handleClickSearchItem = (searchText, searchResultKey, talk_type, receiver_
   if (searchResultKey === 'general_infos') {
     // 先清空右侧
     state.isShowSearchRecordDetailInfo = false
-    state.searchDetailList.apiParams = encodeURIComponent(JSON.stringify({
-      last_group_id: 0,
-      last_member_id: 0,
-      receiver_id: receiver_id,
-      talk_type: talk_type
-    }))
+    state.searchDetailList.apiParams = encodeURIComponent(
+      JSON.stringify({
+        last_group_id: 0,
+        last_member_id: 0,
+        receiver_id: receiver_id,
+        talk_type: talk_type
+      })
+    )
     state.searchDetailList.searchText = state.searchRecordText
     state.searchDetailList.lastId = undefined
     // 再显示
@@ -608,19 +635,52 @@ const searchListRef = ref()
 const searchDetailListRef = ref()
 
 // lastIdChange 事件区分来源
-const handleSearchListLastIdChange = (last_id, last_group_id, last_member_id, last_receiver_user_name, last_receiver_group_name) => {
-  state.searchList.lastId = { last_id, last_group_id, last_member_id, last_receiver_user_name, last_receiver_group_name }
-  state.searchList.apiParams = encodeURIComponent(JSON.stringify({
-    ...JSON.parse(decodeURIComponent(state.searchList.apiParams)),
-    last_id, last_group_id, last_member_id, last_receiver_user_name, last_receiver_group_name
-  }))
+const handleSearchListLastIdChange = (
+  last_id,
+  last_group_id,
+  last_member_id,
+  last_receiver_user_name,
+  last_receiver_group_name
+) => {
+  state.searchList.lastId = {
+    last_id,
+    last_group_id,
+    last_member_id,
+    last_receiver_user_name,
+    last_receiver_group_name
+  }
+  state.searchList.apiParams = encodeURIComponent(
+    JSON.stringify({
+      ...JSON.parse(decodeURIComponent(state.searchList.apiParams)),
+      last_id,
+      last_group_id,
+      last_member_id,
+      last_receiver_user_name,
+      last_receiver_group_name
+    })
+  )
 }
 const handleSearchDetailListLastIdChange = (last_id, last_group_id, last_member_id) => {
   state.searchDetailList.lastId = { last_id, last_group_id, last_member_id }
-  state.searchDetailList.apiParams = encodeURIComponent(JSON.stringify({
-    ...JSON.parse(decodeURIComponent(state.searchDetailList.apiParams)),
-    last_id, last_group_id, last_member_id
-  }))
+  state.searchDetailList.apiParams = encodeURIComponent(
+    JSON.stringify({
+      ...JSON.parse(decodeURIComponent(state.searchDetailList.apiParams)),
+      last_id,
+      last_group_id,
+      last_member_id
+    })
+  )
+}
+
+// 关闭搜索聊天记录模态框
+const handleCloseSearchRecordModal = () => {
+  state.isShowSearchRecordModal = false
+  state.searchRecordText = ''
+}
+
+// 获取搜索结果总数
+const getResultTotalCount = (total) => {
+  state.searchDetailList.total = total
 }
 </script>
 
@@ -836,6 +896,8 @@ const handleSearchDetailListLastIdChange = (last_id, last_group_id, last_member_
     :style="state.customSearchRecordModalStyle"
     :customCloseBtn="true"
     :closable="false"
+    :customCloseEvent="true"
+    @customCloseModal="handleCloseSearchRecordModal"
   >
     <template #content>
       <div class="search-record-modal-content">
@@ -872,6 +934,22 @@ const handleSearchDetailListLastIdChange = (last_id, last_group_id, last_member_
               ></chatAppSearchList>
             </div>
             <div class="search-record-detail">
+              <div class="search-record-detail-header" v-if="state.isShowSearchRecordDetailInfo">
+                <HighlightText
+                  class="text-[14px] text-[#B0B0B0] leading-[20px]"
+                  :text="
+                    state.searchDetailList.total +
+                    '条与“' +
+                    state.searchRecordText +
+                    '”相关的搜索结果'
+                  "
+                  :searchText="state.searchRecordText"
+                />
+                <div class="search-record-detail-header-btn">
+                  <span>进入聊天</span>
+                  <n-icon :component="Right" color="#46299D" size="14px" />
+                </div>
+              </div>
               <chatAppSearchList
                 ref="searchDetailListRef"
                 v-if="state.isShowSearchRecordDetailInfo"
@@ -883,7 +961,8 @@ const handleSearchDetailListLastIdChange = (last_id, last_group_id, last_member_
                 :isPagination="true"
                 :searchRecordDetail="true"
                 @lastIdChange="handleSearchDetailListLastIdChange"
-                :searchResultMaxHeight="'517px'"
+                :searchResultMaxHeight="'469px'"
+                @resultTotalCount="getResultTotalCount"
               ></chatAppSearchList>
             </div>
           </div>
@@ -1083,6 +1162,28 @@ html[theme-mode='dark'] {
       width: 578px;
       height: 517px;
       border: 1px solid #efeff5;
+      .search-record-detail-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 14px 4px 14px 10px;
+        box-sizing: border-box;
+        .search-record-detail-header-btn {
+          line-height: 20px;
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+          justify-content: flex-end;
+          gap: 8px;
+          cursor: pointer;
+          span {
+            line-height: 20px;
+            color: #46299d;
+            font-size: 14px;
+            font-weight: 400;
+          }
+        }
+      }
     }
   }
   .search-record-empty {