增加昵称和部门的匹配

api/oa/binding.js

@@ -0,0 +1,10 @@
+import request from "@/util/oaRequest"
+
+// 根据昵称从oa系统获取对应的部门信息
+export function getDeptNameByNickName(nicknames) {
+    return request({
+        url: '/fadapp/auth/dept-names-by-nicks',
+        data: nicknames,
+        method: "post"
+    })
+}

pages/conversation/chating/components/ChatingHeader.vue

@@ -12,10 +12,16 @@
     </view>
     <view class="u-nav-slot" slot="center">
       <view class="chating_info" :class="{ chating_info_single: isSingle }">
-        <view class="conversation_info">
+        <view
-          <view class="title">{{ storeCurrentConversation.showName }}</view>
+          class="conversation_info"
-          <view v-if="!isSingle && !isNotify" class="sub_title"
+          :style="isSingle ? 'flex-direction: column; align-items: center;' : 'flex-direction: row; align-items: center; justify-content: center;'"
-            >{{ groupMemberCount }}
+        >
+          <view class="title" :style="isSingle ? 'text-align: center;' : ''">{{ storeCurrentConversation.showName }}</view>
+          <view v-if="isSingle && storeCurrentConversation.deptName" style="margin-top:6rpx; display: flex; justify-content: center;">
+            <text :style="{backgroundColor: storeCurrentConversation.color, color: '#fff', padding: '2px 10px', borderRadius: '10px', fontSize: '20rpx', display: 'inline-block', textAlign: 'center'}">{{ storeCurrentConversation.deptName }}</text>
+          </view>
+          <view v-if="!isSingle && !isNotify" class="sub_title" style="margin-left: 8rpx;">
+            {{ groupMemberCount }}
           </view>
         </view>
       </view>

pages/conversation/chating/components/ChatingList.vue

@@ -16,7 +16,7 @@
     <view id="scroll_wrap">
       <u-loadmore nomoreText="" :status="loadMoreStatus" />
       <view
-        v-for="item in storeHistoryMessageList"
+        v-for="item in messageListWithDept"
         :key="item.clientMsgID"
       >
         <message-item-render
@@ -36,6 +36,7 @@
 <script>
 import { mapGetters, mapActions } from "vuex";
 import MessageItemRender from "./MessageItem/index.vue";
+import { withDeptName } from '@/util/withDeptName';
 
 export default {
   name: "",
@@ -58,6 +59,7 @@ export default {
       messageLoadState: {
         loading: false,
       },
+      messageListWithDept: [],
     };
   },
   computed: {
@@ -75,11 +77,39 @@ export default {
       return this.messageLoadState.loading ? "loading" : "loadmore";
     },
   },
+  watch: {
+    storeHistoryMessageList: {
+      handler: 'updateMessageListWithDept',
+      immediate: true,
+      deep: true
+    }
+  },
   mounted() {
     this.loadMessageList();
   },
   methods: {
     ...mapActions("message", ["getHistoryMesageList"]),
+    async updateMessageListWithDept() {
+      // 取所有发送者昵称
+      const allSenders = this.storeHistoryMessageList.map(item => ({ showName: item.senderNickname }));
+      // 获取部门信息
+      const deptInfoArr = await withDeptName(allSenders);
+      // 构建映射
+      const deptMap = {};
+      deptInfoArr.forEach((obj, idx) => {
+        if (obj.deptName) {
+          deptMap[this.storeHistoryMessageList[idx].sendID] = {
+            deptName: obj.deptName,
+            color: obj.color
+          };
+        }
+      });
+      // 合并到消息
+      this.messageListWithDept = this.storeHistoryMessageList.map(msg => {
+        const dept = deptMap[msg.sendID];
+        return dept ? { ...msg, deptName: dept.deptName, color: dept.color } : { ...msg };
+      });
+    },
     messageItemRender(clientMsgID) {
       if (
         this.initFlag &&

pages/conversation/chating/components/MessageItem/index.vue

@@ -19,7 +19,12 @@
         >
           <text>{{ formattedMessageTime }}</text>
           <text style="margin-left: 2rpx; margin-right: 2rpx">{{ "" }}</text>
-          <text v-if="!isSingle">{{ source.senderNickname }}</text>
+          <text v-if="!isSingle">
+            {{ source.senderNickname }}
+          </text>
+          <template v-if="!isSingle && source.deptName">
+            <text class="dept_name" :style="{backgroundColor: source.color, color: '#fff', padding: '2px 8px', borderRadius: '8px', fontSize: '20rpx', marginLeft: '8rpx'}">{{ source.deptName }}</text>
+          </template>
         </view>
         <view class="message_send_state_box">
           <view
@@ -384,6 +389,13 @@ export default {
       font-size: 0.85rem;
       color: #666;
       margin-bottom: 6rpx;
+      align-items: center;
+      .dept_name {
+        display: inline-block;
+        line-height: 1.2;
+        vertical-align: middle;
+        margin-left: 8rpx;
+      }
     }
 
     .message_content_wrap {

pages/conversation/conversationList/components/ConversationItem.vue

@@ -10,7 +10,11 @@
         size="46"
       />
       <view class="details">
-        <text class="conversation_name">{{ source.showName }}</text>
+        <text class="conversation_name">{{ source.showName }}
+          <template v-if="!isGroup && source.deptName">
+            <text class="dept_name" :style="{backgroundColor: source.color, color: '#fff', padding: '2px 8px', borderRadius: '8px', fontSize: '20rpx', marginLeft: '8rpx'}">{{ source.deptName }}</text>
+          </template>
+        </text>
         <view class="lastest_msg_wrap">
           <text class="lastest_msg_content">{{ latestMessage }}</text>
         </view>
@@ -106,6 +110,14 @@ export default {
         @include nomalEllipsis();
         max-width: 40vw;
         font-size: 28rpx;
+        display: inline-flex;
+        align-items: center;
+      }
+      .dept_name {
+        display: inline-block;
+        line-height: 1.2;
+        vertical-align: middle;
+        margin-left: 8rpx;
       }
 
       .lastest_msg_wrap {

pages/conversation/conversationList/index.vue

@@ -14,7 +14,7 @@
       @scrolltolower="scrolltolower"
     >
       <conversation-item
-        v-for="item in storeConversationList"
+        v-for="item in conversationListWithDeptName"
         :key="item.conversationID"
         :source="item"
         ref="conversationItem"
@@ -33,6 +33,8 @@
 import { mapGetters } from "vuex";
 import ChatHeader from "./components/ChatHeader.vue";
 import ConversationItem from "./components/ConversationItem.vue";
+import { getDeptNameByNickName } from "@/api/oa/binding";
+import { withDeptName } from '@/util/withDeptName';
 
 export default {
   components: {
@@ -48,11 +50,19 @@ export default {
       doubleClick: 0,
       triggered: false,
       refreshing: false,
+      conversationListWithDeptName: [], // 新增
     };
   },
   computed: {
     ...mapGetters(["storeConversationList", "storeIsSyncing", "storeProgress"]),
   },
+  watch: {
+    storeConversationList: {
+      handler: 'updateConversationListWithDeptName',
+      immediate: true,
+      deep: true
+    }
+  },
   onReady() {
     this.$nextTick(() => plus.navigator.closeSplashscreen());
   },
@@ -87,6 +97,10 @@ export default {
     closeAllSwipe() {
       this.$refs.swipeWrapperRef.closeAll();
     },
+    // 新增：异步获取部门名和颜色
+    async updateConversationListWithDeptName() {
+      this.conversationListWithDeptName = await withDeptName(this.storeConversationList);
+    },
   },
 };
 </script>

util/withDeptName.js

@@ -0,0 +1,76 @@
+import { getDeptNameByNickName } from '@/api/oa/binding';
+
+/*
+ * withDeptName 高阶函数
+ * ---------------------------------------------
+ * 用途：
+ *   为会话列表（如IM会话、联系人等）异步注入部门名称和部门颜色，
+ *   使前端组件可直接渲染带部门信息的会话项。
+ * 
+ * 参数：
+ *   @param {Array<Object>} conversationList - 原始会话对象数组，
+ *     每项需包含唯一标识（如 showName 字段）。
+ * 
+ * 返回：
+ *   @returns {Promise<Array<Object>>} - 返回一个 Promise，
+ *     解析后为带有部门名（deptName）和部门色（color）的会话对象数组。
+ *     若某项无部门信息，则不包含 deptName/color 字段。
+ * 
+ * 使用场景：
+ *   - 会话列表、联系人列表等需要展示部门信息的场景。
+ *   - 适用于任何需要根据昵称批量获取部门名的业务。
+ *   - 可在 watch、生命周期、异步数据流等场景下调用。
+ * 
+ * 示例：
+ *   import { withDeptName } from '@/util/withDeptName';
+ *   const result = await withDeptName(conversationList);
+ *   // result: [{...item, deptName, color}, ...]
+ * 
+ * 注意事项：
+ *   - 依赖 getDeptNameByNickName 接口，需保证接口可用。
+ *   - 仅为获取到真实部门名的项添加 deptName/color 字段。
+ *   - 若接口异常或无部门名，则原项不变。
+ *   - color 为自动分配的浅色系，便于前端高亮展示。
+ *   - 建议在数据源变更时重新调用。
+ */
+export async function withDeptName(conversationList) {
+  const nicknames = conversationList.map(item => item.showName);
+  let deptMap = {};
+  try {
+    const res = await getDeptNameByNickName(nicknames);
+    if (Array.isArray(res.data)) {
+      res.data.forEach(obj => {
+        if (obj && obj.nickName && obj.deptName) {
+          deptMap[obj.nickName] = obj.deptName;
+        }
+      });
+    }
+  } catch (e) {
+    deptMap = {};
+  }
+  const colorList = [
+    '#FFB6C1', '#87CEFA', '#90EE90', '#FFD700', '#FFA07A',
+    '#9370DB', '#00CED1', '#FF69B4', '#B0C4DE', '#40E0D0',
+  ];
+  const deptNameSet = new Set();
+  Object.values(deptMap).forEach(deptName => {
+    deptNameSet.add(deptName);
+  });
+  const deptNameArr = Array.from(deptNameSet);
+  const deptColorMap = {};
+  deptNameArr.forEach((dept, idx) => {
+    deptColorMap[dept] = colorList[idx % colorList.length];
+  });
+  return conversationList.map(item => {
+    const deptName = deptMap[item.showName];
+    if (deptName) {
+      return {
+        ...item,
+        deptName,
+        color: deptColorMap[deptName] || ''
+      }
+    } else {
+      return { ...item }
+    }
+  });
+}