'更新'

src/views/message/components/messageContent.vue

@@ -34,7 +34,7 @@
                   :model-value="inputCourseId"
                   size="large"
                   placeholder=""
-                  readonly
+
               >
               </el-input>
             </el-form-item>

src/views/message/components/sendMessage.vue

@@ -23,7 +23,7 @@
           <div class="message-content" @click="handleClick(item)">
             <h2 class="message-title">{{item.title}}</h2>
             <div class="message-details">
-              <span class="sender">收件人:{{item.receiverUsers}}</span>
+              <div>收件人:<span class="sender" v-for="o in item.receiveUsers" :key="o.id">{{o.receiverName}}</span></div>
               <span class="read-status">阅读人数：{{item.readUserNum}}</span>
             </div>
             <div class="message-time">发送时间：{{item.sendTime}}</div>
@@ -54,7 +54,7 @@
 import { ref,computed,onMounted} from 'vue';
 import { useRouter } from 'vue-router';
 import useUserStore from "@/store/modules/user";
-import {getSendMessagesListApi,deleteSendMessageApi} from "@/api/user/messag";
+import {getSendMessagesListApi} from "@/api/user/messag";
 import { ElMessageBox, ElMessage } from 'element-plus'
 const userStore = useUserStore()
 //传参
@@ -71,7 +71,7 @@ const params = ref({
   sortBy:false//排序字段
 })
 const total = ref(0)
-const sendMessage = ref([])
+const sendMessage = ref({})
 const loading = ref(false)
 // const hoveringOver = ref(null)
 // 获取发送的消息列表
@@ -156,8 +156,10 @@ function handleClick(item) {
   // 传递整个消息对象
   router.push({
     path: '/sendMessageList',
-    query: item
+    query: {id:item.id}
   });
+
+  sessionStorage.setItem('senMsg:Item',JSON.stringify(item))
 }
 </script>
 <style scoped>
@@ -213,7 +215,7 @@ li{
   margin-top: 10px; /* 与标题的间距 */
 }
 .sender {
-  margin-right: 88px; /* 发件人和已读状态的间距 */
+  margin-right: 20px; /* 发件人和已读状态的间距 */
 }
 .read-status {
   color: #888; /* 已读状态的颜色 */

src/views/message/components/sendMessageList.vue

@@ -13,7 +13,7 @@
           </template>
           <div class="container">
             <div class="header_content">
-              <span class="sender">收件人：{{ receiverNames }}</span>
+              收件人：<span class="sender" v-for="o in sendMessage.receiveUsers" :key="o.id">{{ o.receiverName }}</span>
               <span class="time">发送时间：{{ sendMessage.sendTime }}</span>
 <!--              <span class="read-status">是否阅读：{{sendMessage.isRead}}</span>-->
             </div>
@@ -43,30 +43,32 @@ const back = ()=>{
   router.go(-1)
 }
 //获取参数
-const sendMessage = ref(route.query)
+let item = sessionStorage.getItem('senMsg:Item')
+if(item) item =JSON.parse(item)
 
-onMounted(() => {
-  console.log('Received message:', sendMessage.value);
-  // 尝试解析 receiveUsers
-  if (sendMessage.value.receiveUsers && typeof sendMessage.value.receiveUsers[0] === 'string') {
-    sendMessage.value.receiveUsers = sendMessage.value.receiveUsers.map(user => {
-      try {
-        return JSON.parse(user);
-      } catch (error) {
-        console.error('Error parsing user:', user, error);
-        return null; // 或者返回默认值
-      }
-    });
-  }
-});
+const sendMessage = ref(item || {})
+// onMounted(() => {
+//   console.log('Received message:', sendMessage.value);
+//   // 尝试解析 receiveUsers
+//   if (sendMessage.value.receiveUsers && typeof sendMessage.value.receiveUsers[0] === 'string') {
+//     sendMessage.value.receiveUsers = sendMessage.value.receiveUsers.map(user => {
+//       try {
+//         return JSON.parse(user);
+//       } catch (error) {
+//         console.error('Error parsing user:', user, error);
+//         return null; // 或者返回默认值
+//       }
+//     });
+//   }
+// });
 
 // 提取收件人的姓名
-const receiverNames = computed(() => {
-  if (sendMessage.value && sendMessage.value.receiveUsers) {
-    return sendMessage.value.receiveUsers.map(user => user?.receiverName).join(', ');
-  }
-  return '';
-});
+// const receiverNames = computed(() => {
+//   if (sendMessage.value && sendMessage.value.receiveUsers) {
+//     return sendMessage.value.receiveUsers.map(user => user?.receiverName).join(', ');
+//   }
+//   return '';
+// });
 </script>
 
 <style scoped>