$(document).ready(function (){
    function checkInputs() {
        let elementInputs = $('#element-create-form').children('.card-body').length;
        if (elementInputs <= 1) {
            $('#element-create-delete').prop( "disabled", true );
        }
        else {
            $('#element-create-delete').prop( "disabled", false );
        }
    }
    function GetOptions(count) {
        let str = '';
        for (const c in categories) {
            str += `<div class="custom-control custom-checkbox">`;
            str += `<input type="checkbox" class="custom-control-input" id="category_company_${count}_${c}" name="category_company[${count-1}][]" value="${c}" checked>`;
            str += `<label class="custom-control-label" for="category_company_${count}_${c}">${categories[c]}</label>`;
            str += `</div>`;
        }
        return str;
    }
    function GetWeightControl(count) {
        let str = '';
        if (isPesoGenerico)
        {
            str += `<input type="hidden" id="percentage1" min="1" max="100" name="percentage[]" class="form-control" placeholder="Peso..." value="100"></input>`;
        }
        else
        {
            str += `
            <div class="input-group">
                <label for="percentage${count}">Peso</label>
                <input type="number" id="percentage${count}" min="1" max="100" name="percentage[]" class="form-control" placeholder="Peso...">
                <div class="input-group-append">
                    <div class="input-group-text bg-dark">
                        <i class="fas fa-percent"></i>
                    </div>
                </div>
            </div>`;
        }
        return str;
    }
    $('#element-create-add').on('click', function (evt) {
        checkInputs();
        let count = $('#element-create-form').children('.card-body').length + 1;
        let html = `<div class="card-body">
            <div class="form-group">
                <label for="description${count}">Descripción</label>
                <div class="input-group">
                    <input type="text" id="description${count}" name="description[]" class="form-control" placeholder="Descripcion...">
                </div>
            </div>
            <div class="form-group">
                ${GetWeightControl(count)}
            </div>
            <div class="form-group">
                <label>Tipo de empresa</label>
                ${GetOptions(count)}
            </div>
        </div>`;
        $('#element-create-form').children('.card-body').last().after(html);
        $('#element-create-delete').prop( "disabled", false );
    });
    $('#element-create-delete').on('click', function (evt) {
        $('#element-create-form').children('.card-body').last().remove();
    });
});