添加红包功能

TUIKit/components/TUIChat/chat-header/index.vue

@@ -3,17 +3,12 @@
     <Navigation :title="title">
       <template #left>
         <div @click="back">
-          <Icon
-            :file="backSVG"
-          />
+          <Icon :file="backSVG" />
         </div>
       </template>
       <template #right>
         <div @click="onNavigationBarButtonTap">
-          <Icon
-            v-if="isGroup"
-            :file="More"
-          />
+          <Icon v-if="isGroup" :file="More" />
         </div>
       </template>
     </Navigation>
@@ -21,78 +16,78 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, onUnmounted, ref } from '../../../adapter-vue';
-import {
-  TUIStore,
-  StoreName,
-  IConversationModel,
-  TUITranslateService,
-} from '@tencentcloud/chat-uikit-engine-lite';
-import { onLoad } from '@dcloudio/uni-app';
-import Navigation from '../../common/Navigation/index.vue';
-import Icon from '../../common/Icon.vue';
-import More from '../../../assets/icon/more.svg';
-import backSVG from '../../../assets/icon/back.svg';
+  import { onMounted, onUnmounted, ref } from '../../../adapter-vue'
+  import {
+    TUIStore,
+    StoreName,
+    IConversationModel,
+    TUITranslateService
+  } from '@tencentcloud/chat-uikit-engine-lite'
+  import { onLoad } from '@dcloudio/uni-app'
+  import Navigation from '../../common/Navigation/index.vue'
+  import Icon from '../../common/Icon.vue'
+  import More from '../../../assets/icon/more.svg'
+  import backSVG from '../../../assets/icon/back.svg'
 
-const emits = defineEmits(['openGroupManagement']);
-const props = defineProps(['isGroup']);
+  const emits = defineEmits(['openGroupManagement'])
+  const props = defineProps(['isGroup'])
 
-const currentConversation = ref<IConversationModel>();
-const typingStatus = ref(false);
-const title = ref('');
+  const currentConversation = ref<IConversationModel>()
+  const typingStatus = ref(false)
+  const title = ref('')
 
-const setChatHeaderContent = (content: string) => {
-  title.value = content || '云通信 IM';
-};
-
-const onNavigationBarButtonTap = () => {
-  if (props.isGroup) {
-    emits('openGroupManagement');
+  const setChatHeaderContent = (content: string) => {
+    title.value = content || '云通信 IM'
   }
-};
 
-onMounted(() => {
-  TUIStore.watch(StoreName.CONV, {
-    currentConversation: onCurrentConversationUpdated,
-  });
-  TUIStore.watch(StoreName.CHAT, {
-    typingStatus: onTypingStatusUpdated,
-  });
-});
-
-onUnmounted(() => {
-  TUIStore.unwatch(StoreName.CONV, {
-    currentConversation: onCurrentConversationUpdated,
-  });
-  TUIStore.unwatch(StoreName.CHAT, {
-    typingStatus: onTypingStatusUpdated,
-  });
-});
-
-onLoad(() => {
-  setChatHeaderContent(currentConversation.value?.getShowName());
-});
-
-function onCurrentConversationUpdated(conversation: IConversationModel) {
-  currentConversation.value = conversation;
-  if (!typingStatus.value) {
-    setChatHeaderContent(currentConversation?.value?.getShowName());
+  const onNavigationBarButtonTap = () => {
+    if (props.isGroup) {
+      emits('openGroupManagement')
+    }
   }
-}
 
-function onTypingStatusUpdated(status: boolean) {
-  typingStatus.value = status;
-  if (typingStatus.value) {
-    setChatHeaderContent(TUITranslateService.t('TUIChat.对方正在输入'));
-  } else {
-    setChatHeaderContent(currentConversation.value?.getShowName());
+  onMounted(() => {
+    TUIStore.watch(StoreName.CONV, {
+      currentConversation: onCurrentConversationUpdated
+    })
+    TUIStore.watch(StoreName.CHAT, {
+      typingStatus: onTypingStatusUpdated
+    })
+  })
+
+  onUnmounted(() => {
+    TUIStore.unwatch(StoreName.CONV, {
+      currentConversation: onCurrentConversationUpdated
+    })
+    TUIStore.unwatch(StoreName.CHAT, {
+      typingStatus: onTypingStatusUpdated
+    })
+  })
+
+  onLoad(() => {
+    setChatHeaderContent(currentConversation.value?.getShowName())
+  })
+
+  function onCurrentConversationUpdated(
+    conversation: IConversationModel
+  ) {
+    currentConversation.value = conversation
+    if (!typingStatus.value) {
+      setChatHeaderContent(currentConversation?.value?.getShowName())
+    }
   }
-}
 
-function back() {
-  uni.navigateBack();
-}
+  function onTypingStatusUpdated(status: boolean) {
+    typingStatus.value = status
+    if (typingStatus.value) {
+      setChatHeaderContent(TUITranslateService.t('TUIChat.对方正在输入'))
+    } else {
+      setChatHeaderContent(currentConversation.value?.getShowName())
+    }
+  }
+
+  function back() {
+    uni.navigateBack()
+  }
 </script>
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>