@extends("agentportal.layouts.layout")

@section("title", trans('message_lang.LBL_EXTERNAL_SEND_MONEY_TXNS'))

@section("page_style")
    <link rel="stylesheet" type="text/css" href="{{ url('dist/assets/plugins/custom/datatables/datatables.bundle.css') }}">
    <link href="{{ url('css/select2.min.css') }}" rel="stylesheet" type="text/css"/>
    <style type="text/css">
        .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
            background-color: #00FFFF;
        }
    </style>
@endsection

<div id="loading"  style="display:none;">
    <div id="image-loader">
        <img  src="{{ url('img/loading.gif')}}" alt="Loading..." />
    </div>
</div>

@section("content")
<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
    <!--begin::Subheader-->
    <!-- <div class="subheader py-2 py-lg-4 subheader-solid" id="kt_subheader">
    </div> -->
    <!--end::Subheader-->
    <!--begin::Entry-->
    <div class="d-flex flex-column-fluid">
        <!--begin::Container-->
        <div class="container">
            <!--begin::Card-->
            <div class="card card-custom">
                <div class="card-header">
                    <div class="card-title">
                        <h3 class="card-label">{{ trans('message_lang.LBL_EXTERNAL_SEND_MONEY_TXNS') }}</h3>
                    </div>
                </div>
                <div class="card-body">
                            <form class="" action="{{ route('agentportal.external-send-money-transactions.list') }}" method="post" name="form" id="filterForm">
                                @csrf
                                <input type="hidden" name="page" id="page" value="1">
                                <div class="form-group row justify-content-end">
                                    <div class="col-md-3">
                                        <button type="submit" name="export" class="btn btn-primary font-weight-bolder float-right">{!! trans("message_lang.LBL_EXPORT_TO_CSV") !!}</button>
                                    </div>
                                </div>
                                <div class="form-group row justify-content-md-start">
                                    <div class="col-md-3">
                                        <label class="" for="search_field">{!! trans("message_lang.LBL_SEARCH_FIELD") !!} <span style="color:red;"></span></label>
                                        <select name="search_field" id="search_field" class="form-control custom-field">
                                            <option value="">{!! trans("message_lang.PLACEHOLDER_SELECT") !!}</option>
                                            <option value="reference_no" {{ $request->has('search_field') && $request->search_field == "reference_no" ? 'selected' : '' }}>Reference</option>
                                        </select>
                                    </div>
                                    <div class="col-md-3">
                                        <label class="" for="search_key">{!! trans("message_lang.LBL_SEARCH_KEY") !!} <span style="color:red;"></span></label>
                                        <input type="text" name="search_key" class="form-control custom-field" value="{!! $request->has('search_key') ? $request->search_key : "" !!}">
                                    </div>
                                    <div class="col-md-3">
                                        <label for="receiving_option">{{ __('message_lang.LBL_DELIVERY_METHOD') }}</label>
                                        <select class="form-control mx-sm-0" name="receiving_option" id="receiving_option" >
                                            <option value="">{{ __('message_lang.LBL_SELECT_DELIVERY_METHOD') }}</option>
                                            @if(isset($receivingOptionList))
                                                @foreach ($receivingOptionList as $value)
                                                    <option value="{{ $value->receiving_option_code }}" {{ $request->has('receiving_option') && $request->receiving_option == $value->receiving_option_code ? 'selected' : '' }}>{{ $value->receiving_option }}</option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row justify-content-md-start">
                                    <div class="col-md-3">
                                        <label class="" for="sender_country_id">{!! trans("message_lang.LBL_SENDING_COUNTRY") !!}<span style="color:red;"></span></label>
                                        <select name="sender_country_code" id="sender_country_id" class="form-control custom-field">
                                            <option value="">{!! trans("message_lang.PLACEHOLDER_SELECT_COUNTRY") !!}</option>
                                            @if(isset($senderCountries))
                                                @foreach ($senderCountries as $key => $country)
                                                <option value="{{ $country->country_code }}" {{ $request->has('sender_country_code') && $request->sender_country_code == $country->country_code ? 'selected' : '' }} >{{ $country->country_name }}</option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3">
                                        <label class="" for="receiver_country_id">{!! trans("message_lang.LBL_RECEIVING_COUNTRY") !!} <span style="color:red;"></span></label><br/>
                                        <select name="receiver_country_code" id="receiver_country_id" class="form-control custom-field">
                                            <option value="">{!! trans("message_lang.PLACEHOLDER_SELECT_COUNTRY") !!}</option>
                                            @if(isset($receiverCountries))
                                                @foreach ($receiverCountries as $key => $country)
                                                <option value="{{ $country->country_code }}" {{ $request->has('receiver_country_code') && $request->receiver_country_code == $country->country_code ? 'selected' : '' }}>{{ $country->country_name }}</option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    <div class="col-md-3">
                                        <label for="status">{{ trans('message_lang.LBL_TXN_STATUS') }}</label>
                                        <select class="form-control mx-sm-0" name="status[]" id="status" multiple="multiple">
                                            <option value="">{{ trans('message_lang.LBL_ALL') }}</option>
                                            @foreach($smtxnStatus as $key => $value)
                                                <option value="{{ $value }}" {{ $request->has('status') && in_array($value, $request->status) ? 'selected' : '' }}>{{ $txnstatuses[$key] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-3">
                                        <label for="status">{{ trans('message_lang.LBL_PARTNER_TXN_STATUS') }}</label>
                                        <select class="form-control mx-sm-0" name="partner_txn_status[]" id="partner_txn_status" multiple="multiple">
                                            <option value="">{{ trans('message_lang.LBL_ALL') }}</option>
                                            @foreach($smtxnStatus as $key => $value)
                                                <option value="{{ $value }}" {{ $request->has('partner_txn_status') && in_array($value, $request->partner_txn_status) ? 'selected' : '' }}>{{ $txnstatuses[$key] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group row justify-content-md-left">
                                    <div class="col-md-3">
                                        <label for="partner_id">{{ __('message_lang.LBL_PARTNERS') }}</label>
                                        <select class="form-control mx-sm-0" name="partner_id" id="partner_id" >
                                            <option value="">{{ __('message_lang.LBL_SELECT_PARTNER') }}</option>
                                            @if(isset($partners))
                                                @foreach ($partners as $value)
                                                    <option value="{{ $value->partner_id }}" {{ $request->has('partner_id') && $request->partner_id == $value->partner_id ? 'selected' : '' }}>{{ $value->name }}</option>
                                                @endforeach
                                            @endif
                                        </select>
                                    </div>
                                    @include('agentportal.layouts.date_filter_v1')
                                </div>
                                <div class="form-group row justify-content-md-center">
                                    <button type="submit" class="btn btn-primary" id="apply-filter-paid" data-count="0">{!! trans("message_lang.BTN_SEARCH") !!}</button>

                                    <div class="subheader-separator subheader-separator-ver mt-2 mb-2 mr-4 bg-gray-200"></div>

                                    <a href="{!! route('agentportal.external-send-money-transactions.list') !!}" class="btn btn-secondary" id="apply-filter-clear-paid">{!! trans("message_lang.BTN_CLEAR_SEARCH") !!}</a>
                                </div>
                                @if($transactions)
                                    <div class="perPage">
                                        <label>
                                            <div class="show">{!! trans('message_lang.DATATABLE_LBL_SHOW') !!}</div>
                                            <select name="per_page" id="perPage" class="custom-select custom-select-sm form-control form-control-sm">
                                                <option value="10" {!! $request->has('per_page') && $request->per_page == "10" ? 'selected' : '' !!} {!! !$request->has('per_page') ? 'selected' : '' !!}>10</option>
                                                <option value="50" {!! $request->has('per_page') && $request->per_page == "50" ? 'selected' : '' !!} {!! !$request->has('per_page') ? 'selected' : '' !!}>50</option>
                                                <option value="100" {!! $request->has('per_page') && $request->per_page == "100" ? 'selected' : '' !!}>100</option>
                                                <option value="{!! $transactions->total() !!}" {!! $request->has('per_page') && $request->per_page == $transactions->total() ? 'selected' : '' !!}>All</option>
                                            </select>
                                            <div class="entries">{!! trans('message_lang.DATATABLE_LBL_ENTRIES') !!}</div>
                                        </label>
                                    </div>
                                @endif
                        </form>

                        <div id="bulk-actions-container" style="display: none;" class="mb-4">
                            <div class="d-flex justify-content-between align-items-center bg-light p-4 rounded">
                                <span class="text-gray-700"><span id="selected-count">0</span> {{ trans('message_lang.LBL_ITEMS_SELECTED') }}</span>
                                <a href="#" id="bulk-action-button" class="btn btn-primary">{{ trans('message_lang.LBL_REINITIATE_SELECTED_TRANSACTIONS') }}</a>
                            </div>
                        </div>

                        <!--begin: Datatable-->
                            <table id="datatable" class="table table-responsive table-bordered grid-table nowrap">
                            <thead>
                                <tr>
                                    <th>
                                        #
                                    </th>
                                    @hasanyrole('administrator')
                                        <th><input type="checkbox" id="select-all-checkbox"></th>
                                    @endhasanyrole
                                    <th>{{ trans('message_lang.LBL_REF_NO') }}</th>
                                    <th>{{ trans('message_lang.LBL_SENDER') }}</th>
                                    <th>{{ trans('message_lang.LBL_COUNTRY') }}</th>
                                    <th>{{ trans('message_lang.LBL_AMOUNT') }}</th>
                                    <th>{{ trans('message_lang.LBL_TXN_STATUS') }}</th>
                                    <th>{{ trans('message_lang.LBL_PARTNER_TXN_STATUS') }}</th>
                                    <th>{{ trans('message_lang.LBL_BENEFICIARY_NAME') }}</th>
                                    <th>{{ trans('message_lang.LBL_BNB_PARTNER_NAME')}}
                                    <th>{{ trans('message_lang.LBL_RECEIVING_OPTION') }}</th>
                                    <th>{{ trans('message_lang.LBL_DATE') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($transactions as $key => $transaction)
                                    <tr>
                                        <td>
                                            {!! $key + 1 !!}
                                        </td>
                                        @hasanyrole('administrator')
                                            <td>
                                                @if ($transaction->partner_txn_status == $smtxnStatus['CS_PROCESSING'])
                                                    <input type="checkbox" name="" id="">
                                                @endif
                                            </td>
                                        @endhasanyrole
                                        <td><a href="{!! route('agentportal.external-send-money-transactions.show', ['id' => base64_encode($transaction->id)]) !!}">{!! $transaction->reference_no !!}</a></td>
                                        <td>{!! $transaction->sender_first_name !!} {!! $transaction->sender_last_name !!}</td>
                                        <td>{!! $transaction->country_name !!} - {!! $transaction->receiving_country_name !!}</td>
                                        <td>{{ number_format($transaction->sending_amount, 2) . ' (' . $transaction->sending_currency . ') - ' . number_format($transaction->receiving_amount, 2) .' (' . $transaction->receiving_currency . ')' }}</td>
                                        <td>
                                            @if($transaction->status == $smtxnStatus['PENDING'])
                                                <span class="badge badge-secondary">
                                                    {{ trans('message_lang.STATUS_OPTION_PENDING') }}
                                                </span>
                                            @elseif($transaction->status == $smtxnStatus['IN_PROGRESS'])
                                                <span class="badge badge-secondary">
                                                    {{ trans('message_lang.STATUS_OPTION_INPROGRESS') }}
                                                </span>
                                            @elseif($transaction->status == $smtxnStatus['PAID'])
                                                <span class="badge badge-success">
                                                    {{ trans('message_lang.STATUS_OPTION_PAID') }}
                                                </span>
                                            @elseif($transaction->status == $smtxnStatus['CANCELLED'])
                                                <span class="badge badge-danger">
                                                    {{ trans('message_lang.STATUS_OPTION_CANCELLED') }}
                                                </span>
                                            @elseif($transaction->status == $smtxnStatus['FAILED'])
                                                <span class="badge badge-danger">
                                                    {{ trans('message_lang.STATUS_OPTION_FAILED') }}
                                                </span>
                                            @elseif($transaction->status == $smtxnStatus['CS_PROCESSING'])
                                                <span class="badge badge-warning">
                                                    {{ trans('message_lang.STATUS_OPTION_CS_PROCESSING') }}
                                                </span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($transaction->partner_txn_status == $smtxnStatus['PENDING'])
                                                <span class="badge badge-secondary">
                                                    {{ trans('message_lang.STATUS_OPTION_PENDING') }}
                                                </span>
                                            @elseif($transaction->partner_txn_status == $smtxnStatus['IN_PROGRESS'])
                                                <span class="badge badge-secondary">
                                                    {{ trans('message_lang.STATUS_OPTION_INPROGRESS') }}
                                                </span>
                                            @elseif($transaction->partner_txn_status == $smtxnStatus['PAID'])
                                                <span class="badge badge-success">
                                                    {{ trans('message_lang.STATUS_OPTION_PAID') }}
                                                </span>
                                            @elseif($transaction->partner_txn_status == $smtxnStatus['CANCELLED'])
                                                <span class="badge badge-danger">
                                                    {{ trans('message_lang.STATUS_OPTION_CANCELLED') }}
                                                </span>
                                            @elseif($transaction->partner_txn_status == $smtxnStatus['FAILED'])
                                                <span class="badge badge-danger">
                                                    {{ trans('message_lang.STATUS_OPTION_FAILED') }}
                                                </span>
                                            @elseif($transaction->partner_txn_status == $smtxnStatus['CS_PROCESSING'])
                                                <span class="badge badge-warning">
                                                    {{ trans('message_lang.STATUS_OPTION_CS_PROCESSING') }}
                                                </span>
                                            @endif
                                        </td>
                                        <td>{!! $transaction->receiver_first_name !!} {!! $transaction->receiver_middle_name !!} {!! $transaction->receiver_last_name !!}</td>
                                        <td>{!! $transaction->getApiPartner ? $transaction->getApiPartner->name : '-' !!}</td>
                                        <td>{!! $transaction->receiving_option_code !!}</td>
                                        <td>{!! format_date_tz($transaction->created_at) !!}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td valign="top" colspan="12" style="text-align: center">{!! trans('message_lang.DATATABLE_LBL_NO_DATA_AVAILABLE') !!}</td>
                                    </tr>
                                @endforelse
                            </tbody>
                            </table>
                            <!--end: Datatable-->
                        </div>
                        <div class="card-footer">
                            @if($transactions)
                            <div class="pagination">
                                <div class="left-info">
                                    <span>
                                        {!! trans('message_lang.DATATABLE_LBL_SHOWING_INFO') !!} {!! $transactions->firstItem() !!} {!! trans('message_lang.DATATABLE_LBL_TO') !!} {!! $transactions->lastItem() !!} {!! trans('message_lang.DATATABLE_LBL_OF') !!} {!! $transactions->total() !!} {!! trans('message_lang.DATATABLE_LBL_ENTRIES') !!}
                                    </span>
                                </div>
                                <div class="right-info">
                                    {!! $transactions->appends(request()->query())->links() !!}
                                </div>
                            </div>
                            @endif
                        </div>
            </div>
            <!--end::Card-->
        </div>
        <!--end::Container-->
    </div>
    <!--end::Entry-->
</div>
@endsection
@section("page_vendors")
    <script src="{{ url('js/select2.min.js') }}"></script>
@endsection

@section("page_script")
<script type="text/javascript">
    $(document).ready(function () {
        var d = new Date();
        var month = d.getMonth()+1;
        var day = d.getDate();

        var output = d.getFullYear() + '-' +
            ((''+month).length<2 ? '0' : '') + month + '-' +
            ((''+day).length<2 ? '0' : '') + day;

        $('#from_date').datepicker({
            "format": "{{ app()->getLocale() == "fr" ? 'dd-mm-yyyy' : 'yyyy-mm-dd' }}",
            "keyboardNavigation": false,
            "autoclose": true,
            "startDate": '-2y -1m',
            "endDate": new Date()
        });

        $('#from_date').datepicker({
            "format": "{{ app()->getLocale() == "fr" ? 'dd-mm-yyyy' : 'yyyy-mm-dd' }}",
            "keyboardNavigation": false,
            "autoclose": true,
        }).on('change', function(e){
            $("#hdn_from_date").val($(this).val());
            var date = new Date($("#from_date").val());
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();
            var minDate = new Date(y, m, d + 31);

            $('#to_date').datepicker('destroy').datepicker({
                "format": "{{ app()->getLocale() == "fr" ? 'dd-mm-yyyy' : 'yyyy-mm-dd' }}",
                "keyboardNavigation": false,
                "autoclose": true,
                "startDate": $("#from_date").val(),
                "endDate":minDate
            }).on('change', function(e) {
            }).datepicker('setDate', minDate);
        });

        $("#duration").on("change", function() {
            var duration = $(this).val();
            if(duration == "6") {
                $(".customDate").show();
            } else {
                $(".customDate").hide();
            }
        }).change();


        $("#sender_country_id, #receiver_country_id").select2();

        $("#status, #partner_txn_status").select2({
            placeholder: "{{ trans('message_lang.LBL_ALL') }}",
        });

        jQuery(document).on("click",".page-link",function(e){
            e.preventDefault();
            const params = new URL(jQuery(this).attr('href')).searchParams;
            jQuery("#page").val(params.get('page'));
            jQuery("#filterForm").submit();
        });

        jQuery("#perPage").on("change",function(){
            jQuery("#filterForm").submit();
        });

        // Add new bulk processing code
        const bulkActionsContainer = $('#bulk-actions-container');
        const selectAllCheckbox = $('#select-all-checkbox');
        const selectedCount = $('#selected-count');
        const bulkActionButton = $('#bulk-action-button');
        let selectedTransactions = [];

        // Handle select all checkbox
        selectAllCheckbox.on('change', function() {
            const isChecked = $(this).prop('checked');
            $('tbody input[type="checkbox"]').prop('checked', isChecked);
            updateSelectedItems();
        });

        // Handle individual checkboxes
        $(document).on('change', 'tbody input[type="checkbox"]', function() {
            updateSelectedItems();

            // Update select all checkbox state
            const allChecked = $('tbody input[type="checkbox"]:checked').length === $('tbody input[type="checkbox"]').length;
            selectAllCheckbox.prop('checked', allChecked);
        });

        function updateSelectedItems() {
            selectedTransactions = [];
            $('tbody input[type="checkbox"]:checked').each(function() {
                const row = $(this).closest('tr');
                const referenceNo = row.find('td:nth-child(3) a').text();
                selectedTransactions.push(referenceNo);
            });

            // Update UI
            if (selectedTransactions.length > 0) {
                selectedCount.text(selectedTransactions.length);
                bulkActionsContainer.show();
            } else {
                bulkActionsContainer.hide();
            }
        }

        $('#bulk-action-button').on('click', function(e) {
            e.preventDefault();

            const refsHtml = `
                <p>{{trans('message_lang.CONFIRM_REINITIATE')}}</p>
                <div class="text-left mt-2">
                    <div style="">
                        ${selectedTransactions.map(ref => `<div class="mt-1">${ref}</div>`).join('')}
                    </div>
                </div>
            `;

            Swal.fire({
                icon: "info",
                title: "Confirmation",
                confirmButtonText: "{{trans('message_lang.YES_I_CONFIRM')}}",
                showCancelButton: true,
                cancelButtonText: "{{trans('message_lang.BTN_NO_CANCEL')}}",
                html: refsHtml,
            }).then((result) => {
                if (result.value) {
                    $("#loading").show();
                    $(this).prop("disabled", true);

                    // Prepare the data for reinitiation request
                    const data = {
                        _token: "{{ csrf_token() }}",
                        transaction_references: selectedTransactions
                    };

                    const url = "{{ route('agentportal.external-send-money-transactions.bulk-reinitiate') }}";
                    submitRequest(url, data).then((response) => {
                        if(response){
                            $("#loading").hide();
                            if(response.status){
                                toastr.success("{{ trans('message_lang.LBL_SELECTED_TRANSACTIONS_WILL_BE_REINITIATED') }}");
                            } else {
                                toastr.error(response.message);
                            }
                        } else {
                            $("#loading").hide();
                            toastr.error("{{ trans('message_lang.SOMETHING_WENT_WRONG') }}");
                        }

                        // Clear checkboxes
                        $('tbody input[type="checkbox"]').prop('checked', false);
                        selectAllCheckbox.prop('checked', false);  // Also clear the select-all checkbox
                        updateSelectedItems();
                    }).catch((error) => {
                        $("#loading").hide();
                        $(this).prop("disabled", false);
                        statusCode = error.status;
                        message = error.responseJSON.message
                            ? error.responseJSON.message
                            : "{{ trans('message_lang.SOMETHING_WENT_WRONG') }}";
                        if (statusCode === 401) {
                            message = "{{ trans('message_lang.UNAUTHORIZED') }}";
                        }

                        toastr.error(message);
                    });
                }
            });
        });
    });

    async function submitRequest(url, data, method = "POST") {
        return $.ajax({
            type: method,
            url: url,
            data: data,
            dataType: "json",
            success: function(response) {
                return response;
            },
            error: function(error) {
                return error;
            },
        });
    }
</script>
@endsection