@extends('voyager::master')

@section('content')
    @include('voyager::partials.breadcrumb', ['breadcrumbs' => $generatedBreadcrumbs])

    <div class="page-content">
        <div class="panel panel-bordered">
            <div class="panel-body">
                <table id="dataTable" class="table table-hover agent-table">
                    <thead>
                        <tr>

                            <th>{{__('datatable.sn')}}</th>
                            <th>{{__('customform.form.al_account.name_ar')}}</th>
                            <th>{{__('form.mobile_number')}}</th>
                            <th>{{__('generic.email')}}</th>
                            <th>{{__('customform.form.al_account.currency')}}</th>
                            <th>{{__('customform.form.gl_account')}}</th>
                            <th>{{__('customform.form.customer_type')}}</th>
                            <th>{{__('customform.form.gl_purpose')}}</th>
                            <th>{{__('datatable.status')}}</th>
                            <th>{{__('voyager::generic.action')}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if(isset($glAccounts))
                        @foreach ($glAccounts as $glAccount)
                            <tr>
                                <td>{{$loop->index +1}}</td>
                                <td>{{ $glAccount->name_ar }} <br/> {{ $glAccount->name_en }}</td>
                                <td>{{ $glAccount->mobile }}</td>
                                <td>{{ $glAccount->email }}</td>
                                <td>{{ $glAccount->currency }}</td>
                                <td>{{ $glAccount->gl_wallet_id }}</td>
                                <td>{{ $glAccount->customer_type }}</td>
                                <td>{{ \App\Enums\TransactionType::getStr($glAccount->gl_purpose) }}</td>
                                <td>
                                    <div class="mt-3 pb-1">
                                        <span class="p-1 label label-{{ strtolower(\App\Enums\Status::getStr($glAccount->status)) }}" id="status-label-{{ $glAccount->local_id }}">
                                            {{ \App\Enums\Status::getStr($glAccount->status) }}
                                        </span>
                                    </div>
                                </td>
                                <td class="d-flex">
                                @if(hasPermission('approval', 'GlAccount') && checkAndReturnValue($glAccount, 'is_approval_needed') == true && ($glAccount->status != 1 && $glAccount->status != 2))
                                        <button class="btn btn-sm btn-danger pull-right top-up reject-button"
                                        data-id="{{ checkAndReturnValue($glAccount, 'id')}}"
                                        data-href="{{
                                            route('approval.reject', [
                                                'id' => checkAndReturnValue($glAccount, 'id'),
                                                'route' => 'gl-account.reject',
                                                'callback_url' => 'voyager.gl-accounts.index'
                                            ])
                                        }}">
                                            <i class="voyager-exclamation"></i>
                                            {{__('datatable.reject')}}

                                </button>
                                        <button class="btn btn-sm btn-success pull-right top-up accept-button"
                                        data-id="{{ checkAndReturnValue($glAccount, 'id') }}"
                                        data-href="{{
                                            route('approval.approve', [
                                                'activation_key' => 'id',
                                                'activation_val' => checkAndReturnValue($glAccount, 'id'),
                                                'route' => 'gl-account.approve',
                                                'callback_url' => 'voyager.gl-accounts.index'
                                            ])
                                        }}">
                                            <i class="voyager-check"></i>
                                            {{__('datatable.approve')}}

                            </button>
                                    @endif
                                    @if(hasPermission('read', 'GlAccount'))
                                    <a href="{{ route('voyager.gl-accounts.show', $glAccount->id) }}" class="btn btn-sm btn-warning">
                                        <i class="voyager-eye"></i> {{__('generic.view')}}
                                    </a>
                                    @endif
                                    @if(hasPermission('edit', 'GlAccount'))
                                    <a href="{{ route('voyager.gl-accounts.edit', $glAccount->id) }}" class="btn btn-sm btn-primary ml-1">
                                        <i class="voyager-edit"></i> {{__('generic.edit')}}
                                    </a>
                                    @endif
                                    @if(hasPermission('delete', 'GlAccount'))
                                         <form action="{{ route('voyager.gl-accounts.destroy', $glAccount->id) }}" method="POST" style="display:inline-block;" class="delete-form">
                                            @csrf
                                            @method('DELETE')
                                            <button type="button" class="btn btn-sm btn-danger delete-button">
                                                <i class="voyager-trash"></i> {{__('generic.delete')}}
                                            </button>
                                         </form>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                        @endif
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection

@section('javascript')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <script>
        $(document).ready(function() {
    var searchLabel = "@lang('datatable.sSearch')";
    var lengthMenuLabel = "@lang('datatable.sLengthMenu')";
    var infoLabel = "@lang('datatable.sInfo')";
    var infoEmptyLabel = "@lang('datatable.sInfoEmpty')";
    var infoFilteredLabel = "@lang('datatable.sInfoFiltered')";
    var loadingRecordsLabel = "@lang('datatable.sLoadingRecords')";
    var processingLabel = "@lang('datatable.sProcessing')";
    var zeroRecordsLabel = "@lang('datatable.sZeroRecords')";

    var firstLabel = "@lang('datatable.oPaginate.sFirst')";
    var lastLabel = "@lang('datatable.oPaginate.sLast')";
    var nextLabel = "@lang('datatable.oPaginate.sNext')";
    var previousLabel = "@lang('datatable.oPaginate.sPrevious')";

    var sortAscendingLabel = "@lang('datatable.oAria.sSortAscending')";
    var sortDescendingLabel = "@lang('datatable.oAria.sSortDescending')";
            // setTimeout(function() {
                $('#dataTable').DataTable({
                            language: {
                        search: searchLabel,
                        lengthMenu: lengthMenuLabel,
                        info: infoLabel,
                        infoEmpty: infoEmptyLabel,
                        infoFiltered: infoFilteredLabel,
                        loadingRecords: loadingRecordsLabel,
                        processing: processingLabel,
                        zeroRecords: zeroRecordsLabel,
                        paginate: {
                            first: firstLabel,
                            last: lastLabel,
                            next: nextLabel,
                            previous: previousLabel
                        },
                        aria: {
                            sortAscending: sortAscendingLabel,
                            sortDescending: sortDescendingLabel
                        }
                    },
                });

                $('.delete-button').on('click', function () {
                    const form = $(this).closest('.delete-form');

                    Swal.fire({
                        title: "{{__('generic.are_you_sure')}}?",
                        text: "{{__('messages.text.wont_revert')}}",
                        icon: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#3085d6",
                        cancelButtonColor: "#d33",
                        confirmButtonText: "{{__('generic.delete_this_confirm')}}"
                    }).then((result) => {
                        if (result.isConfirmed) {
                            form.submit();
                            Swal.fire({
                                title: "{{__('messages.title.deleted')}}",
                                text: "{{__('messages.text.delete_confirm')}}",
                                icon: "success"
                            });
                        }
                    });
                });
            // }, 1000); // 1 second delay before initializing DataTable and binding delete button events
        });
    </script>
    <script>
        setupConfirmationButton('accept-button',"{{__('messages.approval_confirmation')}}","{{__('messages.cancel')}}","{{__('messages.confirm')}}","{{__('messages.confirmation_title')}}");
        setupRejectionButton('reject-button', "{{__('messages.rejection_confirmation')}}","{{__('messages.cancel')}}","{{__('messages.confirm')}}", "{{__('messages.confirmation_title')}}");
        </script>
@stop