@ndscnj/roomkit-web-vue3 25.12.24161 → 25.12.24163

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

@@ -1,14 +1,28 @@
 <template>
   <div>
-    <div v-if="voteControlConfig.visible" class="more-control-container">
+    <div v-if="moreControlConfig.visible" class="more-control-container">
       <icon-button
         v-tap="showMore"
-        :is-active="sidebarName === 'vote'"
-        :title="t('Vote')"
+        :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">
@@ -16,19 +30,37 @@ 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 voteControlConfig = roomService.getComponentConfig('MoreControl');
+
+const moreControlConfig = roomService.getComponentConfig('MoreControl');
 const showMoreContent = ref(false);
 const moreContentRef = ref();
-const { t, sidebarName,basicStore } = userMoreControl();
-const emit = defineEmits(['show-overlay','on-vote']);
+
+const { t, sidebarName } = userMoreControl();
+const roomStore = useRoomStore();
+const emit = defineEmits(['show-overlay']);
 function showMore() {
   showMoreContent.value = true;
-  emit('on-vote', {
-    name: 'onVote',
-    visible:basicStore.isSidebarOpen,
-  });
 }
+
+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;

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

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

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

@@ -14,15 +14,7 @@
       v-if="!roomStore.isSpeakAfterTakingSeatMode"
       v-tap="() => handleControlClick('chatControl')"
     />
-    <vote-control
-      v-tap="() => handleControlClick('voteControl')"
-      @show-overlay="handleShowOverlay"
-      @on-vote="onVote"
-    >
-      <template #content>
-        <slot name="content"></slot>
-      </template>
-  </vote-control>
+    <slot name="contentH5"></slot>
     <AIControl
       @click="handleControlClick('AIControl')"
     />
@@ -55,7 +47,6 @@ import ChatControl from '../ChatControl.vue';
 import MasterApplyControl from '../ManageStageControl.vue';
 import MemberApplyControl from '../ApplyControl/MemberApplyControl.vue';
 import MoreControl from '../MoreControl/index';
-import VoteControl from '../VoteControl/index.ts';
 import AIControl from '../AIControl.vue';
 import bus from '../../../hooks/useMitt';
 import vTap from '../../../directives/vTap';
@@ -64,10 +55,8 @@ import useRoomFooter from './useRoomFooterHooks';
 
 const { roomStore, isMaster, isAdmin, isAudience } = useRoomFooter();
 
-const emit = defineEmits(['show-overlay','on-vote']);
-const onVote = (data: { name: string; visible: boolean }) => {
-  emit('on-vote', { code: data.visible, message: 'vote' });
-};
+const emit = defineEmits(['show-overlay']);
+
 function handleControlClick(name: string) {
   bus.emit('experience-communication', name);
 }

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

@@ -51,7 +51,6 @@
         class="center-container-item"
         @click="handleControlClick('MasterApplyControl')"
       />
-      <slot name="content"></slot>
       <voteControl
         class="center-container-item"
         @click="handleControlClick('voteControl')"

package/src/TUIRoom/conference.vue

@@ -21,11 +21,14 @@
     <template #content>
       <slot name="content"></slot>
     </template>
+    <template #contentH5>
+      <slot name="contentH5"></slot>
+    </template>
     </room-footer>
     <room-sidebar @on-vote="onVote">
       <template #content>
-          <slot name="content"></slot>
-        </template>
+        <slot name="content"></slot>
+      </template>
     </room-sidebar>
     <room-setting />
     <room-overlay />