<script setup>
import { ref } from 'vue';
import { useRouter, useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()
const options = route.matched.at(-2).children.map(({ name, meta: { title } }) => ({ name, title }))

// #region (props)
//
// #endregion

function handleTabChange(name) {
  router.push({ name })
}

const activeName = ref(route.name)
</script>

<template>
  <div class="w-full h-full">
    <div class="card mb-2">
      <el-tabs v-model="activeName" @tab-change="handleTabChange">
        <!-- <el-tab-pane label="待审核" name="-SHGL-MSSQ-DSH"></el-tab-pane>
          <el-tab-pane label="已通过" name="-SHGL-MSSQ-YTG"></el-tab-pane>
          <el-tab-pane label="未通过" name="-SHGL-MSSQ-WTG"></el-tab-pane> -->
        <el-tab-pane v-for="({name,title}) in options" :label="title" :name="name"></el-tab-pane>
      </el-tabs>
    </div>

    <router-view />
  </div>
</template>
