修复会话列表搜索时格式不正确问题

修复添加有头像人员时显示不正确
给会话列表添加滚动条

src/views/liveChat/index.vue

@@ -42,6 +42,7 @@ const { proxy } = getCurrentInstance();
 const userIds = useUserStore();
 // main元素的初始高度，在onMounted时需要重新计算
 let height = ref(document.documentElement.clientHeight - 16 + "px;");
+let height2= ref('0px'); //会话列表高度
 const messageText = ref(""); //发送的内容
 let headerName = ref("");
 const total = ref(0);
@@ -224,6 +225,7 @@ const changeMsg = async (val,isnew) => {
   resInfo.fromId = val.id
   resInfo.content = val.content
   resInfo.file = val.file
+  resInfo.toAvatar = resInfo.fromAvatar = resInfo.avatar
   if (searchData.value.length > 0) {
     //判断是否有相同的聊天人
     const filerData = searchData.value.filter(
@@ -509,10 +511,15 @@ const formatText = (text) => {
           };
           reader.readAsText(res);
       })
-  }
+  };
+const headError=(ind,item)=>{
+  console.log("头像加载失败:",ind)
+  item.fromAvatar=item.toAvatar=item.avatar=null;
+};
 // 滚动翻页========
 onMounted(() => {
   height.value = document.documentElement.clientHeight - document.getElementsByClassName("tab_box")[0].offsetHeight-8-document.getElementsByClassName("nav")[0].offsetHeight -26 + "px";
+  height2.value = height.value.replace('px','') - 48 + 'px';
   getMsgList();
   websoctStore.connect();
   setInterval(handleNewMessage, 1000); // 每秒钟检查是否有新消息
@@ -551,67 +558,75 @@ onMounted(() => {
         ></Addperson>
       </div>
       <!-- 列表 -->
-      <div
-        :class="
-          clickPersonIndex == index
-            ? 'activ-left-container left-container shouzhi'
-            : 'left-container shouzhi'
-        "
-        v-for="(item, index) in searchData"
-        :key="index"
-        @click="clickPerson(index, item)"
-      >
-      <template v-if="item.display==null || item.display==1">
-        <img :src="cebian" class="cebian" v-if="clickPersonIndex == index" />
-        <button
-          class="del-chat"
-          v-if="clickPersonIndex == index && item.fromId!=-1"
-          @click="delClick(item.userId!=null? item.userId : (item.toId == userIds.uid?item.fromId:item.toId))"
+      <div :style="'overflow-y: auto;height: '+height2">
+        <div
+          :class="
+            (item.display!=null && item.display==0) 
+            ? ''
+            :(
+            clickPersonIndex == index
+              ? 'activ-left-container left-container shouzhi'
+              : 'left-container shouzhi'
+            )
+          "
+          v-for="(item, index) in searchData"
+          :key="index"
+          @click="clickPerson(index, item)"
         >
-          删除会话
-        </button>
-        <div>
-          <img
-            :src="wangzhi + item.fromAvatar"
-            class="head-sculpture"
-            v-if="item.toId == userIds.uid && item.fromAvatar"
-          />
-          <img :src="item.avatar " alt="" v-else-if="item.avatar"/>
-          <img
-            :src="wangzhi + item.toAvatar"
-            class="head-sculpture"
-            v-else-if="item.toId != userIds.uid && item.toAvatar"
-          />
-          <span
-            style="
-              background-color: #7a89ba;
-              display: inline-block;
-              color: #fff;
-              font-weight: 600;
-              text-align: center;
-              line-height: 40px;
-            "
-            class="head-sculpture"
-            v-else
-            >{{ item.nickName!=null? item.nickName.slice(0, 1):item.toId == userIds.uid? item.fromName.slice(0, 1): item.toName.slice(0, 1) }}</span>
-        </div>
-        <div class="spill">
-          <span class="person-name">{{
-            item.nickName
-              ? item.nickName
-              : item.toId == userIds.uid
-              ? item.fromName
-              : item.toName
-          }}</span
-          ><span class="person-cont spill">
-            {{ item.file?.fileName ? item.file?.fileName : item.content }}</span
+        <template v-if="item.display==null || item.display==1">
+          <img :src="cebian" class="cebian" v-if="clickPersonIndex == index" />
+          <button
+            class="del-chat"
+            v-if="clickPersonIndex == index && item.fromId!=-1"
+            @click="delClick(item.userId!=null? item.userId : (item.toId == userIds.uid?item.fromId:item.toId))"
           >
+            删除会话
+          </button>
+          <div>
+            <img
+              :src="wangzhi + item.fromAvatar"
+              class="head-sculpture"
+              :onerror="headError(index,item)"
+              v-if="item.toId == userIds.uid && item.fromAvatar"
+            />
+            <img :src="item.avatar" :onerror="headError(index,item)" alt="" v-else-if="item.avatar"/>
+            <img
+              :src="wangzhi + item.toAvatar"
+              class="head-sculpture"
+              :onerror="headError(index,item)"
+              v-else-if="item.toId != userIds.uid && item.toAvatar"
+            />
+            <span
+              style="
+                background-color: #7a89ba;
+                display: inline-block;
+                color: #fff;
+                font-weight: 600;
+                text-align: center;
+                line-height: 40px;
+              "
+              class="head-sculpture"
+              v-else
+              >{{ item.nickName!=null? item.nickName.slice(0, 1):item.toId == userIds.uid? item.fromName.slice(0, 1): item.toName.slice(0, 1) }}</span>
+          </div>
+          <div class="spill">
+            <span class="person-name">{{
+              item.nickName
+                ? item.nickName
+                : item.toId == userIds.uid
+                ? item.fromName
+                : item.toName
+            }}</span
+            ><span class="person-cont spill">
+              {{ item.file?.fileName ? item.file?.fileName : item.content }}</span
+            >
+          </div>
+          <span
+            class="yuandian"
+            v-if="item.showCircel && $route.path == '/index' && clickPersonId!==item.fromId"
+          ></span>
+        </template>
         </div>
-        <span
-          class="yuandian"
-          v-if="item.showCircel && $route.path == '/index' && clickPersonId!==item.fromId"
-        ></span>
-      </template>
       </div>
     </div>
     <!-- 右侧聊天 -->
@@ -687,7 +702,8 @@ onMounted(() => {
                   <div>
                     <img
                       :src="wangzhi + record.fromAvatar"
-                      class="head-sculpture"
+                      class="head-sculpture"    
+                      :onerror="headError(index,record)"                  
                       v-if="
                         useUserStore().uid != record.toId && record.fromAvatar
                       "
@@ -695,6 +711,7 @@ onMounted(() => {
                     <img
                       :src="wangzhi + record.toAvatar"
                       class="head-sculpture"
+                      :onerror="headError(index,record)"
                       v-else-if="
                         useUserStore().uid == record.toId && record.toAvatar
                       "
@@ -726,6 +743,7 @@ onMounted(() => {
                     <img
                       :src="wangzhi + record.fromAvatar"
                       class="head-sculpture"
+                      :onerror="headError(index,record)"
                       v-if="
                         useUserStore().uid == record.toId && record.fromAvatar
                       "
@@ -733,6 +751,7 @@ onMounted(() => {
                     <img
                       :src="wangzhi + record.toAvatar"
                       class="head-sculpture"
+                      :onerror="headError(index,record)"
                       v-else-if="
                         useUserStore().uid != record.toId && record.toAvatar
                       "