26 lines
635 B
Vue
26 lines
635 B
Vue
<script lang="ts" setup>
|
|
import { ref, watch } from 'vue';
|
|
import { useNav } from '@/layout/hooks/useNav';
|
|
|
|
const screenIcon = ref();
|
|
const { toggle, isFullscreen, Fullscreen, ExitFullscreen } = useNav();
|
|
|
|
isFullscreen.value = !!(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement);
|
|
|
|
watch(
|
|
isFullscreen,
|
|
full => {
|
|
screenIcon.value = full ? ExitFullscreen : Fullscreen;
|
|
},
|
|
{
|
|
immediate: true,
|
|
},
|
|
);
|
|
</script>
|
|
|
|
<template>
|
|
<span class="fullscreen-icon navbar-bg-hover" @click="toggle">
|
|
<IconifyIconOffline :icon="screenIcon" />
|
|
</span>
|
|
</template>
|