chore: 未读消息加粗显示

src/components/MessageItem.vue

 <template>
-  <div class="message-item" @click="onClick">
+  <div class="message-item" :class="classes" @click="onClick">
     <div class="message-item-pic" :class="`message-item-pic-${type}`"></div>
     <div class="message-item-content">
       <div class="message-item-content-hd">
@@ -14,6 +14,16 @@
 export default {
   name: 'MessageItem',
   props: { type: String, data: Object },
+  computed: {
+    isRead() {
+      return this.data.status === '1'
+    },
+    classes() {
+      return {
+        'un-read': !this.isRead
+      }
+    }
+  },
   methods: {
     onClick() {
       this.$router.push({ name: 'messageItem', params: { id: this.data.id } })
@@ -69,4 +79,7 @@ export default {
   font-size: 14px;
   color: #999;
 }
+.un-read .message-item-content__title {
+  font-weight: bold;
+}
 </style>