@extends('backend.layouts.app')

@section('content')

    <!--Member Personal Profile Start-->
    <div class="customFlyout customFlyout1300  flyout-position-t memberProfile">
        <div id="productListData loader_seller" style=" position: absolute; top: 30pc; left: 30pc;">
            <div id="loader"style=" display:none;  text-align: center; width: 100px; margin: 0 auto;">
                <img width="100" src="{{ url('public/assets/img/ZKZg.gif') }}">
            </div>
        </div>
    </div>
    <!--Member Personal Profile End-->

    <div class="aiz-titlebar text-left mt-2 mb-3 ">
        <div class="row align-items-center">
            <div class="col-md-6">
                <h1 class="h3">Ads Request Hub</h1>
            </div>
        </div>
    </div>

    <div class="admin-table table-freezed " id="table_list"><div class="loader_main"  style="  position: relative;
    top: 50%;
    left: 40%;
    transform: translate(50%, 50%);
    width: 100px;
    height:50vh;
    text-align: center;">
 <img width="100" src="{{ url('public/assets/img/ZKZg.gif') }}">
        </div>
    </div>
@endsection

@section('modal')
    @include('modals.delete_modal')

    <div class="modal right fade editPost-modal seaport-airport" data-refresh="true" id="editPost-modal" role="dialog">
        <div class="modal-dialog" id="modals_datas">
        </div>
    </div>

    <!-- Filter Modal -->
    <div class="modal Top Up fade filterFlyout " id="filterFlyout" tabindex="-1" role="dialog"
        aria-labelledby="myModalLabel2" aria-hidden="true" style="position: absolute">
        <div class="modal-dialog" role="document">
            <div class="modal-content" >
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel2">User Search Filter</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                </div>
                <div class="modal-body c-scrollbar">
                    <form class="step_form" id="sort_sellers" action="{{ url('/admin/advertisement/list') }}" method="GET">
                        <div class="row mt-3">
                            <div class="col-md-6">
                                <div class="field">
                                    <div class="field-in">
                                        <label class="field_label focus-in">Request ID</label>
                                        <input type="text" class="form-control search_field" id="search" name="search"  value="{{ request()->notify }}" placeholder="{{ translate('Type Request ID') }}">
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="field">
                                    <div class="field-in">
                                        <label class="field_label focus-in">User Name</label>
                                        <input type="text" class="form-control search_field" id="name" name="name" placeholder="{{ translate('Type name') }}">
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="field">
                                    <div class="field-in">
                                        <label class="field_label focus-in">Title</label>
                                        <input type="text" class="form-control search_field" id="title" name="title" placeholder="{{ translate('Type title') }}">
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="field">
                                    <div class="field-in">
                                        <label class="field_label focus-in">Select Status</label>
                                        <div class="custom-dropdown">
                                            <i class="icons icon-arrow-bottom"></i>
                                            <select name="status" id="status" class="form-control">
                                                <option value="" disabled selected hidden>Filter by Status</option>
                                                <optgroup label="Filter by Status">Filter by Status</optgroup>
                                                <option value="0"> {{ translate('Requested') }} </option>
                                                <option value="1"> {{ translate('Approved') }} </option>
                                                <option value="2"> {{ translate('Rejected') }} </option>
                                            </select>
                                        </div>
                                        <span class="error_class_category text-danger" style="margin-top: 1px;display:none;font-size:80%" id="errorname1">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary btn-sm" id="resetFilter" value="Reset"
                        aria-label="Reset">Reset</button>
                    <button type="button" class="btn btn-outline-secondary btn-sm" value="Cancel" data-dismiss="modal"
                        aria-label="Close">Cancel</button>
                    <button type="button" class="btn btn-primary btn-sm" id="searchFilter" value="Search">Search</button>
                </div>

            </div><!-- modal-content -->
        </div><!-- modal-dialog -->
    </div><!-- Filter modal -->
@endsection

@section('script')

<script type="text/javascript">

    $(document).ready(function() {
        @if (empty(request()->notify))
            var urls = "{{ route('advertisement.list') }}"
            data_index(urls);
        @endif

        function data_index(url,data) {
            $.ajax({
                url: url,
                data: data,
                type: 'GET',
                success: function(data) {
                    $("#table_list").html(data);
                }
            });
        }

        function sort_sellers(el) {
            $('#sort_sellers').submit();
        }

        function handleSearch() {
            var url = $('#sort_sellers').attr('action');
            var data = $('#sort_sellers').serialize();
            data_index(url, data);
            $('#filterFlyout').modal('hide');
        }

        @if (request()->notify)
            var user = '{{ request()->notify }}';
            if (user) {
                var url =  "{{ route('advertisement.list') }}";
                var data = {
                    'search': user
                };
                data_index(url,data);
            }
        @endif

        $(document).on("keypress", "input.search_field", function(e) {
            if (e.which == 13) {
                handleSearch();
            }
        });

        $(document).on('click', '#searchFilter', function() {
            handleSearch();
        });

        $(document).on('click', '#resetFilter', function() {
            $('#sort_sellers')[0].reset();
            data_index(url,data);
            //$('#filterFlyout').modal('hide');
        });

        $(document).on('click', '#clearBtn', function() {
            var url = $('#sort_sellers').attr('action');
            $('#sort_sellers')[0].reset();
            $('input[name="search"], input[name="name"], input[name="title"]').val('');
            data_index(url,'');
            $('#filterFlyout').modal('hide');
        });

        $('button[data-dismiss="modal"]').click(function() {
            $('input[name="search"], input[name="name"], input[name="title"]').val('');
        });

        $('#search, #name, #title').keyup(function() {
            var inputValue = $(this).val();
            if (inputValue.startsWith(' ')) {
                $(this).val('');
                return false;
            }
            inputValue = inputValue.replace(/(\s)\s+/g, '$1');
            $(this).val(inputValue);
        });

        $(document).on('click', '.memberUser-freeze', function() {
            var user_id = $(this).data('userid');
            $('body').toggleClass('OverlayBg');
            $('.v-scroll').hide();
            $('#loader').css('display','block');
            $(".memberProfile").addClass("active");
            $('body.body-active').css('overflow-y','hidden');
            getCurrentMemberInfo(user_id);

        });

        function getCurrentMemberInfo(user){
            $.ajax({
                url: "{{ url('/admin/seller/profile') }}",
                type: "GET",
                data: {
                    'user_id': user
                },
                success: function(obj) {
                    $(".memberProfile").html(obj);
                }
            });
        }

        // function loadStoredPagination() {
        //     var storedURL = localStorage.getItem('paginationURL');  
            
        //     if (storedURL) {
        //         $.ajax({
        //             url: storedURL,
        //             cache: false,
        //             success: function(data) { 
        //                 $("#table_list").html(data); 
        //             }
        //         });
        //     }
        // } 

        $(document).on('click', '#deletebtn', function() {
            var url = $(this).data('href');
            var checkThis = $(this);
            var deleteModal = $('#delete-modal');
            deleteModal.modal({
                backdrop: 'static',
                keyboard: false
            });
            var storedURL = localStorage.getItem('paginationURL');
            var requestURL = storedURL && storedURL.trim() !== "" ? storedURL : '{{ route('advertisement.list') }}';
            $('#delete-link').one('click', function(e) {
                $.ajax({
                    url: url,
                    type: "GET",
                    success: function(obj) {
                        $('#delete-modal').modal('hide');
                        AIZ.plugins.notify('success', 'Ad deleted successfully');
                        // loadStoredPagination();
                        // var urls = "{{ route('advertisement.list') }}"
                        data_index(requestURL);
                    }
                });
            });
        });

        $('#delete-modal').on('hidden.bs.modal', function () {
            $(this).find('#delete-link').off('click');
        });

        $(document).on('click', 'a.page-link', function(event) {
            event.preventDefault();
            var url = $(this).attr('href');
            localStorage.setItem('paginationURL', url);
            $.ajax({
                url: url,
                cache: false,
                success: function(html) {
                    $("#table_list").html(html);
                }
            });
            $('#sProduct').text('0');
            $('#deletedData').hide();
            $('#restoreData').hide();
        });

        //==================================== Delete Multiple Data ==========================================//

        $(document).on('click', '#checkAll', function() {
            $("#sProduct").text("0");
            if ($(this).is(":checked")) {
                $("#deletedData").css("display", "block");
                $("#restoreData").css("display", "block");
                $(this).closest('table').find('#searchPage tr').addClass('active');
            } else {
                $("#deletedData").css("display", "none");
                $("#restoreData").css("display", "none");
                $(this).closest('table').find('#searchPage tr').removeClass('active');
            }
            $(".product_checkbox").prop("checked", this.checked);
            $("#select_count").html($("input.product_checkbox:checked").length + " Selected");

        });

        $(document).on('click', '.product_checkbox,#checkAll', function() {
            if ($(this).is(':checked')) {
                $(this).closest('tr').addClass('active');
            } else {
                $(this).closest('tr').removeClass('active');
            }
            if ($('.product_checkbox:checked').length == $('.product_checkbox').length) {
                $('#checkAll').prop('checked', true);
                $("#deletedData").css("display", "block");
                $("#restoreData").css("display", "block");

            } else {
                if ($('.product_checkbox:checked').length == "0") {
                    $("#deletedData").css("display", "none");
                    $("#restoreData").css("display", "none");
                } else {
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");
                }
                $('#checkAll').prop('checked', false);
            }
            $("#sProduct").text($("input.product_checkbox:checked").length);
        });

        $(document).on('click', '#delete_records', function() {
            var row = $(this).closest('tr');
            var deleteModal = $('#delete-modal');
            var products = [];
            $(".product_checkbox:checked").each(function() {
                products.push($(this).val());
            });

            if (products.length <= 0) {
                alert("Please select records.");
            } else {
                var selected_values = products.join(",");
                deleteModal.modal({
                    backdrop: 'static',
                    keyboard: false
                });

                $('#delete-link').one('click', function(e) {
                    $.ajax({
                        type: "POST",
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        url: "{{ url('/admin/advertisement/multi_delete') }}",
                        cache: false,
                        data: 'emp_id=' + selected_values,
                        success: function(response) {
                            var emp_ids = response.split(",");
                            for (var i = 0; i < emp_ids.length; i++) {
                                $("#" + emp_ids[i]).closest("tr").remove();
                            }
                            var count = products.length;
                            if (count === 1) {
                                AIZ.plugins.notify('success', 'Ad Deleted successfully');
                            } else {
                                AIZ.plugins.notify('success', 'Ads Deleted successfully');
                            }
                            var urls = "{{ route('advertisement.list') }}"
                            data_index(urls);
                            $("#sProduct").text("0");
                            $('#delete-modal').modal('hide');
                            $("#deletedData").hide();
                        }
                    });
                });
            }
        });

        $(document).on('click', '.filter-link', function() {
            $(document).find('body').addClass('body-active');
        });

        function edit_ads(url) {
            $.ajax({
                url: url,
                success: function(data) {
                    $("#modals_datas").html(data);
                }
            });
        }

        $(document).on('click', '.edit_ads', function(event) {
            let id = $(this).data('id');
            var url = "{{ url('/admin/advertisement/edit') }}" + "/" + id;
            edit_ads(url);
        });

        /////////////////////////////// Edit & update Ads

        $(document).on('click', '#update_ads', function() {
            var formData = new FormData($("#update_form")[0]);
            let action = $(this).closest('.modal-content').find('form').attr('action');
            var checkStatusVal = $(this).closest('.modal-content').find('select[name="status"]').val();
            var commentsVal = $(this).closest('.modal-content').find('textarea[name="rejection_reason"]').val();

            if (checkStatusVal == "2" && commentsVal.trim() == "") {
                AIZ.plugins.notify('danger', 'Please add Rejection Reason');
                return false;
            }

            $.ajax({
                method: "POST",
                url: action,
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                success: function(data) {
                    if (data.error) {
                        $("#errorname1").css("display", "block").text(data.error.status);
                    } else {
                        AIZ.plugins.notify('success', 'Ad Updated successfully');
                        $('#editPost-modal').modal('hide');
                        var urls = "{{ route('advertisement.list') }}"
                        data_index(urls);
                    }
                }
            });
        });

        $(document).on('change', '#status', function(e) {
            var selectedValue = $(this).val();
            var commentsSection = $('#commentsSection');
            $('#update_ads').prop('disabled', false).removeClass('disableBTN');
            if (selectedValue == '2') {
                commentsSection.fadeIn();
            } else {
                commentsSection.fadeOut();
            }
        });

    });
</script>
@endsection