明道云视图插件全屏代码，并在全屏状态下隐藏【全屏】按钮

<template>
  <div ref="fullscreenElement">
    <!-- 你的页面内容 -->
    <button 
      v-if="!isFullscreen" 
      @click="toggleFullscreen"
      class="fullscreen-btn"
    >
      进入全屏
    </button>
  </div>
</template>

<script setup>
import { ref, onMounted, onUnmounted } from 'vue';

const fullscreenElement = ref(null);
const isFullscreen = ref(false);

const toggleFullscreen = () => {
  if (!document.fullscreenElement) {
    fullscreenElement.value?.requestFullscreen().catch(err => {
      console.error(`全屏错误: ${err.message}`);
    });
  } else {
    if (document.exitFullscreen) {
      document.exitFullscreen();
    }
  }
};

// 监听全屏状态变化
const handleFullscreenChange = () => {
  isFullscreen.value = !!document.fullscreenElement;
};

onMounted(() => {
  document.addEventListener('fullscreenchange', handleFullscreenChange);
  document.addEventListener('webkitfullscreenchange', handleFullscreenChange); // Safari
  document.addEventListener('msfullscreenchange', handleFullscreenChange); // IE/Edge
});

onUnmounted(() => {
  document.removeEventListener('fullscreenchange', handleFullscreenChange);
  document.removeEventListener('webkitfullscreenchange', handleFullscreenChange);
  document.removeEventListener('msfullscreenchange', handleFullscreenChange);
});
</script>

<style>
.fullscreen-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  padding: 8px 16px;
  background: #42b983;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  z-index: 1000;
}

.fullscreen-btn:hover {
  background: #33a06f;
}
</style>