virtualSimulation/src/layout/index.vue

<template>
  <div class="container-bgc">
    <div class="top">
      <div class="title">{{ setting.title }}</div>
    </div>
    <router-view v-slot="{ Component }">
      <keep-alive >
        <component :is="Component"></component>
      </keep-alive>
    </router-view>
    <keep-alive> </keep-alive>
    <div class="bottom"></div>
  </div>
</template>

<script lang="ts" setup>
// import { onMounted, reactive, ref, toRefs, watch } from "vue";
import settingStore from "@/store/modules/setting";
const setting = settingStore();
console.log(setting.title);
</script>

<style lang="scss" scoped>
.container-bgc {
  position: relative;
  width: 100%;
  // height: 1080px;
  min-height: 100vh;
  background-color: #091d22;
  background: url("../assets//images/bg2.png") no-repeat;
  background-size: cover ;

  .top {
    width: 100%;
    height: 75px;
    text-align: center;
    font-size: 42px;
    line-height: 75px;
    font-style: italic;
    background: url("../assets/images/topbgc.png") no-repeat;
    // background-position: center bottom -10px;
    background-size: cover;
    .title {
      color: #fff;
    }
  }

}
</style>