tyyx_manager/plop/template/tab.vue.hbs

<script setup>
import { ref } from 'vue';
import { useRouter,useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()

// #region (props)
// {{props}}
{{#if props}}
const props = defineProps<{
  {{#each props}}
  {{this}}: string,
  {{/each}}
}>()
{{/if}}
// #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">
        {{#each tab_list}}
          <el-tab-pane label="{{title}}" name="{{name}}"></el-tab-pane>
        {{/each}}
      </el-tabs>
    </div>

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