<template>
	<el-container class="is-vertical">
        <sc-page-header addText="新增节点" @add="table_add" @expand="table_expand"></sc-page-header>

        <el-tabs v-model="activeName">
            <el-tab-pane v-for="(label, key) in workerStates" :key="key" :label="label" :name="key"></el-tab-pane>
        </el-tabs>

        <component ref="componentRef" :is="allcomp[activeName]" />
	</el-container>
</template>

<script setup>
import { workerStates } from "../main";
import allcomp from "./components";

const activeName = ref("record");

const componentRef = ref();
const table_add = () => componentRef.value.table_add();
const table_expand = () => componentRef.value.table_expand();
const table_refresh = () => componentRef.value.refreshTable();
</script>

<style lang="scss" scoped>
.el-tabs {padding: 0 12px;background: #fff;}
</style>