@ndscnj/roomkit-web-vue3 25.12.2319 → 25.12.2409

package/lib/index.js

@@ -3928,36 +3928,170 @@ to {
 }
 .footer .mirror-container .mirror-text[data-v-21a63691] {
   margin-left: 4px;
-}.tool-box[data-v-92356fd2] {
-  position: absolute;
-  bottom: 72px;
-  z-index: 2;
+}span[data-v-939000cb] {
+  padding-right: 5px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 17px;
+}
+.contact-container-main[data-v-939000cb] {
+  position: fixed;
+  bottom: 0;
   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;
+}
+}
+.contact-container-main .contact-title-main[data-v-939000cb] {
+  display: flex;
+  flex-direction: row;
   align-items: center;
-  justify-content: center;
-  padding: 5px 0;
-  border-radius: 15px;
-  background-color: var(--bg-color-dialog);
-  box-shadow: 0 -8px 30p var(--uikit-color-black-8);
+  padding: 30px 0 20px 25px;
+  font-family: "PingFang SC";
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 24px;
+  color: var(--text-color-primary);
 }
-.tool-box .tool-box-item[data-v-92356fd2] {
+.contact-container-main .contact-content-main[data-v-939000cb] {
   display: flex;
+  flex-direction: row;
   align-items: center;
-  justify-content: flex-start;
-  width: 100%;
-  padding: 7px 10px;
-  font-size: 12px;
+  width: 90%;
+  height: 15%;
+  padding: 0 0 0 25px;
+  margin-bottom: 10px;
+}
+.contact-container-main .contact-title[data-v-939000cb],
+.contact-container-main .contact-content[data-v-939000cb] {
+  width: 28%;
+  font-family: "PingFang SC";
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 20px;
   white-space: nowrap;
-  cursor: pointer;
+  color: var(--text-color-primary);
 }
-.tool-box .tool-box-item .icon[data-v-92356fd2] {
-  margin-right: 8px;
+.contact-container-main .contact-content[data-v-939000cb] {
+  width: 62%;
+  overflow: hidden;
+  font-size: 14px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--text-color-secondary);
 }
-.tool-box .tool-box-item[data-v-92356fd2]:hover {
+.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);
+}
+.contact-container-main .copy[data-v-939000cb] {
+  margin-left: 30px;
+  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-d1a96ffd] {
+  padding: 20px;
+}
+.more-container .more-title[data-v-d1a96ffd] {
+  display: flex;
+  align-items: center;
+}
+.more-container .more-title .email-icon[data-v-d1a96ffd] {
+  color: var(--uikit-color-gray-7);
+}
+.more-container .more-title .more-notice[data-v-d1a96ffd] {
+  width: 100%;
+  height: 22px;
+  padding-left: 8px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+  color: var(--text-color-primary);
+}
+.more-container .more-item[data-v-d1a96ffd] {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+.more-container .more-item[data-v-d1a96ffd]:not(:first-child) {
+  margin-top: 20px;
+}
+.more-container .more-item:not(:first-child) .item-title[data-v-d1a96ffd] {
+  width: 100%;
+  padding-bottom: 8px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+  color: var(--text-color-primary);
+}
+.more-container .more-item:not(:first-child) .more-content[data-v-d1a96ffd] {
+  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;
   border-radius: 8px;
-  background-color: var(--list-color-hover);
-}.footer-container[data-v-6b90d75f] {
+  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);
+}
+.more-container .more-item:not(:first-child) .copy-icon[data-v-d1a96ffd] {
+  position: absolute;
+  top: 45px;
+  right: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  color: var(--text-color-link);
+}.contact-container[data-v-c9bb5a2b] {
+  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] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3971,25 +4105,25 @@ to {
   background-color: var(--bg-color-topbar);
   box-shadow: 0 -8px 30px var(--uikit-color-black-8);
 }
-.footer-container .left-container[data-v-6b90d75f] {
+.footer-container .left-container[data-v-f808bd91] {
   display: flex;
   align-items: center;
   height: 100%;
 }
-.footer-container .left-container .left-container-item[data-v-6b90d75f]:not(:first-child) {
+.footer-container .left-container .left-container-item[data-v-f808bd91]:not(:first-child) {
   margin-left: 1rem;
 }
-.footer-container .center-container[data-v-6b90d75f] {
+.footer-container .center-container[data-v-f808bd91] {
   position: relative;
   display: flex;
   align-items: center;
   height: 100%;
   margin: 0 auto;
 }
-.footer-container .center-container .center-container-item[data-v-6b90d75f]:not(:first-child) {
+.footer-container .center-container .center-container-item[data-v-f808bd91]:not(:first-child) {
   margin-left: 16px;
 }
-.footer-container .right-container[data-v-6b90d75f] {
+.footer-container .right-container[data-v-f808bd91] {
   display: flex;
   align-items: center;
   height: 100%;
@@ -4977,159 +5111,6 @@ to {
   right: 0;
   z-index: 101;
   height: 100%;
-}span[data-v-939000cb] {
-  padding-right: 5px;
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 17px;
-}
-.contact-container-main[data-v-939000cb] {
-  position: fixed;
-  bottom: 0;
-  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;
-}
-}
-.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;
-  color: var(--text-color-primary);
-}
-.contact-container-main .contact-content-main[data-v-939000cb] {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  width: 90%;
-  height: 15%;
-  padding: 0 0 0 25px;
-  margin-bottom: 10px;
-}
-.contact-container-main .contact-title[data-v-939000cb],
-.contact-container-main .contact-content[data-v-939000cb] {
-  width: 28%;
-  font-family: "PingFang SC";
-  font-size: 14px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 20px;
-  white-space: nowrap;
-  color: var(--text-color-primary);
-}
-.contact-container-main .contact-content[data-v-939000cb] {
-  width: 62%;
-  overflow: hidden;
-  font-size: 14px;
-  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);
-}
-.contact-container-main .copy[data-v-939000cb] {
-  margin-left: 30px;
-  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-17479e8d] {
-  padding: 20px;
-}
-.more-container .more-title[data-v-17479e8d] {
-  display: flex;
-  align-items: center;
-}
-.more-container .more-title .email-icon[data-v-17479e8d] {
-  color: var(--uikit-color-gray-7);
-}
-.more-container .more-title .more-notice[data-v-17479e8d] {
-  width: 100%;
-  height: 22px;
-  padding-left: 8px;
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 22px;
-  color: var(--text-color-primary);
-}
-.more-container .more-item[data-v-17479e8d] {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-}
-.more-container .more-item[data-v-17479e8d]:not(:first-child) {
-  margin-top: 20px;
-}
-.more-container .more-item:not(:first-child) .item-title[data-v-17479e8d] {
-  width: 100%;
-  padding-bottom: 8px;
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 22px;
-  color: var(--text-color-primary);
-}
-.more-container .more-item:not(:first-child) .more-content[data-v-17479e8d] {
-  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;
-  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);
-}
-.more-container .more-item:not(:first-child) .copy-icon[data-v-17479e8d] {
-  position: absolute;
-  top: 45px;
-  right: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  color: var(--text-color-link);
 }.conversation[data-v-b897add1] {
   height: 100%;
   padding: 20px;
@@ -9159,7 +9140,7 @@ body, html {
 }
 .tui-room :not([class|=el]) {
   transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
-}.tui-room[data-v-d9ae22c4] {
+}.tui-room[data-v-3b59b436] {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -9171,7 +9152,7 @@ body, html {
   text-align: left;
   background-color: var(--bg-color-topbar);
 }
-.tui-room .header[data-v-d9ae22c4] {
+.tui-room .header[data-v-3b59b436] {
   position: absolute;
   top: 0;
   left: 0;
@@ -9182,20 +9163,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-d9ae22c4] {
+.tui-room .content[data-v-3b59b436] {
   position: absolute;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: var(--bg-color-topbar);
 }
-.tui-room.tui-room-h5[data-v-d9ae22c4] {
+.tui-room.tui-room-h5[data-v-3b59b436] {
   width: 100%;
   min-width: 350px;
   height: 100%;
   min-height: 525px;
 }
-#roomContainer.chat-room[data-v-d9ae22c4] {
+#roomContainer.chat-room[data-v-3b59b436] {
   position: absolute;
   top: 0;
   right: 0;
@@ -9207,8 +9188,8 @@ body, html {
   margin: auto;
   border-radius: 10px;
 }
-#roomContainer.tui-room-h5[data-v-d9ae22c4],
-#roomContainer .chat-room[data-v-d9ae22c4] {
+#roomContainer.tui-room-h5[data-v-3b59b436],
+#roomContainer .chat-room[data-v-3b59b436] {
   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.2319",
+  "version": "25.12.2409",
   "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,11 @@ 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 }) => {
+  console.log(data,"data111")
+  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" v-if="voteControlConfig.visible">
+  <div class="vote-control-container">
     <icon-button
       :is-active="sidebarName === 'vote'"
       :title="t('Vote')"
@@ -7,11 +7,12 @@
     >
       <IconAIIcon size="24" />
     </icon-button>
-    {{ sidebarName }}
-    <div @click="toggleToolBox">0测试0</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>
@@ -24,6 +25,7 @@ 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);
@@ -32,50 +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() {
+  console.log(showToolBox.value,"0000")
   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>
-.tool-box {
-  position: absolute;
-  bottom: 72px;
-  z-index: 2;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 5px 0;
-  border-radius: 15px;
-  background-color: var(--bg-color-dialog);
-  box-shadow: 0 -8px 30p var(--uikit-color-black-8);
-
-  .tool-box-item {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    width: 100%;
-    padding: 7px 10px;
-    font-size: 12px;
-    white-space: nowrap;
-    cursor: pointer;
-
-    .icon {
-      margin-right: 8px;
-    }
-  }
-
-  .tool-box-item:hover {
-    border-radius: 8px;
-    background-color: var(--list-color-hover);
-  }
+.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/conference.vue

@@ -322,6 +322,7 @@ function resetStore() {
 }
 
 const onVote = (data: { name: string; visible: boolean }) => {
+  console.log(data,"data222")
   emit('on-vote', { code: data.visible, message: 'vote' });
 };
 const onStartRoom = () => {