@extends('layout.main')

@section('filter')
    <div id="datatable-filter" class="fixed new_filter">
        <div class="filter-inner">
            <h2 class="filter-header">
                <a href="#" class="filter-close" data-animate="1"><i class="entypo-cancel"></i></a>
                <i class="fa fa-filter"></i>
                Filter
            </h2>
            <form role="form" id="rate-table-search" action="javascript:void(0);"  method="post" class="form-horizontal form-groups-bordered validate" novalidate>
                <div class="form-group">
                    <label for="field-1" class="control-label">Code</label>
                    <input type="text" name="Code" class="form-control" id="field-1" placeholder="" />
                </div>
                <div class="form-group">
                    <label class="control-label">Description</label>
                    <input type="text" name="Description" class="form-control" id="field-1" placeholder="" />
                </div>
                <div class="form-group" style="">
                    <label class="control-label">Trunk</label>
                    {{ Form::select('Trunk', $trunks, '', array("class"=>"select2")) }}
                    <input type="hidden" name="TrunkID" value="{{$trunkID}}" >
                </div>
                <div class="form-group">
                    <label class="control-label">Timezone</label>
                    {{ Form::select('Timezones', $Timezones, '', array("class"=>"select2")) }}
                </div>
                <div class="form-group">
                    <label for="field-1" class="control-label">Country</label>
                    {{ Form::select('Country', $countries, Input::old('Country') , array("class"=>"select2")) }}
                </div>
                <div class="form-group">
                    <label for="field-1" class="control-label">Effective Date</label>
                    <input type="text" name="EffectiveDate" class="form-control datepicker" data-date-format="yyyy-mm-dd" value="" />
                </div>
                <div class="form-group">
                    <br/>
                    <button type="submit" class="btn btn-primary btn-md btn-icon icon-left">
                        <i class="entypo-search"></i>
                        Search
                    </button>
                </div>
            </form>
        </div>
    </div>
@stop


@section('content')

    <ol class="breadcrumb bc-3">
        <li><a href="{{URL::to('/dashboard')}}"><i class="entypo-home"></i>Home</a></li>
                    <li><a href="{{URL::to('accounts')}}">Accounts</a></li>
                <li class="active"><strong>{{$Title}}</strong></li>
    </ol>
    <h3>View Archive Rates</h3>

    <div class="row" style="margin-bottom: 10px;">
        <div  class="col-md-12">
            <div class="float-right" >
                <a href="{{URL::to('/rate_tables')}}"  class="btn btn-primary btn-sm btn-icon icon-left" >
                    <i class="entypo-floppy"></i>
                    Back
                </a>
            </div>

            @if(User::checkCategoryPermission('ArchiveRates','Delete') )
                <button id="clear-bulk-rate" class="btn btn-danger btn-sm btn-icon icon-left pull-right" data-loading-text="Loading..."> <i class="entypo-trash"></i> Delete Selected </button>
            @endif
        </div>
    </div>
    <form id="clear-bulk-rate-form" >
        <input type="hidden" name="ArchiveRateID" />
        <input type="hidden" name="criteria" />
        <input type="hidden" name="TimezonesID" value="">
    </form>

    <table class="table table-bordered datatable" id="table-4">
        <thead>
        <tr>
            <th width="3%">
                <div class="checkbox ">
                    <input type="checkbox" id="selectall" name="checkbox[]" />
                </div>
            </th>
            <th width="4%">Code</th>
            <th width="20%">Description</th>
            <th width="3%">Interval 1</th>
            <th width="3%">Interval N</th>
            <th width="5%">Connection Fee</th>
            <th width="5%">Rate1</th>
            <th width="5%">RateN</th>
            <th width="8%">Effective Date</th>
            <th width="9%" {{--style="display: none;"--}}>End Date</th>
            <th width="8%">Modified Date</th>
            <th width="10%">Modified By</th>
            <th width="20%">Action</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    
    <script type="text/javascript">
        var $searchFilter = {};
        var checked='';
        var list_fields     = ['ID','Code','Description','Interval1','IntervalN','ConnectionFee','Rate','RateN','EffectiveDate','EndDate','updated_at','updated_by'];
        jQuery(document).ready(function($) {

            $('#filter-button-toggle').show();

            $("#rate-table-search").submit(function(e) {
                return rateDataTable();
            });

            $('#table-4 tbody').on('click', 'tr', function() {
                if(!$(this).hasClass('no-selection')) {
                    if (checked == '') {
                        $(this).toggleClass('selected');
                        if ($(this).hasClass('selected')) {
                            $(this).find('.rowcheckbox').prop("checked", true);
                        } else {
                            $(this).find('.rowcheckbox').prop("checked", false);
                        }
                    }
                }
            });

            //Clear Rate Button
            $(document).off('click.clear-rate','.btn.clear-archive-rate,#clear-bulk-rate');
            $(document).on('click.clear-rate','.btn.clear-archive-rate,#clear-bulk-rate',function(ev) {

                var IDs = [];
                var i = 0;
                $('#table-4 tr .rowcheckbox:checked').each(function(i, el) {
                    ID = $(this).val();
                    IDs[i++] = ID;
                });

                if(IDs.length || $(this).hasClass('clear-archive-rate')) {
                    response = confirm('Are you sure?');
                    if (response) {
                        var TimezonesID     = $searchFilter.Timezones;
                        $("#clear-bulk-rate-form").find("input[name='TimezonesID']").val(TimezonesID);

                        if($(this).hasClass('clear-archive-rate')) {
                            var ID = $(this).parent().find('.hiddenRowData input[name="ID"]').val();
                            $("#clear-bulk-rate-form").find("input[name='ArchiveRateID']").val(ID);
                            $("#clear-bulk-rate-form").find("input[name='criteria']").val('');
                        }

                        if($(this).attr('id') == 'clear-bulk-rate') {
                            var criteria='';
                            if($('#selectallbutton').is(':checked')){
                                criteria = JSON.stringify($searchFilter);
                                $("#clear-bulk-rate-form").find("input[name='ArchiveRateID']").val('');
                                $("#clear-bulk-rate-form").find("input[name='criteria']").val(criteria);
                            }else{
                                /*var IDs = [];
                                var i = 0;
                                $('#table-4 tr .rowcheckbox:checked').each(function(i, el) {
                                    ID = $(this).val();
                                    IDs[i++] = ID;
                                });*/
                                $("#clear-bulk-rate-form").find("input[name='ArchiveRateID']").val(IDs.join(","))
                                $("#clear-bulk-rate-form").find("input[name='criteria']").val('');
                            }
                        }

                        var formData = new FormData($('#clear-bulk-rate-form')[0]);

                        $.ajax({
                            url: baseurl + '/archive_rates/{{$type}}/{{$id}}/clear_rate', //Server script to process data
                            type: 'POST',
                            dataType: 'json',
                            success: function(response) {
                                $(".save.btn").button('reset');

                                if (response.status == 'success') {
                                    toastr.success(response.message, "Success", toastr_opts);
                                    //data_table.fnFilter('', 0);
                                    rateDataTable();
                                } else {
                                    toastr.error(response.message, "Error", toastr_opts);
                                }
                            },
                            // Form data
                            data: formData,
                            //Options to tell jQuery not to process data or worry about content-type.
                            cache: false,
                            contentType: false,
                            processData: false
                        });
                        return false;
                    }
                    return false;
                } else {
                    return false;
                }
            });

            // Replace Checboxes
            $(".pagination a").click(function(ev) {
                replaceCheckboxes();
            });
            
        });

        function rateDataTable() {
            $searchFilter.Code                      = $("#rate-table-search input[name='Code']").val();
            $searchFilter.Description               = $("#rate-table-search input[name='Description']").val();
            $searchFilter.Country                   = $("#rate-table-search select[name='Country']").val();
            $searchFilter.Trunk                     = $("#rate-table-search select[name='Trunk']").val();
            $searchFilter.TrunkID                   = $("#rate-table-search [name='TrunkID']").val();
            $searchFilter.Timezones                 = $("#rate-table-search select[name='Timezones']").val();
            $searchFilter.EffectiveDate             = $("#rate-table-search input[name='EffectiveDate']").val();

            data_table = $("#table-4").DataTable({
                "bDestroy": true, // Destroy when resubmit form
                "bProcessing": true,
                "bServerSide": true,
                "sDom": "<'row'<'col-xs-6 col-left '<'#selectcheckbox.col-xs-1'>'l><'col-xs-6 col-right'<'change-view'><'export-data'T>f>r>t<'row'<'col-xs-6 col-left'i><'col-xs-6 col-right'p>>",
                "sAjaxSource": baseurl + "/archive_rates/{{$type}}/{{$id}}/search_ajax_datagrid",
                "fnServerParams": function(aoData) {
                    aoData.push({"name": "Code", "value": $searchFilter.Code}, {"name": "Description", "value": $searchFilter.Description}, {"name": "Country", "value": $searchFilter.Country},{"name": "Trunk", "value": $searchFilter.Trunk},{"name": "TrunkID", "value": $searchFilter.TrunkID},{"name": "Timezones", "value": $searchFilter.Timezones},{"name": "EffectiveDate", "value": $searchFilter.EffectiveDate});
                    data_table_extra_params.length = 0;
                    data_table_extra_params.push({"name": "Code", "value": $searchFilter.Code}, {"name": "Description", "value": $searchFilter.Description}, {"name": "Country", "value": $searchFilter.Country},{"name": "Trunk", "value": $searchFilter.Trunk},{"name": "TrunkID", "value": $searchFilter.TrunkID},{"name": "Timezones", "value": $searchFilter.Timezones},{"name": "EffectiveDate", "value": $searchFilter.EffectiveDate});
                },
                "iDisplayLength": parseInt('{{CompanyConfiguration::get('PAGE_SIZE')}}'),
                "sPaginationType": "bootstrap",
                //  "sDom": "<'row'<'col-xs-6 col-left'l><'col-xs-6 col-right'<'export-data'T>f>r>t<'row'<'col-xs-6 col-left'i><'col-xs-6 col-right'p>>",
                "aaSorting": [[1, "asc"]],
                "aoColumns":
                        [
                            {"bSortable": false,
                                mRender: function(id, type, full) {
                                    return '<div class="checkbox "><input type="checkbox" name="checkbox[]" value="' + id + '" class="rowcheckbox" ></div>';
                                }
                            }, //0Checkbox
                            {}, //1 code
                            {}, //2 description
                            {}, //3 interval 1
                            {}, //4 interval n
                            {}, //5 ConnectionFee
                            {}, //6 Rate
                            {}, //7 RateN
                            {}, //8 Effective Date
                            {
                                //"bVisible" : false
                            }, //9 End Date
                            {}, //10 ModifiedDate
                            {}, //11 updated_by
                            {
                                mRender: function(id, type, full) {
                                    var action;
                                    clerRate_ = "{{ URL::to('/archive_rates/'.$type.'/{id}/clear_rate')}}";

                                    clerRate_ = clerRate_.replace('{id}', full[0]);
                                    action = '<div class = "hiddenRowData" >';
                                    for(var i = 0 ; i< list_fields.length; i++){
                                        action += '<input type = "hidden"  name = "' + list_fields[i] + '" value = "' + (full[i] != null?full[i]:'')+ '" / >';
                                    }
                                    action += '</div>';