@extends('layouts.app_operasi')

@section('content')
    <div class="container col-12">
        <div class="row justify-content-center">
            <div class="col-md-12">
                <div class="card">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb pb-3">
                            <li class="breadcrumb-item"><a href="{{ url('/') }}">Home</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Kelulusan Anggota</li>
                        </ol>
                    </nav>

                    <div class="card-body text-center">

                        <div class="row mb-4">
                            <div class="col-2 justify-content-start">
                            </div>
                            <div class="col-8 mt-3 justify-content-center">
                            </div>
                            <div class="col-2">
                            </div>
                        </div>

                        <table class='table mt-2 table-striped table-hover' id='table-kelulusan' style="width:100%;">
                            <thead class="thead-dark">
                                <tr>
                                    <th>Cawangan</th>
                                    <th>No Kad Pengenalan</th>
                                    <th>Nama Anggota</th>
                                    <th>Status</th>
                                    <th>Tarikh/Masa</th>
                                    <th>Tindakan</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($arraykelulusan as $index => $k)
                                    @foreach ($k['kelulusanall'] as $indexapp => $approval)
                                        @php
                                            $status = strtolower($approval['status'] ?? '');
                                            $statusLabel = $approval['status'] ?? '—';

                                            // Gunakan strpos() supaya compatible dengan PHP 7.x juga
                                            if (
                                                strpos($status, 'lulus') !== false ||
                                                strpos($status, 'diluluskan') !== false ||
                                                strpos($status, 'selesai') !== false
                                            ) {
                                                $statusStyle = 'background-color:#7ee4b8; color:white;';
                                            } elseif (
                                                strpos($status, 'tolak') !== false ||
                                                strpos($status, 'batal') !== false
                                            ) {
                                                $statusStyle = 'background-color:#f58c8c; color:white;';
                                            } elseif (
                                                strpos($status, 'menunggu') !== false ||
                                                strpos($status, 'pending') !== false
                                            ) {
                                                $statusStyle = 'background-color:#ffd166; color:#333;';
                                            } else {
                                                $statusStyle = 'background-color:#d1d5db; color:#333;';
                                            }
                                        @endphp

                                        <tr>
                                            <td>{{ $k['cawangan'] }}</td>
                                            <td>{{ $approval['nokp'] }}</td>
                                            <td>{{ $approval['nama'] ?? '-' }}</td>
                                            <td>
                                                <span class="px-3 py-2 d-inline-block text-center fw-bold"
                                                    style="{{ $statusStyle }} border-radius:8px; min-width:130px; display:inline-block;">
                                                    {{ $statusLabel }}
                                                </span>
                                            </td>
                                            <td>{{ \Carbon\Carbon::parse($approval['created_at'])->timezone('Asia/Kuala_Lumpur')->format('d/m/Y h:i A') }}
                                            </td>
                                            <td>
                                                <!-- ✅ Lulus -->
                                                <button class="btn btn-success btn-sm me-2"
                                                    onclick="updatelulusAnggota(this)" data-nokp="{{ $approval['nokp'] }}"
                                                    data-kodcaw="{{ $k['cawangankod'] }}" data-taglulus="Y"
                                                    title="Lulus Anggota">
                                                    <i class="fas fa-thumbs-up"></i>
                                                </button>

                                                <!-- ❌ Batal / Tolak -->
                                                <button class="btn btn-danger btn-sm" onclick="updatelulusAnggota(this)"
                                                    data-nokp="{{ $approval['nokp'] }}"
                                                    data-kodcaw="{{ $k['cawangankod'] }}" data-taglulus="N"
                                                    title="Batal / Tolak Kelulusan">
                                                    <i class="fas fa-thumbs-down"></i>
                                                </button>
                                            </td>
                                        </tr>
                                    @endforeach
                                @endforeach
                            </tbody>
                        </table>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        var tablekelulusan = $('#table-kelulusan').DataTable({
            "scrollX": true
        });

        let api = "{{ config('api.url') }}";

        const formatter = new Intl.NumberFormat('en-US', {
            minimumFractionDigits: 2
        });

        var audio = new Audio("{{ asset('sound/3.wav') }}");

        if (tablekelulusan.data().any()) {
            audio.play();
            audio.addEventListener('ended', function() {
                this.currentTime = 0;
                this.play();
            }, false);
        } else {
            audio.loop = false;
            audio.muted = true;
        }


        $('#kelulusanmodal').on('show.bs.modal', function(event) {
            let button = $(event.relatedTarget);
            let norujukan = $(button).data('norujukan');
            let kodcaw = $(button).data('kodcawangan');

            $.ajax({
                method: 'GET',
                url: api + '/api/gadai/norujukan/' + norujukan,
                dataType: 'json',
                success: function(datagadaiwithnorujukan) {

                    let nokp = datagadaiwithnorujukan[0][0].nokp;

                    $.ajax({
                        method: 'GET',
                        url: api + '/api/customers/' + nokp,
                        dataType: 'json',
                        success: function(datagadaiwithnokp) {

                            let nama = datagadaiwithnokp.nama;

                            $('#namalanjut').text(nama);
                            $('#nokplanjut').text(nokp);

                            $.ajax({
                                method: 'GET',
                                url: api + '/api/gadai/customers/' + nokp +
                                    '/outstandingsemasa/' + kodcaw,
                                dataType: 'json',
                                success: function(outstandingsemasa) {

                                    $('#pinjterkumpul').text('RM' + formatter
                                        .format(outstandingsemasa));

                                },
                                error: function(xhr, status, error) {
                                    var err = eval("(" + xhr.responseText +
                                        ")");
                                    alert(xhr.responseText);
                                }
                            });


                        }
                    });

                    $.ajax({
                        method: 'GET',
                        url: api + '/api/customers/' + nokp + '/gadai/belum_tebus',
                        dataType: 'json',
                        success: function(data) {
                            let bilanganaktif = 0;
                            if (data == null) {
                                bilanganaktif = 0;
                            } else {
                                bilanganaktif = data[0].length;
                            }

                            $('#bilaktif').text(bilanganaktif);


                        }
                    });


                    $.ajax({
                        method: 'GET',
                        url: api + '/api/customers/' + nokp + '/gadai/lelong',
                        dataType: 'json',
                        success: function(data) {

                            let bilanganlelong = 0;

                            if (data == null) {
                                bilanganlelong = 0;
                            } else {
                                bilanganlelong = data.length;
                            }


                            $('#billelong').text(bilanganlelong);
                        }
                    });


                }
            });

        });

        async function updatelulus(e) {
            console.log(e);
            return;

            const {
                value: katalaluan
            } = await Swal.fire({
                title: 'Masukkan Katalaluan Semula',
                input: 'password',
                inputPlaceholder: 'Katalaluan',
                confirmButtonText: 'Hantar',
                showCancelButton: true,
                cancelButtonText: 'Batal',
                allowOutsideClick: true
            })

            let dataminta = '';

            $.ajax({
                method: 'get',
                url: "{{ route('operasi.getmintasemulakelulusan') }}",
                async: false,
                data: {
                    passsemula: katalaluan
                },
                success: function(data) {
                    if (data == "False") {
                        dataminta = data;
                    }
                }
            });

            if (dataminta == 'False') {
                Swal.fire({
                    icon: 'error',
                    title: 'Pengesahan Katalaluan Tidak Berjaya'
                })
                event.preventDefault();
                return false;
            }

            // var { value: komenkelulusan } = await Swal.fire({
            //     title: 'Masukkan Komen!',
            //     input: 'radio',
            //     customClass: {
            //         input: 'custom-radio'
            //     },
            //     inputOptions: {
            //         'Pelanggan Baru': 'Pelanggan Baru',
            //         'Pelanggan Tetap': 'Pelanggan Tetap',
            //         'Rekod Gadaian Baik': 'Rekod Gadaian Baik',
            //         'Lain2': 'Lain-Lain'
            //     },
            //     confirmButtonText: 'Hantar',
            //     showCancelButton:false,
            //     allowOutsideClick: false
            // })

            // if(komenkelulusan === 'Lain2')
            // {
            //     var { value: komenkelulusan } = await Swal.fire({
            //     title: 'Masukkan Komen!',
            //     input: 'text',
            //     inputPlaceholder: 'Komen',
            //     confirmButtonText: 'Hantar',
            //     showCancelButton:false,
            //     allowOutsideClick: false
            //     });
            // }

            const {
                value: komenkelulusan
            } = await Swal.fire({
                title: 'Masukkan Komen!',
                input: 'text',
                inputPlaceholder: 'Komen',
                confirmButtonText: 'Hantar',
                showCancelButton: false,
                allowOutsideClick: false
            })

            let norujukan = $(e).data('norujukan');
            let cawangankod = $(e).data('kodcaw');
            let siri = $(e).data('siri');
            let namaoperasi = "{{ Auth::user()->name }}";
            let teller = $(e).closest('tr').children('td:eq(2)').text();
            let taglulus = $(e).data('taglulus');

            teller = String(teller);

            $.ajax({
                method: 'put',
                url: "{{ route('operasi.updatekelulusan') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    "taglulus": taglulus,
                    "norujukan": norujukan,
                    "kodcaw": cawangankod,
                    "komenkelulusan": komenkelulusan,
                    "siri": siri,
                    'namaoperasi': namaoperasi,
                    'teller': teller
                },
                success: function(data) {
                    console.log(data);
                    Swal.fire({
                        icon: 'success',
                        title: 'Pengesahan Berjaya'
                    }).then(function() {
                        location.reload();
                    });

                },
                error: function(xhr, status, error) {
                    var err = eval("(" + xhr.responseText + ")");
                    alert(xhr.responseText);
                }
            });

        }

        async function updatelulusAnggota(e) {

            // 1️⃣ Semak katalaluan semula
            const {
                value: katalaluan
            } = await Swal.fire({
                title: 'Masukkan Katalaluan Semula',
                input: 'password',
                inputPlaceholder: 'Katalaluan',
                confirmButtonText: 'Hantar',
                showCancelButton: true,
                cancelButtonText: 'Batal',
                allowOutsideClick: true
            });

            if (!katalaluan) return;

            let sah = true;
            await $.ajax({
                method: 'get',
                url: "{{ route('operasi.getmintasemulakelulusan') }}",
                async: false,
                data: {
                    passsemula: katalaluan
                },
                success: function(data) {
                    if (data == "False") sah = false;
                }
            });

            if (!sah) {
                Swal.fire({
                    icon: 'error',
                    title: 'Pengesahan Katalaluan Tidak Berjaya'
                });
                return false;
            }

            // 2️⃣ Dapatkan komen kelulusan
            const {
                value: komenkelulusan
            } = await Swal.fire({
                title: 'Masukkan Komen Kelulusan',
                input: 'text',
                inputPlaceholder: 'Contoh: Anggota layak diluluskan',
                confirmButtonText: 'Hantar',
                showCancelButton: false,
                allowOutsideClick: false
            });

            // 3️⃣ Ambil data daripada butang / row
            let nokp = $(e).data('nokp'); // data-nokp perlu ada dalam butang
            let kodcaw = $(e).data('kodcaw');
            let siri = $(e).data('siri');
            let taglulus = $(e).data('taglulus');
            let namaoperasi = "{{ Auth::user()->name }}";

            // 4️⃣ Hantar ke backend (route khas kelulusan anggota)
            $.ajax({
                method: 'put',
                url: "{{ route('operasi.updatekelulusananggota') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    "nokp": nokp,
                    "kodcaw": kodcaw,
                    "siri": siri,
                    "taglulus": taglulus,
                    "komenkelulusan": komenkelulusan,
                    "namaoperasi": namaoperasi
                },
                success: function(data) {
                    Swal.fire({
                        icon: 'success',
                        title: 'Kelulusan Anggota Berjaya'
                    }).then(function() {
                        location.reload();
                    });
                },
                error: function(xhr, status, error) {
                    alert("Ralat: " + xhr.responseText);
                }
            });
        }


        async function updatebatal(e) {
            const {
                value: katalaluan
            } = await Swal.fire({
                title: 'Masukkan Katalaluan Semula',
                input: 'password',
                inputPlaceholder: 'Katalaluan',
                confirmButtonText: 'Hantar',
                showCancelButton: true,
                cancelButtonText: 'Batal',
                allowOutsideClick: true
            })

            let dataminta = '';

            $.ajax({
                method: 'get',
                url: "{{ route('operasi.getmintasemulakelulusan') }}",
                async: false,
                data: {
                    passsemula: katalaluan
                },
                success: function(data) {
                    if (data == "False") {
                        dataminta = data;
                    }
                }
            });

            if (dataminta == 'False') {
                Swal.fire({
                    icon: 'error',
                    title: 'Pengesahan Katalaluan Tidak Berjaya'
                })
                event.preventDefault();
                return false;
            }

            const {
                value: komenkelulusan
            } = await Swal.fire({
                title: 'Masukkan Komen',
                input: 'text',
                inputPlaceholder: 'Komen',
                confirmButtonText: 'Hantar',
                showCancelButton: false,
                allowOutsideClick: false
            })

            let norujukan = $(e).data('norujukan');
            let siri = $(e).data('siri');
            let cawangankod = $(e).data('kodcaw');
            let namaoperasi = "{{ Auth::user()->name }}";
            let teller = $(e).closest('tr').children('td:eq(2)').text();

            teller = String(teller);

            $.ajax({
                method: 'put',
                url: "{{ route('operasi.updatekelulusan') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    "norujukan": norujukan,
                    "siri": siri,
                    "kodcaw": cawangankod,
                    "komenkelulusan": komenkelulusan,
                    "pembatalan": "batal",
                    'namaoperasi': namaoperasi,
                    'teller': teller
                },
                success: function(data) {
                    Swal.fire({
                        icon: 'success',
                        title: 'Pengesahan Berjaya'
                    }).then(function() {
                        location.reload();

                    });

                },
                error: function(xhr, status, error) {
                    var err = eval("(" + xhr.responseText + ")");
                    alert(xhr.responseText);
                }
            });
        }
    </script>
@endsection