<template>
  <!-- <keep-alive :include="cachedViews"> include功能已实现，但每个页面改name（name是id也要改,如modifyReceiveActNo页面），时间紧急 工作量大，暂不用 -->  
  <section class="app-main">
    <router-view v-slot="{ Component, route }">
      <transition name="router-fade" mode="out-in">
        <keep-alive :include="cachedViews">
            <component :is="Component" :key="route.fullPath" />
        </keep-alive>
      </transition>
    </router-view>
  </section>
</template>

<script setup lang="ts">
import { computed } from 'vue';
import useStore from '@/store';
const { tagsView } = useStore();

const cachedViews = computed(() => tagsView.cachedViews);
console.log('cachedViews1',cachedViews)
</script>

<style lang="scss" scoped>
.app-main {
  height: calc(100% - 20px);
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 8px;
  background: #f2f3f5;
  > div{
    &::-webkit-scrollbar-track-piece {
      background: transparent;
    }

    &::-webkit-scrollbar {
      width: 6px;
    }

    &::-webkit-scrollbar-thumb {
      background: #cccccc;
      border-radius: 20px;
      transition:background-color 0.3s;
      &:hover{
        background: #909399;
      }
    }
  }

}
</style>
