@tencentcloud/roomkit-electron-vue3 2.4.2 → 2.6.0

package/lib/components/ManageMember/useIndexHooks.js

@@ -10,6 +10,13 @@ const TUIRoomEngine = require("@tencentcloud/tuiroom-engine-electron");
 const Message = require("../common/base/Message/Message.js");
 const message = require("../../constants/message.js");
 const environment = require("../../utils/environment.js");
+const AllMembersShareScreenIcon = require("../common/icons/AllMembersShareScreenIcon.vue.js");
+const HostShareScreenIcon = require("../common/icons/HostShareScreenIcon.vue.js");
+require("../../services/main.js");
+const roomService = require("../../services/roomService.js");
+require("mitt");
+require("../../services/manager/roomActionManager.js");
+const room$1 = require("../../constants/room.js");
 function useIndex() {
   const roomEngine = useRoomEngine.default();
   const { t } = index.useI18n();
@@ -19,56 +26,139 @@ function useIndex() {
     userList,
     anchorUserList,
     applyToAnchorList,
-    isOnStateTabActive
+    isOnStateTabActive,
+    generalUserScreenStreamList,
+    remoteNotEnteredUserList
   } = pinia.storeToRefs(roomStore);
-  const audienceUserList = Vue.computed(() => userList.value.filter((user) => !anchorUserList.value.includes(user)));
+  let ManageControlType;
+  ((ManageControlType2) => {
+    ManageControlType2["AUDIO"] = "audio";
+    ManageControlType2["VIDEO"] = "video";
+    ManageControlType2["SCREEN"] = "screen";
+  })(ManageControlType || (ManageControlType = {}));
+  const currentActiveTabName = Vue.ref(room$1.USERS_STATUS.Entered);
+  const audienceUserList = Vue.computed(
+    () => userList.value.filter(
+      (user) => !anchorUserList.value.includes(user) && user.isInRoom
+    )
+  );
+  const enterUserList = Vue.computed(
+    () => userList.value.filter((user) => user.isInRoom)
+  );
   const searchText = Vue.ref("");
-  function handleToggleStaged() {
+  const showMoreControl = Vue.ref(false);
+  function handleToggleStaged(item) {
+    currentActiveTabName.value = item.status;
     isOnStateTabActive.value = !isOnStateTabActive.value;
     roomStore.setOnStageTabStatus(isOnStateTabActive.value);
   }
   const filteredUserList = Vue.computed(() => {
     let list = [];
     if (roomStore.isFreeSpeakMode) {
-      list = userList.value;
+      list = enterUserList.value;
     } else if (roomStore.isSpeakAfterTakingSeatMode) {
       list = isOnStateTabActive.value ? anchorUserList.value : audienceUserList.value;
     }
     if (!searchText.value) {
       return list;
     }
-    return list.filter((item) => {
-      var _a;
-      return ((_a = item.userName) == null ? void 0 : _a.includes(searchText.value)) || item.userId.includes(searchText.value);
-    });
+    return list.filter(
+      (item) => {
+        var _a, _b;
+        return ((_a = item.nameCard) == null ? void 0 : _a.includes(searchText.value)) || ((_b = item.userName) == null ? void 0 : _b.includes(searchText.value)) || item.userId.includes(searchText.value);
+      }
+    );
   });
-  const alreadyStaged = Vue.computed(() => `${t("Already on stage")} (${anchorUserList.value.length})`);
-  const notStaged = Vue.computed(() => `${t("Not on stage")} (${audienceUserList.value.length})`);
-  function handleInvite() {
-    basicStore.setSidebarName("invite");
-  }
-  const audioManageInfo = Vue.computed(() => roomStore.isMicrophoneDisableForAllUser ? t("Lift all mute") : t("All mute"));
-  const videoManageInfo = Vue.computed(() => roomStore.isCameraDisableForAllUser ? t("Lift stop all video") : t("All stop video"));
+  const filteredUserStatusList = Vue.computed(() => {
+    let list = [];
+    if (roomStore.isFreeSpeakMode) {
+      list = currentActiveTabName.value === room$1.USERS_STATUS.Entered ? enterUserList.value : remoteNotEnteredUserList.value;
+    } else {
+      switch (currentActiveTabName.value) {
+        case room$1.USERS_STATUS.ON_STAGE:
+          list = anchorUserList.value;
+          break;
+        case room$1.USERS_STATUS.NOT_ON_STAGE:
+          list = audienceUserList.value;
+          break;
+        default:
+          list = remoteNotEnteredUserList.value;
+      }
+    }
+    if (!searchText.value) {
+      return list;
+    }
+    const searchFilter = (item) => {
+      var _a, _b;
+      return ((_a = item.nameCard) == null ? void 0 : _a.includes(searchText.value)) || ((_b = item.userName) == null ? void 0 : _b.includes(searchText.value)) || item.userId.includes(searchText.value);
+    };
+    return list.filter(searchFilter);
+  });
+  const alreadyStaged = Vue.computed(
+    () => `${t("On stage")} (${anchorUserList.value.length})`
+  );
+  const notStaged = Vue.computed(
+    () => `${t("Not on stage")} (${audienceUserList.value.length})`
+  );
+  const audioManageInfo = Vue.computed(
+    () => roomStore.isMicrophoneDisableForAllUser ? t("Lift all mute") : t("All mute")
+  );
+  const videoManageInfo = Vue.computed(
+    () => roomStore.isCameraDisableForAllUser ? t("Lift stop all video") : t("All stop video")
+  );
+  const userStatusList = Vue.computed(() => {
+    if (roomStore.isFreeSpeakMode) {
+      return [
+        {
+          status: room$1.USERS_STATUS.Entered,
+          title: `${t("Entered")} (${enterUserList.value.length})`
+        },
+        {
+          status: room$1.USERS_STATUS.NOT_ENTER,
+          title: `${t("Not Entered")} (${remoteNotEnteredUserList.value.length})`
+        }
+      ];
+    }
+    return [
+      {
+        status: room$1.USERS_STATUS.ON_STAGE,
+        title: `${t("On stage")} (${anchorUserList.value.length})`
+      },
+      {
+        status: room$1.USERS_STATUS.NOT_ON_STAGE,
+        title: `${t("Not on stage")} (${audienceUserList.value.length})`
+      },
+      {
+        status: room$1.USERS_STATUS.NOT_ENTER,
+        title: `${t("Not Entered")} (${remoteNotEnteredUserList.value.length})`
+      }
+    ];
+  });
+  const moreControlList = Vue.computed(() => [
+    {
+      title: roomStore.isScreenShareDisableForAllUser ? t("All members can share screen") : t("Screen sharing for host/admin only"),
+      icon: roomStore.isScreenShareDisableForAllUser ? AllMembersShareScreenIcon.default : HostShareScreenIcon.default,
+      func: toggleManageAllMember,
+      type: "screen"
+      /* SCREEN */
+    }
+  ]);
   const showManageAllUserDialog = Vue.ref(false);
   const dialogContent = Vue.ref("");
   const dialogTitle = Vue.ref("");
   const dialogActionInfo = Vue.ref("");
   let stateForAllAudio = false;
   let stateForAllVideo = false;
-  let ManageControlType;
-  ((ManageControlType2) => {
-    ManageControlType2["AUDIO"] = "audio";
-    ManageControlType2["VIDEO"] = "video";
-  })(ManageControlType || (ManageControlType = {}));
+  let stateForScreenShare = false;
   const currentControlType = Vue.ref(
     "audio"
     /* AUDIO */
   );
   async function toggleManageAllMember(type) {
-    showManageAllUserDialog.value = true;
     currentControlType.value = type;
     switch (type) {
       case "audio":
+        showManageAllUserDialog.value = true;
         dialogTitle.value = roomStore.isMicrophoneDisableForAllUser ? t("Enable all audios") : t("All current and new members will be muted");
         dialogContent.value = roomStore.isMicrophoneDisableForAllUser ? t("After unlocking, users can freely turn on the microphone") : t("Members will not be able to open the microphone");
         stateForAllAudio = !roomStore.isMicrophoneDisableForAllUser;
@@ -76,15 +166,31 @@ function useIndex() {
         dialogActionInfo.value = audioManageInfo.value;
         break;
       case "video":
+        showManageAllUserDialog.value = true;
         dialogTitle.value = roomStore.isCameraDisableForAllUser ? t("Enable all videos") : t("All and new members will be banned from the camera");
         dialogContent.value = roomStore.isCameraDisableForAllUser ? t("After unlocking, users can freely turn on the camera") : t("Members will not be able to open the camera");
         stateForAllVideo = !roomStore.isCameraDisableForAllUser;
         await Vue.nextTick();
         dialogActionInfo.value = videoManageInfo.value;
         break;
+      case "screen":
+        stateForScreenShare = !roomStore.isScreenShareDisableForAllUser;
+        if (generalUserScreenStreamList.value.length === 0) {
+          toggleAllScreenShare();
+          break;
+        }
+        showManageAllUserDialog.value = true;
+        dialogTitle.value = t(
+          "Is it turned on that only the host/admin can share the screen?"
+        );
+        dialogContent.value = t(
+          "Other member is sharing the screen is now, the member's sharing will be terminated after you turning on"
+        );
+        break;
     }
   }
   async function doToggleManageAllMember() {
+    var _a;
     switch (currentControlType.value) {
       case "audio":
         toggleAllAudio();
@@ -92,9 +198,25 @@ function useIndex() {
       case "video":
         toggleAllVideo();
         break;
+      case "screen":
+        await ((_a = roomEngine.instance) == null ? void 0 : _a.closeRemoteDeviceByAdmin({
+          userId: generalUserScreenStreamList.value[0].userId,
+          device: TUIRoomEngine.TUIMediaDevice.kScreen
+        }));
+        toggleAllScreenShare();
+        break;
     }
     showManageAllUserDialog.value = false;
   }
+  async function toggleAllScreenShare() {
+    var _a;
+    await ((_a = roomEngine.instance) == null ? void 0 : _a.disableDeviceForAllUserByAdmin({
+      isDisable: stateForScreenShare,
+      device: TUIRoomEngine.TUIMediaDevice.kScreen
+    }));
+    roomStore.setDisableScreenShareForAllUserByAdmin(stateForScreenShare);
+    showMoreControl.value = false;
+  }
   function showApplyUserList() {
     if (environment.isMobile) {
       basicStore.setSidebarOpenStatus(true);
@@ -118,7 +240,7 @@ function useIndex() {
       isDisable: stateForAllAudio,
       device: TUIRoomEngine.TUIMediaDevice.kMicrophone
     }));
-    roomStore.setMicrophoneDisableState(stateForAllAudio);
+    roomStore.setDisableMicrophoneForAllUserByAdmin(stateForAllAudio);
   }
   async function toggleAllVideo() {
     var _a;
@@ -135,21 +257,34 @@ function useIndex() {
       isDisable: stateForAllVideo,
       device: TUIRoomEngine.TUIMediaDevice.kCamera
     }));
-    roomStore.setCameraDisableState(stateForAllVideo);
+    roomStore.setDisableCameraForAllUserByAdmin(stateForAllVideo);
   }
   const applyToAnchorUserContent = Vue.computed(() => {
-    var _a, _b;
+    var _a, _b, _c;
     const lastIndex = applyToAnchorList.value.length - 1;
-    const userName = ((_a = applyToAnchorList.value[lastIndex]) == null ? void 0 : _a.userName) || ((_b = applyToAnchorList.value[lastIndex]) == null ? void 0 : _b.userId);
+    const userName = ((_a = applyToAnchorList.value[lastIndex]) == null ? void 0 : _a.nameCard) || ((_b = applyToAnchorList.value[lastIndex]) == null ? void 0 : _b.userName) || ((_c = applyToAnchorList.value[lastIndex]) == null ? void 0 : _c.userId);
     if (applyToAnchorList.value.length === 1) {
       return `${userName} ${t("Applying for the stage")}`;
     }
     return `${userName} ${t("and so on number people applying to stage", { number: applyToAnchorList.value.length })}`;
   });
+  function toggleClickMoreBtn() {
+    showMoreControl.value = !showMoreControl.value;
+  }
+  const handleCallAllInvitee = () => {
+    const userIdList = remoteNotEnteredUserList.value.map(
+      (item) => item.userId
+    );
+    roomService.roomService.conferenceInvitationManager.inviteUsers({ userIdList });
+    Message.default({
+      type: "success",
+      message: t("Invitation sent, waiting for members to join."),
+      duration: message.MESSAGE_DURATION.NORMAL
+    });
+  };
   return {
     showApplyUserList,
     searchText,
-    handleInvite,
     t,
     toggleManageAllMember,
     doToggleManageAllMember,
@@ -165,7 +300,14 @@ function useIndex() {
     filteredUserList,
     isOnStateTabActive,
     handleToggleStaged,
-    applyToAnchorUserContent
+    applyToAnchorUserContent,
+    toggleClickMoreBtn,
+    showMoreControl,
+    moreControlList,
+    userStatusList,
+    currentActiveTabName,
+    filteredUserStatusList,
+    handleCallAllInvitee
   };
 }
 exports.default = useIndex;

package/lib/components/PreRoom/LoadingOverlay.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/lib/components/PreRoom/LoadingOverlay.vue.js

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

package/lib/components/PreRoom/LoadingOverlay.vue2.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const index = require("../../locales/index.js");
+const SvgIcon = require("../common/base/SvgIcon.vue.js");
+const LoadingScheduleIcon = require("../common/icons/LoadingScheduleIcon.vue.js");
+const _hoisted_1 = { class: "loading-overlay" };
+const _hoisted_2 = { class: "loading-text" };
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "LoadingOverlay",
+  setup(__props) {
+    const { t } = index.useI18n();
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+        Vue.createVNode(SvgIcon.default, {
+          icon: LoadingScheduleIcon.default,
+          class: "loading"
+        }),
+        Vue.createElementVNode("span", _hoisted_2, Vue.toDisplayString(Vue.unref(t)("Entering the room now...")), 1)
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/PreRoom/PasswordDialog.vue.d.ts

@@ -0,0 +1,14 @@
+interface Props {
+    visible: boolean;
+}
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
+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;
+    };
+};

package/lib/components/PreRoom/PasswordDialog.vue.js

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

package/lib/components/PreRoom/PasswordDialog.vue2.js

@@ -0,0 +1,127 @@
+"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("mitt");
+require("../../services/manager/roomActionManager.js");
+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 utils = require("../../utils/utils.js");
+const Message = require("../common/base/Message/Message.js");
+const message = require("../../constants/message.js");
+const basic = require("../../stores/basic.js");
+const room = require("../../constants/room.js");
+const SvgIcon = require("../common/base/SvgIcon.vue.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);
+    Vue.watch(
+      () => props.visible,
+      (val) => {
+        isShowPasswordContainer.value = val;
+      },
+      {
+        immediate: true
+      }
+    );
+    async function joinRoom() {
+      if (!utils.isDigitsOnly(inputPassword.value) || inputPassword.value.length < room.PASSWORD_MAX_LENGTH_LIMIT) {
+        Message.default({
+          type: "warning",
+          message: t("Your room password format is incorrect, please check it"),
+          duration: message.MESSAGE_DURATION.NORMAL
+        });
+        return;
+      }
+      await roomService.roomService.join(roomId.value, {
+        isOpenCamera: false,
+        isOpenMicrophone: true,
+        password: inputPassword.value
+      });
+      roomService.roomService.emit(types.EventType.ROOM_JOIN);
+    }
+    function cancelInputPassword() {
+      inputPassword.value = "";
+      roomService.roomService.emit(types.EventType.ROOM_ERROR);
+    }
+    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: inputPassword.value.length === 0,
+              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 your room password"),
+            type: "password",
+            maxlength: "6"
+          }, {
+            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;

package/lib/components/RoomContent/StreamContainer/index.vue.d.ts

@@ -1,6 +1,6 @@
 declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<{
     showRoomTool: boolean;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     showRoomTool: boolean;
 }>>>, {}, {}>;
 export default _default;

package/lib/components/RoomContent/StreamContainer/index.vue.js

@@ -1,7 +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");
-require("./index.vue3.js");
+;/* empty css            */
 const _pluginVue_exportHelper = require("../../../_virtual/_plugin-vue_export-helper.js");
-const StreamContainer = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-d8433998"]]);
+const StreamContainer = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-1756ac9e"]]);
 exports.default = StreamContainer;