%%#IFDEF%%Proc.RESULT%%
    %%Proc.RESULT%%
 %%#ELSE

    <div>
        <button type="submit" class="btn btn-success btn-flat" onClick="location.href='?action=edit'"><i class="fa fa-plus"></i> Create New</button>
    </div>
    <br>

    <div class="box-header" id="form-filters-toggle">
        <h3 class="box-title">Filters</h3> <i class="fa fa-arrow-right" aria-hidden="true"></i>
    </div>

    <form class="form-horizontal" id="form-filters">
        <div class="box-body">
            <div class="form-group">
                <label for="select_customer_id" class="col-sm-1 control-label">Customer</label>
                <div class="col-sm-3">
                    <select name="customer_id" id="select_customer_id" class="form-control my-select-control"%%#IFDEF%%Proc.subcontractor_id%% disabled="disabled"%%#>
                    %%Proc.customers_list%%
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label for="select_subcontractor_id" class="col-sm-1 control-label">Subcontractor</label>
                <div class="col-sm-3">
                    <select name="subcontractor_id" id="select_subcontractor_id" class="form-control my-select-control"%%#IFDEF%%Proc.customer_id%% disabled="disabled"%%#>
                    %%Proc.subcontractors_list%%
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label for="filter_date_from" class="col-sm-1 control-label">date from</label>
                <div class="col-sm-3">
                    <input type=text id="filter_date_from" name="date_from" value="%%Func.my_htmlspecialchars(Proc.date_from)%%" class="form-control datepicker">
                </div>
            </div>
            <div class="form-group">
                <label for="filter_date_to" class="col-sm-1 control-label">date to</label>
                <div class="col-sm-3">
                    <input type=text id="filter_date_to" name="date_to" value="%%Func.my_htmlspecialchars(Proc.date_to)%%" class="form-control datepicker">
                </div>
            </div>
            <div class="form-group">
                <label for="filter_date_from" class="col-sm-1 control-label"></label>
                <div class="col-sm-3">
                    <input type=checkbox name="show_all" value="1" id="show_all"%%#IFDEF%%Proc.show_all%% checked%%#> <label for="show_all" style="font-weight: normal;">show all results on one page</label>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-1 col-xs-2">
                    <button type="submit" class="btn btn-warning btn-flat"><i class="fa fa-filter"></i> Set filter</button>
                </div>
            </div>
        </div>
    </form>
    
    <div class="box-header">
        <h3 class="box-title">Checked amounts sum</h3></i>
    </div>
    <div class="box-body">
        <div class="row">
            <div class="col-xs-2">Incomes:</div><div class="col-xs-2" id="incomes_totals">0</div>
        </div>
        <div class="row">
            <div class="col-xs-2">Expenses:</div><div class="col-xs-2" id="expenses_totals">0</div>
        </div>
        <div class="row">
            <div class="col-xs-2">Margin:</div><div class="col-xs-2" id="margin_totals">0</div>
        </div><br>
        <div class="row">
            <div class="col-xs-2">
                <button type="button" class="btn btn-warning btn-flat" id="reset_checked"><i class="fa fa-eraser"></i> Reset checked</button>
            </div>
        </div>
    </div>

    <table  class="table table-hover">
        <tr>
            <th>ID</th>
            <th>Code</th>
            <th>Name</th>
            <th>Incomes</th>
            <th>Expenses</th>
            <th>Margin</th>
            <th>Margin %</th>
            <th>Status</th>
            <th>Actions</th>
        </tr>
        %%#IFDEF%%Proc.LIST%%
            %%Proc.LIST%%
        %%#ELSE
            <tr>
                <td colspan=9>No records found</td>
            </tr>
        %%#
    </table>
    %%Proc.PAGER%%
%%#

<script>
$('.datepicker').datetimepicker({                                                                                                                                                                                                                                              
    format: 'YYYY-MM-DD'
});

$('.my-select-control').on('change', function() {
    var id = $(this).attr('id');
    var value = $(this).val();
    var antagonist_id = id == 'select_customer_id' ? 'select_subcontractor_id' : 'select_customer_id';
    console.log(value);
    if ( value == '' ) {
        $('#'+antagonist_id).removeAttr('disabled');
    } else {
        $('#'+antagonist_id).attr('disabled', 'disabled');
    }
    
});


$('#form-filters-toggle').click(function() {
    $('#form-filters').toggle(100);
    var iii = $(this).find('i');
    if ( iii.hasClass('fa-arrow-right') ) {
        iii.removeClass('fa-arrow-right').addClass('fa-arrow-down');
        setCookie('view-filters-prj', 1);
    } else {
        iii.removeClass('fa-arrow-down').addClass('fa-arrow-right');
        setCookie('view-filters-prj', 0);
    }
});

if(getCookie('view-filters-prj') == 1){
    $('#form-filters-toggle').click();
}

var stored_key = '%%CODE%%_%%ID%%';

var summ_defaults = {
    'incomes' : 0,
    'expenses' : 0,
    'margin' : 0
};

var storedSearchVer = getSearchVer(stored_key);
var currentSearchVer = calcQueryVersion();

var totals_summ;

if (storedSearchVer === currentSearchVer) {
    totals_summ = getStoredValue(stored_key, summ_defaults);
} else {
    totals_summ = summ_defaults;
    setSearchVer(stored_key, currentSearchVer);
    setStoredValue(stored_key, totals_summ);
}

drawSumm(totals_summ);

var checked_default = getStoredValue(stored_key + '_checked', []);

$('tr.checkable td:not(.non-clickable)').click(function(e) {
    e.stopPropagation();
    
    var tr = $(this).parent();
    
    var id = tr.data('id');
    var checked = getStoredValue(stored_key + '_checked', checked_default);
    
    if ( tr.hasClass('checked') ) {
        removeFromSumm(stored_key, tr, {
            'incomes' : 3,
            'expenses' : 4,
            'margin' : 5
        });
        
        checked = checked.filter(val => val !== id);
        
    } else {
        appendToSumm(stored_key, tr, {
            'incomes' : 3,
            'expenses' : 4,
            'margin' : 5
        });
        
        checked[checked.length++] = id;
    }
    
    setStoredValue(stored_key + '_checked', checked);
});

$('#tr'+checked_default.join(',#tr')).addClass('checked');

$('#reset_checked').click(function() {
    resetStoredKey(stored_key);
});

</script>