feat:礼物消息

src/components/chat-item/chat-item.vue

@@ -17,7 +17,8 @@
         <view class="chat-send-name" v-if="isShowSendName">
           {{ chat.sendNickName + ':&nbsp;' }}
         </view>
-        <view v-if="!isTextMessage" class="chat-content-text">{{ chat.lastContent }}</view>
+        <view v-if="isGiftMessage" class="chat-content-text">[礼物]</view>
+        <view v-else-if="!isTextMessage" class="chat-content-text">{{ chat.lastContent }}</view>
         <rich-text v-else class="chat-content-text" :nodes="nodesText"></rich-text>
         <view v-if="chat.isDnd" class="icon iconfont icon-dnd"></view>
         <wd-badge v-else-if="chat.unreadCount > 0" :max="99" :model-value="chat.unreadCount" />
@@ -88,6 +89,14 @@
         let messageType = this.chat.messages[idx].type;
         return messageType == this.$enums.MESSAGE_TYPE.TEXT;
       },
+      isGiftMessage() {
+        if (this.chat.messages.length == 0) {
+          return false;
+        }
+        let idx = this.chat.messages.length - 1;
+        let messageType = this.chat.messages[idx].type;
+        return messageType == this.$enums.MESSAGE_TYPE.GIFT;
+      },
       nodesText() {
         let text = this.$str.html2Escape(this.chat.lastContent);
         return this.$emo.transform(text, 'emoji-small');

src/components/chat-message-item/chat-message-item.vue

@@ -68,6 +68,29 @@
                 </view>
               </long-press-menu>
             </view>
+            <view
+              class="message-file bg-#B37B2E/40!"
+              v-else-if="msgInfo.type == $enums.MESSAGE_TYPE.GIFT"
+            >
+              <view class="p-2 flex-col-center">
+                <image
+                  class="size-300rpx"
+                  :src="JSON.parse(msgInfo.content).image"
+                  mode="aspectFill"
+                />
+                <view>向你赠送了一个礼物</view>
+                <view class="c-transparent bg-clip-text bg-gradient-to-r from-red to-pink">
+                  {{ JSON.parse(msgInfo.content).title }}
+                </view>
+                <view class="text-20rpx c-#eee">
+                  {{
+                    (JSON.parse(msgInfo.content).price / 100.0).toFixed(2).replace(/\.?0+$/, '') +
+                    '钻石'
+                  }}
+                </view>
+                <loading v-if="sending"></loading>
+              </view>
+            </view>
             <long-press-menu
               v-else-if="msgInfo.type == $enums.MESSAGE_TYPE.AUDIO"
               :items="menuItems"