@tencentcloud/roomkit-electron-vue3 2.6.0 → 2.6.2

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-translate/index.vue2.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+require("../../../../../adapter-vue.js");
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+const Icon = require("../../../../common/Icon.vue.js");
+const translationContent = require("./translation-content.vue.js");
+const checkSm = require("../../../../../assets/icon/check-sm.svg.js");
+const _hoisted_1 = { class: "copyright" };
+const _hoisted_2 = { class: "copyright-text" };
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "index",
+  props: {
+    message: { default: () => ({}) }
+  },
+  setup(__props) {
+    const props = __props;
+    const translationVisible = Vue.ref(false);
+    const hasTranslationError = Vue.ref(false);
+    const translationWrapperRef = Vue.ref();
+    let isSingleTranslation = true;
+    Vue.onMounted(() => {
+      TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.CHAT, {
+        translateTextInfo: onMessageTranslationUpdated
+      });
+    });
+    Vue.onUnmounted(() => {
+      TUIChatEngine.TUIStore.unwatch(TUIChatEngine.StoreName.CHAT, {
+        translateTextInfo: onMessageTranslationUpdated
+      });
+    });
+    function toggleErrorStatus(hasError) {
+      hasTranslationError.value = hasError;
+    }
+    function onMessageTranslationUpdated(info) {
+      if (info === void 0) return;
+      isSingleTranslation = false;
+      const translationInfoList = info.get(props.message.conversationID) || [];
+      for (let i = 0; i < translationInfoList.length; ++i) {
+        const { messageID, visible } = translationInfoList[i];
+        if (messageID === props.message.ID && visible !== void 0) {
+          if (translationInfoList.length === 1 && visible) {
+            isSingleTranslation = true;
+          }
+          hasTranslationError.value = false;
+          translationVisible.value = visible;
+          break;
+        }
+      }
+    }
+    return (_ctx, _cache) => {
+      return Vue.unref(translationVisible) ? (Vue.openBlock(), Vue.createElementBlock("div", {
+        key: 0,
+        ref_key: "translationWrapperRef",
+        ref: translationWrapperRef,
+        class: Vue.normalizeClass({
+          "message-translation": true,
+          "reverse": props.message.flow === "out",
+          "error": Vue.unref(hasTranslationError)
+        })
+      }, [
+        Vue.createVNode(translationContent.default, {
+          message: props.message,
+          translationContentVisible: Vue.unref(translationVisible),
+          translationWrapperRef: Vue.unref(translationWrapperRef),
+          isSingleTranslation: Vue.unref(isSingleTranslation),
+          onToggleErrorStatus: toggleErrorStatus
+        }, null, 8, ["message", "translationContentVisible", "translationWrapperRef", "isSingleTranslation"]),
+        Vue.createElementVNode("div", _hoisted_1, [
+          Vue.createVNode(Icon.default, {
+            file: Vue.unref(checkSm.default),
+            size: "13px"
+          }, null, 8, ["file"]),
+          Vue.createElementVNode("div", _hoisted_2, Vue.toDisplayString(Vue.unref(TUIChatEngine.TUITranslateService).t("TUIChat.由IM提供翻译支持")), 1)
+        ])
+      ], 2)) : Vue.createCommentVNode("", true);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-translate/translation-content.vue.d.ts

@@ -0,0 +1,37 @@
+import { IMessageModel } from '@tencentcloud/chat-uikit-engine';
+
+interface IProps {
+    message: IMessageModel;
+    translationContentVisible: boolean;
+    isSingleTranslation: boolean;
+    translationWrapperRef: HTMLDivElement | undefined;
+}
+declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IProps>, {
+    message: () => IMessageModel;
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    toggleErrorStatus: (status: boolean) => void;
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IProps>, {
+    message: () => IMessageModel;
+}>>> & {
+    onToggleErrorStatus?: ((status: boolean) => any) | undefined;
+}, {
+    message: IMessageModel;
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-translate/translation-content.vue.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const translationContent_vue_vue_type_script_setup_true_lang = require("./translation-content.vue2.js");
+;/* empty css                          */
+const _pluginVue_exportHelper = require("../../../../../../../../_virtual/_plugin-vue_export-helper.js");
+const TranslationContent = /* @__PURE__ */ _pluginVue_exportHelper.default(translationContent_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-2d45d33b"]]);
+exports.default = TranslationContent;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-translate/translation-content.vue2.js

@@ -0,0 +1,110 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+require("../../../../../adapter-vue.js");
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+const universalApi = require("@tencentcloud/universal-api");
+const translation = require("../../../utils/translation.js");
+const _hoisted_1 = ["src"];
+const _hoisted_2 = {
+  key: 1,
+  class: "text-plain"
+};
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "translation-content",
+  props: {
+    message: { default: () => ({}) },
+    translationContentVisible: { type: Boolean },
+    isSingleTranslation: { type: Boolean },
+    translationWrapperRef: {}
+  },
+  emits: ["toggleErrorStatus"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const props = __props;
+    const translationFinished = Vue.ref(false);
+    const translationErrorText = Vue.ref("");
+    const translationTextList = Vue.ref([]);
+    const calculateHeight = Vue.ref(0);
+    const calculateWidth = Vue.ref(0);
+    const translationLoadingRef = Vue.ref();
+    const translationContentRef = Vue.ref();
+    Vue.watch(() => props.translationContentVisible, (newVal) => {
+      if (newVal) {
+        translation.translator.get(props.message).then((result) => {
+          translationFinished.value = true;
+          translationTextList.value = result;
+          Vue.nextTick(() => {
+            const { height: originHeight, width: originWidth } = universalApi.getBoundingClientRectSync(translationLoadingRef.value);
+            const { height, width } = universalApi.getBoundingClientRectSync(translationContentRef.value);
+            calculateHeight.value = originHeight;
+            calculateWidth.value = originWidth;
+            requestAnimationFrame(() => {
+              calculateHeight.value = height;
+              calculateWidth.value = width;
+              if (props.isSingleTranslation) {
+                Vue.nextTick(() => {
+                  const { bottom } = universalApi.getBoundingClientRectSync(props.translationWrapperRef);
+                  const { bottom: bottomWindow } = universalApi.getBoundingClientRectSync("#messageScrollList");
+                  if (bottom > bottomWindow) {
+                    const timer = setTimeout(() => {
+                      props.translationWrapperRef.scrollIntoView({ block: "end", behavior: "smooth" });
+                      clearTimeout(timer);
+                    }, 150);
+                  }
+                });
+              }
+            });
+          });
+        }).catch((err) => {
+          translationFinished.value = true;
+          const { height: originHeight } = universalApi.getBoundingClientRectSync(translationLoadingRef.value);
+          calculateHeight.value = originHeight;
+          translationTextList.value = [];
+          emits("toggleErrorStatus", true);
+          translationErrorText.value = err.message;
+        });
+      }
+    }, { immediate: true });
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", {
+        class: "message-translation-container",
+        style: Vue.normalizeStyle({
+          height: Vue.unref(calculateHeight) > 0 ? `${Vue.unref(calculateHeight)}px` : "auto",
+          width: Vue.unref(calculateWidth) > 0 ? `${Vue.unref(calculateWidth)}px` : "auto"
+        })
+      }, [
+        Vue.unref(translationFinished) ? (Vue.openBlock(), Vue.createElementBlock("div", {
+          key: 0,
+          ref_key: "translationContentRef",
+          ref: translationContentRef,
+          class: Vue.normalizeClass({
+            "translation-content": true,
+            "occur": Vue.unref(calculateHeight) > 0
+          })
+        }, [
+          Vue.unref(translationTextList).length > 0 ? (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, { key: 0 }, Vue.renderList(Vue.unref(translationTextList), (text, index) => {
+            return Vue.openBlock(), Vue.createElementBlock("span", { key: index }, [
+              text.type === "face" ? (Vue.openBlock(), Vue.createElementBlock("img", {
+                key: 0,
+                class: "text-face",
+                src: text.value
+              }, null, 8, _hoisted_1)) : (Vue.openBlock(), Vue.createElementBlock("span", _hoisted_2, Vue.toDisplayString(text.value), 1))
+            ]);
+          }), 128)) : (Vue.openBlock(), Vue.createElementBlock(Vue.Fragment, { key: 1 }, [
+            Vue.createTextVNode(Vue.toDisplayString(Vue.unref(translationErrorText)), 1)
+          ], 64))
+        ], 2)) : Vue.createCommentVNode("", true),
+        Vue.createElementVNode("div", {
+          ref_key: "translationLoadingRef",
+          ref: translationLoadingRef,
+          class: Vue.normalizeClass({
+            "loading": true,
+            "loading-end": Vue.unref(translationFinished)
+          })
+        }, Vue.toDisplayString(Vue.unref(TUIChatEngine.TUITranslateService).t("TUIChat.翻译中")) + "... ", 3)
+      ], 4);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-video.vue.d.ts

@@ -0,0 +1,41 @@
+import { IMessageModel } from '@tencentcloud/chat-uikit-engine';
+import { IVideoMessageContent } from '../../../../interface';
+
+declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    content: IVideoMessageContent;
+    messageItem: IMessageModel;
+}>, {
+    content: () => IVideoMessageContent;
+    messageItem: () => IMessageModel;
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    uploading: (...args: any[]) => void;
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    content: IVideoMessageContent;
+    messageItem: IMessageModel;
+}>, {
+    content: () => IVideoMessageContent;
+    messageItem: () => IMessageModel;
+}>>> & {
+    onUploading?: ((...args: any[]) => any) | undefined;
+}, {
+    content: IVideoMessageContent;
+    messageItem: IMessageModel;
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-video.vue.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const messageVideo_vue_vue_type_script_setup_true_lang = require("./message-video.vue2.js");
+;/* empty css                    */
+const _pluginVue_exportHelper = require("../../../../../../../_virtual/_plugin-vue_export-helper.js");
+const MessageVideo = /* @__PURE__ */ _pluginVue_exportHelper.default(messageVideo_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-281f1f55"]]);
+exports.default = MessageVideo;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/message-video.vue2.js

@@ -0,0 +1,167 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+require("../../../../adapter-vue.js");
+const utils = require("../../utils/utils.js");
+const Icon = require("../../../common/Icon.vue.js");
+const iconClose = require("../../../../assets/icon/icon-close.svg.js");
+const env = require("../../../../utils/env.js");
+const _hoisted_1 = { class: "message-video" };
+const _hoisted_2 = ["src"];
+const _hoisted_3 = ["src", "poster"];
+const _hoisted_4 = ["src", "poster"];
+const _hoisted_5 = {
+  key: 0,
+  class: "dialog-video"
+};
+const _hoisted_6 = ["src"];
+const transparentPosterUrl = "https://web.sdk.qcloud.com/im/assets/images/transparent.png";
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "message-video",
+  props: {
+    content: { default: () => ({}) },
+    messageItem: { default: () => ({}) }
+  },
+  emits: ["uploading"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const isShow = Vue.ref(false);
+    const poster = Vue.ref("");
+    const posterWidth = Vue.ref(0);
+    const posterHeight = Vue.ref(0);
+    const skeleton = Vue.ref();
+    const videoRef = Vue.ref();
+    Vue.watchEffect(async () => {
+      if (!props.content) return;
+      poster.value = await handlePosterUrl(props.content, props.messageItem);
+      Vue.nextTick(async () => {
+        var _a, _b, _c, _d, _e;
+        const containerWidth = ((_a = document.getElementById("messageScrollList")) == null ? void 0 : _a.clientWidth) || 0;
+        const max = !env.isPC ? Math.min(containerWidth - 172, 300) : 300;
+        let size;
+        if (props.messageItem.status === "success") {
+          let { snapshotWidth = 0, snapshotHeight = 0 } = props.content;
+          const { snapshotUrl } = props.content;
+          if (snapshotWidth === 0 || snapshotHeight === 0) return;
+          if (snapshotUrl === transparentPosterUrl) {
+            snapshotWidth = posterWidth.value;
+            snapshotHeight = posterHeight.value;
+          }
+          size = utils.handleSkeletonSize(snapshotWidth, snapshotHeight, max, max);
+          ((_b = skeleton == null ? void 0 : skeleton.value) == null ? void 0 : _b.style) && (skeleton.value.style.width = `${size.width}px`);
+          ((_c = skeleton == null ? void 0 : skeleton.value) == null ? void 0 : _c.style) && (skeleton.value.style.height = `${size.height}px`);
+          if (env.isPC) {
+            ((_d = videoRef == null ? void 0 : videoRef.value) == null ? void 0 : _d.style) && (videoRef.value.style.width = `${size.width}px`);
+            ((_e = videoRef == null ? void 0 : videoRef.value) == null ? void 0 : _e.style) && (videoRef.value.style.height = `${size.height}px`);
+          }
+        } else {
+          emits("uploading");
+        }
+      });
+    });
+    const isWidth = Vue.computed(() => {
+      const { snapshotWidth = 0, snapshotHeight = 0 } = props.messageItem.payload;
+      return snapshotWidth >= snapshotHeight;
+    });
+    Vue.watch(() => props.messageItem.status, (newVal, oldVal) => {
+      if (newVal === "success" && oldVal !== "success") {
+        emits("uploading");
+      }
+    });
+    function toggleVideoPreviewer() {
+      if (props.messageItem.progress > 0 && props.messageItem.progress < 1) {
+        return;
+      }
+      isShow.value = !isShow.value;
+    }
+    function getVideoBase64(url) {
+      return new Promise((resolve) => {
+        let dataURL = "";
+        const video = document.createElement("video");
+        video.setAttribute("crossOrigin", "anonymous");
+        video.setAttribute("src", url);
+        video.setAttribute("preload", "auto");
+        video.addEventListener(
+          "loadeddata",
+          function() {
+            const canvas = document.createElement("canvas"), width = video.videoWidth, height = video.videoHeight;
+            canvas.width = width;
+            canvas.height = height;
+            canvas.getContext("2d").drawImage(video, 0, 0, width, height);
+            dataURL = canvas.toDataURL("image/jpeg");
+            posterWidth.value = width;
+            posterHeight.value = height;
+            resolve(dataURL);
+          },
+          { once: true }
+        );
+      });
+    }
+    async function handlePosterUrl(messgeContent, messageItem) {
+      var _a, _b, _c, _d;
+      if (!messageItem) return "";
+      if (messageItem.status !== "success") {
+        return await getVideoBase64(messgeContent.url);
+      } else {
+        return messgeContent.snapshotUrl !== transparentPosterUrl && messgeContent.snapshotUrl || ((_a = messageItem == null ? void 0 : messageItem.payload) == null ? void 0 : _a.snapshotUrl) !== transparentPosterUrl && ((_b = messageItem == null ? void 0 : messageItem.payload) == null ? void 0 : _b.snapshotUrl) || ((_c = messageItem.payload) == null ? void 0 : _c.thumbUrl) !== transparentPosterUrl && ((_d = messageItem == null ? void 0 : messageItem.payload) == null ? void 0 : _d.thumbUrl) || await getVideoBase64(messgeContent.url);
+      }
+    }
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+        Vue.createElementVNode("div", {
+          ref_key: "skeleton",
+          ref: skeleton,
+          class: Vue.normalizeClass(["message-video-box", [
+            (!props.messageItem.progress || props.messageItem.progress === 1) && !Vue.unref(env.isPC) && "message-video-cover"
+          ]]),
+          onClick: toggleVideoPreviewer
+        }, [
+          props.messageItem.progress > 0 && props.messageItem.progress < 1 && Vue.unref(poster) || !Vue.unref(env.isPC) && Vue.unref(poster) ? (Vue.openBlock(), Vue.createElementBlock("img", {
+            key: 0,
+            class: Vue.normalizeClass(["message-img", [Vue.unref(isWidth) ? "is-width" : "is-height"]]),
+            src: Vue.unref(poster)
+          }, null, 10, _hoisted_2)) : !Vue.unref(env.isPC) ? (Vue.openBlock(), Vue.createElementBlock("video", {
+            key: 1,
+            ref_key: "videoRef",
+            ref: videoRef,
+            class: "message-img video-h5-uploading",
+            src: props.content.url + "#t=0.1",
+            poster: props.content.url,
+            preload: "auto",
+            muted: ""
+          }, null, 8, _hoisted_3)) : (Vue.openBlock(), Vue.createElementBlock("video", {
+            key: 2,
+            ref_key: "videoRef",
+            ref: videoRef,
+            class: "message-img video-web",
+            src: props.content.url,
+            controls: "",
+            preload: "metadata",
+            poster: Vue.unref(poster)
+          }, null, 8, _hoisted_4))
+        ], 2),
+        Vue.unref(isShow) && !Vue.unref(env.isPC) ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_5, [
+          Vue.createElementVNode("div", {
+            class: "dialog-video-close",
+            onClick: Vue.withModifiers(toggleVideoPreviewer, ["stop"])
+          }, [
+            Vue.createVNode(Icon.default, { file: Vue.unref(iconClose.default) }, null, 8, ["file"])
+          ]),
+          Vue.createElementVNode("div", {
+            class: Vue.normalizeClass(["dialog-video-box", [!Vue.unref(env.isPC) ? "dialog-video-h5" : ""]]),
+            onClick: Vue.withModifiers(toggleVideoPreviewer, ["self"])
+          }, [
+            Vue.createElementVNode("video", {
+              class: Vue.normalizeClass([Vue.unref(isWidth) ? "is-width" : "is-height"]),
+              src: props.content.url,
+              controls: "",
+              autoplay: ""
+            }, null, 10, _hoisted_6)
+          ], 2)
+        ])) : Vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/read-status/index.vue.d.ts

@@ -0,0 +1,34 @@
+import { IMessageModel } from '@tencentcloud/chat-uikit-engine';
+
+interface IProps {
+    message: IMessageModel;
+}
+declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IProps>, {
+    message: () => IMessageModel;
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    openReadUserPanel: () => void;
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IProps>, {
+    message: () => IMessageModel;
+}>>> & {
+    onOpenReadUserPanel?: (() => any) | undefined;
+}, {
+    message: IMessageModel;
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/read-status/index.vue.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const index_vue_vue_type_script_setup_true_lang = require("./index.vue2.js");
+;/* empty css            */
+const _pluginVue_exportHelper = require("../../../../../../../../_virtual/_plugin-vue_export-helper.js");
+const ReadStatus = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-085f4d59"]]);
+exports.default = ReadStatus;

package/lib/components/Chat/ChatKit/components/TUIChat/message-list/message-elements/read-status/index.vue2.js

@@ -0,0 +1,144 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+require("../../../../../adapter-vue.js");
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+const config = require("../../../config.js");
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "index",
+  props: {
+    message: { default: () => ({}) }
+  },
+  emits: ["openReadUserPanel"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const props = __props;
+    const ReadStatus = config.default.getFeatureConfig("ReadStatus");
+    const TYPES = TUIChatEngine.TYPES;
+    const isDisplayMessageReadReceipt = Vue.ref(TUIChatEngine.TUIStore.getData(TUIChatEngine.StoreName.USER, "displayMessageReadReceipt"));
+    Vue.onMounted(() => {
+      TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.USER, {
+        displayMessageReadReceipt: onDisplayMessageReadReceiptUpdate
+      });
+    });
+    Vue.onUnmounted(() => {
+      TUIChatEngine.TUIStore.unwatch(TUIChatEngine.StoreName.USER, {
+        displayMessageReadReceipt: onDisplayMessageReadReceiptUpdate
+      });
+    });
+    const isShowReadStatus = Vue.computed(() => {
+      if (!ReadStatus) {
+        return false;
+      }
+      if (!isDisplayMessageReadReceipt.value) {
+        return false;
+      }
+      const {
+        ID,
+        type,
+        flow,
+        status,
+        hasRiskContent,
+        conversationID,
+        conversationType,
+        needReadReceipt = false
+      } = props.message;
+      if (hasRiskContent) {
+        return false;
+      }
+      const { groupProfile } = TUIChatEngine.TUIStore.getConversationModel(conversationID) || {};
+      if ((groupProfile == null ? void 0 : groupProfile.type) === TYPES.GRP_AVCHATROOM || (groupProfile == null ? void 0 : groupProfile.type) === TYPES.GRP_COMMUNITY) {
+        return false;
+      }
+      if (type === TYPES.MSG_CUSTOM) {
+        const message = TUIChatEngine.TUIStore.getMessageModel(ID);
+        if ((message == null ? void 0 : message.getSignalingInfo()) !== null) {
+          return false;
+        }
+      }
+      if (flow !== "out" || status !== "success") {
+        return false;
+      }
+      if (conversationType === "GROUP") {
+        return needReadReceipt;
+      } else if (conversationType === "C2C") {
+        return true;
+      }
+      return false;
+    });
+    const readState = Vue.computed(() => {
+      const { conversationType, needReadReceipt = false, isPeerRead = false } = props.message;
+      const { readCount = 0, unreadCount = 0, isPeerRead: isReceiptPeerRead = false } = props.message.readReceiptInfo;
+      if (conversationType === "C2C") {
+        if (needReadReceipt) {
+          return isReceiptPeerRead ? 0 : 1;
+        } else {
+          return isPeerRead ? 0 : 1;
+        }
+      } else if (conversationType === "GROUP") {
+        if (needReadReceipt) {
+          if (readCount === 0) {
+            return 1;
+          } else if (unreadCount === 0) {
+            return 2;
+          } else {
+            return 4;
+          }
+        } else {
+          return 3;
+        }
+      }
+      return 1;
+    });
+    const readStatusText = Vue.computed(() => {
+      const { readCount = 0 } = props.message.readReceiptInfo;
+      switch (readState.value) {
+        case 0:
+          return TUIChatEngine.TUITranslateService.t("TUIChat.已读");
+        case 1:
+          return TUIChatEngine.TUITranslateService.t("TUIChat.未读");
+        case 2:
+          return TUIChatEngine.TUITranslateService.t("TUIChat.全部已读");
+        case 4:
+          return `${readCount}${TUIChatEngine.TUITranslateService.t("TUIChat.人已读")}`;
+        default:
+          return "";
+      }
+    });
+    const isUseUnreadStyle = Vue.computed(() => {
+      const { conversationType } = props.message;
+      if (conversationType === "C2C") {
+        return readState.value !== 0;
+      } else if (conversationType === "GROUP") {
+        return readState.value !== 2;
+      }
+      return false;
+    });
+    const isHoverFingerPointer = Vue.computed(() => {
+      return props.message.needReadReceipt && props.message.conversationType === "GROUP" && (readState.value === 4 || readState.value === 1);
+    });
+    function openReadUserPanel() {
+      if (isHoverFingerPointer.value) {
+        emits("openReadUserPanel");
+      }
+    }
+    function onDisplayMessageReadReceiptUpdate(isDisplay) {
+      isDisplayMessageReadReceipt.value = isDisplay;
+    }
+    return (_ctx, _cache) => {
+      return Vue.withDirectives((Vue.openBlock(), Vue.createElementBlock("div", {
+        class: Vue.normalizeClass({
+          "message-label": true,
+          "unread": Vue.unref(isUseUnreadStyle),
+          "finger-point": Vue.unref(isHoverFingerPointer)
+        }),
+        onClick: openReadUserPanel
+      }, [
+        Vue.createElementVNode("span", null, Vue.toDisplayString(Vue.unref(readStatusText)), 1)
+      ], 2)), [
+        [Vue.vShow, Vue.unref(isShowReadStatus)]
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;