@extends('layouts.app', ['path' => 'activity_logs'])
@section('title')
	Activity Logs - HRMS
@endsection
@section('content')
    <div class="content" data-color="primary">
        <div class="d-md-flex d-block align-items-center justify-content-between page-breadcrumb mb-3">
            <div class="my-auto mb-2">
                <h2 class="mb-1">System Activity Logs</h2>
                <nav>
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item">
                            <a href="{{ route('dashboard') }}"><i class="ti ti-smart-home"></i></a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">System Activity Logs</li>
                    </ol>
                </nav>
            </div>
        </div>

        @include('partials.new_alerts')

        <div class="card">
            <div class="card-header d-flex align-items-center justify-content-between flex-wrap gap-2">
                <h5 class="mb-0">Activity Logs</h5>
                <div class="d-flex gap-2 align-items-center" style="width: 220px; margin-right: 450px;">
                    <select class="form-select form-select-sm select2" id="filterUser">
                        <option value="">All Users</option>

                        @php
                            $uniqueUsers = collect($activityLogs)
                                ->unique('user.name')
                                ->sortBy(fn($log) => strtolower($log['user']['name']));
                        @endphp

                        @foreach ($uniqueUsers as $log)
                            @php
                                $userName = preg_replace('/\.\d+$/', '', $log['user']['name']);
                            @endphp
                            <option value="{{ $userName }}">{{ $userName }}</option>
                        @endforeach
                    </select>

                    <select class="form-select form-select-sm select2" id="filterModule">
                        <option value="">All Modules</option>

                        @php
                            $uniqueModules = collect($activityLogs)
                                ->unique('module')
                                ->sortBy(fn($log) => strtolower($log['module']));
                        @endphp

                        @foreach ($uniqueModules as $log)
                            @php
                                $formattedModule = \Illuminate\Support\Str::title(
                                    str_replace('_', ' ', $log['module'])
                                );
                            @endphp
                            <option value="{{ $formattedModule }}">{{ $formattedModule }}</option>
                        @endforeach
                    </select>

                    <button class="btn  btn-primary text-nowrap" id="applyFilter" style="padding: 6px;">
                        <i class="ti ti-filter"></i> Apply Filters
                    </button>
                    <button class="btn  btn-outline-secondary text-nowrap" id="removeFilter" style="padding: 6px;">
                        <i class="ti ti-refresh "></i> Clear Filters
                    </button>
                </div>
            </div>
            <div class="card-body">
                <table class="table table-hover table-sm" id="activityTable">
                    <thead>
                        <tr>
                            <th>Employee ID</th>
                            <th>Modified By</th>
                            <th>Module</th>
                            <th>Action</th>
                            <th>Description</th>
                            <th>Modified Entity</th>
                            <th>Date</th>
                            <th>Details</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($activityLogs as $log)
                            <tr>
                                <td style="vertical-align: middle;">
                                    <span class="badge bg-secondary-transparent">
                                        <p style="color: #3B7080;">{{$log['user']['employee_id']}} </p>
                                    </span>
                                </td>
                                <td>
                                    {{ ucfirst($log['user']['name']) }}
                                </td>
                                <td style="vertical-align: middle;">
                                    <span class=" w-auto bg-light text-dark px-2 py-1 d-inline-flex align-items-center text-start" style="width: auto !important;padding: 0.25rem 0.45rem;font-weight: 600;letter-spacing: 0.5px;border-radius: 4px;font-size:0.75rem;line-height:1;white-space: nowrap;vertical-align: baseline;">
                                        {{ Str::title(str_replace('_', ' ', trim($log['module']))) }}
                                    </span>
                                </td>

                                <td style="vertical-align: middle;">
                                    <span class="badge bg-{{ getActionBadge($log['event']) }} text-white">{{ \Str::upper(str_replace('_', ' ', $log['event'])) }}</span>
                                </td>
                                <td style="vertical-align: middle;">
                                    {{
                                        Str::title(
                                            $log['log_name'] === 'employee' &&
                                            !Str::startsWith(Str::lower($log['description']), 'employee')
                                                ? 'Employee ' . $log['description']
                                                : $log['description']
                                        )
                                    }}
                                </td>
                                <td style="vertical-align: middle;">{{ $log['entity_name'] }}</td>
                                <td data-order="{{ strtotime($log['created_at']) }}" style="vertical-align: middle;"><small class="text-muted">{{ formatDisplayDateMDYhia($log['created_at']) }}</small></td>
                                <td style="vertical-align: middle;">
                                    @if ($log['event']!=='created')
                                        <button class="btn btn-sm btn-outline-primary view-details" type="button"
                                            data-log='@json($log)'>
                                            <i class="ti ti-eye"></i>
                                        </button>
                                    @else
                                        -
                                    @endif

                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>

        <div class="modal fade" id="changesModal" tabindex="-1">
            <div class="modal-dialog modal-xl">
                <div class="modal-content" style="max-height: 100vh">
                    <div class="modal-header bg-primary">
                        <div>
                            <h5 class="modal-title mb-1 text-white">Changes Made</h5>
                        </div>
                        <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                    </div>
                    <div class="modal-body" style="overflow-y: auto;">

                        <div id="changesSection" style="display: none;">
                            <div class="table-responsive">
                                <table class="table table-bordered table-hover">
                                    <thead class="table-light">
                                        <tr>
                                            <th width="30%">Field Name</th>
                                            <th width="35%">Previous Value</th>
                                            <th width="35%">New Value</th>
                                        </tr>
                                    </thead>
                                    <tbody id="changesTableBody"></tbody>
                                </table>
                            </div>
                        </div>
                        <div id="noChangesSection" style="display: none;">
                            <div class="alert alert-info">
                                <i class="ti ti-info-circle me-2"></i>No field changes recorded for this activity.
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('scripts')
    <script src="{{ asset('assets/js/dev-script/activity-log.js?v=' . config('api.version')) }}"></script>
@endpush