import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Propertiy } from 'src/app/interface/propertiy-interface';
@Component({
    selector: 'checkbox-demo',
    templateUrl: './checkbox-demo.component.html'
})
export class CheckboxDemoComponent implements OnInit {
    binding = 'bb';
    binding1 = 'bb';
    binding2 = 'bb';
    binding3 = 'bb';
    binding4 = 'bb';
    condition = true;
    checkboxProperties: Array<Propertiy> = [
        {
            name: 'model',
            value: 'string',
            type: '@Input()',
            description: 'checkbox标识,可做双向绑定[(model)]，用于独立使用'
        },
        {
            name: 'label',
            value: 'string',
            type: '@Input()',
            description: 'checkbox作为复选组时的标识'
        },
        {
            name: 'disabled',
            value: 'boolean',
            type: '@Input()',
            description: '设置禁用，默认false'
        },
        {
            name: 'modelChange',
            value: `EventEmitter<string>`,
            type: '@Output()',
            description: `触发复选框的回调`
        }
    ];
    checkboxGroupProperties: Array<Propertiy> = [
        {
            name: 'model',
            value: 'string',
            type: '@Input()',
            description: '选中的复选框值，可以做双向绑定[(model)]，内部可放置farris-checkbox'
        },
        {
            name: 'name',
            value: 'string',
            type: '@Input()',
            description: '设置checkbox的name值，默认自动生成'
        },
        {
            name: 'horizontal',
            value: `boolean`,
            type: '@Input()',
            description: `水平/竖直排列,默认false`
        },
        {
            name: 'modelChange',
            value: `EventEmitter<string>`,
            type: '@Output()',
            description: `切换复选框变化的回调`
        }
    ];
    checkboxgroupProperties: Array<Propertiy> = [
        {
            name: 'data',
            value: 'Array<{ label: string; value: string}>',
            type: '@Input()',
            description: '数据源'
        },
        {
            name: 'value',
            value: 'string|string[]',
            type: '@Input()',
            description: '复选组的值，可以使用[(ngModel)]双向绑定'
        },
        {
            name: 'disable',
            value: 'boolean',
            type: '@Input()',
            description: '禁用，默认false'
        },
        {
            name: 'horizontal',
            value: `boolean`,
            type: '@Input()',
            description: `水平/竖直排列,默认false`
        },
        {
            name: 'separator',
            value: `string`,
            type: '@Input()',
            description: `当复选组值为字符串时，分隔符把值分开。默认为逗号,`
        },
        {
            name: 'isStringValue',
            value: `boolean`,
            type: '@Input()',
            description: `值类型是否为string,默认为true`
        },
        {
            name: 'changeValue',
            value: `EventEmitter<string[]|string>`,
            type: '@Output()',
            description: `选中复选框变化的回调`
        },
        {
            name: 'setCheckboxData',
            value: `EventEmitter<CheckboxComponent>`,
            type: '@Output()',
            description: `复选框动态获取数据源回调`
        }
    ];
    constructor(
        private http: HttpClient
    ) { }
    ngOnInit(): void { }
    changeValue(e) {
    }
    setCheckboxData(e) {
        const checkboxGroup = e;
        this.http.get('http://localhost:8080/query').subscribe((res: any) => {
            e.data = res.map(ele => {
                return {
                    value: ele.value,
                    name: ele.text
                };
            });
        });
    }
}