<template>
    <div>
      <HeadMenu @open-login-form="showLoginForm = true" @open-register-form="showRegisterForm = true" />
      <div class="contain">
        <slot />
        <Feedback/>
        <Footer/>
      </div>
    </div>
    <Login :isVisible="showLoginForm" @open-register-form="showRegisterForm = true" @close-login-form="showLoginForm = false" />
    <Register :isVisible="showRegisterForm" @open-login-form="showLoginForm = true" @close-register-form="showRegisterForm = false" />
  </template>
  
  <script setup lang="ts">
  import { ref } from 'vue';
  
  import HeadMenu from '@/views/HeadMenu.vue';
  
  import Footer from '@/views/Footer.vue';
  import Login from '@/components/login.vue';
  import Register from '@/components/register.vue'; 
  import Feedback from '@/components/floatingMenu.vue';
  
  const showLoginForm = ref(false);
  const showRegisterForm = ref(false); // 定义控制注册组件显示的变量
  </script>
  
  <style lang="scss">
  .contain {
    min-height: calc(100vh - 70px);
    display: flex;
    flex-direction: column;
   .routerView {
      flex: 1;
    }
  }
  </style>