@tencentcloud/roomkit-web-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,
96 lines (95 loc) • 4.22 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const IconButton = require("../common/base/IconButton.vue.js");
const uikitBaseComponentVue3 = require("@tencentcloud/uikit-base-component-vue3");
require("../../services/main.js");
const roomService = require("../../services/roomService.js");
const index = require("../../locales/index.js");
require("@tencentcloud/tuiroom-engine-js");
require("../../utils/environment.js");
require("mitt");
require("../../services/manager/roomActionManager.js");
require("@tencentcloud/tui-core");
const useRoomOverlayHooks = require("../RoomOverlay/useRoomOverlayHooks.js");
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__ */ Vue.defineComponent({
__name: "AIControl",
setup(__props) {
const { toggleOverlayVisibility } = useRoomOverlayHooks.useRoomOverlayHooks();
const { t } = index.useI18n();
const AIControlConfig = roomService.roomService.getComponentConfig("AIControl");
const { basicStore } = roomService.roomService;
const isSidebarOpen = Vue.computed(() => basicStore.isSidebarOpen);
const sidebarName = Vue.computed(() => basicStore.sidebarName);
const showToolBox = Vue.ref(false);
const showSubtitles = Vue.ref(false);
Vue.watch(isSidebarOpen, (newValue) => {
showToolBox.value = newValue && false;
});
function toggleToolBox() {
showToolBox.value = !showToolBox.value;
}
function handleExperienceAsr() {
basicStore.setIsExperiencedAI(true);
roomService.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(useRoomOverlayHooks.OverlayMap.AISubtitlesOverlay, showSubtitles.value);
};
return (_ctx, _cache) => {
return Vue.unref(AIControlConfig).visible ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
Vue.createVNode(IconButton.default, {
"is-active": sidebarName.value === "aiTranscription",
title: Vue.unref(t)("AI Assistant"),
onClickIcon: toggleToolBox
}, {
default: Vue.withCtx(() => [
Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconAIIcon), { size: "24" })
]),
_: 1
}, 8, ["is-active", "title"]),
!isSidebarOpen.value && showToolBox.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_2, [
Vue.createElementVNode("div", {
class: "tool-box-item",
onClick: openAISubtitles
}, [
Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconAISubtitles), { class: "icon" }),
!showSubtitles.value ? (Vue.openBlock(), Vue.createElementBlock("span", _hoisted_3, Vue.toDisplayString(Vue.unref(t)("Turn on AI real-time subtitles")), 1)) : (Vue.openBlock(), Vue.createElementBlock("span", _hoisted_4, Vue.toDisplayString(Vue.unref(t)("Turn off AI real-time subtitles")), 1))
]),
Vue.createElementVNode("div", {
class: "tool-box-item",
onClick: toggleAITranscription
}, [
Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconAITranscription), { class: "icon" }),
Vue.createElementVNode("span", null, Vue.toDisplayString(Vue.unref(t)("Enable AI real-time meeting recording")), 1)
])
])) : Vue.createCommentVNode("", true)
])) : Vue.createCommentVNode("", true);
};
}
});
exports.default = _sfc_main;