@extends('layouts.app-admin')

@section('content')
    <div class="content d-flex flex-column flex-column-fluid pt-0" id="kt_content">
        <div class="d-flex flex-column-fluid">
            <div class="container">
                <div class="card shadow mb-4">
                    <div class="card-header p-2">
                        <div class="container-fluid d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
                            <div class="col-6 d-flex align-items-center flex-wrap mr-2">
                                <h5 class="text-dark font-weight-bold mt-2 mb-2 mr-5">
                                    Usuarios
                                </h5>
                            </div>
                            <div class="col-6 d-flex justify-content-end">
                                <a href="{{route('admin-users-create')}}" class="btn btn-primary btn-rounded m-1">
                                    <i class="fas fa-plus-circle fa-sm text-white-50"></i>
                                    Agregar Usuario
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="card-body card-body-table">
                        <div class="table-responsive">
                            <table class="table table-bordered table-custom" id="dataTableUsers" width="100%" cellspacing="0">
                                <thead class="thead-custom">
                                    <tr class="tr-custom" align="center">
                                        <th class="th-custom th-table-index">Código</th>
                                        <th class="th-custom th-table-index">Usuario</th>
                                        <th class="th-custom th-table-index">Edad</th>
                                        <th class="th-custom th-table-index">Nivel</th>
                                        <th class="th-custom th-table-index">Tipo</th>
                                        <th class="th-custom th-table-index">Lesión</th>
                                        <th class="th-custom th-table-index">Protección<br>de Datos</th>
                                        <th class="th-custom th-table-index">Fecha Firma</th>

                                        <th class="th-custom th-table-index">Foto</th>
                                        <th class="th-custom th-table-index">Activo</th>

                                        <th class="th-custom th-table-index">Acciones</th>
                                    </tr>
                                </thead>
                                <tbody class="tbody-custom">
                                    @if($users->count())
                                        @foreach($users as $user)
                                            <tr class="tr-custom">
                                                <td class="td-custom text-center">
                                                    <a href="{{url('admin-users-edit')}}/{{$user->id}}" class="text-dark-75 font-weight-bolder text-hover-primary font-size-lg">
                                                        {{$user->code}}
                                                    </a>
                                                </td>
                                                <td class="td-custom">
                                                    <a href="{{url('admin-users-edit')}}/{{$user->id}}" class="text-dark-75 font-weight-bolder text-hover-primary font-size-lg">
                                                        {{$user->first_name}} {{$user->last_name}}
                                                    </a>
                                                </td>
                                                <td class="td-custom text-center">
                                                    {{$user->age}}
                                                </td>
                                                <td class="td-custom">
                                                    @switch($user->level)
                                                        @case(1)
                                                            Normal
                                                            @break
                                                        @case(2)
                                                            Avanzado
                                                            @break
                                                        @case(3)
                                                            Superior
                                                            @break
                                                    @endswitch
                                                </td>
                                                <td class="td-custom">
                                                    @foreach ($user->roles as $role)
                                                        @switch($role->name)
                                                            @case('user')
                                                                Usuario
                                                                @break

                                                            @case('superuser')
                                                                Super usuario
                                                                @break
                                                        @endswitch
                                                    @endforeach
                                                </td>
                                                <td class="td-custom text-center">
                                                    @if($user->injury == 0)
                                                        <span class="label label-lg font-weight-bold label-light-success label-inline">
                                                            No
                                                        </span>
                                                    @else
                                                        <span class="label label-lg font-weight-bold label-light-danger label-inline">
                                                            Si
                                                        </span>
                                                    @endif
                                                </td>
                                                <td class="td-custom text-center">
                                                    @if($user->data_protection == 0)
                                                        <span class="label label-lg font-weight-bold label-light-danger label-inline">
                                                            Pendiente
                                                        </span>
                                                    @else
                                                        <span class="label label-lg font-weight-bold label-light-success label-inline">
                                                            Firmada
                                                        </span>
                                                    @endif
                                                </td>
                                                <td class="td-custom" align="center">
                                                    @if($user->data_protection_date)
                                                        <span class="text-dark-75 font-weight-bolder d-block font-size-lg">
                                                            {{Carbon\Carbon::parse($user->data_protection_date)->format('d/m/Y H:i')}}
                                                        </span>
                                                    @else
                                                        -----
                                                    @endif
                                                </td>
                                                <td class="td-custom">
                                                    <div class="text-center">
                                                        @if($user->photo)
                                                            <img class="img-show" id="show-foto" src="{{Storage::disk('s3')->url('images/profiles/' . $user->photo)}}" alt="">
                                                        @else
                                                            <img class="img-show" id="show-foto" src="{{asset('images/blank.png')}}" alt="">
                                                        @endif
                                                    </div>
                                                </td>
                                                <td class="td-custom" align="center">
                                                    @if($user->active === 1)
                                                        <span class="label label-lg font-weight-bold label-light-success label-inline">
                                                            Activado
                                                        </span>
                                                    @else
                                                        <span class="label label-lg font-weight-bold label-light-danger label-inline">
                                                            Desactivado
                                                        </span>
                                                    @endif
                                                </td>
                                                <td class="td-custom" style="text-align: center;">
                                                    <div class="d-flex justify-content-center">
                                                        {{-- <a href="{{url('admin-games')}}/{{$user->id}}" class="btn btn-sm btn-default btn-text-primary btn-hover-primary btn-icon mr-2" title="Ver Juegos">
                                                            <span class="svg-icon svg-icon-md svg-icon-primary">
                                                                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                        <rect x="0" y="0" width="24" height="24"/>
                                                                        <path d="M12.9486833,8.31622777 L11.0513167,7.68377223 C11.8160243,5.38964935 13.0426772,3.95855428 14.7574644,3.5298575 C15.650287,3.30665184 17,1.86951059 17,1 L19,1 C19,2.79715607 17.0163797,5.02668149 15.2425356,5.4701425 C14.2906561,5.70811238 13.517309,6.61035065 12.9486833,8.31622777 Z" fill="#000000" fill-rule="nonzero" opacity="0.3"/>
                                                                        <path d="M7.81798367,7 L16.2025685,7 C17.5586976,6.72948613 18.9494633,7.42723712 19.526457,8.72046451 L22.9501217,16.3939916 C23.4665806,17.5515411 23.1998005,18.9087734 22.2836331,19.7847233 L21.8392372,20.2096113 C21.8188115,20.2291404 21.7980738,20.2483405 21.7770321,20.2672042 C20.6904893,21.2412841 19.0200246,21.1501149 18.0459447,20.0635721 L15.2994684,17 L8.86456314,17 L6.11808685,20.0635721 C5.14400696,21.1501149 3.47354224,21.2412841 2.38699945,20.2672042 C2.36595778,20.2483405 2.34522009,20.2291404 2.3247944,20.2096113 L1.85770343,19.7630245 C0.952705301,18.8977536 0.680264004,17.5614241 1.17430192,16.4109277 L4.46146538,8.75590867 C5.02845054,7.43553556 6.44099515,6.71763226 7.81798367,7 Z M8,14 C9.1045695,14 10,13.1045695 10,12 C10,10.8954305 9.1045695,10 8,10 C6.8954305,10 6,10.8954305 6,12 C6,13.1045695 6.8954305,14 8,14 Z M17,12 C17.5522847,12 18,11.5522847 18,11 C18,10.4477153 17.5522847,10 17,10 C16.4477153,10 16,10.4477153 16,11 C16,11.5522847 16.4477153,12 17,12 Z M15,14 C15.5522847,14 16,13.5522847 16,13 C16,12.4477153 15.5522847,12 15,12 C14.4477153,12 14,12.4477153 14,13 C14,13.5522847 14.4477153,14 15,14 Z" fill="#000000"/>
                                                                    </g>
                                                                </svg>
                                                            </span>
                                                        </a> --}}
                                                        <a href="{{url('admin-users-edit')}}/{{$user->id}}" class="btn btn-sm btn-default btn-text-primary btn-hover-primary btn-icon mr-2" title="Editar">
                                                            <span class="svg-icon svg-icon-md svg-icon-primary">
                                                                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                        <rect x="0" y="0" width="24" height="24"></rect>
                                                                        <path
                                                                            d="M12.2674799,18.2323597 L12.0084872,5.45852451 C12.0004303,5.06114792 12.1504154,4.6768183 12.4255037,4.38993949 L15.0030167,1.70195304 L17.5910752,4.40093695 C17.8599071,4.6812911 18.0095067,5.05499603 18.0083938,5.44341307 L17.9718262,18.2062508 C17.9694575,19.0329966 17.2985816,19.701953 16.4718324,19.701953 L13.7671717,19.701953 C12.9505952,19.701953 12.2840328,19.0487684 12.2674799,18.2323597 Z"
                                                                            fill="#000000" fill-rule="nonzero"
                                                                            transform="translate(14.701953, 10.701953) rotate(-135.000000) translate(-14.701953, -10.701953) ">
                                                                        </path>
                                                                        <path
                                                                            d="M12.9,2 C13.4522847,2 13.9,2.44771525 13.9,3 C13.9,3.55228475 13.4522847,4 12.9,4 L6,4 C4.8954305,4 4,4.8954305 4,6 L4,18 C4,19.1045695 4.8954305,20 6,20 L18,20 C19.1045695,20 20,19.1045695 20,18 L20,13 C20,12.4477153 20.4477153,12 21,12 C21.5522847,12 22,12.4477153 22,13 L22,18 C22,20.209139 20.209139,22 18,22 L6,22 C3.790861,22 2,20.209139 2,18 L2,6 C2,3.790861 3.790861,2 6,2 L12.9,2 Z"
                                                                            fill="#000000" fill-rule="nonzero" opacity="0.3"></path>
                                                                    </g>
                                                                </svg>
                                                            </span>
                                                        </a>
                                                        @if($user->active === 1)
                                                            <a href="{{url('admin-users-desactivate')}}/{{$user->id}}" class="btn btn-sm btn-default btn-text-primary btn-hover-primary btn-icon mr-2" title="Desactivar">
                                                                <span class="svg-icon svg-icon-md svg-icon-primary">
                                                                    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                            <rect x="0" y="0" width="24" height="24"/>
                                                                            <circle fill="#000000" opacity="0.3" cx="12" cy="12" r="10"/>
                                                                            <path d="M12.0355339,10.6213203 L14.863961,7.79289322 C15.2544853,7.40236893 15.8876503,7.40236893 16.2781746,7.79289322 C16.6686989,8.18341751 16.6686989,8.81658249 16.2781746,9.20710678 L13.4497475,12.0355339 L16.2781746,14.863961 C16.6686989,15.2544853 16.6686989,15.8876503 16.2781746,16.2781746 C15.8876503,16.6686989 15.2544853,16.6686989 14.863961,16.2781746 L12.0355339,13.4497475 L9.20710678,16.2781746 C8.81658249,16.6686989 8.18341751,16.6686989 7.79289322,16.2781746 C7.40236893,15.8876503 7.40236893,15.2544853 7.79289322,14.863961 L10.6213203,12.0355339 L7.79289322,9.20710678 C7.40236893,8.81658249 7.40236893,8.18341751 7.79289322,7.79289322 C8.18341751,7.40236893 8.81658249,7.40236893 9.20710678,7.79289322 L12.0355339,10.6213203 Z" fill="#000000"/>
                                                                        </g>
                                                                    </svg>
                                                                </span>
                                                            </a>
                                                        @else
                                                            <a href="{{url('admin-users-activate')}}/{{$user->id}}" class="btn btn-sm btn-default btn-text-primary btn-hover-primary btn-icon mr-2" title="Activar">
                                                                <span class="svg-icon svg-icon-md svg-icon-primary">
                                                                    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                            <rect x="0" y="0" width="24" height="24"/>
                                                                            <circle fill="#000000" opacity="0.3" cx="12" cy="12" r="10"/>
                                                                            <path d="M16.7689447,7.81768175 C17.1457787,7.41393107 17.7785676,7.39211077 18.1823183,7.76894473 C18.5860689,8.1457787 18.6078892,8.77856757 18.2310553,9.18231825 L11.2310553,16.6823183 C10.8654446,17.0740439 10.2560456,17.107974 9.84920863,16.7592566 L6.34920863,13.7592566 C5.92988278,13.3998345 5.88132125,12.7685345 6.2407434,12.3492086 C6.60016555,11.9298828 7.23146553,11.8813212 7.65079137,12.2407434 L10.4229928,14.616916 L16.7689447,7.81768175 Z" fill="#000000" fill-rule="nonzero"/>
                                                                        </g>
                                                                    </svg>
                                                                </span>
                                                            </a>
                                                        @endif
                                                        <a href="javascript:;" class="btn btn-sm btn-default btn-text-primary btn-hover-primary btn-icon open-deleteUser" title="Eliminar" data-toggle="modal" data-target="#modalDeleteUser{{$user->id}}" data-user-id="{{$user->id}}" data-user-name="{{$user->first_name}} {{$user->last_name}}">
                                                            <span class="svg-icon svg-icon-md svg-icon-primary">
                                                                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                                    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                                        <rect x="0" y="0" width="24" height="24"></rect>
                                                                        <path
                                                                            d="M6,8 L6,20.5 C6,21.3284271 6.67157288,22 7.5,22 L16.5,22 C17.3284271,22 18,21.3284271 18,20.5 L18,8 L6,8 Z"
                                                                            fill="#000000" fill-rule="nonzero"></path>
                                                                        <path
                                                                            d="M14,4.5 L14,4 C14,3.44771525 13.5522847,3 13,3 L11,3 C10.4477153,3 10,3.44771525 10,4 L10,4.5 L5.5,4.5 C5.22385763,4.5 5,4.72385763 5,5 L5,5.5 C5,5.77614237 5.22385763,6 5.5,6 L18.5,6 C18.7761424,6 19,5.77614237 19,5.5 L19,5 C19,4.72385763 18.7761424,4.5 18.5,4.5 L14,4.5 Z"
                                                                            fill="#000000" opacity="0.3"></path>
                                                                    </g>
                                                                </svg>
                                                            </span>
                                                        </a>
                                                        <!-- Modal Delete -->
                                                        <div class="modal fade" id="modalDeleteUser{{$user->id}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                            <div class="modal-dialog" role="document">
                                                                <div class="modal-content">
                                                                    <div class="modal-header">
                                                                        <h5 class="modal-title" id="exampleModalLabel">Eliminar Usuario</h5>
                                                                        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                                                                            <span aria-hidden="true">×</span>
                                                                        </button>
                                                                    </div>
                                                                    <div class="modal-body text-center">
                                                                        Esta seguro que desea eliminar el Usuario <b><span id="user_name"></span></b>?
                                                                    </div>
                                                                    <div class="modal-footer">
                                                                        <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancelar</button>
                                                                        <a class="btn btn-primary" href="{{route('admin-users-delete',['user_id'=>$user->id])}}">Eliminar</a>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <!-- END | Modal Delete -->
                                                    </div>
                                                </td>
                                            </tr>
                                        @endforeach
                                    @endif
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection