@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 novalidate class="form-horizontal form-groups-bordered validate" action="javascript:void(0);" method="get" id="zipcode-search">
                <div class="form-group">
                    <label for="ZipCode" class="control-label">Zip Code</label>
                    <input class="form-control" name="ZipCode" id="ZipCode"  type="text" >
                </div>
                <div class="form-group">
                    <label for="Type" class="control-label">Type</label>
                    <input class="form-control" name="Type" id="Type"  type="text" >
                </div>
                <div class="form-group">
                    <label for="State" class="control-label">State</label>
                    <input class="form-control" name="State" id="State"  type="text" >
                </div>
                <div class="form-group">
                    <label for="Timezone" class="control-label">Timezone</label>
                    <input class="form-control" name="Timezone" id="Timezone"  type="text" >
                </div>
                <div class="form-group">
                    <label for="Country" class="control-label">Country</label>
                    <input class="form-control" name="Country" id="Country"  type="text" >
                </div>
                <div class="form-group hide">
                    <label for="Title" class="control-label">Status</label>
                    <p class="make-switch switch-small">
                        {{Form::checkbox('Status', '1', true, [])}}
                    </p>
                </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="{{action('dashboard')}}"><i class="entypo-home"></i>Home</a>
        </li>
        <li class="active">
            <a href="javascript:void(0)">Zip Codes</a>
        </li>
    </ol>

    <h3>Zip Codes</h3>
    <div class="tab-content">
        <div class="tab-pane active">
            <div class="clear"></div>
            <br>
            <div class="row">
                <div class="col-md-12">
                    <div class="input-group-btn pull-right" style="width:76px;" id="btn-action">
                        @if(User::checkCategoryPermission('ZipCodes','Delete'))
                            <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Action <span class="caret"></span></button>
                            <ul class="dropdown-menu dropdown-menu-left" role="menu" style="background-color: #000; border-color: #000; margin-top:0px;">
                                <li>
                                    <a class="bulk-delete" id="bulk-delete" href="javascript:;" >
                                        Bulk Delete
                                    </a>
                                </li>
                            </ul>
                        @endif
                    </div>

                    @if(User::checkCategoryPermission('ZipCodes','Add'))
                        <p style="text-align: right;">
                            <a id="btn-add-new-zipcode" href="javascript:void(0);" class="btn btn-primary ">
                                <i class="entypo-plus"></i>
                                Add New
                            </a>
                            <a id="btn-upload-zipcode" href="javascript:void(0);" class="btn btn-primary">
                                <i class="entypo-upload"></i>
                                Upload File
                            </a>
                        </p>
                    @endif
                </div>
                <div class="clear"></div>
            </div>

            <table class="table table-bordered datatable" id="ZipCodeDataTable">
                <thead>
                <tr>
                    <th width="5%"><input type="checkbox" id="selectall" name="checkbox[]" class="" /></th>
                    <th>Zip Code</th>
                    <th>Type</th>
                    <th>Primary City</th>
                    <th>State</th>
                    <th>County</th>
                    <th>Timezone</th>
                    <th>AreaCode</th>
                    <th>Country</th>
                    <th width="8%">Action</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
            <script type="text/javascript">
                var $searchFilter = {};
                var checked='';
                var list_fields  = ['ZipCodeID', 'ZipCode','Type','PrimaryCity','State','County','Timezone','AreaCode','Country',
                    'Decommissioned','PrimaryCity','AcceptableCities','UnacceptableCities','WorldRegion','Latitude','Longitude'];

                jQuery(document).ready(function ($) {
                    $('#filter-button-toggle').show();

                    $searchFilter.ZipCode = $("#zipcode-search input[name='ZipCode']").val();
                    $searchFilter.Type = $("#zipcode-search input[name='Type']").val();
                    $searchFilter.State = $("#zipcode-search input[name='State']").val();
                    //$searchFilter.County = $("#zipcode-search input[name='County']").val();
                    $searchFilter.Timezone = $("#zipcode-search input[name='Timezone']").val();
                    //$searchFilter.AreaCode = $("#zipcode-search input[name='AreaCode']").val();
                    $searchFilter.Country = $("#zipcode-search input[name='Country']").val();
                    //$searchFilter.Status = Status = $("#zipcode-search input[name='Status']").is(":checked") ? 1 : 0;

                    data_table = $("#ZipCodeDataTable").dataTable({
                        "bDestroy": true,
                        "bProcessing": true,
                        "bServerSide": true,
                        "sAjaxSource": baseurl + "/zipcodes/ajax_datagrid/type",
                        "fnServerParams": function (aoData) {
                            aoData.push(
                                {"name": "ZipCode", "value": $searchFilter.ZipCode},
                                {"name": "Type", "value": $searchFilter.Type},
                                //{"name": "County", "value": $searchFilter.County},
                                {"name": "State", "value": $searchFilter.State},
                                {"name": "Timezone", "value": $searchFilter.Timezone},
                                //{"name": "AreaCode", "value": $searchFilter.AreaCode},
                                {"name": "Country", "value": $searchFilter.Country}
                            );
                            data_table_extra_params.length = 0;
                            data_table_extra_params.push(
                                {"name": "ZipCode", "value": $searchFilter.ZipCode},
                                {"name": "Type", "value": $searchFilter.Type},
                                //{"name": "County", "value": $searchFilter.County},
                                {"name": "State", "value": $searchFilter.State},
                                {"name": "Timezone", "value": $searchFilter.Timezone},
                                //{"name": "AreaCode", "value": $searchFilter.AreaCode},
                                {"name": "Country", "value": $searchFilter.Country},
                                {"name":"Export","value":1}
                            );
                        },
                        "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, //ZipCodeID
                                mRender: function(id, type, full) {
                                    return '<div class="checkbox "><input type="checkbox" name="checkbox[]" value="' + id + '" class="rowcheckbox" ></div>';
                                }
                            }, // 0 //ZipCodeID
                            {  "bSortable": true },  // 1 ZipCode (Title)
                            {  "bSortable": true },  // 2 Type
                            {  "bSortable": true },  // 3 PrimaryCity
                            {  "bSortable": true },  // State
                            {  "bSortable": true },  // County
                            {  "bSortable": true },  // Timezone
                            {  "bSortable": true },  // AreaCode
                            {  "bSortable": true },  // 5 Country
                            {  // 10 Status //Action
                                "bSortable": false,
                                mRender: function (id, type, full) {
                                    var action, edit_, delete_;
                                    delete_ = "{{ URL::to('zipcodes/{id}/delete')}}";
                                    edit_   = "{{ URL::to('zipcodes/{id}/edit')}}";
                                    delete_ = delete_ .replace( '{id}', full[0] );
                                    edit_   = edit_.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>';
                                    @if(User::checkCategoryPermission('ZipCodes', 'Edit') )
                                        action += ' <a href="' + edit_ + '" title="Edit" class="edit-zipcode btn btn-default btn-xs" data-name="Edit Zip Code"><i class="entypo-pencil"></i>&nbsp;</a>';
                                    @endif
                                            @if(User::checkCategoryPermission('ZipCodes', 'Delete'))
                                        action += ' <a href="'+delete_+'" title="Delete" class="btn delete btn-danger btn-default btn-xs"><i class="entypo-trash"></i></a>';
                                    @endif

                                        return action;
                                }
                            }
                        ],
                        "oTableTools": {
                            "aButtons": [
                                {
                                    "sExtends": "download",
                                    "sButtonText": "EXCEL",
                                    "sUrl": baseurl + "/zipcodes/ajax_datagrid/xlsx",
                                    sButtonClass: "save-collection btn-sm"
                                },
                                {
                                    "sExtends": "download",
                                    "sButtonText": "CSV",
                                    "sUrl": baseurl + "/zipcodes/datagrid/csv",
                                    sButtonClass: "save-collection btn-sm"
                                }
                            ]
                        },
                        "fnDrawCallback": function () {
                            $(".dataTables_wrapper select").select2({
                                minimumResultsForSearch: -1
                            });

                            $("#selectall").click(function(ev) {
                                var is_checked = $(this).is(':checked');
                                $('#ZipCodeDataTable tbody tr').each(function(i, el) {
                                    if (is_checked) {
                                        $(this).find('.rowcheckbox').prop("checked", true);
                                        $(this).addClass('selected');
                                    } else {
                                        $(this).find('.rowcheckbox').prop("checked", false);
                                        $(this).removeClass('selected');
                                    }
                                });
                            });

                        }

                    });

                    $("#zipcode-search").submit(function (e) {
                        e.preventDefault();
                        $searchFilter.ZipCode = $("#zipcode-search input[name='ZipCode']").val();
                        $searchFilter.Type = $("#zipcode-search input[name='Type']").val();
                        $searchFilter.State = $("#zipcode-search input[name='State']").val();
                        $searchFilter.County = $("#zipcode-search input[name='County']").val();
                        $searchFilter.Timezone = $("#zipcode-search input[name='Timezone']").val();
                        $searchFilter.AreaCode = $("#zipcode-search input[name='AreaCode']").val();
                        $searchFilter.Country = $("#zipcode-search input[name='Country']").val();
                        data_table.fnFilter('', 0);
                        return false;
                    });
                    $('#ZipCodeDataTable tbody').on('click', 'tr', function() {
                        if($(this).find('.rowcheckbox').hasClass('rowcheckbox')) {
                            if (checked == '') {
                                $(this).toggleClass('selected');
                                if ($(this).hasClass('selected')) {
                                    $(this).find('.rowcheckbox').prop("checked", true);
                                } else {
                                    $(this).find('.rowcheckbox').prop("checked", false);
                                }
                            }
                        }
                    });

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

                    $('body').on('click', '.btn.delete', function (e) {
                        e.preventDefault();
                        var url = $(this).attr("href");
                        response = confirm('Are you sure?');
                        if (response) {
                            $.ajax({
                                url: url,
                                type: 'POST',
                                dataType: 'json',
                                success: function (response) {
                                    $(".btn.delete").button('reset');
                                    if (response.status == 'success') {
                                        toastr.success(response.message, "Success", toastr_opts);
                                        $("#zipcode-search").submit();
                                    } else {
                                        toastr.error(response.message, "Error", toastr_opts);
                                    }
                                },
                                // Form data
                                //data: {},
                                cache: false,
                                contentType: false,
                                processData: false
                            });
                        }
                        return false;
                    });

                    $('#add-edit-zipcode-form').submit(function(e){
                        e.preventDefault();
                        var modal       = $(this).parents('.modal');
                        var ZipCodeID = $("#add-edit-zipcode-form [name='ZipCodeID']").val();

                        if( typeof ZipCodeID != 'undefined' && ZipCodeID != ''){
                            update_new_url = baseurl + '/zipcodes/update/'+ZipCodeID;
                        }else{
                            update_new_url = baseurl + '/zipcodes/store';
                        }

                        showAjaxScript(update_new_url, new FormData(($('#add-edit-zipcode-form')[0])), function(response){
                            $(".btn").button('reset');
                            if (response.status == 'success') {
                                modal.modal('hide');
                                toastr.success(response.message, "Success", toastr_opts);
                                $("#zipcode-search").submit();
                            }else{
                                toastr.error(response.message, "Error", toastr_opts);
                            }
                        });
                    });

                    $('#upload-zipcode-form').submit(function(e){
                        e.preventDefault();
                        var modal = $(this).parents('.modal');
                        var that  = $(this);
                        showAjaxScript(baseurl + '/zipcodes/upload', new FormData(($('#upload-zipcode-form')[0])), function(response){
                            that.trigger("reset");
                            //that.find(".file-input-name").remove();
                            $(".btn").button('reset');
                            if (response.status == 'success') {
                                modal.modal('hide');
                                toastr.success(response.message, "Success", toastr_opts);
                                $("#zipcode-search").submit();
                            } else {
                                toastr.error(response.message, "Error", toastr_opts);
                            }
                        });
                    });

                    $('#btn-add-new-zipcode').on('click', function() {
                        $('#add-edit-zipcode-form').trigger('reset');
                        $('#add-edit-zipcode-form .select2').val('').trigger('change');
                        $('#add-edit-zipcode-form').find('input[name=ZipCodeID]').val('');
                        $('#add-edit-modal-zipcode h4').html('Add New Zip Code');
                        $('#add-edit-modal-zipcode').modal('show');
                    });
                    $('#btn-upload-zipcode').on('click', function() {
                        $('#upload-zipcode-form').trigger('reset');
                        $('#upload-modal-zipcode').modal('show');
                    });

                    $(document).on('click','.edit-zipcode',function(e) {
                        e.preventDefault();
                        e.stopPropagation();
                        $('#add-edit-zipcode-form').trigger("reset");
                        var cur_obj = $(this).prev("div.hiddenRowData");
                        for(var i = 0 ; i< list_fields.length; i++){
                            $("#add-edit-zipcode-form [name='"+list_fields[i]+"']").val(cur_obj.find("input[name='"+list_fields[i]+"']").val());
                        }
                        $('#add-edit-modal-zipcode h4').html('Edit Zip Code');
                        $('#add-edit-modal-zipcode').modal('show');
                    });



                    $("#bulk-delete").click(function(ev) {
                        ev.stopPropagation();


                        var ZipCodeIDs = [];
                        var i = 0;
                        $('#ZipCodeDataTable tr .rowcheckbox:checked').each(function (i, el) {
                            ZipCodeID = $(this).val();
                            ZipCodeIDs[i] = ZipCodeID;
                            i++;
                        });

                        if (ZipCodeIDs.length) {
                            response = confirm('Are you sure?');
                            if (response) {
                                var formdata = new FormData();
                                formdata.append('ZipCodeIDs', ZipCodeIDs);
                                $.ajax({
                                    url: baseurl + "/zipcodes/0/delete",
                                    type: 'POST',
                                    dataType: 'json',
                                    success: function (response) {
                                        if (response.status == 'success') {
                                            toastr.success(response.message, "Success", toastr_opts);
                                            $("#zipcode-search").trigger('submit');
                                        } else {
                                            toastr.error(response.message, "Error", toastr_opts);
                                        }
                                    },
                                    // Form data
                                    data: formdata,
                                    cache: false,
                                    contentType: false,
                                    processData: false
                                });
                            }
                        }
                    });

                    //$("#zipcode-search").trigger('submit');
                });

            </script>

            @include('includes.errors')
            @include('includes.success')

        </div>
    </div>
@stop
@section('footer_ext')
    @parent
    @include("zipcodes.addeditmodal")
@stop