auth-web/src/pages/auth-object-manage/sort-code-manage/index.vue

<!--
 * @Description: 数据分级分类码表管理
 * @Autor: linqian
 * @Date: 2021-03-31 14:51:53
-->
<template>
    <div>
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
            <el-tab-pane label="数据分级表码" name="dataLevel"></el-tab-pane>
            <el-tab-pane label="数据安全级别表码" name="safeLevelCode"></el-tab-pane>
            <el-tab-pane label="数据资源分类表码" name="sourceSortCode"></el-tab-pane>
            <el-tab-pane label="字段分类表码" name="fieldSortCode"></el-tab-pane>
            <el-tab-pane label="字段关系分类表码" name="fieldRelSort"></el-tab-pane>
        </el-tabs>
        <keep-alive>
           <component :is="activeName"></component>         
        </keep-alive>
    </div>
</template>

<script>
import dataLevel from "./data-level.vue";
import fieldSortCode from "./field-sort-code";
import safeLevelCode from "./safe-level-code";
import sourceSortCode from "./source-sort-code";
import fieldRelSort from "./filed-rel-sort.vue"
export default {
    components: {
        dataLevel,
        fieldSortCode,
        safeLevelCode,
        sourceSortCode,
        fieldRelSort
    },
    data() {
        return {
            activeName: "dataLevel"
        };
    },
    computed: {},
    methods: {
        /**
         * @description: 切换tab
         * @param {*} tab
         * @return {*}
         */
        handleClick(tab) {
            this.component = tab.name;
        }
    },
    created() {},
    mounted() {}
};
</script>

<style lang='scss' scoped>

</style>