<template>
    <div>
        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
            <el-form-item label="全部字段" prop="columns">
                <p></p>
                <el-checkbox-group v-model="form.columns">
                    <!-- 循环遍历选项 -->
                    <el-checkbox
                        v-for="(item, index) in allColumns"
                        :key="index"
                        :label="item.prop"
                        :disabled="item.prop == 'customerId' || item.prop == 'businessId'"
                    >
                        {{ item.label }}
                    </el-checkbox>
                </el-checkbox-group>
            </el-form-item>
            <div   class="footer">
                <el-button type="primary" @click="submitForm">确定</el-button>
                <el-button  @click="cancel">取消</el-button>
            </div>
        </el-form>
    </div>
</template>

<script>
    import {updateShow} from "@/api/company/show";

    export default {
        name: "business",
        data() {
            return {
                form:{
                    type:'',
                    columns:[],
                },
                allColumns:[],
                // 表单校验
                rules: {
                    type: [
                        { required: true, message: "type不能为空", trigger: "blur" }
                    ],
                    columns: [
                        { required: true, message: '请至少选择一个选项', trigger: 'change' },
                        ],

                },


            }
        },

        created() {

        },
        methods: {
            cancel(){
                this.$emit('close');
            },
            reset(allColumns,selectedKeys,type,){
                this.allColumns = allColumns;
                this.form.columns = selectedKeys;
                this.form.type = type;
            },
            /** 提交按钮 */
            submitForm() {
                this.$refs["form"].validate(valid => {
                if (valid) {
                    updateShow(this.form).then(response => {
                        if (response.code === 200) {
                            this.msgSuccess("提交成功");
                            this.$emit('close');
                        }
                    });
                }
                });
            },
        }
    };
</script>
<style lang="scss" scoped>
.contents{
    height: 100%;
    background-color: #fff;
    padding: 20px;

}
.footer{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
</style>
