@extends('layouts.app-admin')
@section('title',trans('admin_default.country'))
@section('content')

<div class="content-wrapper">
    <div class="panel panel-white border-top-success">
        <div class="panel-heading">
            <h5 class="panel-title text-bold">
                <i class="icon-location4 position-left"></i>
                {{trans('admin_default.country')}}
            </h5>
        </div>

        <div class="panel-body">
        
            <button type="button" class="btn btn-primary pull-right" data-toggle="modal" data-target="#add-country-modal" style="margin-top: 10px;">
                <i class="icon-add position-left"></i> 
                {!! trans('admin_default.add_new') !!}
            </button>

            <form class="main-search col-sm-3" method="POST" action="{{ url('/country/listing') }}" style="margin: 10px 0; padding-left: 0;">
                {!! csrf_field() !!}
                <div class="input-group input-group-sm">
                    <input  type="text" value="{{$search_text}}" name="search" 
                            maxlength="50" 
                            class="form-control" placeholder="Search...">
                    <span class="input-group-btn bg-success">
                        <button class="btn btn-primary" title="Search" data-popup="tooltip">
                            <i class="icon-search4"></i>
                        </button>
                    </span>
                </div>
            </form>

            <div>
                <table class="table table-bordered table-framed">
                    <thead>
                        <tr>
                            <th width="50px">#</th>
                            <th>{{trans('admin_default.country_code')}}</th>
                            <th>{{trans('admin_default.country_name')}}</th>
                            <th width="10%">{{trans('admin_default.status')}}</th>
                            <th width="10%">{{trans('admin_default.action')}}</th>
                        </tr>
                    </thead>

                    <tbody>
                    @foreach( $data as $key => $value )
                        <tr>
                            <td>{{$key+1}}</td>
                            <td>{{$value->code}}</td>
                            <td>{{$value->name}}</td>
                            <td class="text-center">
                                {!! getStateButton(
                                        $value->id,
                                        $value->state, 
                                        url('/country/update-state'), 1) !!}
                            </td>
                            <td class="text-center">
                                <ul class="icons-list">
                                    <li class="dropdown">
                                        <a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">
                                            <i class="icon-menu9"></i>
                                        </a>
                                        <ul class="dropdown-menu dropdown-menu-right">
                                            <li>
                                                <a 
                                                    href="#" 
                                                    data-toggle="modal" 
                                                    data-target="#edit-country-modal" 
                                                    data-id="{{$value->id}}" 
                                                    data-code="{{$value->code}}" 
                                                    data-name="{{$value->name}}"
                                                    class="btn-edit">
                                                    <i class="icon-pencil7"></i> {{trans('admin_default.edit')}}
                                                </a>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
                @if(count($data))
                    <div class="clearfix"></div>
                    @include('elements.paginate')
                @endif
            </div>
        </div>

    </div>
</div>

<form id="hidden-form" action="" method="POST" style="display: none;">
    {!! csrf_field() !!}
    <input type="hidden" id="hidden-form-id" name="hidden_form_id" value="">
    <input type="hidden" id="hidden-form-state" name="hidden_form_state" value="0">
</form>

@include('countries.modal')

@endsection

@section('script')
<script type="text/javascript">
$(function(){

    // edit button
    $('.btn-edit').click(function(){
        var me = $(this),
            id = me.data('id'),
            name = me.data('name'),
            code = me.data('code');
        $('#edit-hidden-id').val(id);
        var modal  = $('div#edit-country-modal');
        modal.find('input#edit-code').val(code);
        modal.find('input#edit-name').val(name);
    });

    // confirm
    $('a#yes-confirm').click(function(e){
        e.preventDefault();
        $('form#hidden-form').submit();
    });

});
</script>
@endsection