@extends('layouts.app')
@section('content')
    <div class="card">
        <div class="card-header d-flex justify-content-between">
            <div class="header-title">
                <h4 class="card-title">Historial de cambios</h4>
            </div>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table id="log-table" class="table table-striped" data-toggle="data-table">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Mensaje</th>
                            <th>Cambios</th>
                            <th>Hora</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($logs as $item)
                            <tr>
                                <td>{{ $loop->iteration }}</td>
                                <td> {{ $item->usuario->name . ' ' . $item->usuario->lastname . ' ' . $item->mensaje }}
                                </td>
                                <td>
                                    @if ($item->changed_data)
                                        @foreach ($item->changed_data as $clave => $valor)
                                            @if (gettype($valor) == 'string')
                                                <p>{{ $clave . ' => ' . $valor }}</p>
                                            @else
                                                <p>{{ $clave }}</p>
                                            @endif
                                        @endforeach
                                    @else
                                        SIN CAMBIOS
                                    @endif
                                </td>
                                <td>{{ $item->created_at->format('H:i d-m-Y') }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection