@extends('layouts.main')
@section('content')

<div class="row">
	 <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                <div class="card-block">   
                        <div class="form-body">    
                            <div class="col-md-6">       
                                    <label for="imei">IMEI</label>
                                    <p class="form-control-plaintext">{{$device->IMEI}}</p>
                            </div> 
                            <div class="col-md-6"> 
                                <div class="form-group">
                                    <label for="alias">Alias</label>
                                    <p class="form-control-plaintext">{{$device->ALIAS}}</p>
                                </div>   
                            </div>
                        </div> 
                </div>
            </div>
        </div>
    </div>
</div>


<div class="row">
	 <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <h1 class="form-section">{{ __('strings.geofence_data') }}<span class="float-sm-right"> <a href="{{route('goefence_create_index_view',["imei" => $device->IMEI])}}" class="btn btn-primary">{{__('strings.create_geofence')}}</a></span></h1>
                </div>
                <div class="card-body">
                <div class="card-block">   
                        <div class="form-body">                               
                            <div class="form-body">   
                                <div class="form-body"> 
                                    <table id="alerts-table" class="table table-striped hover">
                                        <thead>
                                            <tr>
                                                <th>Id</th>
                                                <th>ALIAS</th>
                                                <th>{{__('strings.type')}}</th>
                                                <th>{{__('strings.created_at')}}</th>
                                                <th></th>
                                            </tr>
                                        </thead>
                                    </table>
                                </div>
                            </div>
                        </div> 
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<script>
var map;
$(document).ready(function () {
    
    $('#alerts-table').DataTable({
            processing: true,
            data: @json($alerts),
            paging: true,
            pageLength: 25,
            columns: [
            { data: 'id', name: 'id', defaultContent: "<i>{{__('strings.undefined')}}</i>" },
            { data: 'alias', name: 'alias', defaultContent: "<i>{{__('strings.undefined')}}</i>" },
            { data: 'type', name: 'type', defaultContent: "<i>{{__('strings.undefined')}}</i>" },
            { data: 'created_at', name: 'created_at', render: function ( data, type, row ) {
                    if(data) {
                        return moment.utc(data).local().format("YYYY-MM-DD HH:mm");
                    } else {
                        return "0000-00-00 00:00";
                    }
                } 
            },
            { data: 'id', name: 'id', render: function ( data, type, row ) {
                    return '<a href="{{URL::to("/")}}/alerts/others/geo/{{$device->IMEI}}/' + data + '/update"><i class="glyphicon glyphicon-edit"></i>{{__("strings.submit_upgrade")}}</a>';
                } 
            },
            ],
            dom: 'Bfrtip',
            buttons: [
                'pageLength','copy', 'excel',{
                    extend: 'pdfHtml5',
                    orientation: 'landscape',
                    pageSize: 'A4'
                }
            ],
            language: {
                url: "{{asset('DataTables/languages')}}/{{App::getLocale()}}.json"
            },
            order: [[ 0, "desc" ]]
        });     
});

</script>
@endpush