@extends('layouts/base_view')
@section('title'){!! $variables['header_routes'] !!}@endsection
@section('content')
<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">
                            <i class="fas fa-mobile-alt"></i> Monitoring Digital Product
                        </h3>
                        <div class="card-tools">
                            <a href="{{ route('reward-fulfillments.index') }}" class="btn btn-outline-secondary btn-sm">
                                <i class="fas fa-arrow-left"></i> Kembali ke List
                            </a>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="row mb-3">
                            <div class="col-md-2">
                                <select id="f-status" class="form-control form-control-sm">
                                    <option value="">Semua Status</option>
                                    <option value="pending">Pending</option>
                                    <option value="processing">Diproses</option>
                                    <option value="delivered">Terkirim</option>
                                    <option value="failed">Gagal</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select id="f-provider-status" class="form-control form-control-sm">
                                    <option value="">Semua Provider Status</option>
                                    <option value="00">Success (RC: 00)</option>
                                    <option value="68">Pending (RC: 68)</option>
                                    <option value="failed">Failed (RC: Lainnya)</option>
                                    <option value="not_sent">Belum Dikirim</option>
                                </select>
                            </div>
                            <div class="col-md-2">
                                <select id="f-operator" class="form-control form-control-sm">
                                    <option value="">Semua Operator</option>
                                    @foreach($operators as $op)
                                        <option value="{{ $op->operator_code }}">{{ $op->operator_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-auto ml-auto">
                                <button class="btn btn-danger btn-sm" id="btn-bulk-retry" disabled>
                                    <i class="fas fa-redo"></i> Kirim Ulang Terpilih (<span id="selected-count">0</span>)
                                </button>
                            </div>
                        </div>

                        <div class="alert alert-info">
                            <i class="fas fa-info-circle"></i> 
                            <strong>Info:</strong> Halaman ini menampilkan hanya transaksi digital (pulsa, paket data). 
                            Anda dapat mengirim ulang transaksi yang gagal secara satuan atau sekaligus dengan mencentang checkbox.
                        </div>

                        <table id="id_data_table" class="table table-bordered table-striped table-sm">
                            <thead>
                                <tr>
                                    <th width="30">
                                        <input type="checkbox" id="select-all" title="Pilih semua yang gagal">
                                    </th>
                                    <th>#</th>
                                    <th>End User</th>
                                    <th>Reward Item</th>
                                    <th>Operator</th>
                                    <th>Product Code</th>
                                    <th>Status</th>
                                    <th>Provider RC</th>
                                    <th>Provider Message</th>
                                    <th>Provider Request ID</th>
                                    <th>Provider Transaction ID</th>
                                    <th>Provider Sent At</th>
                                    <th>Provider Completed At</th>
                                    <th>Dibuat</th>
                                    <th width="100">Aksi</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<script>
$(function() {
    var table = $('#id_data_table').DataTable({
        processing: true, 
        serverSide: true,
        ajax: {
            url: '{{ route("reward-fulfillments.digital-monitoring") }}',
            data: function(d) {
                d.status = $('#f-status').val();
                d.provider_status = $('#f-provider-status').val();
                d.operator_code = $('#f-operator').val();
            }
        },
        columns: [
            {data: 'checkbox', name: 'checkbox', orderable: false, searchable: false, className: 'text-center'},
            {data: 'no', name: 'no', orderable: false, searchable: false},
            {data: 'end_user', name: 'end_user', orderable: false},
            {data: 'reward_item', name: 'reward_item'},
            {data: 'operator_code', name: 'operator_code', orderable: false},
            {data: 'product_code', name: 'product_code', orderable: false},
            {data: 'status', name: 'status', orderable: false},
            {data: 'provider_rc', name: 'provider_rc', orderable: false},
            {data: 'provider_message', name: 'provider_message', orderable: false},
            {data: 'provider_request_id', name: 'provider_request_id', orderable: false},
            {data: 'provider_transaction_id', name: 'provider_transaction_id', orderable: false},
            {data: 'provider_sent_at', name: 'provider_sent_at'},
            {data: 'provider_completed_at', name: 'provider_completed_at'},
            {data: 'created_at', name: 'created_at'},
            {data: 'actions', name: 'actions', orderable: false, searchable: false, className: 'text-center'},
        ],
        responsive: true,
        lengthChange: true,
        autoWidth: false,
        pageLength: 25,
        order: [[13, 'desc']], // Sort by created date
        drawCallback: function() {
            updateSelectedCount();
        }
    });

    // Filter change
    $('#f-status, #f-provider-status, #f-operator').change(function(){ 
        table.draw(); 
    });

    // Select all checkbox
    $('#select-all').on('change', function() {
        var checked = $(this).prop('checked');
        $('.select-item').prop('checked', checked);
        updateSelectedCount();
    });

    // Individual checkbox
    $(document).on('change', '.select-item', function() {
        updateSelectedCount();
        
        // Update select-all state
        var total = $('.select-item').length;
        var checked = $('.select-item:checked').length;
        $('#select-all').prop('checked', total > 0 && total === checked);
    });

    // Update selected count
    function updateSelectedCount() {
        var count = $('.select-item:checked').length;
        $('#selected-count').text(count);
        $('#btn-bulk-retry').prop('disabled', count === 0);
    }

    // Bulk retry
    $('#btn-bulk-retry').on('click', function() {
        var ids = [];
        $('.select-item:checked').each(function() {
            ids.push($(this).val());
        });

        if (ids.length === 0) {
            Swal.fire({ icon: 'warning', text: 'Pilih minimal 1 transaksi yang gagal.' });
            return;
        }

        Swal.fire({
            title: 'Kirim Ulang ' + ids.length + ' Transaksi?',
            text: 'Transaksi yang dipilih akan dikirim ulang ke provider voucher.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, Kirim Ulang',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#dc3545',
        }).then((result) => {
            if (result.isConfirmed) {
                $('#loaderaditdinda').show();
                $.ajax({
                    url: '{{ route("reward-fulfillments.bulk-retry-digital") }}',
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}',
                        ids: ids
                    },
                    success: function(res) {
                        $('#loaderaditdinda').hide();
                        if (res.success) {
                            var msg = res.message;
                            if (res.errors && res.errors.length) {
                                msg += '<br><br><small class="text-muted">' + res.errors.join('<br>') + '</small>';
                            }
                            Swal.fire({ 
                                icon: 'success', 
                                title: 'Selesai',
                                html: msg,
                                confirmButtonText: 'OK'
                            }).then(() => {
                                table.draw();
                                $('#select-all').prop('checked', false);
                                updateSelectedCount();
                            });
                        } else {
                            Swal.fire({ icon: 'error', text: res.message });
                        }
                    },
                    error: function() {
                        $('#loaderaditdinda').hide();
                        Swal.fire({ icon: 'error', text: 'Terjadi kesalahan saat mengirim ulang.' });
                    }
                });
            }
        });
    });

    // Single check status
    $(document).on('click', '.btn-check-status', function() {
        var id = $(this).data('id');
        
        Swal.fire({
            title: 'Cek Status Provider',
            text: 'Mengecek status transaksi di provider...',
            icon: 'info',
            showConfirmButton: false,
            allowOutsideClick: false,
        });
        
        $.ajax({
            url: '/reward-fulfillments/' + id + '/check-provider-status',
            method: 'POST',
            data: { _token: '{{ csrf_token() }}' },
            success: function(res) {
                if (res.success) {
                    Swal.fire({ 
                        icon: 'success', 
                        title: 'Status Diperbarui',
                        html: res.message,
                        confirmButtonText: 'OK'
                    }).then(() => table.draw());
                } else {
                    Swal.fire({ icon: 'error', title: 'Gagal', text: res.message });
                }
            },
            error: function() {
                Swal.fire({ icon: 'error', text: 'Terjadi kesalahan saat mengecek status.' });
            }
        });
    });

    // Single retry
    $(document).on('click', '.btn-retry', function() {
        var id = $(this).data('id');
        
        Swal.fire({
            title: 'Kirim Ulang ke Provider?',
            text: 'Transaksi akan dikirim ulang ke provider voucher.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, Kirim Ulang',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#dc3545',
        }).then((result) => {
            if (result.isConfirmed) {
                Swal.fire({
                    title: 'Mengirim...',
                    text: 'Mengirim ulang transaksi ke provider...',
                    icon: 'info',
                    showConfirmButton: false,
                    allowOutsideClick: false,
                });
                
                $.ajax({
                    url: '/reward-fulfillments/' + id + '/retry-provider',
                    method: 'POST',
                    data: { _token: '{{ csrf_token() }}' },
                    success: function(res) {
                        if (res.success) {
                            Swal.fire({ 
                                icon: 'success', 
                                title: 'Berhasil Dikirim',
                                html: res.message,
                                confirmButtonText: 'OK'
                            }).then(() => table.draw());
                        } else {
                            Swal.fire({ icon: 'error', title: 'Gagal', text: res.message });
                        }
                    },
                    error: function() {
                        Swal.fire({ icon: 'error', text: 'Terjadi kesalahan saat mengirim ulang.' });
                    }
                });
            }
        });
    });

    // Cancel fulfillment
    $(document).on('click', '.btn-cancel', function() {
        var id = $(this).data('id');
        
        Swal.fire({
            title: 'Batalkan Reward?',
            text: 'Reward yang dibatalkan tidak bisa dikirim lagi ke provider.',
            icon: 'warning',
            input: 'textarea',
            inputPlaceholder: 'Alasan pembatalan (opsional)',
            showCancelButton: true,
            confirmButtonText: 'Ya, Batalkan',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#6c757d',
        }).then((result) => {
            if (result.isConfirmed) {
                Swal.fire({
                    title: 'Membatalkan...',
                    text: 'Membatalkan reward...',
                    icon: 'info',
                    showConfirmButton: false,
                    allowOutsideClick: false,
                });
                
                $.ajax({
                    url: '/reward-fulfillments/' + id + '/cancel',
                    method: 'POST',
                    data: { 
                        _token: '{{ csrf_token() }}',
                        reason: result.value || 'Dibatalkan oleh admin'
                    },
                    success: function(res) {
                        if (res.success) {
                            Swal.fire({ 
                                icon: 'success', 
                                title: 'Berhasil Dibatalkan',
                                text: res.message,
                                confirmButtonText: 'OK'
                            }).then(() => table.draw());
                        } else {
                            Swal.fire({ icon: 'error', title: 'Gagal', text: res.message });
                        }
                    },
                    error: function() {
                        Swal.fire({ icon: 'error', text: 'Terjadi kesalahan saat membatalkan reward.' });
                    }
                });
            }
        });
    });
});
</script>
@endsection