fuliqi
2024-10-29 ab0e808d99312422b4d88de2c5f0ecd91776c35b
src/views/meet/index.vue
@@ -5,14 +5,25 @@
</template>
<script setup>
import { ref, onMounted } from 'vue';
import {ref, watch, onMounted} from 'vue';
import {useRoute} from 'vue-router';
import useWebScoket from "@/hooks/useWebScoket.js";
import {storeToRefs} from 'pinia';
import {useUserStore} from '@/store/index.js';
const route = useRoute();
const meet = ref(null);
const userStore = useUserStore();
const {userInfo} = storeToRefs(userStore);
const {meetName, id, userName, userCode} = route.query;
let jitsiApi = null;
onMounted(() => {
  const width = window.innerWidth;
  const height = window.innerHeight;
  const domain = 'ycl.easyblog.vip:8443';
  const domain = 'www.kgmeet.com:8443/' + id;
  const options = {
    roomName: 'test',
    roomName: meetName,
    width: width,
    height: height,
    parentNode: meet.value,
@@ -20,12 +31,136 @@
    configOverwrite: {
      prejoinConfig: {
        enabled: false
      },
      //禁用邮箱
      gravatar: {
        disabled: true
      },
      // 控制顶部标题会议信息标签的可见性和行为。
      // 如果标签的 ID 不在上述两个数组中的任何一个中,则它在标题上根本不可见。
      conferenceInfo: {
        // 这些标签不会与工具箱一起隐藏。
        alwaysVisible: ['recording'],
        // 这些标签将与工具箱按钮一起自动隐藏。
        autoHide: [
          // 'raised-hands-count',
          'subject',
          'conference-timer',
          'participants-count',
          'e2ee',
          'video-quality',
          'insecure-room',
          'highlight-moment',
          'top-panel-toggle',
        ]
      },
      ModeratorIndicator: true,
      // startSilent: true,
      //禁用改名
      readOnlyName: true,
      //参会者名单
      remoteVideoMenu: {
        disabled: false,
        disableKick: true,
        disableGrantModerator: true,
        disabledDemote: false
      },
      // 自定义按钮
      toolbarButtons: [
        // 摄像头
        'camera',
        // 聊天
        'chat',
        // 共享
        'desktop',
        'download',
        'fullscreen',
        'hangup',
        'highlight',
        'linktosalesforce',
        'livestreaming',
        'microphone',
        'noisesuppression',
        'raisehand',
        'recording',
        'select-background',
        'settings',
        'shareaudio',
        'sharedvideo',
        'shortcuts',
        'stats',
        'tileview',
        'toggle-camera',
        // 'closedcaptions',
        // 'embedmeeting',
        // 'etherpad',
        // 'feedback',
        // 'filmstrip',
        // 'help',
        // 'invite',
        // 'participants-pane',
        // 'profile',
        // 'security',
        'videoquality',
        'whiteboard'
      ],
      // 禁用邀请
      disableInviteFunctions: true,
      //禁用全部静音
      disableRemoteMute: false,
      //主持人选项
      participantsPane: {
        enabled: false,
        hideMoreActionsButton: true,
        hideModeratorSettingsTab: true,
        hideMuteAllButton: true,
      },
      //取消退出页面
      enableClosePage: false,
      whiteboard: {
        enabled: true
      }
    },
    toolbarButtons: ['whiteboard']
    userInfo: {
      displayName: userName
    }
  };
  const api = new JitsiMeetExternalAPI(domain, options);
  jitsiApi = new JitsiMeetExternalAPI(domain, options);
  jitsiInit();
  // 连接webscoket
  // connect();
});
const jitsiInit = () => {
  jitsiApi.addListener('readyToClose', () => {
    window.close()
  });
}
// const {status, message, error, connect, disconnect, sendMessage} = useWebScoket({
//   url: 'wss://ycl.easyblog.vip:82/websocket/' + userInfo._rawValue.id,
//   heartBeatData: 'ping'
// });
// watch(
//     () => message.value,
//     (msg) => {
//       console.log('msg', msg.commend);
//       if (msg.commend === 'kickOut') {
//         jitsiApi.executeCommand('hangup');
//       }
//       if (msg.commend === 'mute') {
//         jitsiApi.executeCommand('toggleAudio');
//       }
//       if (msg.commend === 'openCamera') {
//         jitsiApi.executeCommand('toggleVideo');
//       }
//     }
// );
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped></style>