<template>
  <div style="width: 100vw; height: 100vh; padding: 0; margin: 0">
    <floating-ball v-if="isFold" v-model="isFold"></floating-ball>
    <floating-list v-else v-model="isFold"></floating-list>
  </div>
</template>

<script setup lang="ts">
  import { onMounted, ref } from 'vue';
  import FloatingBall from './aa-components/floating-ball.vue';
  import FloatingList from './aa-components/floating-list.vue';

  const isFold = ref(false);

  onMounted(() => {
    document.addEventListener('contextmenu', (e) => {
      // 阻止默认的右键菜单
      e.preventDefault();
    });
  });
</script>

<style scoped lang="scss">
  body {
    width: 100vw;
    height: 100vh;
    padding: 0;
    margin: 0;
  }

  div,
  span,
  img {
    user-select: none;
    -webkit-user-drag: none;
  }
</style>
