在IndexSider.vue中添加了调试输出，更新了TalkItem.vue以使用新的头像组件并调整了样式，增加了TalkItem的高度。

src/components/avatar-module/index.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="avatar-module" :style="[customStyle, { background: avatar ? '#fff' : '' }]">
+    <img :src="avatar" v-if="avatar" />
+    <span v-else :style="customTextStyle">{{ text_avatar }}</span>
+  </div>
+</template>
+<script setup>
+//群聊默认头像
+import groupNormal from '@/assets/image/groupNormal.png'
+import groupDepartment from '@/assets/image/groupDepartment.png'
+import groupProject from '@/assets/image/groupProject.png'
+import groupCompany from '@/assets/image/groupCompany.png'
+import { computed, defineProps } from 'vue'
+
+const props = defineProps({
+  mode: {
+    //模式：1=人；2=群
+    type: Number,
+    default: 0,
+  },
+  avatar: {
+    //头像
+    type: String,
+    default: '',
+  },
+  userName: {
+    //用户名称
+    type: String,
+    default: '',
+  },
+  groupType: {
+    //群类型：1=普通群；2=部门群；3=项目群；4=总群/公司群
+    type: Number,
+    default: 0,
+  },
+  customStyle: {
+    //自定义样式
+    type: Object,
+    default() {
+      return {}
+    },
+  },
+  customTextStyle: {
+    //自定义文字样式
+    type: Object,
+    default() {
+      return {}
+    },
+  },
+})
+
+//头像
+const avatar = computed(() => {
+  let avatar_img = props?.avatar
+  if (!avatar_img) {
+    if (props?.mode === 1) {
+    } else if (props?.mode === 2) {
+      if (props?.groupType === 1) {
+        avatar_img = groupNormal
+      } else if (props?.groupType === 2) {
+        avatar_img = groupDepartment
+      } else if (props?.groupType === 3) {
+        avatar_img = groupProject
+      } else if (props?.groupType === 4) {
+        avatar_img = groupCompany
+      }
+    }
+  }
+  return avatar_img
+})
+
+//文字头像
+const text_avatar = computed(() => {
+  return props?.userName.length >= 2
+    ? props?.userName.slice(-2)
+    : props?.userName
+})
+</script>
+<style lang="less" scoped>
+.avatar-module {
+  border-radius: 50%;
+  overflow: hidden;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(to right, #674bbc, #46299d);
+  flex-shrink: 0;
+  img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+}
+</style>

src/views/message/inner/IndexSider.vue

@@ -38,7 +38,9 @@ const items = computed((): ISession[] => {
     return keyword.toLowerCase().indexOf(searchKeyword.value.toLowerCase()) != -1
   })
 })
-
+setTimeout(()=>{
+  console.log('items.value',items.value)
+},1000)
 watch(() => talkStore, (newValue, oldValue) => {
   console.log(newValue);
   
@@ -180,6 +182,7 @@ onMounted(() => {
     <main id="talk-session-list" class="el-main me-scrollbar me-scrollbar-thumb">
       <template v-if="loadStatus == 2"><Skeleton /></template>
       <template v-else>
+
         <TalkItem
           v-for="item in items"
           :key="item.index_name"

src/views/message/inner/TalkItem.vue

@@ -1,22 +1,26 @@
-<script lang="ts" setup>
+<script setup>
 import { ArrowUp, ArrowDown, CloseRemind } from '@icon-park/vue-next'
 import Xtime from '@/components/base/Xtime.vue'
-import { ISession } from '@/types/chat'
+import avatarModule from '@/components/avatar-module/index.vue'
-
 const emit = defineEmits(['tab-talk', 'top-talk'])
 
-defineProps<{
+defineProps({
-  data: ISession
+  data: Object,
-  avatar: String
+  avatar: String,
-  username: String
+  username: String,
   active: Boolean
-}>()
+})
 </script>
 
 <template>
   <div class="talk pointer" :class="{ actived: active }" @click="emit('tab-talk', data)">
     <div class="avatar-box">
-      <im-avatar :src="avatar" :size="34" :username="data.name" />
+      
+      <avatarModule    :mode="data?.group_type === 0 ? 1 : 2"
+              :avatar="data?.avatar"
+              :groupType="data?.group_type"
+              :userName="data?.name" :customStyle="{width:'42px',height:'42px'}"></avatarModule>
+      <!-- <im-avatar :src="avatar" :size="34" :username="data.name" /> -->
       <div class="top-mask" @click.stop="emit('top-talk', data)">
         <n-icon :component="data.is_top == 1 ? ArrowDown : ArrowUp" />
       </div>
@@ -68,7 +72,7 @@ defineProps<{
 <style lang="less" scoped>
 .talk {
   padding: 8px 10px 8px 5px;
-  height: 50px;
+  height: 64px;
   display: flex;
   align-items: center;
   transition: 0.2s ease-in;