index.vue 727 B

12345678910111213141516171819202122232425262728293031323334
  1. <template>
  2. <div
  3. v-if="isNotNetwork"
  4. class="network"
  5. >
  6. <i class="icon icon-error">!</i>
  7. <p class="network-content">
  8. {{
  9. TUITranslateService.t("TUIConversation.网络异常,请您检查网络设置")
  10. }}
  11. </p>
  12. </div>
  13. </template>
  14. <script lang="ts" setup>
  15. import TUIChatEngine, {
  16. TUIStore,
  17. StoreName,
  18. TUITranslateService,
  19. } from '@tencentcloud/chat-uikit-engine';
  20. import {
  21. ref,
  22. } from '../../../adapter-vue';
  23. const isNotNetwork = ref(false);
  24. TUIStore.watch(StoreName.USER, {
  25. netStateChange: (value: string) => {
  26. isNotNetwork.value = (value === TUIChatEngine.TYPES.NET_STATE_DISCONNECTED);
  27. },
  28. });
  29. </script>
  30. <style lang="scss" scoped src="../style/index.scss"></style>