<template>
    <div style="margin:0 auto;width:99%">
        <div class="header">
            <el-form :model="tableSearch"
                     ref="tableSearch"
                     :inline="true">
                <el-form-item label="表名">
                    <el-select v-model="tableSearch.classId" @change="searchChange">
                        <el-option
                                v-for="item in dicClassName"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
        </div>
        <single-table-page :className="className"></single-table-page>
    </div>
</template>

<script>
    import singleTablePage from '../common/singleTablePage';
    export default {
        name: "data-maintain",
        data () {
            return {
                className:'',
                dicClassName:[],
                tableSearch:{
                    classId:''
                }
            }
        },
        components: {
            singleTablePage
        },
        created () {
            this.getData('importClass').then(res=>{
                let data=res.data;
                let temp=[];
                data.data.forEach(item=>{
                    temp.push({
                        label: item.classNameChn,
                        className:item.className,
                        value: item.id,
                    })
                });
                this.dicClassName=temp;
                if(temp.length!==0){
                    this.tableSearch={
                        classId:temp[0].value
                    };
                    this.className=temp[0].className;
                }
            });
        },
        methods: {
            searchChange () {//搜索按钮
                if(this.dicClassName.length===0){
                    this.$message({
                        showClose: true,
                        message: "请选择表",
                        type: "warning"
                    });
                    return;
                }
                this.dicClassName.forEach(item=>{
                    if(item.value===this.tableSearch.classId){
                        this.className=item.className;
                    }
                });
            }
        }
    }
</script>

<style scoped>
</style>