@ndscnj/roomkit-web-vue3 25.12.24165 → 25.12.24167

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

@@ -57,17 +57,22 @@ 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("../MoreControl/index.js");
 const AIControl = require("../AIControl.vue.js");
+const index$1 = require("../VoteControl/index.js");
 const useMitt = require("../../../hooks/useMitt.js");
 const useRoomFooterHooks = require("./useRoomFooterHooks.js");
 const _hoisted_1 = { class: "footer-container" };
 const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
   __name: "indexH5",
-  emits: ["show-overlay"],
+  emits: ["show-overlay", "on-vote"],
   setup(__props, { emit: __emit }) {
     const { roomStore, isMaster, isAdmin, isAudience } = useRoomFooterHooks.default();
     const emit = __emit;
+    const onVote = (data) => {
+      console.log(data, "data111");
+      emit("on-vote", { code: data.visible, message: "vote" });
+    };
     function handleControlClick(name) {
       useMitt.default.emit("experience-communication", name);
     }
@@ -88,11 +93,21 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
         }, null, 8, ["display-mode"])), [
           [Vue.unref(vTap.default), () => handleControlClick("videoControl")]
         ]) : Vue.createCommentVNode("", true),
+        Vue.createVNode(Vue.unref(index$1.default), {
+          class: "center-container-item",
+          onClick: _cache[0] || (_cache[0] = ($event) => handleControlClick("voteControl")),
+          onOnVote: onVote
+        }, {
+          contentH5: Vue.withCtx(() => [
+            Vue.renderSlot(_ctx.$slots, "contentH5", {}, void 0, true)
+          ]),
+          _: 3
+        }),
         !Vue.unref(roomStore).isSpeakAfterTakingSeatMode ? Vue.withDirectives((Vue.openBlock(), Vue.createBlock(ChatControl_vue_vue_type_script_setup_true_lang.default, { key: 2 }, null, 512)), [
           [Vue.unref(vTap.default), () => handleControlClick("chatControl")]
         ]) : Vue.createCommentVNode("", true),
         Vue.createVNode(AIControl.default, {
-          onClick: _cache[0] || (_cache[0] = ($event) => handleControlClick("AIControl"))
+          onClick: _cache[1] || (_cache[1] = ($event) => handleControlClick("AIControl"))
         }),
         Vue.unref(roomStore).isSpeakAfterTakingSeatMode && (Vue.unref(isMaster) || Vue.unref(isAdmin)) ? Vue.withDirectives((Vue.openBlock(), Vue.createBlock(ManageStageControl_vue_vue_type_script_setup_true_lang.default, { key: 3 }, null, 512)), [
           [Vue.unref(vTap.default), () => handleControlClick("MasterApplyControl")]
@@ -103,7 +118,7 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
         Vue.withDirectives(Vue.createVNode(ManageMemberControl_vue_vue_type_script_setup_true_lang.default, null, null, 512), [
           [Vue.unref(vTap.default), () => handleControlClick("manageMemberControl")]
         ]),
-        Vue.withDirectives(Vue.createVNode(Vue.unref(index$1.default), { onShowOverlay: handleShowOverlay }, null, 512), [
+        Vue.withDirectives(Vue.createVNode(Vue.unref(index$2.default), { onShowOverlay: handleShowOverlay }, null, 512), [
           [Vue.unref(vTap.default), () => handleControlClick("moreControl")]
         ])
       ]);

package/lib/components/RoomInvite/indexH5.vue.js

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

package/lib/components/RoomMore/indexH5.vue.js

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

package/lib/components/RoomSidebar/indexH5.vue.js

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

package/lib/components/RoomSidebar/indexPC.vue.d.ts

@@ -1,5 +1,6 @@
 declare function __VLS_template(): {
     content?(_: {}): any;
+    contentH5?(_: {}): any;
 };
 declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/lib/components/RoomSidebar/indexPC.vue.js

@@ -29,6 +29,9 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
               content: Vue.withCtx(() => [
                 Vue.renderSlot(_ctx.$slots, "content")
               ]),
+              contentH5: Vue.withCtx(() => [
+                Vue.renderSlot(_ctx.$slots, "contentH5")
+              ]),
               _: 3
             })) : Vue.createCommentVNode("", true),
             Vue.unref(sidebarName) == "more" ? (Vue.openBlock(), Vue.createBlock(Vue.unref(index$2.default), { key: 2 })) : Vue.createCommentVNode("", true),

package/lib/components/RoomVote/index.d.ts

@@ -1,8 +1,20 @@
-declare const Index: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "on-close-contact": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
-    "onOn-close-contact"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any> | ({
+declare const Index: ({
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: {
+        contentH5?(_: {}): any;
+    };
+})) | ({
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};

package/lib/components/RoomVote/indexH5.vue.d.ts

@@ -1,6 +1,11 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "on-close-contact": (...args: any[]) => void;
-}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
-    "onOn-close-contact"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare function __VLS_template(): {
+    contentH5?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, 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/RoomVote/indexH5.vue.js

@@ -1,7 +1,14 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const indexH5_vue_vue_type_script_setup_true_lang = require("./indexH5.vue2.js");
+const Vue = require("vue");
 ;/* empty css              */
 const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.js");
-const indexH5 = /* @__PURE__ */ _pluginVue_exportHelper.default(indexH5_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-939000cb"]]);
+const _sfc_main = {};
+const _hoisted_1 = { class: "more-container" };
+function _sfc_render(_ctx, _cache) {
+  return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+    Vue.renderSlot(_ctx.$slots, "contentH5", {}, void 0, true)
+  ]);
+}
+const indexH5 = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-6c9f3c67"]]);
 exports.default = indexH5;

package/lib/conference.vue.d.ts

@@ -16,6 +16,7 @@ declare function enterRoom(options: {
 declare function resetStore(): void;
 declare function __VLS_template(): {
     content?(_: {}): any;
+    contentH5?(_: {}): any;
 };
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     displayMode: "permanent" | "wake-up";

package/lib/conference.vue.js

@@ -4,5 +4,5 @@ const conference_vue_vue_type_script_setup_true_lang = require("./conference.vue
 ;/* empty css                 */
 ;/* empty css                 */
 const _pluginVue_exportHelper = require("./_virtual/_plugin-vue_export-helper.js");
-const ConferenceMainView = /* @__PURE__ */ _pluginVue_exportHelper.default(conference_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-4dd66a12"]]);
+const ConferenceMainView = /* @__PURE__ */ _pluginVue_exportHelper.default(conference_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-5135c8c9"]]);
 exports.default = ConferenceMainView;

package/lib/conference.vue2.js

@@ -276,18 +276,16 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
           class: "footer",
           onShowOverlay: handleShowOverlay,
           onOnVote: onVote
-        }, {
-          content: Vue.withCtx(() => [
-            Vue.renderSlot(_ctx.$slots, "content", {}, void 0, true)
-          ]),
-          _: 3
-        }, 512), [
+        }, null, 512), [
           [Vue.vShow, Vue.unref(showRoomTool)]
         ]),
         Vue.createVNode(Vue.unref(index$3.default), { onOnVote: onVote }, {
           content: Vue.withCtx(() => [
             Vue.renderSlot(_ctx.$slots, "content", {}, void 0, true)
           ]),
+          contentH5: Vue.withCtx(() => [
+            Vue.renderSlot(_ctx.$slots, "contentH5", {}, void 0, true)
+          ]),
           _: 3
         }),
         Vue.createVNode(index$4.default),

package/lib/index.js

@@ -3664,7 +3664,13 @@ to {
 .tool-box .tool-box-item[data-v-34681937]:hover {
   border-radius: 8px;
   background-color: var(--list-color-hover);
-}.footer-container[data-v-f3bbac91] {
+}.ndsc-img-box[data-v-2a47be79] {
+  width: 24px;
+  height: 24px;
+}.ndsc-img-box[data-v-997feff9] {
+  width: 24px;
+  height: 24px;
+}.footer-container[data-v-92597491] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3928,44 +3934,6 @@ to {
 }
 .footer .mirror-container .mirror-text[data-v-21a63691] {
   margin-left: 4px;
-}.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;
@@ -4986,95 +4954,70 @@ to {
   right: 0;
   z-index: 101;
   height: 100%;
-}span[data-v-939000cb] {
-  padding-right: 5px;
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 17px;
+}.more-container[data-v-6c9f3c67] {
+  padding: 20px;
 }
-.contact-container-main[data-v-939000cb] {
-  position: fixed;
-  bottom: 0;
+.more-container .more-title[data-v-6c9f3c67] {
   display: flex;
-  flex-direction: column;
-  width: 100%;
-  padding-bottom: 4vh;
-  border-radius: 15px 15px 0 0;
-  animation-name: popup-939000cb;
-  animation-duration: 200ms;
-  background-color: var(--bg-color-operate);
-}
-@keyframes popup-939000cb {
-from {
-    transform: scaleY(0);
-    transform-origin: bottom;
-}
-to {
-    transform: scaleY(1);
-    transform-origin: bottom;
+  align-items: center;
 }
+.more-container .more-title .email-icon[data-v-6c9f3c67] {
+  color: var(--uikit-color-gray-7);
 }
-.contact-container-main .contact-title-main[data-v-939000cb] {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 30px 0 20px 25px;
-  font-family: "PingFang SC";
-  font-size: 20px;
-  font-style: normal;
-  font-weight: 500;
-  line-height: 24px;
+.more-container .more-title .more-notice[data-v-6c9f3c67] {
+  width: 100%;
+  height: 22px;
+  padding-left: 8px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
   color: var(--text-color-primary);
 }
-.contact-container-main .contact-content-main[data-v-939000cb] {
+.more-container .more-item[data-v-6c9f3c67] {
+  position: relative;
   display: flex;
-  flex-direction: row;
-  align-items: center;
-  width: 90%;
-  height: 15%;
-  padding: 0 0 0 25px;
-  margin-bottom: 10px;
+  flex-direction: column;
 }
-.contact-container-main .contact-title[data-v-939000cb],
-.contact-container-main .contact-content[data-v-939000cb] {
-  width: 28%;
-  font-family: "PingFang SC";
+.more-container .more-item[data-v-6c9f3c67]:not(:first-child) {
+  margin-top: 20px;
+}
+.more-container .more-item:not(:first-child) .item-title[data-v-6c9f3c67] {
+  width: 100%;
+  padding-bottom: 8px;
   font-size: 14px;
-  font-style: normal;
   font-weight: 400;
-  line-height: 20px;
-  white-space: nowrap;
+  line-height: 22px;
   color: var(--text-color-primary);
 }
-.contact-container-main .contact-content[data-v-939000cb] {
-  width: 62%;
+.more-container .more-item:not(:first-child) .more-content[data-v-6c9f3c67] {
+  position: relative;
+  box-sizing: border-box;
+  display: inline-block;
+  flex: 1;
+  height: 42px;
+  padding: 10px 30px 10px 16px;
   overflow: hidden;
   font-size: 14px;
+  font-weight: 500;
+  line-height: 22px;
   text-overflow: ellipsis;
   white-space: nowrap;
-  color: var(--text-color-secondary);
-}
-.contact-container-main .contact-bottom[data-v-939000cb] {
-  width: 90%;
-  padding-left: 40px;
-  font-family: "PingFang SC";
-  font-size: 12px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 17px;
-  text-align: center;
-  color: var(--text-color-secondary);
+  border-radius: 8px;
+  outline: none;
+  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+  color: var(--text-color-primary);
+  background-color: var(--bg-color-input);
+  border: 1px solid var(--stroke-color-module);
 }
-.contact-container-main .copy[data-v-939000cb] {
-  margin-left: 30px;
+.more-container .more-item:not(:first-child) .copy-icon[data-v-6c9f3c67] {
+  position: absolute;
+  top: 45px;
+  right: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
   color: var(--text-color-link);
-}
-.cancel[data-v-939000cb] {
-  flex: 1;
-  padding-right: 30px;
-  font-size: 16px;
-  font-weight: 400;
-  text-align: end;
 }.more-container[data-v-41107c5f] {
   padding: 20px;
 }
@@ -9168,7 +9111,7 @@ body, html {
 }
 .tui-room :not([class|=el]) {
   transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
-}.tui-room[data-v-4dd66a12] {
+}.tui-room[data-v-5135c8c9] {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -9180,7 +9123,7 @@ body, html {
   text-align: left;
   background-color: var(--bg-color-topbar);
 }
-.tui-room .header[data-v-4dd66a12] {
+.tui-room .header[data-v-5135c8c9] {
   position: absolute;
   top: 0;
   left: 0;
@@ -9191,20 +9134,20 @@ body, html {
   border-bottom: 1px solid var(--stroke-color-primary);
   box-shadow: 0 1px 0 var(--uikit-color-black-8);
 }
-.tui-room .content[data-v-4dd66a12] {
+.tui-room .content[data-v-5135c8c9] {
   position: absolute;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: var(--bg-color-topbar);
 }
-.tui-room.tui-room-h5[data-v-4dd66a12] {
+.tui-room.tui-room-h5[data-v-5135c8c9] {
   width: 100%;
   min-width: 350px;
   height: 100%;
   min-height: 525px;
 }
-#roomContainer.chat-room[data-v-4dd66a12] {
+#roomContainer.chat-room[data-v-5135c8c9] {
   position: absolute;
   top: 0;
   right: 0;
@@ -9216,8 +9159,8 @@ body, html {
   margin: auto;
   border-radius: 10px;
 }
-#roomContainer.tui-room-h5[data-v-4dd66a12],
-#roomContainer .chat-room[data-v-4dd66a12] {
+#roomContainer.tui-room-h5[data-v-5135c8c9],
+#roomContainer .chat-room[data-v-5135c8c9] {
   width: 100%;
   height: 100%;
 }.user-info-container[data-v-9e9aff53] {

package/package.json

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

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

@@ -1,122 +1,40 @@
 <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 v-if="moreControlConfig.visible" class="more-control-container">
+    <icon-button
+      :is-active="sidebarName === 'vote'"
+      :title="t('Vote')"
+      @click-icon="toggleMoreSidebar"
+    >
+      <img class="ndsc-img-box" src="../../../assets/imgs/vote-icon.png" alt=""/>
+    </icon-button>
   </div>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, defineEmits } from 'vue';
-import { IconExtension } from '@tencentcloud/uikit-base-component-vue3';
+import { IconMore } 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';
-
+import { defineEmits} from 'vue';
 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;
+const { t, basicStore, sidebarName } = userMoreControl();
+const emit = defineEmits(['on-vote']);
+function toggleMoreSidebar() {
+  if (basicStore.setSidebarOpenStatus && basicStore.sidebarName === 'vote') {
+    basicStore.setSidebarOpenStatus(false);
+    basicStore.setSidebarName('');
+    return;
   }
+  basicStore.setSidebarOpenStatus(true);
+  basicStore.setSidebarName('vote');
+  emit('on-vote', {
+    name: 'onVote',
+    visible:basicStore.isSidebarOpen,
+  });
 }
-
-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);
+.ndsc-img-box{
+  width: 24px;
+  height: 24px
 }
 </style>

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

@@ -5,7 +5,7 @@
       :title="t('Vote')"
       @click-icon="toggleMoreSidebar"
     >
-      <IconMore size="24" />
+      <img class="ndsc-img-box" src="../../../assets/imgs/vote-icon.png" alt=""/>
     </icon-button>
   </div>
 </template>
@@ -32,4 +32,9 @@ function toggleMoreSidebar() {
   });
 }
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.ndsc-img-box{
+  width: 24px;
+  height: 24px
+}
+</style>