获取到红包信息后更新UI

TUIKit/components/TUIChat/message-list/message-elements/message-custom.vue

@@ -78,14 +78,14 @@
       "
     >
       <!-- 红包 -->
-      <view class="red-envelope">
+      <view class="red-envelope" @click="onClaim">
         <view class="top-title">
           <Icon :file="unopenedEnvelope" width="78rpx" height="80rpx" />
           <text class="title">
             {{ customData.title }}
           </text>
         </view>
-        <text class="bottom-text">积分红包</text>
+        <text class="bottom-text">积分红包{{ customData.isOpen }}</text>
       </view>
     </template>
     <template v-else>
@@ -112,11 +112,19 @@
     content: any
   }
 
+  interface IEmit {
+    (key: 'claim'): void
+  }
+
+  const emits = defineEmits<IEmit>()
+
   const props = withDefaults(defineProps<Props>(), {
     messageItem: undefined,
     content: undefined
   })
 
+  console.log(props.messageItem, '获取到红包信息后更新UI')
+
   const custom = ref()
   const message = ref<IMessageModel>()
   const extension = ref()
@@ -137,6 +145,12 @@
   const openLink = (url: any) => {
     window.open(url)
   }
+
+  /** 红包领取 */
+  const onClaim = () => {
+    // console.log(customData.value)
+    emits('claim')
+  }
 </script>
 <style lang="scss" scoped>
   @import '../../../../assets/styles/common';