<?php $__env->startSection('content'); ?>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap4-toggle/css/bootstrap4-toggle.min.css">

    <style>
        .toggle.btn-sm {
            min-width: 4.125rem !important;
        }
    </style>

    <div class="card">
        <div class="card-header">
            <?php echo e(trans('global.buyer')); ?> <?php echo e(trans('global.list')); ?> <?php echo e(session('user_timezone')); ?>

        </div>

        <div class="card-body">
            <div class="row mb-3">
                <div class="col-md-3" id="kycFilterDiv">
                    <select id="kycFilter" class="form-control select2">
                        <option value=""><?php echo e(trans('global.all')); ?> <?php echo e(trans('cruds.user.fields.kyc_status')); ?></option>
                        <option value="0"><?php echo e(trans('cruds.user.fields.kyc_status_name.pending')); ?></option>
                        <option value="1"><?php echo e(trans('cruds.user.fields.kyc_status_name.under_review')); ?></option>
                        <option value="2"><?php echo e(trans('cruds.user.fields.kyc_status_name.approved')); ?></option>
                        <option value="3"><?php echo e(trans('cruds.user.fields.kyc_status_name.rejected')); ?></option>
                    </select>
                </div>
                <div class="col-md-3">
                    <select id="status" class="form-control select2">
                        <option value=""><?php echo e(trans('global.all')); ?> <?php echo e(trans('cruds.user.fields.status')); ?></option>
                        <option value="1"><?php echo e(trans('cruds.user.fields.status_name.unblock')); ?></option>
                        <option value="2"><?php echo e(trans('cruds.user.fields.status_name.block')); ?></option>
                    </select>
                </div>
            </div>

            <?php if(session()->has('success')): ?>
                <div class="alert alert-success">
                    <?php echo e(session()->get('success')); ?>

                </div>
            <?php endif; ?>

            <div class="alert alert-success user-status-message-div user-status-message d-none"></div>

            <?php
                $b_count = '';
                if($buyer_count > 0){
                    $b_count = '('.$buyer_count.')';
                }
            ?> 

            <ul class="nav nav-tabs" id="userTabs" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" id="buyer-requested-tab" data-toggle="tab" href="#buyer_requested" role="tab" aria-controls="buyer_requested" aria-selected="false"><?php echo e(trans('global.tabbing.buyer_requested')); ?> <?php echo e($b_count); ?></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="buyers-tab" data-toggle="tab" href="#buyers" role="tab" aria-controls="buyers" aria-selected="false"><?php echo e(trans('global.tabbing.buyer_accepted')); ?></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="buyer-rejected-tab" data-toggle="tab" href="#buyer_rejected" role="tab" aria-controls="buyer_rejected" aria-selected="false"><?php echo e(trans('global.tabbing.buyer_rejected')); ?></a>
                </li>
            </ul>
            
            <div class="tab-content mt-3" id="userTabsContent">
                <div class="tab-pane fade show active" id="buyer_requested" role="tabpanel" aria-labelledby="buyer-requested-tab">
                    <table class="table table-bordered table-striped table-hover ajaxTable datatable datatable-buyer-requested">
                        <thead>
                            <tr>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.full_name')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone_code')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.email_id')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.kyc_status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.seller_status')); ?>

                                </th>
                                 <th>
                                    <?php echo e(trans('cruds.user.fields.status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.created_at')); ?>

                                </th>
                                <th>
                                    &nbsp;
                                </th>
                            </tr>
                        </thead>
                    </table>
                </div>
                <div class="tab-pane fade" id="buyers" role="tabpanel" aria-labelledby="buyers-tab">
                    <table class="table table-bordered table-striped table-hover ajaxTable datatable datatable-Buyers">
                        <thead>
                            <tr>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.full_name')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone_code')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.email_id')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.kyc_status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.seller_status')); ?>

                                </th>
                                 <th>
                                    <?php echo e(trans('cruds.user.fields.status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.created_at')); ?>

                                </th>
                                <th>
                                    &nbsp;
                                </th>
                            </tr>
                        </thead>
                    </table>
                </div>
                <div class="tab-pane fade" id="buyer_rejected" role="tabpanel" aria-labelledby="buyer-rejected-tab">
                    <table class="table table-bordered table-striped table-hover ajaxTable datatable datatable-buyer-rejected">
                        <thead>
                            <tr>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.full_name')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone_code')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.phone')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.email_id')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.kyc_status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.seller_status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.status')); ?>

                                </th>
                                <th>
                                    <?php echo e(trans('cruds.user.fields.created_at')); ?>

                                </th>
                                <th>
                                    &nbsp;
                                </th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('scripts'); ?>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>

    <?php echo \Illuminate\View\Factory::parentPlaceholder('scripts'); ?>
    <script>
        $(function () {
            const hash = window.location.hash;
            if (hash === '#buyer_requested' || hash === '#buyers' || hash === '#buyer_rejected') {
                const tabLink = document.querySelector(`.nav-link[href="${hash}"]`);
                const tabContent = document.querySelector(hash);

                if (tabLink && tabContent) {
                    document.querySelectorAll('.nav-link').forEach(el => el.classList.remove('active'));
                    document.querySelectorAll('.tab-pane').forEach(el => el.classList.remove('active', 'show'));
                    tabLink.classList.add('active');
                    tabContent.classList.add('active', 'show');
                }
            }

            function initUserTable(tableClass, roleFilter) {
                let dtButtons = $.extend(true, [], $.fn.dataTable.defaults.buttons);
                let routeUrl = "<?php echo e(route('admin.users.buyer')); ?>";

                let dtOverrideGlobals = {
                    buttons: dtButtons,
                    processing: true,
                    serverSide: true,
                    retrieve: true,
                    aaSorting: [],
                    ajax: {
                        url: routeUrl,
                        data: function (d) {
                            d.role = roleFilter;
                            d.kyc_status = $('#kycFilter').val();
                            d.status = $('#status').val();
                        }
                    },
                    columns: [
                        { data: 'full_name', name: 'full_name' },
                        { data: 'country_id', name: 'country_id' },
                        { data: 'phone', name: 'phone' },
                        { data: 'email', name: 'email' },
                        { data: 'kyc_status', name: 'kyc_status' },
                        { data: 'seller_status', name: 'seller_status' },
                        { data: 'status', name: 'status' },
                        { data: 'created_at', name: 'created_at' },
                        { data: 'actions', name: "<?php echo e(trans('global.actions')); ?>" }
                    ],
                    order: [[7, 'desc']],
                    pageLength: 10,
                };

                return $('.' + tableClass).DataTable(dtOverrideGlobals);
            }

            let buyerRequestedTable = initUserTable('datatable-buyer-requested', 'buyer_requested');
            let buyerTable = initUserTable('datatable-Buyers', 'Buyer');
            let buyerRejectedTable = initUserTable('datatable-buyer-rejected', 'buyer_rejected');

            function toggleColumns(tabId) {
                if (tabId === 'buyers') {
                    buyerTable.column(4).visible(true);   // Show KYC
                    buyerTable.column(5).visible(false);   // Hide Seller Status
                    
                    $('#seller_status_filter_div').hide();
                    $('#kycFilterDiv').show();
                } else if(tabId === 'buyer_requested'){
                    buyerRequestedTable.column(5).visible(false);  // Hide Seller Status
                    buyerRequestedTable.column(6).visible(false); // Hide Status
                    
                    $('#seller_status_filter_div').hide();
                    $('#kycFilterDiv').show();
                } else if(tabId === 'buyer_rejected'){
                    buyerRejectedTable.column(5).visible(false);  // Hide Seller Status
                    buyerRejectedTable.column(6).visible(false); // Hide Status
                    
                    $('#seller_status_filter_div').hide();
                    $('#kycFilterDiv').show();
                }
            }

            const activeTab = document.querySelector('.nav-link.active');
            if (activeTab) {
                const tabId = activeTab.getAttribute('href').replace('#', '');
                console.log('Initial tab:', tabId);
                setTimeout(() => {
                    toggleColumns(tabId);
                }, 300);
            }

            document.querySelectorAll('.nav-link').forEach(tab => {
                tab.addEventListener('click', function () {
                    setTimeout(() => {
                        const activeTab = document.querySelector('.nav-link.active');
                        const tabId = activeTab.getAttribute('href').replace('#', '');
                        toggleColumns(tabId);
                    }, 300);
                });
            });
           
            $('#kycFilter, #status').change(function () {
                buyerRequestedTable.ajax.reload();
                buyerTable.ajax.reload();
                buyerRejectedTable.ajax.reload();
            });

             // Re-initialize toggle after table draw
            buyerTable.on('draw', function () {
                $('.toggle-flag').bootstrapToggle({
                    on: 'Unblock',
                    off: 'Block',
                    size: 'small',
                    onstyle: 'success',
                    offstyle: 'danger'
                });
            });

            // Handle toggle change
            $(document).on('change', '.toggle-flag', function () {
                let user_id = $(this).data('id');
                let value = $(this).prop('checked') ? 1 : 0;

                $.ajax({
                    url: "<?php echo e(route('admin.users.status_update')); ?>",
                    method: 'POST',
                    data: {
                        _token: '<?php echo e(csrf_token()); ?>',
                        user_id: user_id,
                        status: value
                    },
                    success: function (res) {
                        console.log(res.message);
                        if(res.message != ''){
                            $('.user-status-message-div').removeClass('d-none');
                            $('.user-status-message').text(res.message);
                        }
                    },
                    error: function () {
                        alert("<?php echo e(trans('global.something_went_wrong')); ?>");
                    }
                });
            });
        });
    </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.admin', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /var/www/html/resources/views/admin/users/buyer_data.blade.php ENDPATH**/ ?>