<template>
    <div>
        <el-form
            ref="form"
            :model="form"
            :rules="rules"
            label-width="200px"
            class="flexBox"
        >
            <div class="formItemBox">
                <el-form-item label="节点名称:" prop="a1">
                    <el-input
                        placeholder="请输入"
                        maxlength="30"
                        v-autoTrim="{ obj: form, key: 'a1' }"
                        v-model="form.a1"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="节点地址:" prop="a2">
                    <el-input
                        placeholder="请输入"
                        maxlength="100"
                        v-autoTrim="{ obj: form, key: 'a2' }"
                        v-model="form.a2"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="节点类型:" prop="a3">
                    <el-input
                        placeholder="请输入"
                        maxlength="100"
                        v-autoTrim="{ obj: form, key: 'a3' }"
                        v-model="form.a3"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="适用类型:" prop="a4">
                    <el-input
                        placeholder="请输入"
                        maxlength="100"
                        v-autoTrim="{ obj: form, key: 'a4' }"
                        v-model="form.a4"
                    >
                    </el-input>
                </el-form-item>
            </div>
        </el-form>
        <div class="title">公有</div>
        <tableList
            ref="table"
            style="width:60%;min-width: 900px;margin: auto;"
            :columns="columns"
            :getDataWay="getDataWay"
            :checkedData="checkedData"
            index
            selection
        >   
        </tableList>
        <div class="btns">
            <el-button type="primary" @click="save">保存</el-button>
            <el-button type="primary" plain @click="cancel">取消</el-button>
        </div>
    </div>
</template>

<script>
import tableList from "@/components/grid/TableList";

export default {
    name: "clusteringDetail",
    components: {tableList},
    data() {
        return {
            getDataWay:{
                //dataType: "url",
                dataType: "data",
                type: "post",
                // firstRequest: false,
                // data: this.$api.algorithmsLibrary.selectSharedAlgorithmList,
                data:[{a1:'1',a2:'2',a3:'3',a4:'4'}],
                param: {},
            },
            columns: [
                //表格列
                {
                    label: "账户名",
                    prop: "a1",
                },
                {
                    label: "账户类型",
                    prop: "a2",
                },
                {
                    label: "联系人",
                    prop: "a3",
                },
                {
                    label: "联系方式",
                    prop: "a4",
                },
            ],
            form: {
                a1:'',
                a2:'',
                a3:'',
                a4:''
            },
            
            rules: {
            }
        };
    },

    computed: {},

    methods: {
        save(){

        },
        cancel(){

        },
    },

    mounted() {
        
    },
};
</script>

<style lang="less" scoped>
.el-form {
    width: 60%;
    min-width: 900px;
    padding-top: 60px;
    margin: 0 auto;

    .formItemBox {
        flex: 1;

        /deep/ .el-input,
        .el-select {
            width: 100%;
        }
    }

    .el-textarea {
        height: 96px;
    }
}

.btns {
    padding-top: 30px;
    text-align: center;
}
.title {
    width: 60%;
    min-width: 900px;
    margin: 4px auto;
    border-left: 6px solid @themeColor;
    padding-left: 20px;
    color: @themeColor;
    font-size: 16px;
    font-weight: bold;
}

</style>