<template>
  <main class="main-wrap h-full bg-page">
    <el-scrollbar>
      <div class="p-4">
        <router-view v-if="routeRefreshTag" v-slot="{ Component, route }">
          <keep-alive :include="includeList" :max="20">
            <component :is="Component" :key="route.fullPath" />
          </keep-alive>
        </router-view>
      </div>
    </el-scrollbar>
  </main>
</template>

<script setup lang="ts">
import { useConfigStore } from '@/stores/modules/config'
import { useTabsStore } from '@/stores/modules/tabs'

const configStore = useConfigStore()
const tabsStore = useTabsStore()
const routeRefreshTag = computed(() => configStore.routeRefreshTag)
const includeList = computed(() => tabsStore.cachedTabList)
</script>
