@extends('layouts.app')
@section('title', 'Admin: Show File: '.$dataFile->filename)
@section('content')
<div class="container py-3">
    <h1 class="fs-2">Admin | Show File: <strong>{{ $dataFile->filename }}</strong></h1>
    <table class="table table-bordered table-responsive my-3 mh-25-vh">
        <thead>
            <tr>
                <th class="fs-5" colspan="2">
                    File Details
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th class="w-25">Client</th>
                <td class="w-75">{{ $dataFile->client->name }}</td>
            </tr>
            <tr>
                <th class="w-25">Date uploaded</th>
                <td class="w-75">{{ $dataFile->created_at }}</td>
            </tr>
            <tr>
                <th class="w-25">Location associated</th>
                @if($dataFile->location)
                    <td class="w-75">{{ $dataFile->location->address }}</td>
                @else
                    <td class="w-75"><small class="text-danger">n/a</small></td>
                @endif
            </tr>
        </tbody>
    </table>
    <div class="d-flex flex-row justify-content-start align-items-center" style="gap:1em;">
        <button disabled class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#updateLocationConfirm">Update Location</button>
        <button class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteFileConfirm">Delete File</button>
    </div>

    @if ($message = Session::get('success'))
    <div class="d-flex flex-row my-3 w-100 justify-content-center">
        <div class="alert alert-success">
            <p class="text-center">{{ $message }}</p>
        </div>
    </div>
    @endif

    <h2 class="fs-3 mt-3">Data Logs Pulled from File</h2>

    <div class="card">
        <div class="card-header">
            <div style="display: flex; justify-content: space-between; align-items: center;">
                <span id="card_title">
                    {{ __('Data Log') }}
                </span>
            </div>
        </div>


        <div class="card-body">
            <div class="table-responsive overflow-y-scroll mh-25-vh">
                <table class="table table-striped table-hover">
                    <thead class="thead sticky-top">
                        <tr>
                            <th>Date/Time</th>
                            <th>Gender</th>
                            <th>Age</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($dataFile->dataLogs as $dataLog)
                            <tr>
                                <td>{{ $dataLog->date_time }}</td>
                                <td>{{ $dataLog->gender }}</td>
                                <td>{{ $dataLog->age }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection