<template>
  <div class="fit">
    <q-ajax-bar position="top" color="accent" size="5px" skip-hijack />
    <router-view />
  </div>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import { useI18n } from "vue-i18n";
import EventBus, { EventNamesDefine } from "src/common/EventBus";
import GlobalData from "./common/GlobalData";
import { useStore } from "src/store";

export default defineComponent({
  name: "App",

  setup() {
    const $t = useI18n();
    const $q = useStore();
    document.title = $t.t("title");

    window.onresize = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.WindowResize, evt);

    window.onmousedown = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.WindowMouseDown, evt);
    window.onmousemove = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.WindowMouseMove, evt);
    window.onmouseup = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.WindowMouseUp, evt);
    window.onmouseout = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.WindowMouseOut, evt);

    window.document.body.onclick = (evt: any) =>
      EventBus.getInstance().emit(EventNamesDefine.DocumentBodyClick, evt);

    document.body.classList.add("overflow-hidden");

    return {};
  },
});
</script>
