@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,
137 lines (136 loc) • 4.9 kB
JavaScript
"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const pinia = require("pinia");
require("../../services/main.js");
const roomService = require("../../services/roomService.js");
const types = require("../../services/types.js");
const index = require("../../locales/index.js");
require("@tencentcloud/tuiroom-engine-electron");
require("../../utils/environment.js");
require("mitt");
require("../../services/manager/roomActionManager.js");
require("@tencentcloud/tui-core");
const index$1 = require("../common/base/Dialog/index.vue.js");
const Button = require("../common/base/Button.vue.js");
const index$2 = require("../common/base/Input/index.vue.js");
const CloseInputIcon = require("../common/icons/CloseInputIcon.vue.js");
const basic = require("../../stores/basic.js");
const SvgIcon = require("../common/base/SvgIcon.vue.js");
const common = require("../../utils/common.js");
const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
__name: "PasswordDialog",
props: {
visible: { type: Boolean }
},
setup(__props) {
const basicStore = basic.useBasicStore();
const { roomId } = pinia.storeToRefs(basicStore);
const { t } = index.useI18n();
const inputPassword = Vue.ref("");
const props = __props;
const isShowPasswordContainer = Vue.ref(false);
const isJoiningRoom = Vue.ref(false);
const isJoinButtonDisable = Vue.computed(
() => inputPassword.value.length === 0 || isJoiningRoom.value
);
Vue.watch(
() => props.visible,
(val) => {
isShowPasswordContainer.value = val;
},
{
immediate: true
}
);
async function joinRoom() {
try {
isJoiningRoom.value = true;
await roomService.roomService.join(roomId.value, {
isOpenCamera: false,
isOpenMicrophone: true,
password: inputPassword.value
});
roomService.roomService.emit(types.EventType.ROOM_JOIN);
} catch (error) {
isJoiningRoom.value = false;
}
}
function cancelInputPassword() {
inputPassword.value = "";
roomService.roomService.emit(types.EventType.ROOM_ERROR);
}
Vue.watch(
() => inputPassword.value,
async (val) => {
if (val && common.invalidPasswordRegex.test(val)) {
await Vue.nextTick();
inputPassword.value = val.replace(common.invalidPasswordRegex, "");
}
}
);
return (_ctx, _cache) => {
return Vue.openBlock(), Vue.createBlock(index$1.default, {
modelValue: isShowPasswordContainer.value,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isShowPasswordContainer.value = $event),
title: Vue.unref(t)("The room is encrypted"),
modal: true,
"show-close": false,
"close-on-click-modal": false,
width: "420px",
"append-to-body": true,
"confirm-button": Vue.unref(t)("Join"),
"cancel-button": Vue.unref(t)("Cancel"),
onConfirm: joinRoom,
onCancel: cancelInputPassword
}, {
footer: Vue.withCtx(() => [
Vue.createElementVNode("span", null, [
Vue.createVNode(Button.default, {
class: "button",
size: "default",
disabled: isJoinButtonDisable.value,
onClick: joinRoom
}, {
default: Vue.withCtx(() => [
Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Join")), 1)
]),
_: 1
}, 8, ["disabled"]),
Vue.createVNode(Button.default, {
class: "button",
size: "default",
type: "primary",
onClick: cancelInputPassword
}, {
default: Vue.withCtx(() => [
Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
]),
_: 1
})
])
]),
default: Vue.withCtx(() => [
Vue.createVNode(index$2.default, {
"model-value": inputPassword.value,
onInput: _cache[1] || (_cache[1] = ($event) => inputPassword.value = $event),
placeholder: Vue.unref(t)("Please enter the password"),
type: "password",
maxlength: "32"
}, {
suffixIcon: Vue.withCtx(() => [
Vue.createVNode(SvgIcon.default, {
class: "svg-icon",
onClick: _cache[0] || (_cache[0] = ($event) => inputPassword.value = ""),
icon: CloseInputIcon.default
})
]),
_: 1
}, 8, ["model-value", "placeholder"])
]),
_: 1
}, 8, ["modelValue", "title", "confirm-button", "cancel-button"]);
};
}
});
exports.default = _sfc_main;