feat(聊天页面): 添加教师信息卡片并增强用户信息获取逻辑

pages/chat/index.vue

@@ -15,6 +15,30 @@
         :scroll-into-view="scrollToView"
         scroll-with-animation
       >
+        <!-- 教师信息 -->
+        <div class="teacher-info-card">
+          <image class="teacher-avatar" :src="receiverHeadSculptureUrl"></image>
+          <div class="teacher-info">
+            <div class="teacher-name">{{ vuex_msgUser.receiverName }}</div>
+
+            <div class="teacher-school">
+              <image
+                class="school-icon"
+                src="/static/common/images/icon_college.png"
+              ></image>
+              <text class="school-text">{{ vuex_msgUser.collegeName }}</text>
+            </div>
+
+            <div class="teacher-college">
+              <image
+                class="college-icon"
+                src="/static/common/images/icon_major.png"
+              ></image>
+              <text class="college-text">{{ vuex_msgUser.collegeName }}</text>
+            </div>
+          </div>
+        </div>
+
         <view
           v-for="(message, index) in vuex_msgList"
           :key="message.id"
@@ -49,7 +73,7 @@
           >
             <image
               class="ai-avatar"
-              src="/static/common/images/avatar_ai.png"
+              :src="receiverHeadSculptureUrl"
               mode="scaleToFill"
             />
             <view class="message-content">
@@ -168,6 +192,14 @@ export default {
   },
 
   computed: {
+    receiverHeadSculptureUrl() {
+      if (this.vuex_msgUser.receiverHeadSculptureUrl) {
+        return this.baseUrl + "/" + this.vuex_msgUser.receiverHeadSculptureUrl;
+      }
+
+      return "/static/common/images/avatar_default.jpg";
+    },
+
     headSculptureUrl() {
       if (this.vuex_user.HeadSculptureUrl) {
         return this.baseUrl + "/" + this.vuex_user.HeadSculptureUrl;
@@ -399,6 +431,62 @@ export default {
       //   padding: 10rpx 0;
       // }
 
+      .teacher-info-card {
+        background-color: #ffffff;
+        padding: 30rpx;
+        border-radius: 16rpx;
+        margin: 30rpx 0;
+        box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
+
+        display: flex;
+        align-items: center;
+        margin-bottom: 36rpx;
+
+        .teacher-avatar {
+          width: 120rpx;
+          height: 120rpx;
+          border-radius: 10rpx;
+          margin-right: 30rpx;
+          object-fit: cover;
+        }
+
+        .teacher-info {
+          display: flex;
+          flex-direction: column;
+          justify-content: space-between;
+          gap: 8rpx;
+          flex: 1;
+
+          .teacher-name {
+            font-family: PingFang SC;
+            font-weight: bold;
+            font-size: 32rpx;
+            color: #333333;
+          }
+
+          .teacher-school,
+          .teacher-college {
+            display: flex;
+            align-items: center;
+
+            .school-icon,
+            .college-icon {
+              margin-right: 16rpx;
+              width: 24rpx;
+              height: 24rpx;
+              display: inline-block;
+              text-align: center;
+            }
+
+            .school-text,
+            .college-text {
+              font-size: 24rpx;
+              color: #666666;
+            }
+          }
+        }
+      }
+
       .message-time {
         text-align: center;
         font-size: 24rpx;

store/index.js

@@ -282,7 +282,16 @@ const store = new Vuex.Store({
         (i) => i && (i.receiverId === friendId || i.friendId === friendId)
       );
       if (target) {
-        commit("set_MsgUser", target);
+        // 获取消息接收方用户信息
+        Vue.prototype.$u.api
+          .GetReceiverUserInfoApi({ Id: friendId })
+          .then((res) => {
+            if (res.succeed && res.data) {
+              commit("set_MsgUser", { ...target, ...res.data });
+            } else {
+              commit("set_MsgUser", target);
+            }
+          });
 
         // 跳转到对话页，参数按需调整
         uni.navigateTo({