@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
{{-- section content --}}
@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 back --}}
                        <button class="btn btn-secondary mb-0" onclick="history.back()"><i
                                class="fas fa-circle-left me-1"> </i><span class="font-weight-bold">Kembali</span>
                        </button>
                        {{-- check authorize delete --}}
                        @if ($authorize->delete == '1')
                            <form action="{{ url($url_menu . '/' . encrypt($harga_saham_id)) }}" method="POST"
                                style="display: inline">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-danger mb-0"
                                    onclick="return deleteData(event, '{{ \Carbon\Carbon::parse($header->tanggal_investasi)->locale('id')->isoFormat('D MMMM YYYY') }}', 'Hapus')">
                                    <i class="fas fa-trash me-1"> </i><span class="font-weight-bold">Hapus</span>
                                </button>
                            </form>
                        @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-body">
                        <p class="text-uppercase text-sm">View {{ $title_menu }}</p>
                        <hr class="horizontal dark mt-0">
                        <div class="row mb-3 px-3">
                            <div class="col-md-6">
                                <p class="mb-1"><strong>Tanggal Investasi</strong> &nbsp;:
                                    {{ \Carbon\Carbon::parse($header->tanggal_investasi)->locale('id')->isoFormat('D MMMM YYYY') }}
                                </p>
                            </div>
                        </div>
                        <div class="row mb-3 px-3">
                            <div class="col-md-6">
                                <p class="mb-1"><strong>Tanggal Download</strong> &nbsp;:
                                    {{ \Carbon\Carbon::parse($header->tanggal_download)->locale('id')->isoFormat('D MMMM YYYY') }}
                                </p>
                            </div>
                        </div>
                        <div class="row mb-3 px-3">
                            <div class="col-md-6">
                                <p class="mb-1"><strong>Total Lembar Saham</strong> &nbsp;:
                                    {{ number_format($total_lembar_saham, 0, ',', '.') }}
                                </p>
                            </div>
                        </div>
                        {{-- Filter / Search has been removed as it will be handled by DataTables --}}
                        <div class="table-responsive">
                            <table class="table table-striped table-hover" id="list_detail">
                                <thead class="thead-light" style="background-color: #00b7bd4f;">
                                    <tr>
                                        <th>No</th>
                                        <th>Nama Investor</th>
                                        <th>Nomor SID</th>
                                        <th>Nama Pemegang Rekening</th>
                                        <th>Kode Pemegang Rekening</th>
                                        <th>Jumlah</th>
                                        <th>Lainnya</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($detail as $dt)
                                        <tr>
                                            <td>{{ $loop->iteration }}</td>
                                            <td>{{ $dt->nama_investor }}</td>
                                            <td>{{ $dt->nomor_sid }}</td>
                                            <td>{{ $dt->nama_pemegang_rekening }}</td>
                                            <td>{{ $dt->kode_pemegang_rekening }}</td>
                                            <td data-sort="{{ $dt->jumlah_kepemilikan_saham }}">{{ number_format($dt->jumlah_kepemilikan_saham, 0, ',', '.') }}</td>
                                            <td>
                                                <button type="button" class="btn btn-sm btn-info mb-0 py-1 px-2"
                                                    data-bs-toggle="modal"
                                                    data-bs-target="#detailModal{{ $dt->id }}" title="Lihat Detail">
                                                    <i class="fas fa-ellipsis-h"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Modal Detail per Investor --}}
    @foreach ($detail as $dt)
        <div class="modal fade" id="detailModal{{ $dt->id }}" tabindex="-1"
            aria-labelledby="detailModalLabel{{ $dt->id }}" aria-hidden="true">
            <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
                <div class="modal-content">
                    <div class="modal-header bg-light">
                        <h5 class="modal-title" id="detailModalLabel{{ $dt->id }}">Detail -
                            {{ $dt->nama_investor }}</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body px-4 py-3">
                        <div class="table-responsive">
                            <table class="table table-bordered table-striped table-hover table-sm mb-0">
                                <tbody>
                                <tr>
                                    <th style="width: 35%;">Nama Investor</th>
                                    <td>{{ $dt->nama_investor }}</td>
                                </tr>
                                <tr>
                                    <th>Nomor Rekening</th>
                                    <td>{{ $dt->nomor_rekening }}</td>
                                </tr>
                                <tr>
                                    <th>Nomor SID</th>
                                    <td>{{ $dt->nomor_sid }}</td>
                                </tr>
                                <tr>
                                    <th>Nomor KTP</th>
                                    <td>{{ $dt->nomor_ktp }}</td>
                                </tr>
                                <tr>
                                    <th>NPWP</th>
                                    <td>{{ $dt->npwp }}</td>
                                </tr>
                                <tr>
                                    <th>Passport</th>
                                    <td>{{ $dt->passport }}</td>
                                </tr>
                                <tr>
                                    <th>Alamat 1</th>
                                    <td>{{ $dt->alamat_1 }}</td>
                                </tr>
                                <tr>
                                    <th>Alamat 2</th>
                                    <td>{{ $dt->alamat_2 }}</td>
                                </tr>
                                <tr>
                                    <th>Status Pajak</th>
                                    <td>{{ $dt->status_pajak }}</td>
                                </tr>
                                <tr>
                                    <th>Status Pajak Investor</th>
                                    <td>{{ $dt->status_pajak_investor }}</td>
                                </tr>
                                <tr>
                                    <th>Kewarganegaraan</th>
                                    <td>{{ $dt->kewarganegaraan }}</td>
                                </tr>
                                <tr>
                                    <th>Status Investor</th>
                                    <td>{{ $dt->status_investor }}</td>
                                </tr>
                                <tr>
                                    <th>Tingkat Pajak Equi</th>
                                    <td>{{ $dt->tingkat_pajak_equi }}</td>
                                </tr>
                                <tr>
                                    <th>Tingkat Pajak Corp</th>
                                    <td>{{ $dt->tingkat_pajak_corp }}</td>
                                </tr>
                                <tr>
                                    <th>Tingkat Pajak MTN</th>
                                    <td>{{ $dt->tingkat_pajak_mtn }}</td>
                                </tr>
                                <tr>
                                    <th>Nama Pemegang Rekening</th>
                                    <td>{{ $dt->nama_pemegang_rekening }}</td>
                                </tr>
                                <tr>
                                    <th>Kode Pemegang Rekening</th>
                                    <td>{{ $dt->kode_pemegang_rekening }}</td>
                                </tr>
                                <tr>
                                    <th>Jumlah Kepemilikan Saham</th>
                                    <td>{{ number_format($dt->jumlah_kepemilikan_saham, 0, ',', '.') }}</td>
                                </tr>
                                <tr>
                                    <th>Status Rekening</th>
                                    <td>{{ $dt->status_rekening }}</td>
                                </tr>
                                <tr>
                                    <th>Status Balance</th>
                                    <td>{{ $dt->status_balance }}</td>
                                </tr>
                                <tr>
                                    <th>Percentage</th>
                                    <td>{{ $dt->percentage }}%</td>
                                </tr>
                                <tr>
                                    <th>Email</th>
                                    <td>{{ $dt->email }}</td>
                                </tr>
                                <tr>
                                    <th>No Telp</th>
                                    <td>{{ $dt->no_telp }}</td>
                                </tr>
                            </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="modal-footer bg-light">
                        <button type="button" class="btn btn-secondary mb-0" data-bs-dismiss="modal">Tutup</button>
                    </div>
                </div>
            </div>
        </div>
    @endforeach

    {{-- check flag js on dmenu --}}
    @if ($jsmenu == '1')
        @if (view()->exists("js.{$dmenu}"))
            @push('addjs')
                {{-- file js in folder (resources/views/js) --}}
                @include('js.' . $dmenu);
            @endpush
        @else
            @push('addjs')
                <script>
                    Swal.fire({
                        title: 'JS Not Found!!',
                        text: 'Please Create File JS',
                        icon: 'error',
                        confirmButtonColor: '#028284'
                    });
                </script>
            @endpush
        @endif
    @endif
@endsection
@push('js')
    <script>
        //function delete
        function deleteData(event, name, msg) {
            event.preventDefault();
            Swal.fire({
                title: 'Konfirmasi',
                text: `Apakah Anda Yakin ${msg} Data ${name} ini?`,
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: `Ya, ${msg}`,
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    event.target.closest('form').submit();
                }
            });
        }

        $(document).ready(function() {
            $('#list_detail').DataTable({
                "language": {
                    "search": "Cari:",
                    "lengthMenu": "Tampilkan _MENU_ data",
                    "info": "Menampilkan _START_ sampai _END_ dari _TOTAL_ data",
                    "infoEmpty": "Menampilkan 0 sampai 0 dari 0 data",
                    "infoFiltered": "(difilter dari _MAX_ total data)",
                    "paginate": {
                        "first": "Pertama",
                        "last": "Terakhir",
                        "next": "Selanjutnya",
                        "previous": "Sebelumnya"
                    }
                }
            });
        });
    </script>
@endpush