@tencentcloud/roomkit-electron-vue3
Version:
<h1 align="center"> TUIRoomKit</h1> Conference (TUIRoomKit) is a product suitable for multi-person audio and video conversation scenarios such as business meetings, webinars, and online education. By integrating this product, you can add room management,
101 lines (100 loc) • 4.1 kB
JavaScript
import { defineComponent, computed, ref, watch, createElementBlock, createCommentVNode, unref, openBlock, createVNode, createElementVNode, toDisplayString } from "vue";
import IconButton from "../common/base/IconButton.vue.mjs";
import AIIcon from "../common/icons/AIIcon.vue.mjs";
import AITranscription from "../common/icons/AITranscription.vue.mjs";
import AISubtitlesIcon from "../common/icons/AISubtitles.vue.mjs";
import "../../services/main.mjs";
import { roomService } from "../../services/roomService.mjs";
import { useI18n } from "../../locales/index.mjs";
import "@tencentcloud/tuiroom-engine-electron";
import "../../utils/environment.mjs";
import "mitt";
import "../../services/manager/roomActionManager.mjs";
import "@tencentcloud/tui-core";
import SvgIcon from "../common/base/SvgIcon.vue.mjs";
import { useRoomOverlayHooks, OverlayMap } from "../RoomOverlay/useRoomOverlayHooks.mjs";
const _hoisted_1 = {
key: 0,
class: "more-control-container"
};
const _hoisted_2 = {
key: 0,
class: "tool-box"
};
const _hoisted_3 = { key: 0 };
const _hoisted_4 = { key: 1 };
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "AIControl",
setup(__props) {
const { toggleOverlayVisibility } = useRoomOverlayHooks();
const { t } = useI18n();
const AIControlConfig = roomService.getComponentConfig("AIControl");
const { basicStore } = roomService;
const isSidebarOpen = computed(() => basicStore.isSidebarOpen);
const sidebarName = computed(() => basicStore.sidebarName);
const showToolBox = ref(false);
const showSubtitles = ref(false);
watch(isSidebarOpen, (newValue) => {
showToolBox.value = newValue && false;
});
function toggleToolBox() {
showToolBox.value = !showToolBox.value;
}
function handleExperienceAsr() {
basicStore.setIsExperiencedAI(true);
roomService.trackingManager.sendMessage("experience-room-ai");
}
const toggleAITranscription = () => {
if (basicStore.setSidebarOpenStatus && basicStore.sidebarName === "aiTranscription") {
basicStore.setSidebarOpenStatus(false);
basicStore.setSidebarName("");
return;
}
handleExperienceAsr();
basicStore.setSidebarOpenStatus(true);
basicStore.setSidebarName("aiTranscription");
showToolBox.value = false;
};
const openAISubtitles = () => {
showSubtitles.value = !showSubtitles.value;
showToolBox.value = false;
handleExperienceAsr();
toggleOverlayVisibility(OverlayMap.AISubtitlesOverlay, showSubtitles.value);
};
return (_ctx, _cache) => {
return unref(AIControlConfig).visible ? (openBlock(), createElementBlock("div", _hoisted_1, [
createVNode(IconButton, {
"is-active": sidebarName.value === "aiTranscription",
title: unref(t)("AI Assistant"),
icon: AIIcon,
onClickIcon: toggleToolBox
}, null, 8, ["is-active", "title"]),
!isSidebarOpen.value && showToolBox.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
createElementVNode("div", {
class: "tool-box-item",
onClick: openAISubtitles
}, [
createVNode(SvgIcon, {
class: "icon",
icon: AISubtitlesIcon
}),
!showSubtitles.value ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(unref(t)("Turn on AI real-time subtitles")), 1)) : (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(unref(t)("Turn off AI real-time subtitles")), 1))
]),
createElementVNode("div", {
class: "tool-box-item",
onClick: toggleAITranscription
}, [
createVNode(SvgIcon, {
class: "icon",
icon: AITranscription
}),
createElementVNode("span", null, toDisplayString(unref(t)("Enable AI real-time meeting recording")), 1)
])
])) : createCommentVNode("", true)
])) : createCommentVNode("", true);
};
}
});
export {
_sfc_main as default
};