@ndscnj/roomkit-web-vue3 25.12.24158 → 25.12.24161

package/lib/index.js

@@ -3635,6 +3635,44 @@ to {
   border-radius: 8px;
   color: var(--text-color-primary);
   background-color: var(--button-color-secondary-default);
+}.show-more-content[data-v-b8ad5a8b] {
+  position: absolute;
+  bottom: 15px;
+  left: 5%;
+  width: 90%;
+  height: 17vh;
+  padding: 10px;
+  border-radius: 13px;
+  animation-name: popup-b8ad5a8b;
+  animation-duration: 200ms;
+  background-color: var(--bg-color-operate);
+}
+@keyframes popup-b8ad5a8b {
+from {
+    bottom: 0;
+}
+to {
+    bottom: 15px;
+}
+}
+.control-compent[data-v-b8ad5a8b] {
+  display: flex;
+}
+.close[data-v-b8ad5a8b] {
+  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);
 }.tool-box[data-v-34681937] {
   position: absolute;
   bottom: 72px;
@@ -3664,7 +3702,7 @@ to {
 .tool-box .tool-box-item[data-v-34681937]:hover {
   border-radius: 8px;
   background-color: var(--list-color-hover);
-}.footer-container[data-v-f3bbac91] {
+}.footer-container[data-v-49d683da] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3928,45 +3966,7 @@ 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] {
+}.footer-container[data-v-eeb020b6] {
   position: absolute;
   bottom: 0;
   display: flex;
@@ -3980,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-4afcea78] {
+.footer-container .left-container[data-v-eeb020b6] {
   display: flex;
   align-items: center;
   height: 100%;
 }
-.footer-container .left-container .left-container-item[data-v-4afcea78]:not(:first-child) {
+.footer-container .left-container .left-container-item[data-v-eeb020b6]:not(:first-child) {
   margin-left: 1rem;
 }
-.footer-container .center-container[data-v-4afcea78] {
+.footer-container .center-container[data-v-eeb020b6] {
   position: relative;
   display: flex;
   align-items: center;
   height: 100%;
   margin: 0 auto;
 }
-.footer-container .center-container .center-container-item[data-v-4afcea78]:not(:first-child) {
+.footer-container .center-container .center-container-item[data-v-eeb020b6]:not(:first-child) {
   margin-left: 16px;
 }
-.footer-container .right-container[data-v-4afcea78] {
+.footer-container .right-container[data-v-eeb020b6] {
   display: flex;
   align-items: center;
   height: 100%;
@@ -4986,13 +4986,13 @@ to {
   right: 0;
   z-index: 101;
   height: 100%;
-}span[data-v-939000cb] {
+}span[data-v-872a5da4] {
   padding-right: 5px;
   font-size: 12px;
   font-weight: 500;
   line-height: 17px;
 }
-.contact-container-main[data-v-939000cb] {
+.contact-container-main[data-v-872a5da4] {
   position: fixed;
   bottom: 0;
   display: flex;
@@ -5000,11 +5000,11 @@ to {
   width: 100%;
   padding-bottom: 4vh;
   border-radius: 15px 15px 0 0;
-  animation-name: popup-939000cb;
+  animation-name: popup-872a5da4;
   animation-duration: 200ms;
   background-color: var(--bg-color-operate);
 }
-@keyframes popup-939000cb {
+@keyframes popup-872a5da4 {
 from {
     transform: scaleY(0);
     transform-origin: bottom;
@@ -5014,7 +5014,7 @@ to {
     transform-origin: bottom;
 }
 }
-.contact-container-main .contact-title-main[data-v-939000cb] {
+.contact-container-main .contact-title-main[data-v-872a5da4] {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -5026,7 +5026,7 @@ to {
   line-height: 24px;
   color: var(--text-color-primary);
 }
-.contact-container-main .contact-content-main[data-v-939000cb] {
+.contact-container-main .contact-content-main[data-v-872a5da4] {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -5035,8 +5035,8 @@ to {
   padding: 0 0 0 25px;
   margin-bottom: 10px;
 }
-.contact-container-main .contact-title[data-v-939000cb],
-.contact-container-main .contact-content[data-v-939000cb] {
+.contact-container-main .contact-title[data-v-872a5da4],
+.contact-container-main .contact-content[data-v-872a5da4] {
   width: 28%;
   font-family: "PingFang SC";
   font-size: 14px;
@@ -5046,7 +5046,7 @@ to {
   white-space: nowrap;
   color: var(--text-color-primary);
 }
-.contact-container-main .contact-content[data-v-939000cb] {
+.contact-container-main .contact-content[data-v-872a5da4] {
   width: 62%;
   overflow: hidden;
   font-size: 14px;
@@ -5054,7 +5054,7 @@ to {
   white-space: nowrap;
   color: var(--text-color-secondary);
 }
-.contact-container-main .contact-bottom[data-v-939000cb] {
+.contact-container-main .contact-bottom[data-v-872a5da4] {
   width: 90%;
   padding-left: 40px;
   font-family: "PingFang SC";
@@ -5065,11 +5065,11 @@ to {
   text-align: center;
   color: var(--text-color-secondary);
 }
-.contact-container-main .copy[data-v-939000cb] {
+.contact-container-main .copy[data-v-872a5da4] {
   margin-left: 30px;
   color: var(--text-color-link);
 }
-.cancel[data-v-939000cb] {
+.cancel[data-v-872a5da4] {
   flex: 1;
   padding-right: 30px;
   font-size: 16px;

package/package.json

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

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

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

@@ -14,6 +14,15 @@
       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>
     <AIControl
       @click="handleControlClick('AIControl')"
     />
@@ -46,6 +55,7 @@ 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';
@@ -54,8 +64,10 @@ import useRoomFooter from './useRoomFooterHooks';
 
 const { roomStore, isMaster, isAdmin, isAudience } = useRoomFooter();
 
-const emit = defineEmits(['show-overlay']);
-
+const emit = defineEmits(['show-overlay','on-vote']);
+const onVote = (data: { name: string; visible: boolean }) => {
+  emit('on-vote', { code: data.visible, message: 'vote' });
+};
 function handleControlClick(name: string) {
   bus.emit('experience-communication', name);
 }

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

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

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

@@ -8,7 +8,7 @@
       :size="400"
     >
       <chat v-if="sidebarName == 'chat'" />
-      <room-vote v-if="sidebarName == 'vote'">
+      <room-vote v-if="sidebarName == 'vote'" >
         <template #content>
           <slot name="content"></slot>
         </template>
@@ -28,18 +28,7 @@ import RoomMore from '../RoomMore';
 import RoomVote from '../RoomVote';
 import Chat from '../Chat/index';
 import AITranscription from '../common/widgets/AITools/AITranscription.vue';
-import { defineEmits,watch} from 'vue';
 const { isSidebarOpen, title, handleClose, sidebarName } = useSideBar();
-const emit = defineEmits(['on-vote',]);
-watch(
-  () => isSidebarOpen,
-  (newValue, oldValue) => {
-    emit('on-vote', {
-      name: 'onVote',
-      visible: isSidebarOpen,
-    });
-  }
-);
 </script>
 
 <style lang="scss"></style>

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

@@ -1,40 +1,11 @@
 <template>
   <div class="contact-container-main">
-    <div class="contact-title-main">
-      <div>{{ t('Contact us') }}</div>
-      <span v-tap="handleCloseContact" class="cancel">{{ t('Cancel') }}</span>
-    </div>
-    <div
-      v-for="item in contactContentList"
-      :key="item.id"
-      class="contact-content-main"
-    >
-      <span class="contact-title">{{ t(item.title) }}</span>
-      <span class="contact-content">{{ item.content }}</span>
-      <IconCopy v-tap="() => onCopy(item.copyLink)" class="copy" />
-    </div>
-    <span class="contact-bottom">
-      {{
-        t(
-          'If you have any questions, please feel free to join our QQ group or send an email'
-        )
-      }}
-    </span>
+    <slot name="content"></slot>
   </div>
 </template>
 
 <script setup lang="ts">
-import useRoomMoreControl from './useRoomMoreHooks';
-import { IconCopy } from '@tencentcloud/uikit-base-component-vue3';
-import vTap from '../../directives/vTap';
 
-const { t, onCopy, contactContentList } = useRoomMoreControl();
-
-const emit = defineEmits(['on-close-contact']);
-
-function handleCloseContact() {
-  emit('on-close-contact');
-}
 </script>
 
 <style lang="scss" scoped>

package/es/components/RoomVote/indexH5.vue2.mjs

@@ -1,51 +0,0 @@
-import { defineComponent, createElementBlock, openBlock, createElementVNode, withDirectives, toDisplayString, unref, createTextVNode, Fragment, renderList, createVNode } from "vue";
-import useRoomMoreHooks from "./useRoomMoreHooks.mjs";
-import { IconCopy } from "@tencentcloud/uikit-base-component-vue3";
-import vTap from "../../directives/vTap.mjs";
-const _hoisted_1 = { class: "contact-container-main" };
-const _hoisted_2 = { class: "contact-title-main" };
-const _hoisted_3 = { class: "cancel" };
-const _hoisted_4 = { class: "contact-title" };
-const _hoisted_5 = { class: "contact-content" };
-const _hoisted_6 = { class: "contact-bottom" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "indexH5",
-  emits: ["on-close-contact"],
-  setup(__props, { emit: __emit }) {
-    const { t, onCopy, contactContentList } = useRoomMoreHooks();
-    const emit = __emit;
-    function handleCloseContact() {
-      emit("on-close-contact");
-    }
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("div", _hoisted_2, [
-          createElementVNode("div", null, toDisplayString(unref(t)("Contact us")), 1),
-          withDirectives((openBlock(), createElementBlock("span", _hoisted_3, [
-            createTextVNode(toDisplayString(unref(t)("Cancel")), 1)
-          ])), [
-            [unref(vTap), handleCloseContact]
-          ])
-        ]),
-        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(contactContentList), (item) => {
-          return openBlock(), createElementBlock("div", {
-            key: item.id,
-            class: "contact-content-main"
-          }, [
-            createElementVNode("span", _hoisted_4, toDisplayString(unref(t)(item.title)), 1),
-            createElementVNode("span", _hoisted_5, toDisplayString(item.content), 1),
-            withDirectives(createVNode(unref(IconCopy), { class: "copy" }, null, 512), [
-              [unref(vTap), () => unref(onCopy)(item.copyLink)]
-            ])
-          ]);
-        }), 128)),
-        createElementVNode("span", _hoisted_6, toDisplayString(unref(t)(
-          "If you have any questions, please feel free to join our QQ group or send an email"
-        )), 1)
-      ]);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};

package/es/components/RoomVote/useRoomMoreHooks.mjs

@@ -1,43 +0,0 @@
-import { computed } from "vue";
-import { TUIToast, TOAST_TYPE } from "@tencentcloud/uikit-base-component-vue3";
-import i18n, { useI18n } from "../../locales/index.mjs";
-import "../../utils/environment.mjs";
-import { clipBoard } from "../../utils/adapter.mjs";
-function useRoomMoreHooks() {
-  const { t } = useI18n();
-  const groupNumber = "770645461";
-  const email = "chaooliang@tencent.com";
-  async function onCopy(value) {
-    try {
-      await clipBoard(value);
-      TUIToast({
-        message: t("Copied successfully"),
-        type: TOAST_TYPE.SUCCESS
-      });
-    } catch (error) {
-      TUIToast({
-        message: t("Copied failure"),
-        type: TOAST_TYPE.ERROR
-      });
-    }
-  }
-  const isZH = computed(() => i18n.global.locale.value === "zh-CN");
-  const contactContentList = [
-    { id: 1, title: "group chat", content: groupNumber, copyLink: groupNumber },
-    { id: 2, title: "Email", content: email, copyLink: email }
-  ];
-  const handleClick = () => {
-    window.open("https://zhiliao.qq.com/s/c5GY7HIM62CK", "_blank");
-  };
-  return {
-    t,
-    onCopy,
-    contactContentList,
-    email,
-    handleClick,
-    isZH
-  };
-}
-export {
-  useRoomMoreHooks as default
-};

package/lib/components/RoomVote/indexH5.vue2.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const Vue = require("vue");
-const useRoomMoreHooks = require("./useRoomMoreHooks.js");
-const uikitBaseComponentVue3 = require("@tencentcloud/uikit-base-component-vue3");
-const vTap = require("../../directives/vTap.js");
-const _hoisted_1 = { class: "contact-container-main" };
-const _hoisted_2 = { class: "contact-title-main" };
-const _hoisted_3 = { class: "cancel" };
-const _hoisted_4 = { class: "contact-title" };
-const _hoisted_5 = { class: "contact-content" };
-const _hoisted_6 = { class: "contact-bottom" };
-const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
-  __name: "indexH5",
-  emits: ["on-close-contact"],
-  setup(__props, { emit: __emit }) {
-    const { t, onCopy, contactContentList } = useRoomMoreHooks.default();
-    const emit = __emit;
-    function handleCloseContact() {
-      emit("on-close-contact");
-    }
-    return (_ctx, _cache) => {
-      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
-        Vue.createElementVNode("div", _hoisted_2, [
-          Vue.createElementVNode("div", null, Vue.toDisplayString(Vue.unref(t)("Contact us")), 1),
-          Vue.withDirectives((Vue.openBlock(), Vue.createElementBlock("span", _hoisted_3, [
-            Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
-          ])), [
-            [Vue.unref(vTap.default), handleCloseContact]
-          ])
-        ]),
-        (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(Vue.unref(contactContentList), (item) => {
-          return Vue.openBlock(), Vue.createElementBlock("div", {
-            key: item.id,
-            class: "contact-content-main"
-          }, [
-            Vue.createElementVNode("span", _hoisted_4, Vue.toDisplayString(Vue.unref(t)(item.title)), 1),
-            Vue.createElementVNode("span", _hoisted_5, Vue.toDisplayString(item.content), 1),
-            Vue.withDirectives(Vue.createVNode(Vue.unref(uikitBaseComponentVue3.IconCopy), { class: "copy" }, null, 512), [
-              [Vue.unref(vTap.default), () => Vue.unref(onCopy)(item.copyLink)]
-            ])
-          ]);
-        }), 128)),
-        Vue.createElementVNode("span", _hoisted_6, Vue.toDisplayString(Vue.unref(t)(
-          "If you have any questions, please feel free to join our QQ group or send an email"
-        )), 1)
-      ]);
-    };
-  }
-});
-exports.default = _sfc_main;

package/lib/components/RoomVote/useRoomMoreHooks.js

@@ -1,43 +0,0 @@
-"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 index = require("../../locales/index.js");
-require("../../utils/environment.js");
-const adapter = require("../../utils/adapter.js");
-function useRoomMoreHooks() {
-  const { t } = index.useI18n();
-  const groupNumber = "770645461";
-  const email = "chaooliang@tencent.com";
-  async function onCopy(value) {
-    try {
-      await adapter.clipBoard(value);
-      uikitBaseComponentVue3.TUIToast({
-        message: t("Copied successfully"),
-        type: uikitBaseComponentVue3.TOAST_TYPE.SUCCESS
-      });
-    } catch (error) {
-      uikitBaseComponentVue3.TUIToast({
-        message: t("Copied failure"),
-        type: uikitBaseComponentVue3.TOAST_TYPE.ERROR
-      });
-    }
-  }
-  const isZH = Vue.computed(() => index.default.global.locale.value === "zh-CN");
-  const contactContentList = [
-    { id: 1, title: "group chat", content: groupNumber, copyLink: groupNumber },
-    { id: 2, title: "Email", content: email, copyLink: email }
-  ];
-  const handleClick = () => {
-    window.open("https://zhiliao.qq.com/s/c5GY7HIM62CK", "_blank");
-  };
-  return {
-    t,
-    onCopy,
-    contactContentList,
-    email,
-    handleClick,
-    isZH
-  };
-}
-exports.default = useRoomMoreHooks;