@extends('backend.app')

@section('title', 'Category Page')

@push('style')
@endpush

@section('content')
    <main class="app-content content">
        <div class="row">
            <div class="col-lg-12 mb-1">
                <div class="card">
                    <div class="card-header">
                        <h4 class="m-0">Payout Requests</h4>
                    </div>
                    <div class="card-body">
                        <table id="data-table" class="table dt-responsive nowrap w-100">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>Transition ID</th>
                                    <th>Owner Information</th>
                                    <th>Amount</th>
                                    <th>Requested Date Time</th>
                                    {{-- <th>Status</th> --}}
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection

@push('script')
    <script src="{{ asset('backend/assets/datatable/js/datatables.min.js') }}"></script>

    {{-- Data Table --}}
    <script>
        $(document).ready(function() {
            $.ajaxSetup({
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                }
            });

            if (!$.fn.DataTable.isDataTable('#data-table')) {
                $('#data-table').DataTable({
                    processing: true,
                    serverSide: true,
                    ajax: "{{ route('owner.payout.index') }}",
                    columns: [{
                            data: 'DT_RowIndex',
                            name: 'DT_RowIndex',
                            orderable: false,
                            searchable: false
                        },
                        {
                            data: 'transaction_id',
                            name: 'transaction_id'
                        },
                        {
                            data: 'owner_info',
                            name: 'owner_info',
                            orderable: false,
                            searchable: false
                        },
                        {
                            data: 'amount',
                            name: 'amount'
                        },
                        {
                            data: 'requested_at',
                            name: 'requested_at'
                        },
                        // {
                        //     data: 'status',
                        //     name: 'status',
                        //     orderable: false,
                        //     searchable: false
                        // },
                        {
                            data: 'action',
                            name: 'action',
                            orderable: false,
                            searchable: false
                        },
                    ]
                });
            }
        });
    </script>

    <script>
        $(document).ready(function() {

            // PAY NOW (with password)
            $(document).on('click', '.pay-now-btn', function(e) {
                e.preventDefault();

                let payUrl = $(this).data('url');
                let payoutId = $(this).data('id');

                Swal.fire({
                    title: 'Enter your password',
                    input: 'password',
                    inputLabel: 'Password',
                    inputPlaceholder: 'Enter your admin password to confirm payout',
                    inputAttributes: {
                        maxlength: 20,
                        autocapitalize: 'off',
                        autocorrect: 'off'
                    },
                    showCancelButton: true,
                    confirmButtonText: 'Confirm Payment',
                    preConfirm: (password) => {
                        if (!password) {
                            Swal.showValidationMessage('Password is required');
                        }
                        return password;
                    }
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: payUrl,
                            type: 'POST',
                            data: {
                                _token: '{{ csrf_token() }}',
                                password: result.value,
                                id: payoutId
                            },
                            beforeSend: function() {
                                Swal.fire({
                                    title: 'Processing...',
                                    text: 'Please wait while we process the payout.',
                                    allowOutsideClick: false,
                                    didOpen: () => {
                                        Swal.showLoading();
                                    }
                                });
                            },
                            success: function(res) {
                                Swal.fire({
                                    icon: 'success',
                                    title: 'Success!',
                                    text: res.message ||
                                        'Payout processed successfully!'
                                }).then(() => {
                                    window.location.reload();
                                });
                            },
                            error: function(xhr) {
                                let msg = xhr.responseJSON?.message ||
                                    'Invalid password or something went wrong.';
                                Swal.fire('Error', msg, 'error');
                            }
                        });
                    }
                });
            });

            // CANCEL REQUEST (with authorization)
            $(document).on('click', '.cancel-request-btn', function(e) {
                e.preventDefault();
                let url = $(this).data('url');

                Swal.fire({
                    title: 'Are you sure?',
                    text: "This payout request will be cancelled!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#6c757d',
                    confirmButtonText: 'Yes, Cancel It'
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: url,
                            type: 'POST',
                            data: {
                                _token: '{{ csrf_token() }}'
                            },
                            success: function(res) {
                                Swal.fire('Success', res.message, 'success').then(() => {
                                    window.location.reload();
                                });
                            },
                            error: function(xhr) {
                                let msg = xhr.responseJSON?.message || 'Something went wrong';
                                Swal.fire('Error', msg, 'error');
                            }
                        });
                    }
                });
            });

        });
    </script>
@endpush