<template>
  <main class="px-4 py-10 text-center text-gray-700 dark:text-gray-200">
    <router-view />
    <Footer />
    <div class="mt-5 mx-auto text-center opacity-25 text-sm">
      [Home Layout]
    </div>
    <router-link to="/datalist">
      Data List
    </router-link>
  </main>
</template>
<script lang="ts">
import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router'

export default {
  setup() {
    onBeforeRouteUpdate((to: any, from: any) => {
    })
    onBeforeRouteLeave((to, from) => {
      // console.log(to);
      // const answer = window.confirm(
      //   'Do you really want to leave? you have unsaved changes!'
      // )
      // // cancel the navigation and stay on the same page
      // if (!answer) return false
    })
  },
}
</script>
