@ndscnj/roomkit-web-vue3 25.12.2318 → 25.12.2320

package/lib/stores/basic.d.ts

@@ -1,7 +1,7 @@
 import { LAYOUT } from '../constants/render';
 import { TUINetwork } from '../../../node_modules/@tencentcloud/tuiroom-engine-js';
 
-type SideBarType = 'chat' | 'invite' | 'manage-member' | 'more' | 'transfer-leave' | 'apply' | 'aiTranscription' | 'vote' | '';
+type SideBarType = 'chat' | 'invite' | 'manage-member' | 'vote' | 'more' | 'transfer-leave' | 'apply' | 'aiTranscription' | '';
 type SceneType = 'chat' | 'default';
 interface BasicState {
     sdkAppId: number;

package/package.json

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

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

@@ -54,6 +54,7 @@
       <voteControl
         class="center-container-item"
         @click="handleControlClick('voteControl')"
+        @on-vote="onVote"
       >
       <template #content>
         <slot name="content"></slot>
@@ -81,6 +82,7 @@
 </template>
 
 <script setup lang="ts">
+import { defineEmits } from "vue";
 import {
   AudioSetting,
   VideoSetting,
@@ -108,6 +110,10 @@ const { roomStore, isMaster, isAdmin, isAudience } = useRoomFooter();
 function handleControlClick(name: string) {
   bus.emit('experience-communication', name);
 }
+const emit = defineEmits(['on-vote']);
+const onVote = (data: { name: string; visible: boolean }) => {
+  emit('on-vote', { code: data.visible, message: 'vote' });
+};
 </script>
 
 <style lang="scss" scoped>

package/src/TUIRoom/components/RoomFooter/voteControl.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="more-container">
+  <div class="vote-control-container" v-if="voteControlConfig.visible">
     <icon-button
       :is-active="sidebarName === 'vote'"
       :title="t('Vote')"
@@ -7,19 +7,25 @@
     >
       <IconAIIcon size="24" />
     </icon-button>
-    {{ sidebarName }}
-    <div @click="toggleToolBox">测试</div>
-    <div class="tool-box" v-if="!isSidebarOpen && showToolBox">
-      123
-      <slot name="content"></slot>
+    <div class="contact-container" v-if="!isSidebarOpen && showToolBox">
+      <room-vote ref="contactRef" @on-close-contact="handleOnCloseContact">
+        <template #content>
+          <slot name="content"></slot>
+        </template>
+      </room-vote>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-  import { roomService } from '../../services';
+import { roomService } from '../../services';
 import { defineEmits, ref,computed,watch } from 'vue';
 import { useI18n } from '../../locales';
+import IconButton from '../common/base/IconButton.vue';
+import {
+  IconAIIcon,
+} from '@tencentcloud/uikit-base-component-vue3';
+import roomVote from '../RoomVote';
 const { basicStore } = roomService;
 const isSidebarOpen = computed(() => basicStore.isSidebarOpen);
 const sidebarName = computed(() => basicStore.sidebarName);
@@ -28,39 +34,30 @@ const showToolBox = ref(false);
 watch(isSidebarOpen, newValue => {
   showToolBox.value = newValue && false;
 });
+const voteControlConfig = roomService.getComponentConfig('VoteControl');
 const emit = defineEmits(['on-vote']);
 function toggleToolBox() {
   showToolBox.value = !showToolBox.value;
   emit('on-vote', {
-      name: 'onVote',
-      visible: showToolBox.value,
-    });
+    name: 'onVote',
+    visible: showToolBox.value,
+  });
+}
+function handleOnCloseContact() {
+  showToolBox.value = false;
 }
-
 </script>
 
 <style lang="scss" scoped>
-.more-container {
-  padding: 20px;
-
-  .more-title {
-    display: flex;
-    align-items: center;
-
-    .email-icon {
-      color: var(--uikit-color-gray-7);
-    }
-
-    .more-notice {
-      width: 100%;
-      height: 22px;
-      padding-left: 8px;
-      font-size: 14px;
-      font-weight: 400;
-      line-height: 22px;
-      color: var(--text-color-primary);
-    }
-  }
-
+.contact-container {
+  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);
 }
 </style>

package/src/TUIRoom/components/RoomVote/indexPC.vue

@@ -15,6 +15,9 @@
       <div class="more-content">{{ email }}</div>
       <IconCopy class="copy-icon" @click="onCopy(email)" />
     </div>
+    <div class="more-item">
+      <slot name="content"></slot>
+    </div>
   </div>
 </template>
 

package/src/TUIRoom/locales/zh-CN.ts

@@ -66,7 +66,7 @@ export default {
   me: '我',
   Admin: '管理员',
   RoomOwner: '主持人',
-  Vote: '表决',
+  'Vote': '表决',
   More: '更多',
   'AI Assistant': 'AI 助手',
   'AI real-time conference content': 'AI 实时会议内容',

package/src/TUIRoom/services/manager/componentManager.ts

@@ -18,6 +18,7 @@ const componentNames = [
   'ManageMemberControl',
   'InviteControl',
   'ChatControl',
+  'VoteControl',
   'MoreControl',
   'VirtualBackground',
   'BasicBeauty',
@@ -49,6 +50,7 @@ const defaultConfig = {
   ManageMemberControl: { visible: true },
   InviteControl: { visible: true },
   ChatControl: { visible: true },
+  VoteControl: { visible: true },
   MoreControl: { visible: true },
   VirtualBackground: { visible: false },
   AIControl: { visible: false },

package/src/TUIRoom/stores/basic.ts

@@ -9,11 +9,11 @@ type SideBarType =
   | 'chat'
   | 'invite'
   | 'manage-member'
+  | 'vote'
   | 'more'
   | 'transfer-leave'
   | 'apply'
   | 'aiTranscription'
-  | 'vote'
   | '';
 type SceneType = 'chat' | 'default';