@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <div class="row gx-4">
                <div class="col-lg">
                    <div class="nav-wrapper">
                        <button class="btn btn-secondary mb-0" onclick="history.back()">
                            <i class="fas fa-circle-left me-1"></i> Kembali
                        </button>
                        @if (isset($authorize) && $authorize->edit == '1' && $kurs->isactive == 1)
                            <button class="btn btn-primary mb-0"
                                onclick="window.location='{{ url($url_menu . '/add?ref=' . encrypt($kurs->id_kurs)) }}'">
                                <i class="fas fa-plus me-1"></i> Tambah
                            </button>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container-fluid py-4">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header pb-0">
                        <h5 class="mb-0">List Histori Kurs - ({{ $kurs->kode }} → {{ $kurs->kode_lawan }})</h5>
                    </div>
                    <div class="col">
                        @include('components.alert')
                    </div>
                    <hr class="horizontal dark mt-2">
                    <div class="row px-4 py-2">
                        <div class="table-responsive">
                            <table class="table display" id="history_table">
                                <thead class="thead-light" style="background-color: #00b7bd4f;">
                                    <tr>
                                        <th>No</th>
                                        <th>Action</th>
                                        <th>Timestamp</th>
                                        <th class="text-end">Kurs API</th>
                                        <th class="text-end">Kurs Manual</th>
                                        <th class="text-end">Selisih</th>
                                        <th>User</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($history as $h)
                                        @php
                                            $prevRecord = null;
                                            if (!$loop->last) {
                                                $prevRecord = $history[$loop->index + 1] ?? null;
                                            }
                                            $selisihPct = 0;
                                            $selisihDir = 'same';
                                            if ($prevRecord && $prevRecord->nilai > 0) {
                                                $selisihPct =
                                                    (($h->nilai - $prevRecord->nilai) / $prevRecord->nilai) * 100;
                                                $selisihDir =
                                                    $selisihPct > 0 ? 'up' : ($selisihPct < 0 ? 'down' : 'same');
                                            }
                                        @endphp
                                        <tr>
                                            <td class="text-sm font-weight-normal">{{ $loop->iteration }}</td>
                                            <td>
                                                @if (isset($authorize) && $authorize->edit == '1' && $h->isactive == 1)
                                                    <a href="{{ url($url_menu . '/edit/' . encrypt($h->id_kurs)) }}"
                                                        class="btn btn-warning btn-sm mb-0 px-2 py-1">

                                                        <i class="fas fa-edit me-1"></i>
                                                        Edit
                                                    </a>
                                                @endif
                                            </td>
                                            <td class="text-sm font-weight-normal">
                                                {{ \Carbon\Carbon::parse($h->created_at)->translatedFormat('d F Y') }}
                                            </td>
                                            <td class="text-sm font-weight-normal text-end">
                                                {{ number_format($h->kurs_api, 2, ',', '.') }}</td>
                                            <td class="text-sm font-weight-normal text-end">
                                                {{ number_format($h->nilai, 2, ',', '.') }}</td>
                                            <td class="text-sm font-weight-normal text-end">
                                                {{ number_format(abs($selisihPct), 2, ',', '.') }}%
                                                @if ($selisihDir == 'up')
                                                    <i class="fas fa-arrow-up text-success"></i>
                                                @elseif ($selisihDir == 'down')
                                                    <i class="fas fa-arrow-down text-danger"></i>
                                                @endif
                                            </td>
                                            <td class="text-sm font-weight-normal">{{ $h->user_update ?? $h->user_create }}
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        <div class="d-flex justify-content-between align-items-center mt-3">
                            <div class="text-sm">
                                Data {{ count($history) > 0 ? 1 : 0 }} - {{ count($history) }} dari {{ count($history) }}
                                data.
                            </div>
                            <div></div>
                        </div>
                    </div>
                    <div class="row px-4 py-2">
                        <div class="col-lg">
                            <div class="nav-wrapper" id="noted"><code>Note : <i aria-hidden="true"
                                        style="color: #ffc2cd;" class="fas fa-circle"></i> Data not active</code></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @if (request()->filled('swal_message'))
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                Swal.fire({
                    icon: @json(request('swal_icon', 'info')),
                    title: @json(request('swal_title', 'Informasi')),
                    text: @json(request('swal_message')),
                    confirmButtonText: 'OK',
                    allowOutsideClick: false
                }).then(function() {
                    const cleanUrl =
                        window.location.origin +
                        window.location.pathname;

                    window.history.replaceState({},
                        document.title,
                        cleanUrl
                    );
                });
            });
        </script>
    @endif
@endsection
@push('js')
    <script>
        $('#history_table').DataTable({
            paging: false,
            info: false,
            searching: true,
            ordering: true,
            order: [
                [0, 'asc']
            ],
            "language": {
                "search": "",
                "searchPlaceholder": "Search...",
                "emptyTable": "Tidak ada history"
            },
            responsive: true,
            dom: '<"row d-flex justify-content-between align-items-center"<"col-lg-12 d-flex justify-content-between align-items-center"Bf>>rtip',
            buttons: [{
                    extend: 'excelHtml5',
                    className: 'buttons-excel',
                    text: '<i class="fas fa-file-excel me-1 text-lg text-success"></i><span class="font-weight-bold"> Excel</span>',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'pdfHtml5',
                    className: 'buttons-pdf',
                    text: '<i class="fas fa-file-pdf me-1 text-lg text-danger"></i><span class="font-weight-bold"> PDF</span>',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
            ],
            initComplete: function() {
                $('.dataTables_filter input').addClass('form-control');
            }
        });
        $('.dt-button').addClass('btn btn-secondary').removeClass('dt-button');
    </script>
@endpush