@ndscnj/roomkit-web-vue3 25.12.24152 → 25.12.24153

package/es/components/RoomFooter/VoteControl/MoreControlH5.vue.d.ts

@@ -0,0 +1,6 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "show-overlay": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    "onShow-overlay"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/es/components/RoomFooter/VoteControl/MoreControlH5.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./MoreControlH5.vue2.mjs";
+/* empty css                    */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const MoreControlH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c413959d"]]);
+export {
+  MoreControlH5 as default
+};

package/es/components/RoomFooter/VoteControl/MoreControlH5.vue2.mjs

@@ -0,0 +1,105 @@
+import { defineComponent, ref, onMounted, onUnmounted, createElementBlock, openBlock, createCommentVNode, unref, withDirectives, createBlock, withCtx, createVNode, createElementVNode, createTextVNode, toDisplayString } from "vue";
+import { IconExtension } from "@tencentcloud/uikit-base-component-vue3";
+import IconButton from "../../common/base/IconButton.vue.mjs";
+import useControl from "./useMoreControlHooks.mjs";
+import _sfc_main$1 from "../ChatControl.vue.mjs";
+import InviteControl from "../InviteControl.vue.mjs";
+import ContactControl from "../ContactControl.vue.mjs";
+import { useRoomStore } from "../../../stores/room.mjs";
+import bus from "../../../hooks/useMitt.mjs";
+import vTap from "../../../directives/vTap.mjs";
+import "../../../services/main.mjs";
+import { roomService } from "../../../services/roomService.mjs";
+import "../../../locales/index.mjs";
+import "@tencentcloud/tuiroom-engine-js";
+import "../../../utils/environment.mjs";
+import "mitt";
+import "../../../services/manager/roomActionManager.mjs";
+import "@tencentcloud/tui-core";
+const _hoisted_1 = {
+  key: 0,
+  class: "more-control-container"
+};
+const _hoisted_2 = { class: "control-compent" };
+const _hoisted_3 = { class: "close" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "MoreControlH5",
+  emits: ["show-overlay"],
+  setup(__props, { emit: __emit }) {
+    const moreControlConfig = roomService.getComponentConfig("MoreControl");
+    const showMoreContent = ref(false);
+    const moreContentRef = ref();
+    const { t, sidebarName } = useControl();
+    const roomStore = useRoomStore();
+    const emit = __emit;
+    function showMore() {
+      showMoreContent.value = true;
+    }
+    function handleCancelControl() {
+      showMoreContent.value = false;
+    }
+    function handleControlClick(name) {
+      bus.emit("experience-communication", name);
+    }
+    function handleShowOverlay(data) {
+      showMoreContent.value = false;
+      emit("show-overlay", data);
+    }
+    function handleDocumentClick(event) {
+      if (showMoreContent.value && !moreContentRef.value.contains(event.target)) {
+        showMoreContent.value = false;
+      }
+    }
+    onMounted(() => {
+      document == null ? void 0 : document.addEventListener("click", handleDocumentClick, true);
+    });
+    onUnmounted(() => {
+      document == null ? void 0 : document.removeEventListener("click", handleDocumentClick, true);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        unref(moreControlConfig).visible ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          withDirectives((openBlock(), createBlock(IconButton, {
+            "is-active": unref(sidebarName) === "more",
+            title: unref(t)("More")
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(IconExtension), { size: "24" })
+            ]),
+            _: 1
+          }, 8, ["is-active", "title"])), [
+            [unref(vTap), showMore]
+          ])
+        ])) : createCommentVNode("", true),
+        showMoreContent.value ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          ref_key: "moreContentRef",
+          ref: moreContentRef,
+          class: "show-more-content"
+        }, [
+          createElementVNode("div", _hoisted_2, [
+            unref(roomStore).isSpeakAfterTakingSeatMode ? (openBlock(), createBlock(_sfc_main$1, {
+              key: 0,
+              onClick: _cache[0] || (_cache[0] = ($event) => handleControlClick("chatControl"))
+            })) : createCommentVNode("", true),
+            createVNode(ContactControl, {
+              onClick: _cache[1] || (_cache[1] = ($event) => handleControlClick("contactControl"))
+            }),
+            createVNode(InviteControl, {
+              onShowOverlay: handleShowOverlay,
+              onClick: _cache[2] || (_cache[2] = ($event) => handleControlClick("inviteControl"))
+            })
+          ]),
+          withDirectives((openBlock(), createElementBlock("div", _hoisted_3, [
+            createTextVNode(toDisplayString(unref(t)("Cancel")), 1)
+          ])), [
+            [unref(vTap), handleCancelControl]
+          ])
+        ], 512)) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/components/RoomFooter/VoteControl/MoreControlPC.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/es/components/RoomFooter/VoteControl/MoreControlPC.vue.mjs

@@ -0,0 +1,49 @@
+import { defineComponent, createElementBlock, createCommentVNode, unref, openBlock, createVNode, withCtx } from "vue";
+import { IconMore } from "@tencentcloud/uikit-base-component-vue3";
+import IconButton from "../../common/base/IconButton.vue.mjs";
+import useControl from "./useMoreControlHooks.mjs";
+import "../../../services/main.mjs";
+import { roomService } from "../../../services/roomService.mjs";
+import "../../../locales/index.mjs";
+import "@tencentcloud/tuiroom-engine-js";
+import "../../../utils/environment.mjs";
+import "mitt";
+import "../../../services/manager/roomActionManager.mjs";
+import "@tencentcloud/tui-core";
+const _hoisted_1 = {
+  key: 0,
+  class: "more-control-container"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "MoreControlPC",
+  setup(__props) {
+    const moreControlConfig = roomService.getComponentConfig("MoreControl");
+    const { t, basicStore, sidebarName } = useControl();
+    function toggleMoreSidebar() {
+      if (basicStore.setSidebarOpenStatus && basicStore.sidebarName === "more") {
+        basicStore.setSidebarOpenStatus(false);
+        basicStore.setSidebarName("");
+        return;
+      }
+      basicStore.setSidebarOpenStatus(true);
+      basicStore.setSidebarName("more");
+    }
+    return (_ctx, _cache) => {
+      return unref(moreControlConfig).visible ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(IconButton, {
+          "is-active": unref(sidebarName) === "more",
+          title: unref(t)("More"),
+          onClickIcon: toggleMoreSidebar
+        }, {
+          default: withCtx(() => [
+            createVNode(unref(IconMore), { size: "24" })
+          ]),
+          _: 1
+        }, 8, ["is-active", "title"])
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/components/RoomFooter/VoteControl/MoreControlPC.vue2.mjs

@@ -0,0 +1,4 @@
+import _sfc_main from "./MoreControlPC.vue.mjs";
+export {
+  _sfc_main as default
+};

package/es/components/RoomFooter/VoteControl/index.d.ts

@@ -0,0 +1,6 @@
+declare const MoreControl: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "show-overlay": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    "onShow-overlay"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any> | import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default MoreControl;

package/es/components/RoomFooter/VoteControl/index.mjs

@@ -0,0 +1,7 @@
+import MoreControlH5 from "./MoreControlH5.vue.mjs";
+import _sfc_main from "./MoreControlPC.vue.mjs";
+import { isMobile } from "../../../utils/environment.mjs";
+const MoreControl = isMobile ? MoreControlH5 : _sfc_main;
+export {
+  MoreControl as default
+};

package/es/components/RoomFooter/VoteControl/useMoreControlHooks.mjs

@@ -0,0 +1,22 @@
+import { computed } from "vue";
+import { useBasicStore } from "../../../stores/basic.mjs";
+import { storeToRefs } from "pinia";
+import { useI18n } from "../../../locales/index.mjs";
+import { ICON_NAME } from "../../../constants/icon.mjs";
+function useControl() {
+  const { t } = useI18n();
+  const basicStore = useBasicStore();
+  const { sidebarName } = storeToRefs(basicStore);
+  const iconName = computed(
+    () => sidebarName.value === "more" ? ICON_NAME.MoreActive : ICON_NAME.More
+  );
+  return {
+    t,
+    basicStore,
+    iconName,
+    sidebarName
+  };
+}
+export {
+  useControl as default
+};

package/es/components/RoomFooter/index/indexPC.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./indexPC.vue2.mjs";
 /* empty css              */
 import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
-const indexPc = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f808bd91"]]);
+const indexPc = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4afcea78"]]);
 export {
   indexPc as default
 };

package/es/components/RoomFooter/index/indexPC.vue2.mjs

@@ -57,7 +57,7 @@ import _sfc_main$3 from "../ManageMemberControl.vue.mjs";
 import _sfc_main$4 from "../ChatControl.vue.mjs";
 import _sfc_main$5 from "../ManageStageControl.vue.mjs";
 import MemberApplyControl from "../ApplyControl/MemberApplyControl.vue.mjs";
-import MoreControl from "../MoreControl/index.mjs";
+import MoreControl$1 from "../MoreControl/index.mjs";
 import EndControl from "../EndControl/index.mjs";
 import _sfc_main$6 from "../SettingControl.vue.mjs";
 import WhiteboardControl from "../WhiteboardControl.vue.mjs";
@@ -65,7 +65,7 @@ import VirtualBackground from "../VirtualBackground.vue.mjs";
 import AIControl from "../AIControl.vue.mjs";
 import BasicBeauty from "../BasicBeauty.vue.mjs";
 import bus from "../../../hooks/useMitt.mjs";
-import voteControl from "../voteControl.vue.mjs";
+import MoreControl from "../VoteControl/index.mjs";
 import useRoomFooter from "./useRoomFooterHooks.mjs";
 const _hoisted_1 = { class: "footer-container" };
 const _hoisted_2 = { class: "left-container" };
@@ -137,7 +137,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             class: "center-container-item",
             onClick: _cache[9] || (_cache[9] = ($event) => handleControlClick("MasterApplyControl"))
           })) : createCommentVNode("", true),
-          createVNode(voteControl, {
+          createVNode(unref(MoreControl), {
             class: "center-container-item",
             onClick: _cache[10] || (_cache[10] = ($event) => handleControlClick("voteControl")),
             onOnVote: onVote
@@ -147,7 +147,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             _: 3
           }),
-          createVNode(unref(MoreControl), {
+          createVNode(unref(MoreControl$1), {
             class: "center-container-item",
             onClick: _cache[11] || (_cache[11] = ($event) => handleControlClick("moreControl"))
           }),

package/es/index.mjs

@@ -3928,17 +3928,45 @@ to {
 }
 .footer .mirror-container .mirror-text[data-v-21a63691] {
   margin-left: 4px;
-}.contact-container[data-v-753053ea] {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 11;
-  box-sizing: border-box;
-  width: 100vw;
-  height: auto;
-  background-color: var(--uikit-color-black-8);
-}.footer-container[data-v-f808bd91] {
+}.show-more-content[data-v-c413959d] {
+  position: absolute;
+  bottom: 15px;
+  left: 5%;
+  width: 90%;
+  height: 17vh;
+  padding: 10px;
+  border-radius: 13px;
+  animation-name: popup-c413959d;
+  animation-duration: 200ms;
+  background-color: var(--bg-color-operate);
+}
+@keyframes popup-c413959d {
+from {
+    bottom: 0;
+}
+to {
+    bottom: 15px;
+}
+}
+.control-compent[data-v-c413959d] {
+  display: flex;
+}
+.close[data-v-c413959d] {
+  position: relative;
+  top: 10%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 10px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px;
+  text-align: center;
+  border-radius: 8px;
+  color: var(--text-color-primary);
+  background-color: var(--button-color-secondary-default);
+}.footer-container[data-v-4afcea78] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3952,25 +3980,25 @@ to {
   background-color: var(--bg-color-topbar);
   box-shadow: 0 -8px 30px var(--uikit-color-black-8);
 }
-.footer-container .left-container[data-v-f808bd91] {
+.footer-container .left-container[data-v-4afcea78] {
   display: flex;
   align-items: center;
   height: 100%;
 }
-.footer-container .left-container .left-container-item[data-v-f808bd91]:not(:first-child) {
+.footer-container .left-container .left-container-item[data-v-4afcea78]:not(:first-child) {
   margin-left: 1rem;
 }
-.footer-container .center-container[data-v-f808bd91] {
+.footer-container .center-container[data-v-4afcea78] {
   position: relative;
   display: flex;
   align-items: center;
   height: 100%;
   margin: 0 auto;
 }
-.footer-container .center-container .center-container-item[data-v-f808bd91]:not(:first-child) {
+.footer-container .center-container .center-container-item[data-v-4afcea78]:not(:first-child) {
   margin-left: 16px;
 }
-.footer-container .right-container[data-v-f808bd91] {
+.footer-container .right-container[data-v-4afcea78] {
   display: flex;
   align-items: center;
   height: 100%;

package/lib/components/RoomFooter/VoteControl/MoreControlH5.vue.d.ts

@@ -0,0 +1,6 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "show-overlay": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    "onShow-overlay"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/components/RoomFooter/VoteControl/MoreControlH5.vue.js

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

package/lib/components/RoomFooter/VoteControl/MoreControlH5.vue2.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const uikitBaseComponentVue3 = require("@tencentcloud/uikit-base-component-vue3");
+const IconButton = require("../../common/base/IconButton.vue.js");
+const useMoreControlHooks = require("./useMoreControlHooks.js");
+const ChatControl_vue_vue_type_script_setup_true_lang = require("../ChatControl.vue.js");
+const InviteControl = require("../InviteControl.vue.js");
+const ContactControl = require("../ContactControl.vue.js");
+const room = require("../../../stores/room.js");
+const useMitt = require("../../../hooks/useMitt.js");
+const vTap = require("../../../directives/vTap.js");
+require("../../../services/main.js");
+const roomService = require("../../../services/roomService.js");
+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 _hoisted_1 = {
+  key: 0,
+  class: "more-control-container"
+};
+const _hoisted_2 = { class: "control-compent" };
+const _hoisted_3 = { class: "close" };
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "MoreControlH5",
+  emits: ["show-overlay"],
+  setup(__props, { emit: __emit }) {
+    const moreControlConfig = roomService.roomService.getComponentConfig("MoreControl");
+    const showMoreContent = Vue.ref(false);
+    const moreContentRef = Vue.ref();
+    const { t, sidebarName } = useMoreControlHooks.default();
+    const roomStore = room.useRoomStore();
+    const emit = __emit;
+    function showMore() {
+      showMoreContent.value = true;
+    }
+    function handleCancelControl() {
+      showMoreContent.value = false;
+    }
+    function handleControlClick(name) {
+      useMitt.default.emit("experience-communication", name);
+    }
+    function handleShowOverlay(data) {
+      showMoreContent.value = false;
+      emit("show-overlay", data);
+    }
+    function handleDocumentClick(event) {
+      if (showMoreContent.value && !moreContentRef.value.contains(event.target)) {
+        showMoreContent.value = false;
+      }
+    }
+    Vue.onMounted(() => {
+      document == null ? void 0 : document.addEventListener("click", handleDocumentClick, true);
+    });
+    Vue.onUnmounted(() => {
+      document == null ? void 0 : document.removeEventListener("click", handleDocumentClick, true);
+    });
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", null, [
+        Vue.unref(moreControlConfig).visible ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+          Vue.withDirectives((Vue.openBlock(), Vue.createBlock(IconButton.default, {
+            "is-active": Vue.unref(sidebarName) === "more",
+            title: Vue.unref(t)("More")
+          }, {
+            default: Vue.withCtx(() => [
+              Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconExtension), { size: "24" })
+            ]),
+            _: 1
+          }, 8, ["is-active", "title"])), [
+            [Vue.unref(vTap.default), showMore]
+          ])
+        ])) : Vue.createCommentVNode("", true),
+        showMoreContent.value ? (Vue.openBlock(), Vue.createElementBlock("div", {
+          key: 1,
+          ref_key: "moreContentRef",
+          ref: moreContentRef,
+          class: "show-more-content"
+        }, [
+          Vue.createElementVNode("div", _hoisted_2, [
+            Vue.unref(roomStore).isSpeakAfterTakingSeatMode ? (Vue.openBlock(), Vue.createBlock(ChatControl_vue_vue_type_script_setup_true_lang.default, {
+              key: 0,
+              onClick: _cache[0] || (_cache[0] = ($event) => handleControlClick("chatControl"))
+            })) : Vue.createCommentVNode("", true),
+            Vue.createVNode(ContactControl.default, {
+              onClick: _cache[1] || (_cache[1] = ($event) => handleControlClick("contactControl"))
+            }),
+            Vue.createVNode(InviteControl.default, {
+              onShowOverlay: handleShowOverlay,
+              onClick: _cache[2] || (_cache[2] = ($event) => handleControlClick("inviteControl"))
+            })
+          ]),
+          Vue.withDirectives((Vue.openBlock(), Vue.createElementBlock("div", _hoisted_3, [
+            Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
+          ])), [
+            [Vue.unref(vTap.default), handleCancelControl]
+          ])
+        ], 512)) : Vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/RoomFooter/VoteControl/MoreControlPC.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/components/RoomFooter/VoteControl/MoreControlPC.vue.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const uikitBaseComponentVue3 = require("@tencentcloud/uikit-base-component-vue3");
+const IconButton = require("../../common/base/IconButton.vue.js");
+const useMoreControlHooks = require("./useMoreControlHooks.js");
+require("../../../services/main.js");
+const roomService = require("../../../services/roomService.js");
+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 _hoisted_1 = {
+  key: 0,
+  class: "more-control-container"
+};
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "MoreControlPC",
+  setup(__props) {
+    const moreControlConfig = roomService.roomService.getComponentConfig("MoreControl");
+    const { t, basicStore, sidebarName } = useMoreControlHooks.default();
+    function toggleMoreSidebar() {
+      if (basicStore.setSidebarOpenStatus && basicStore.sidebarName === "more") {
+        basicStore.setSidebarOpenStatus(false);
+        basicStore.setSidebarName("");
+        return;
+      }
+      basicStore.setSidebarOpenStatus(true);
+      basicStore.setSidebarName("more");
+    }
+    return (_ctx, _cache) => {
+      return Vue.unref(moreControlConfig).visible ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+        Vue.createVNode(IconButton.default, {
+          "is-active": Vue.unref(sidebarName) === "more",
+          title: Vue.unref(t)("More"),
+          onClickIcon: toggleMoreSidebar
+        }, {
+          default: Vue.withCtx(() => [
+            Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconMore), { size: "24" })
+          ]),
+          _: 1
+        }, 8, ["is-active", "title"])
+      ])) : Vue.createCommentVNode("", true);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/RoomFooter/VoteControl/MoreControlPC.vue2.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const MoreControlPC_vue_vue_type_script_setup_true_lang = require("./MoreControlPC.vue.js");
+exports.default = MoreControlPC_vue_vue_type_script_setup_true_lang.default;

package/lib/components/RoomFooter/VoteControl/index.d.ts

@@ -0,0 +1,6 @@
+declare const MoreControl: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "show-overlay": (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    "onShow-overlay"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any> | import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default MoreControl;

package/lib/components/RoomFooter/VoteControl/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const MoreControlH5 = require("./MoreControlH5.vue.js");
+const MoreControlPC_vue_vue_type_script_setup_true_lang = require("./MoreControlPC.vue.js");
+const environment = require("../../../utils/environment.js");
+const MoreControl = environment.isMobile ? MoreControlH5.default : MoreControlPC_vue_vue_type_script_setup_true_lang.default;
+exports.default = MoreControl;

package/lib/components/RoomFooter/VoteControl/useMoreControlHooks.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const basic = require("../../../stores/basic.js");
+const pinia = require("pinia");
+const index = require("../../../locales/index.js");
+const icon = require("../../../constants/icon.js");
+function useControl() {
+  const { t } = index.useI18n();
+  const basicStore = basic.useBasicStore();
+  const { sidebarName } = pinia.storeToRefs(basicStore);
+  const iconName = Vue.computed(
+    () => sidebarName.value === "more" ? icon.ICON_NAME.MoreActive : icon.ICON_NAME.More
+  );
+  return {
+    t,
+    basicStore,
+    iconName,
+    sidebarName
+  };
+}
+exports.default = useControl;

package/lib/components/RoomFooter/index/indexPC.vue.js

@@ -3,5 +3,5 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const indexPC_vue_vue_type_script_setup_true_lang = require("./indexPC.vue2.js");
 ;/* empty css              */
 const _pluginVue_exportHelper = require("../../../_virtual/_plugin-vue_export-helper.js");
-const indexPc = /* @__PURE__ */ _pluginVue_exportHelper.default(indexPC_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-f808bd91"]]);
+const indexPc = /* @__PURE__ */ _pluginVue_exportHelper.default(indexPC_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-4afcea78"]]);
 exports.default = indexPc;

package/lib/components/RoomFooter/index/indexPC.vue2.js

@@ -59,15 +59,15 @@ const ManageMemberControl_vue_vue_type_script_setup_true_lang = require("../Mana
 const ChatControl_vue_vue_type_script_setup_true_lang = require("../ChatControl.vue.js");
 const ManageStageControl_vue_vue_type_script_setup_true_lang = require("../ManageStageControl.vue.js");
 const MemberApplyControl = require("../ApplyControl/MemberApplyControl.vue.js");
-const index$1 = require("../MoreControl/index.js");
-const index$2 = require("../EndControl/index.js");
+const index$2 = require("../MoreControl/index.js");
+const index$3 = require("../EndControl/index.js");
 const SettingControl_vue_vue_type_script_setup_true_lang = require("../SettingControl.vue.js");
 const WhiteboardControl = require("../WhiteboardControl.vue.js");
 const VirtualBackground = require("../VirtualBackground.vue.js");
 const AIControl = require("../AIControl.vue.js");
 const BasicBeauty = require("../BasicBeauty.vue.js");
 const useMitt = require("../../../hooks/useMitt.js");
-const voteControl = require("../voteControl.vue.js");
+const index$1 = require("../VoteControl/index.js");
 const useRoomFooterHooks = require("./useRoomFooterHooks.js");
 const _hoisted_1 = { class: "footer-container" };
 const _hoisted_2 = { class: "left-container" };
@@ -139,7 +139,7 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
             class: "center-container-item",
             onClick: _cache[9] || (_cache[9] = ($event) => handleControlClick("MasterApplyControl"))
           })) : Vue.createCommentVNode("", true),
-          Vue.createVNode(voteControl.default, {
+          Vue.createVNode(Vue.unref(index$1.default), {
             class: "center-container-item",
             onClick: _cache[10] || (_cache[10] = ($event) => handleControlClick("voteControl")),
             onOnVote: onVote
@@ -149,7 +149,7 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
             ]),
             _: 3
           }),
-          Vue.createVNode(Vue.unref(index$1.default), {
+          Vue.createVNode(Vue.unref(index$2.default), {
             class: "center-container-item",
             onClick: _cache[11] || (_cache[11] = ($event) => handleControlClick("moreControl"))
           }),
@@ -168,7 +168,7 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
           })) : Vue.createCommentVNode("", true)
         ]),
         Vue.createElementVNode("div", _hoisted_4, [
-          Vue.createVNode(Vue.unref(index$2.default))
+          Vue.createVNode(Vue.unref(index$3.default))
         ])
       ]);
     };

package/lib/index.js

@@ -3928,17 +3928,45 @@ to {
 }
 .footer .mirror-container .mirror-text[data-v-21a63691] {
   margin-left: 4px;
-}.contact-container[data-v-753053ea] {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 11;
-  box-sizing: border-box;
-  width: 100vw;
-  height: auto;
-  background-color: var(--uikit-color-black-8);
-}.footer-container[data-v-f808bd91] {
+}.show-more-content[data-v-c413959d] {
+  position: absolute;
+  bottom: 15px;
+  left: 5%;
+  width: 90%;
+  height: 17vh;
+  padding: 10px;
+  border-radius: 13px;
+  animation-name: popup-c413959d;
+  animation-duration: 200ms;
+  background-color: var(--bg-color-operate);
+}
+@keyframes popup-c413959d {
+from {
+    bottom: 0;
+}
+to {
+    bottom: 15px;
+}
+}
+.control-compent[data-v-c413959d] {
+  display: flex;
+}
+.close[data-v-c413959d] {
+  position: relative;
+  top: 10%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 10px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px;
+  text-align: center;
+  border-radius: 8px;
+  color: var(--text-color-primary);
+  background-color: var(--button-color-secondary-default);
+}.footer-container[data-v-4afcea78] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3952,25 +3980,25 @@ to {
   background-color: var(--bg-color-topbar);
   box-shadow: 0 -8px 30px var(--uikit-color-black-8);
 }
-.footer-container .left-container[data-v-f808bd91] {
+.footer-container .left-container[data-v-4afcea78] {
   display: flex;
   align-items: center;
   height: 100%;
 }
-.footer-container .left-container .left-container-item[data-v-f808bd91]:not(:first-child) {
+.footer-container .left-container .left-container-item[data-v-4afcea78]:not(:first-child) {
   margin-left: 1rem;
 }
-.footer-container .center-container[data-v-f808bd91] {
+.footer-container .center-container[data-v-4afcea78] {
   position: relative;
   display: flex;
   align-items: center;
   height: 100%;
   margin: 0 auto;
 }
-.footer-container .center-container .center-container-item[data-v-f808bd91]:not(:first-child) {
+.footer-container .center-container .center-container-item[data-v-4afcea78]:not(:first-child) {
   margin-left: 16px;
 }
-.footer-container .right-container[data-v-f808bd91] {
+.footer-container .right-container[data-v-4afcea78] {
   display: flex;
   align-items: center;
   height: 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndscnj/roomkit-web-vue3",
-  "version": "25.12.24152",
+  "version": "25.12.24153",
   "main": "./lib/index.js",
   "module": "./es/index.mjs",
   "types": "./es/index.d.ts",

package/src/TUIRoom/components/RoomFooter/VoteControl/MoreControlH5.vue

@@ -0,0 +1,122 @@
+<template>
+  <div>
+    <div v-if="moreControlConfig.visible" class="more-control-container">
+      <icon-button
+        v-tap="showMore"
+        :is-active="sidebarName === 'more'"
+        :title="t('More')"
+      >
+        <IconExtension size="24" />
+      </icon-button>
+    </div>
+    <div v-if="showMoreContent" ref="moreContentRef" class="show-more-content">
+      <div class="control-compent">
+        <chat-control
+          v-if="roomStore.isSpeakAfterTakingSeatMode"
+          @click="handleControlClick('chatControl')"
+        />
+        <contact-control @click="handleControlClick('contactControl')" />
+        <invite-control
+          @show-overlay="handleShowOverlay"
+          @click="handleControlClick('inviteControl')"
+        />
+      </div>
+      <div v-tap="handleCancelControl" class="close">{{ t('Cancel') }}</div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted, defineEmits } from 'vue';
+import { IconExtension } from '@tencentcloud/uikit-base-component-vue3';
+import IconButton from '../../common/base/IconButton.vue';
+import userMoreControl from './useMoreControlHooks';
+import ChatControl from '../ChatControl.vue';
+import InviteControl from '../InviteControl.vue';
+import ContactControl from '../ContactControl.vue';
+import { useRoomStore } from '../../../stores/room';
+import bus from '../../../hooks/useMitt';
+import vTap from '../../../directives/vTap';
+import { roomService } from '../../../services';
+
+const moreControlConfig = roomService.getComponentConfig('MoreControl');
+const showMoreContent = ref(false);
+const moreContentRef = ref();
+
+const { t, sidebarName } = userMoreControl();
+const roomStore = useRoomStore();
+const emit = defineEmits(['show-overlay']);
+function showMore() {
+  showMoreContent.value = true;
+}
+
+function handleCancelControl() {
+  showMoreContent.value = false;
+}
+function handleControlClick(name: string) {
+  bus.emit('experience-communication', name);
+}
+
+function handleShowOverlay(data: { name: string; visible: boolean }) {
+  showMoreContent.value = false;
+  emit('show-overlay', data);
+}
+
+function handleDocumentClick(event: MouseEvent) {
+  if (showMoreContent.value && !moreContentRef.value.contains(event.target)) {
+    showMoreContent.value = false;
+  }
+}
+
+onMounted(() => {
+  document?.addEventListener('click', handleDocumentClick, true);
+});
+
+onUnmounted(() => {
+  document?.removeEventListener('click', handleDocumentClick, true);
+});
+</script>
+<style lang="scss" scoped>
+.show-more-content {
+  position: absolute;
+  bottom: 15px;
+  left: 5%;
+  width: 90%;
+  height: 17vh;
+  padding: 10px;
+  border-radius: 13px;
+  animation-name: popup;
+  animation-duration: 200ms;
+  background-color: var(--bg-color-operate);
+}
+
+@keyframes popup {
+  from {
+    bottom: 0;
+  }
+
+  to {
+    bottom: 15px;
+  }
+}
+
+.control-compent {
+  display: flex;
+}
+
+.close {
+  position: relative;
+  top: 10%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 10px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 24px;
+  text-align: center;
+  border-radius: 8px;
+  color: var(--text-color-primary);
+  background-color: var(--button-color-secondary-default);
+}
+</style>

package/src/TUIRoom/components/RoomFooter/VoteControl/MoreControlPC.vue

@@ -0,0 +1,31 @@
+<template>
+  <div v-if="moreControlConfig.visible" class="more-control-container">
+    <icon-button
+      :is-active="sidebarName === 'more'"
+      :title="t('More')"
+      @click-icon="toggleMoreSidebar"
+    >
+      <IconMore size="24" />
+    </icon-button>
+  </div>
+</template>
+<script setup lang="ts">
+import { IconMore } from '@tencentcloud/uikit-base-component-vue3';
+import IconButton from '../../common/base/IconButton.vue';
+import userMoreControl from './useMoreControlHooks';
+import { roomService } from '../../../services';
+
+const moreControlConfig = roomService.getComponentConfig('MoreControl');
+const { t, basicStore, sidebarName } = userMoreControl();
+
+function toggleMoreSidebar() {
+  if (basicStore.setSidebarOpenStatus && basicStore.sidebarName === 'more') {
+    basicStore.setSidebarOpenStatus(false);
+    basicStore.setSidebarName('');
+    return;
+  }
+  basicStore.setSidebarOpenStatus(true);
+  basicStore.setSidebarName('more');
+}
+</script>
+<style lang="scss" scoped></style>

package/src/TUIRoom/components/RoomFooter/VoteControl/index.ts

@@ -0,0 +1,8 @@
+import MoreControlH5 from './MoreControlH5.vue';
+import MoreControlPc from './MoreControlPC.vue';
+
+import { isMobile } from '../../../utils/environment';
+
+const MoreControl = isMobile ? MoreControlH5 : MoreControlPc;
+
+export default MoreControl;

package/src/TUIRoom/components/RoomFooter/VoteControl/useMoreControlHooks.ts

@@ -0,0 +1,23 @@
+import { computed } from 'vue';
+import { useBasicStore } from '../../../stores/basic';
+import { storeToRefs } from 'pinia';
+import { useI18n } from '../../../locales';
+import { ICON_NAME } from '../../../constants/icon';
+
+export default function useControl() {
+  const { t } = useI18n();
+
+  const basicStore = useBasicStore();
+  const { sidebarName } = storeToRefs(basicStore);
+
+  const iconName = computed(() =>
+    sidebarName.value === 'more' ? ICON_NAME.MoreActive : ICON_NAME.More
+  );
+
+  return {
+    t,
+    basicStore,
+    iconName,
+    sidebarName,
+  };
+}

package/src/TUIRoom/components/RoomFooter/index/indexPC.vue

@@ -103,7 +103,7 @@ import VirtualBackground from '../VirtualBackground.vue';
 import AIControl from '../AIControl.vue';
 import BasicBeauty from '../BasicBeauty.vue';
 import bus from '../../../hooks/useMitt';
-import voteControl from '../voteControl.vue';
+import voteControl from '../VoteControl';
 import useRoomFooter from './useRoomFooterHooks';
 import { isElectron } from '../../../utils/environment';
 const { roomStore, isMaster, isAdmin, isAudience } = useRoomFooter();

package/es/components/RoomFooter/voteControl.vue.d.ts

@@ -1,15 +0,0 @@
-declare function __VLS_template(): {
-    content?(_: {}): any;
-};
-declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "on-vote": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
-    "onOn-vote"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/es/components/RoomFooter/voteControl.vue.mjs

@@ -1,7 +0,0 @@
-import _sfc_main from "./voteControl.vue2.mjs";
-/* empty css                  */
-import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const voteControl = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-753053ea"]]);
-export {
-  voteControl as default
-};

package/es/components/RoomFooter/voteControl.vue2.mjs

@@ -1,55 +0,0 @@
-import { defineComponent, computed, ref, createElementBlock, openBlock, createVNode, createCommentVNode, unref, withCtx, renderSlot } from "vue";
-import "../../services/main.mjs";
-import { roomService } from "../../services/roomService.mjs";
-import { useI18n } from "../../locales/index.mjs";
-import "@tencentcloud/tuiroom-engine-js";
-import "../../utils/environment.mjs";
-import "mitt";
-import "../../services/manager/roomActionManager.mjs";
-import "@tencentcloud/tui-core";
-import IconButton from "../common/base/IconButton.vue.mjs";
-import { IconAIIcon } from "@tencentcloud/uikit-base-component-vue3";
-const _hoisted_1 = { class: "vote-control-container" };
-const _hoisted_2 = {
-  key: 0,
-  class: "contact-container"
-};
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "voteControl",
-  emits: ["on-vote"],
-  setup(__props, { emit: __emit }) {
-    const { basicStore } = roomService;
-    const sidebarName = computed(() => basicStore.sidebarName);
-    const { t } = useI18n();
-    const showToolBox = ref(false);
-    const emit = __emit;
-    function toggleToolBox() {
-      console.log(showToolBox.value, "0000");
-      showToolBox.value = !showToolBox.value;
-      emit("on-vote", {
-        name: "onVote",
-        visible: showToolBox.value
-      });
-    }
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createVNode(IconButton, {
-          "is-active": sidebarName.value === "vote",
-          title: unref(t)("Vote"),
-          onClickIcon: toggleToolBox
-        }, {
-          default: withCtx(() => [
-            createVNode(unref(IconAIIcon), { size: "24" })
-          ]),
-          _: 1
-        }, 8, ["is-active", "title"]),
-        showToolBox.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
-          renderSlot(_ctx.$slots, "content", {}, void 0, true)
-        ])) : createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};

package/lib/components/RoomFooter/voteControl.vue.d.ts

@@ -1,15 +0,0 @@
-declare function __VLS_template(): {
-    content?(_: {}): any;
-};
-declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "on-vote": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
-    "onOn-vote"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/lib/components/RoomFooter/voteControl.vue.js

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

package/lib/components/RoomFooter/voteControl.vue2.js

@@ -1,55 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const Vue = require("vue");
-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 IconButton = require("../common/base/IconButton.vue.js");
-const uikitBaseComponentVue3 = require("@tencentcloud/uikit-base-component-vue3");
-const _hoisted_1 = { class: "vote-control-container" };
-const _hoisted_2 = {
-  key: 0,
-  class: "contact-container"
-};
-const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
-  __name: "voteControl",
-  emits: ["on-vote"],
-  setup(__props, { emit: __emit }) {
-    const { basicStore } = roomService.roomService;
-    const sidebarName = Vue.computed(() => basicStore.sidebarName);
-    const { t } = index.useI18n();
-    const showToolBox = Vue.ref(false);
-    const emit = __emit;
-    function toggleToolBox() {
-      console.log(showToolBox.value, "0000");
-      showToolBox.value = !showToolBox.value;
-      emit("on-vote", {
-        name: "onVote",
-        visible: showToolBox.value
-      });
-    }
-    return (_ctx, _cache) => {
-      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
-        Vue.createVNode(IconButton.default, {
-          "is-active": sidebarName.value === "vote",
-          title: Vue.unref(t)("Vote"),
-          onClickIcon: toggleToolBox
-        }, {
-          default: Vue.withCtx(() => [
-            Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconAIIcon), { size: "24" })
-          ]),
-          _: 1
-        }, 8, ["is-active", "title"]),
-        showToolBox.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_2, [
-          Vue.renderSlot(_ctx.$slots, "content", {}, void 0, true)
-        ])) : Vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-});
-exports.default = _sfc_main;