@extends('voyager::master')
@php $isAdmin = Auth::user()->hasRole('admin_sms'); $count = count($dataTypeContent); @endphp

@section('page_title', 'Liste des supports')

@section('content')
    <div class="page-content browse container{{$isAdmin? '-fluid' : ' container--limitedWidth'}}">
        @include('voyager::alerts')
        <div class="row justify-content-md-center">
            <div class="@if($isAdmin) col col-md-12 @endif">
                <div class="card shadow">
                    <h2 class="card-header d-flex justify-content-between align-items-baseline flex-wrap">
                        <span>Tous @if (Auth::user()->hasRole('admin_sms'))les @else vos @endif supports</span>

                    </h2>
                    <div class="card-header border-0">
                        <div class="row align-items-center">
                            <div class="col col-6 col-md-4 col-lg-3 flex">
                                <div class="input-group input-group-alternative mb-0">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="ni ni-zoom-split-in"></i></span>
                                    </div>

                                    <input type="text" placeholder="Rechercher" id="searchInTable"
                                           class="form-control form-control-alternative showPlaceHolder"/>
                                </div>
                            </div>

                            <div class="col text-right">
                                @can('add', app($dataType->model_name))
                                    <a href="{{ route('voyager.'.$dataType->slug.'.create') }}"
                                       class="btn btn-icon btn-3 btn-success btn-add-new">
                                        <span class="btn-inner--icon"><i class="ni ni-fat-add"></i></span>

                                        <span class="btn-inner--text">Nouveau support</span>
                                    </a>
                                @endcan
                                @can('delete', app($dataType->model_name))
                                    @include('voyager::partials.bulk-delete')
                                @endcan
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive table-responsive--scrollable">
                        <table id="dataTable"
                               class="table align-items-center table-flush table-hover @if($count < 3)table--fewItems @endif"
                               style="width:100%">
                            <thead class="thead-light">
                            <tr>
                                @can('delete',app($dataType->model_name))
                                    <th scope="col" class="miniCol">
                                        <div class="custom-control custom-control-alternative custom-checkbox mb-3 miniCol  ">
                                            <input class="custom-control-input select_all" type="checkbox" name="row_id"
                                                   id="selectAll">
                                            <label class="custom-control-label" for="selectAll"></label>
                                        </div>
                                    </th>
                                @endcan

                                <th scope="col" id="deviceTypeCol">Type</th>

                                @if(!$isAdmin)
                                    <th scope="col">Nom</th>
                                @endif

                                <th scope="col">ID</th>

                                @if ($isAdmin)
                                    <th scope="col">Sim</th>
                                    <th scope="col">Statut</th>
                                @endif

                                <th scope="col" @if ($isAdmin)id="typeCol"@endif>Groupe</th>

                                @if ($isAdmin)
                                    <th scope="col">Contact</th>
                                @endif

                                <th scope="col">Vidéo</th>
                                <th scope="col">Charges</th>

                                @if ($isAdmin)
                                    <th scope="col">Software</th>
                                    <th scope="col">Maps</th>
                                    <th scope="col">Création</th>
                                @endif


                                <th scope="col" class="smallCol">Actions</th>
                            </tr>
                            </thead>

                            <tbody>

                            @foreach($dataTypeContent as $data)
                                <tr>
                                    @can('delete',app($dataType->model_name))
                                        <td class="no-sort no-click text-right miniCol">
                                            <div class="custom-control custom-control-alternative custom-checkbox mb-3 miniCol">
                                                <input class="custom-control-input" type="checkbox" name="row_id"
                                                       id="checkbox_{{ $data->getKey() }}"
                                                       value="{{ $data->getKey() }}">
                                                <label class="custom-control-label"
                                                       for="checkbox_{{ $data->getKey() }}"></label>
                                            </div>
                                        </td>
                                    @endcan
                                    {{-- TYPE --}}
                                    @php $row = $dataType->browseRows[0]; @endphp
                                    @if (isset($row->details->options->{$data->{$row->field}}))
                                        <td scope="row" class="table__iconCol"
                                            data-search="{{ $row->details->options->{$data->device_type} }}">
                                            <span title="{{ $row->details->options->{$data->device_type} }}">
                                                @if(file_exists(public_path('assets/svg/device_type_' . $data->device_type . '_' . strtolower($data->couleur) .'.svg')))
                                                    @svg('device_type_' . $data->device_type . '_' . strtolower($data->couleur), 'icon-lg')
                                                @endif
                                            </span>
                                        </td>
                                    @else
                                        <td scope="row" class="table__iconCol">
                                            Aucun
                                        </td>
                                    @endif

                                    @if (!$isAdmin)
                                        {{-- NAME --}}
                                        <th scope="row" title="{{$data->name}}">
                                            {{ strlen($data->name) > 0 ? $data->name: 'Aucun nom attribué'}}
                                        </th>
                                    @endif

                                    {{-- ID & Color--}}
                                    <td scope="row">
                                        {{$data->device_id}} - {{$data->couleur}}
                                    </td>

                                    @if ($isAdmin)
                                        <td scope="row">
                                            {{$data->sim}}
                                        </td>

                                        <td scope="row">
                                            {{ $data->getOnlineState() }}
                                        </td>

                                        {{-- STATUT --}}
                                        <td scope="row">
                                            @php $row = $dataType->browseRows[1]; @endphp
                                            @if($row->type == 'select_multiple')
                                                @if (property_exists($row->details, 'options'))
                                                    @if (count(json_decode($data->{$row->field})) > 0)
                                                        @foreach(json_decode($data->{$row->field}) as $item)
                                                            @if (@$row->details->options->{$item})
                                                                {{ $row->details->options->{$item} . (!$loop->last ? ', ' : '') }}
                                                            @endif
                                                        @endforeach
                                                    @else
                                                        {{ __('voyager::generic.none') }}
                                                    @endif
                                                @endif
                                            @endif
                                        </td>
                                    @endif
                                    @if (!$isAdmin)
                                        {{-- GROUP --}}
                                        <td scope="row">
                                            @php $row = $dataType->browseRows[8]; @endphp
                                            @include('vendor.voyager.formfields.relationship', ['view' => 'browse','options' => $row->details])
                                        </td>
                                    @endif

                                    @if ($isAdmin)
                                        {{-- USER --}}
                                        <th scope="row">
                                            <a target="_blank" rel="noopener noreferrer"
                                               href="{{ route('voyager.users.show', [$data->user_id], false) }}">{{($data->getUserContacts()['name'])}}
                                                - {{$data->getUserContacts()['mail']}}</a>
                                        </th>
                                    @endif

                                    {{-- VIDEO --}}
                                    <td scope="row">
                                        @php $row = $dataType->browseRows[10]; @endphp
                                        @if($data->video)<a
                                                target="_blank" rel="noopener noreferrer"
                                                href="{{ route('voyager.videos.show', [$data->video], false) }}">@endif @include('vendor.voyager.formfields.relationship', ['view' => 'browse','options' => $row->details])@if($data->video)</a>@endif
                                    </td>

                                    {{-- Statut CHARGE --}}
                                    <td scope="row">
                                        0
                                    </td>

                                    @if ($isAdmin)
                                        <td scope="row">
                                            {{$data->sw_arduino}} - {{$data->sw_opi}}
                                        </td>

                                        <td scope="row"><a target="_blank" rel="noopener noreferrer"
                                                           href="https://maps.google.com/?q={{$data->latitude}},{{$data->longitude}}"><i
                                                        class="ni ni-square-pin"></i></a>
                                        </td>

                                        {{--DATE--}}
                                        <td data-order="{{\Carbon\Carbon::parse($data->created_at)->timestamp}}">
                                            {{\Carbon\Carbon::parse($data->created_at)->formatLocalized('%e %B %Y')}}
                                        </td>
                                    @endif

                                    <td class="no-sort no-click text-right smallCol" id="bread-actions">
                                        <div class="dropdown smallCol">
                                            <a class="btn btn-sm btn-icon-only text-light" href="#" role="button"
                                               data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                <i class="fas fa-ellipsis-v"></i>
                                            </a>
                                            <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                                                @foreach(Voyager::actions() as $action)
                                                    @include('vendor.voyager.partials.custom-actions', ['action' => $action])
                                                @endforeach
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                    @if ($isServerSide)
                        <div class="pull-left">
                            <div role="status" class="show-res" aria-live="polite">{{ trans_choice(
                                    'voyager::generic.showing_entries', $dataTypeContent->total(), [
                                        'from' => $dataTypeContent->firstItem(),
                                        'to' => $dataTypeContent->lastItem(),
                                        'all' => $dataTypeContent->total()
                                    ]) }}</div>
                        </div>
                        <div class="pull-right">
                            {{ $dataTypeContent->appends([
                                's' => $search->value,
                                'filter' => $search->filter,
                                'key' => $search->key,
                                'order_by' => $orderBy,
                                'sort_order' => $sortOrder
                            ])->links() }}
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    {{-- Single delete modal --}}
    <div class="modal modal-danger" tabindex="-1" id="delete_modal" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">{{ __('voyager::generic.delete_question') }} ?</h4>
                </div>
                <div class="modal-footer">
                    <form action="#" id="delete_form" method="POST">
                        {{ method_field('DELETE') }}
                        {{ csrf_field() }}
                        <input type="submit" class="btn btn-danger pull-right delete-confirm"
                               value="Supprimer">
                    </form>
                    <button type="button" class="btn btn-default pull-right"
                            data-dismiss="modal">{{ __('voyager::generic.cancel') }}</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
@stop

@section('css')
    @if(!$dataType->server_side && config('dashboard.data_tables.responsive'))
        <link rel="stylesheet" href="{{ voyager_asset('lib/css/responsive.dataTables.min.css') }}">
    @endif
@stop

@section('javascript')
    <!-- DataTables -->
    @if(!$dataType->server_side && config('dashboard.data_tables.responsive'))
        <script src="{{ voyager_asset('lib/js/dataTables.responsive.min.js') }}"></script>
    @endif

    @javascript('tableScrollY', count($dataTypeContent) > 5 ? "60vh" : false)
    @javascript('tableCollapse', count($dataTypeContent) > 5 ? "60vh" : false)
    @javascript('admin', $isAdmin)


    <script>

        $(document).ready(function () {
                    @if (!$dataType->server_side)
            var table = $('#dataTable').DataTable({
                    "dom": 't',
                    "order": [],
                    "scrollY": window['tableScrollY'],
                    "scrollCollapse": window['tableCollapse'],
                    "paging": false,
                    "infos": false,
                    "language": 'fr',
                    "columnDefs":
                        [
                            {
                                'targets':
                                    [0, -1],
                                'searchable': false,
                                'orderable': false,
                                'width': '38px',
                                'max-width': '38px'
                            }

                        ],
                    initComplete: function () {
                        if (window['admin']) {
                            var columnType = this.api().column('#typeCol');
                            var select = $('<select class="tableFilter__select"><option value="">Tout</option></select>')
                                .appendTo($(columnType.header()))
                                .on('change', function () {
                                    var val = $.fn.dataTable.util.escapeRegex(
                                        $(this).val()
                                    );

                                    columnType
                                        .search(val ? '^' + val + '$' : '', true, false)
                                        .draw();
                                });

                            columnType.data().unique().sort().each(function (d, j) {
                                select.append('<option value="' + d + '">' + d + '</option>')
                            });
                        }

                        var columnDeviceType = this.api().column('#deviceTypeCol');
                        var selectDevice = $('<select class="tableFilter__select"><option value="">Tout</option></select>')
                            .appendTo($(columnDeviceType.header()))
                            .on('change', function () {
                                var val = $.fn.dataTable.util.escapeRegex(
                                    $(this).val()
                                );

                                columnDeviceType
                                    .search(val ? '^' + val + '$' : '', true, false)
                                    .draw();
                            });

                        var columnDeviceTypeData = columnDeviceType.data();
                        columnDeviceTypeData[0] = $(columnDeviceTypeData[0]).attr('title');
                        columnDeviceTypeData.unique().sort().each(function (d, j) {
                            if (d.length < 100) {
                                selectDevice.append('<option value="' + d + '">' + d + '</option>')
                            }
                        });

                        this.api().columns.adjust().draw();
                    }
                });

            $('#searchInTable').keyup(function () {
                table.search($(this).val()).draw();
            });

            @else
            $('#search-input select').select2({
                minimumResultsForSearch: Infinity
            });
            @endif

            $('.select_all').on('click', function (e) {
                $('input[name="row_id"]').prop('checked', $(this).prop('checked'));
            });

            $('.tableFilter__select').on('click', function (e) {
                $(this).parent().click();
            });

        });


        var deleteFormAction;
        $('td').on('click', '.delete', function (e) {
            $('#delete_form')[0].action = '{{ route('voyager.'.$dataType->slug.'.destroy', ['id' => '__id']) }}'.replace('__id', $(this).data('id'));
            $('#delete_modal').modal('show');
        });
    </script>
@stop