<script setup>
import Header from './views/layout/pc/header/index.vue'
import Footer from './views/layout/pc/footer/index.vue'
</script>

<template>
  <div id="app">
    <Header id="header" />

    <!-- include 对应组件的 name -->
    <router-view id="main" v-slot="{Component}">
      <keep-alive include="New">
        <component :is="Component" />
      </keep-alive>
    </router-view>
    <Footer id="footer" />
  </div>
</template>

<style lang="scss" scoped>
#app {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  #header {
    width: 100%;
    height: $header_nav_height;
    position: fixed;
    z-index: 99;
  }
  #main {
    margin-top: $header_nav_height;
    width: 100%;
    flex: 1;
    background-color: $white;
  }
  #footer {
    width: 100%;
    height: 500px;
  }
}
</style>
