@extends('backend.layouts.app')

@section('content')
    @php
        $loadmore = '    <tr>
     <td colspan="6">
         <div class="loadMore">
             <div class="totalMatrix">
                 Total Rows: <span>10 - 402</span>
             </div>
             <a href="javascript:void(0);"
                 class="load-link attribute_conbinations_paginate">Load more
                 <i class="icons icon-arrow-bottom"></i></a>
         </div>
     </td>
 </tr>';

    @endphp

    <style>

.suggestBTN {
    width: 175px;
    display:none;
    padding: 5px;
}
#breadcrumps_tree {
    width: auto;
        white-space: nowrap;
        overflow-x: auto;    
        padding: 0;   
        scrollbar-width:thin;  
    }

    .breadcrumbsStyle {
        display: inline-block;
        font-family: Arial, sans-serif; 
        font-size: 14px; 
    } 
        #suggestion-modal .CategoryListBox.mt-3 {
            width: 1000px;
        }

        #suggestion-modal .position-relative .offset-subcate {
            width: auto !important;
        }

        i.fa.fa-times.text-danger.cancel_btn {
            position: absolute;
            right: -6px;
            border: 1px solid;
            top: -4px;
            border-radius: 100pc;
            height: 18px;
            width: 18px;
            font-size: 13px;
            padding: 2px 3px;
            background: white;
        }

        .cancel_btn:hover {
            background: red !important;
            color: white !important;
        }

        div#suggestionbox {
            position: relative;
        }

        #rejection_comment_select li.selected {

            font-weight: bold;
        }

        .table thead tr th {
            position: sticky;
            top: 0px;
            background-color: #F8F8F8;
            z-index: 99;
        }

        .spinner {
            border: 2px solid #fff;
            border-top: 2px solid #000;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            animation: spin 2s linear infinite;
        }

        .active-aiz {
            pointer-events: none;
        }

        li .sectorToggle .aiz-switch {
            pointer-events: all;
        }

        @keyframes spin {
            0% {
                transform: rotate(0deg);
            }

            100% {
                transform: rotate(360deg);
            }
        }

        #rejectedData #row_action {
            display: none;
        }

        #approvedData #row_action {
            display: none;
        }

        #approvedData #approved_action,
        #category_list {
            display: none;
        }

        #suggest_new {
            display: none;
            padding: 5px 10px;
        }

        #reason_list {
            background: white;
            display: none;
            width: 850px;
            position: absolute;
            /* right: 0 !important; */
            /* top:60px;
                                        right:50px; */
            border-radius: 4px;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            z-index: 999;
            padding: 20px;
        }

        #pendingData .rej_reason {
            display: none;
        }

        #approvedData #row_action,
        #approvedData .rej_reason {
            display: none;
        }

        #create_suggest .offset-subcate {
            width: auto !important;
        }

        #create_suggest {
            margin: 0px 0px;
        }

        #create_suggest .MainCatAddForm {
            display: none !important;
        }

        div#create_suggest .list-group p {
            display: none;
        }

        div#create_suggest p {
            padding-top: 20px 0px !important;
        }

        #breadcrumps {
            display: none;
            justify-content: space-between;
            color: #e43139;
            font-weight: 500;
            line-height: 8px;
            word-spacing: 3px;
            background: #eeee;
            padding: 2px 5px;
        }

        #breadcrumps button {
            display: none;
            width: max-content;
            margin: 0 8px 0 0;
            background: #0abb75;
            color: #fff;
        }

        div#breadcrumps ul {
            list-style: none;
        }

        div#breadcrumps ul li {
            display: inline;
            padding: 3px 12px;
            border-radius: 20px;
            background: #fff;
            color: #e43139;
        }



        div#breadcrumps ul {
            padding: 16px 4px;
        }

        #app_stat_3,
        #app_stat_0 {
            font-weight: 800;
        }
        #suggestion_modal .modal-body #reason_list{
display:block;
        }
    </style>

    <div id="productListData">
        <div class="loader_main"
            style="  position: absolute;
     top:40%;
    left: 50%;
    transform: translate(50%, 50%);
    width: 100px;
    /* height:50vh; */
    text-align: center;">
            <img width="100" src="{{ url('public/assets/img/ZKZg.gif') }}">
        </div>
    </div>
    <div class="CategoryListPage" style="display:none;">
        <div class="aiz-titlebar text-left mt-2 mb-3">
            <div class="row align-items-center">
                <div class="col-md-6">
                    <h1 class="h3">{{ translate('Category Manager') }}</h1>
                </div>
            </div>
        </div>
        <div class="card ">

            <div class="card-body tbl-res" style="overflow-x: hidden !important">
                <div class="CategoryList w-100">
                    <div class="col-sm-12">
                        <div class="row border-bottom">
                            <ul class="col-sm-7 nav nav-tabs mr-auto" id="CategoryList" role="tablist">
                                <li class="nav-item">
                                    <a class="nav-link active" id="Pc-Cat" data-toggle="tab" href="#Pc"
                                        role="tab" aria-controls="Pc" aria-selected="true">Power Cozmo Categories</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" id="OtherUserCat" data-toggle="tab" href="#UserCat" role="tab"
                                        aria-controls="UserCat" aria-selected="false">Other User Categories
                                        <span class="ml-2 badge badge-dot badge-circle badge-primary" id="totalPendingCount"
                                            data-now="0"> </span>
                                    </a>
                                </li>

                            </ul>

                            {{-- <form class="col-sm-5 mr-n3" id="sort_categories" action="" method="GET"> --}}
                            {{-- <div class="col-sm-3 mr-n3 align-items-center d-flex" id="searchdata">
                                <div class="table-search ml-auto">
                                    <i class="icons icon-search-s" id="memberSearch"></i>
                                    <input type="text" class="form-control form-control-sm searching" id="search"
                                        name="search" value="{{ request()->notify }}"
                                        placeholder="Search with Sub Category">
                                </div>
                            </div> --}}
                            {{-- </form> --}}
                        </div>
                    </div>
                    <div class="tab-content mt-3">
                        <div class="tab-pane fade show active" id="Pc" role="tabpanel" aria-labelledby="Pc-Cat">
                            <div class="list-group">
                                <div class="list-group-item ProductCategorySelector border-0 p-0" data-acc-step>
                                    <div class="list-group-item-inn">
                                        <!--h5 class="mb-0" data-acc-title>
                                                                    @if (request()->status == 'pending')
    All Pending Categories
@else
    All Approved Categories
    @endif
                                                                    </h5>-->

                                        <div class="DataContent" data-acc-content>
                                            <p>Choosing the best product type ensures that you see the most appropriate data
                                                fields for your product. Browse the product types directly or use search.
                                            </p>
                                            <div id="breadcrumps">
                                                <div id="breadcrumps_tree"></div>
<div class="suggestBTN " ><button type="button" class="btn btn-outline-success  " data-id=""
                                                    id="suggest_btn" data-icon="fa fa-thumbs-up"
                                                    style="margin:3px;padding:.416rem 1rem;font-size:13px;">
                                                    {{ translate('Create and Suggest') }}
                                                </button></div>
                                                
                                            </div>
                                            <div class="CategoryListBox mt-3">
                                                <div class="position-relative" style="min-height: 300px;">
                                                    <div class="parent-absolute">
                                                        <div class="parentCategory">
                                                            <div class="addCate-input sector_input">
                                                                <input data-parent="0" id="sector_name" type="text"
                                                                    class="cate-input"
                                                                    placeholder="Search or Create Sectors">

                                                                <div data-parent="0" class="addCateIcon submitnewcat"
                                                                    style="display:none">
                                                                    <i class="icons icon-plus"></i>
                                                                </div>
                                                            </div>
                                                            <span id="sector_message" class=""
                                                                style="font-size:80%;"></span>

                                                            <ul tabindex="0" class="CategoryList c-scrollbar mainCategory"
                                                                id="tabindex0">
                                                                {{-- @foreach ($approvedList as $cate)
                                                                <li data-id="{{ $cate->id }}"> {{ $cate->name }}
                                                                </li>
                                                                @endforeach --}}

                                                                @foreach ($approvedList as $cate)
                                                                    {{-- <li data-id="{{ $cate->id }}" style="position: relative;">
                                                                        @if (!empty($cate->iconImg))
                                                                            <span class="cateProdpic">
                                                                                <img class="img-fluid" src="{{ $cate->iconImg->source }}">
                                                                            </span>
                                                                            <span class="prodCateName" id="{{ $cate->id }}">{{ $cate->name }}</span>
                                                                        @else
                                                                            <span class="cateProdpic">
                                                                                <img class="img-fluid" src="{{ url($cate->icon) }}">
                                                                            </span>
                                                                            <span id="{{ $cate->id }}" class="prodCateName" style="display: flex; justify-content: space-between; padding-left: 0px;">
                                                                                {{ $cate->name }}
                                                                                <div class="tbl-action-link"></div>
                                                                            </span>

                                                                        @endif
                                                                        <div style="position: absolute;right:7px;top:6px;z-index:10;" class="sectorToggle categorytoggle">
                                                                            <label class="aiz-switch aiz-switch-success mb-0 m-0" data-toggle="tooltip" data-placement="top" title="">
                                                                            <input type="checkbox" class="statuses" data-id="{{ $cate->id }}" data-name="{{ $cate->name }}" value="{{ $cate->sector_status }}" @if ($cate->sector_status == '1') checked @endif>
                                                                            <span></span>
                                                                            </label>
                                                                        </div>
                                                                    </li> --}}
                                                                    <li data-id="{{ $cate->id }}"
                                                                        class="{{ $cate->sector_status == '0' ? 'disableSec' : '' }}"
                                                                        style="position: relative;">
                                                                        {{-- <li data-id="{{ $cate->id }}" class="{{ $cate->sector_status == '0' ? 'disableSec' : '' }}"  style="position: relative; pointer-events: {{ $cate->sector_status == '0' ? 'none' : 'auto' }};"> --}}
                                                                        @if (!empty($cate->iconImg))
                                                                            <span id="{{ $cate->id }}"
                                                                                class="cateProdpic">
                                                                                <img class="img-fluid"
                                                                                    src="{{ $cate->iconImg->source }}">
                                                                            </span>
                                                                            <span id="{{ $cate->id }}"
                                                                                class="prodCateName">{{ $cate->name }}</span>
                                                                        @else
                                                                            <span class="cateProdpic">
                                                                                <img class="img-fluid"
                                                                                    src="{{ url($cate->icon) }}">
                                                                            </span>
                                                                            <span id="{{ $cate->id }}"
                                                                                class="prodCateName"
                                                                                style="display: flex; justify-content: space-between; padding-left: 0px;">
                                                                                {{ $cate->name }}
                                                                                <div class="tbl-action-link"></div>
                                                                            </span>
                                                                        @endif
                                                                        <div style="position: absolute; right:7px; top:6px; z-index:10;"
                                                                            class="sectorToggle categorytoggle">
                                                                            <label
                                                                                class="aiz-switch aiz-switch-success mb-0 m-0"
                                                                                data-toggle="tooltip" data-placement="top"
                                                                                title="">
                                                                                <input type="checkbox"
                                                                                    class="sector_status"
                                                                                    data-id="{{ $cate->id }}"
                                                                                    data-name="{{ $cate->name }}"
                                                                                    value="{{ $cate->sector_status }}"
                                                                                    @if ($cate->sector_status == '1') checked @endif>
                                                                                <span></span>
                                                                            </label>
                                                                        </div>

                                                                    </li>
                                                                @endforeach

                                                            </ul>
                                                        </div>
                                                    </div>
                                                    <div class="offset-subcate c-scrollbar">
                                                        <div class="subCateCol NormalSelectorWrapper">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body MainCatAddForm p-1" style="display:none;">
                                <!-- This data is in edit.blade.php File -->
                            </div>
                            <!--MainCatAddForm-->
                        </div>
                        <!--tab-pane-->

                        <div class="tab-pane fade categoryList" id="UserCat" role="tabpanel"
                            aria-labelledby="OtherUserCat" style="position: sticky;top:64px;min-height:648px;">
                            <div class="d-flex align-items-center justify-content-between"
                                style="border-bottom:1px solid #dee2e6 !important;">
                                <ul class="nav nav-tabs border-0 stickycategorytab" id="UserCatTab" role="tablist"
                                    style="top:0px !important">

                                    <li class="nav-item">
                                        <a class="nav-link active" id="User-CatPending" data-toggle="tab"
                                            href="#UserPending" role="tab" aria-controls="UserPending"
                                            data-type="pending" aria-selected="true" style="color:#ffa500"
                                            onclick="changeTab(event, 'User-CatPending')">
                                            Pending
                                            <span class="ml-2 badge badge-dot badge-circle "
                                                style="background-color: #ffa500;color:#fff" id="pendingCountData"
                                                data-now="0">
                                            </span>
                                        </a>
                                    </li>

                                    <li class="nav-item">
                                        <a class="nav-link" id="User-CatActive" data-toggle="tab" href="#UserActive"
                                            role="tab" aria-controls="UserActive" data-type="approved"
                                            aria-selected="true" style="color:#0abb75"
                                            onclick="changeTab(event, 'User-CatActive')">
                                            Approved
                                            <span class="ml-2 badge badge-dot badge-circle"
                                                style="background-color: #0abb75;color:#fff" id="approvedCountData"
                                                data-now="0">
                                            </span>
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="User-CatRejected" data-toggle="tab" href="#UserRejected"
                                            role="tab" aria-controls="UserRejected" data-type="rejected"
                                            aria-selected="false" style="color:#d7282f"
                                            onclick="changeTab(event, 'User-CatRejected')">
                                            Rejected
                                            <span class="ml-2 badge badge-dot badge-circle badge-primary"
                                                id="rejcetedCountData" data-now="0">
                                            </span>
                                        </a>
                                    </li>
                                    <div class="selected-prod" style="display: none;">Selected Category (<span
                                            id="sProduct">0</span>)
                                        <span class="delete-select ml-2" id="deletedData" style="display:none">
                                            <a href="javascript:void(0);" id="delete_records"
                                                class="d-flex align-items-center">Delete Selected
                                                <i class="icons icon-delete" style="margin: -3px 0 0 0;"></i>
                                            </a>
                                        </span>


                                        <span class="delete-select ml-2" id="approve_catdData" style="display:none">
                                            <a href="javascript:void(0);" id="approve_records">Approve Selected
                                                <i class="icons icon-check"></i>
                                            </a>
                                        </span>
                                    </div>
                                </ul>
                                <div class="text-center"
                                    style="min-height: 712px;max-height:750px;position: absolute;top:50%;left:50%;"
                                    id="loaderr"> <img width="100" src="{{ url('public/assets/img/ZKZg.gif') }}">
                                </div>
                                <div class="table-search ml-auto">
                                    <i class="icons icon-search-s" id="memberSearch"></i>
                                    <input type="text" class="form-control form-control-sm searching" id="search"
                                        name="search" value="{{ request()->notify }}"
                                        placeholder="Search with Category">
                                </div>
                            </div>
                            <div class="tab-content mt-1 stickytabscategory" id="CategoryListTable"
                                style="min-height:600px;postion:relative ">
                                <!------ Pending Categories Tab ------>
                                <div class="tab-pane fade show active" id="UserPending" role="tabpanel"
                                    aria-labelledby="UserPending" style="min-height: 600px">
                                    <div class="common-table UserCategoriesApproved">
                                        <div class="table-responsive c-scrollbar" style="height: 600px">
                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th width="4%" class="text-center tbl-shadow">
                                                            <div class="custom-checkbox m-auto">
                                                                <input class="custom-control-input" type="checkbox"
                                                                    id="checkAll">
                                                                <label class="custom-control-label"
                                                                    for="checkAll"></label>
                                                            </div>
                                                        </th>
                                                        <th class="text-center">S.No.</th>
                                                        <th style="width:20%">{{ translate('User Detail') }}</th>
                                                        <th class="td-width-60">{{ translate('Category') }}</th>
                                                        <th class="td-width-60 row_action">Status</th>
                                                        <th class="td-width-10">{{ translate('Created On') }}</th>
                                                        <th class="td-width-10">{{ translate('Product Count') }}</th>
                                                        <th class="td-width-10 text-center">{{ translate('Action') }}
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody id="pendingData">

                                                    <div class="ajax-loader categoryloader" style=" display:none;">
                                                        <img width="100"
                                                            src="{{ url('public/assets/img/ZKZg.gif') }}">
                                                    </div>
                                                </tbody>
                                                <tfoot class="tablePagination">

                                                    {!! $loadmore !!}
                                                </tfoot>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <!--tab-pane-->

                                <!------ Approved Categories Tab ------>

                                <div class="tab-pane" id="UserActive" role="tabpanel" aria-labelledby="UserActive">
                                    <div class="common-table UserCategoriesApproved">
                                        <div class="table-responsive c-scrollbar" style="height: 600px">
                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th width="4%" class="text-center tbl-shadow">
                                                            <div class="custom-checkbox m-auto">
                                                                <input class="custom-control-input" type="checkbox"
                                                                    id="checkAll1">
                                                                <label class="custom-control-label"
                                                                    for="checkAll1"></label>
                                                            </div>
                                                        </th>
                                                        <th class="">S.No.</th>
                                                        <th class="td-width-15">{{ translate('User Detail') }}</th>
                                                        <th class="td-width-60">{{ translate('Category') }}</th>
                                                        <th class="td-width-10">{{ translate('Created On') }}</th>
                                                        <th>{{ translate('Product Count') }}</th>
                                                        {{-- <th class="td-width-10 text-center">{{ translate('Action') }} --}}
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody id="approvedData">

                                                </tbody>
                                                <tfoot class="tablePagination">


                                                    {!! $loadmore !!}



                                                </tfoot>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <!--tab-pane-->

                                <!------ Rejected Categories Tab ------>

                                <div class="tab-pane" id="UserRejected" role="tabpanel" aria-labelledby="UserRejected">
                                    <div class="common-table UserCategoriesApproved">
                                        <div class="table-responsive c-scrollbar" style="height: 600px">
                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th width="4%" class="text-center tbl-shadow">
                                                            <div class="custom-checkbox m-auto">
                                                                <input class="custom-control-input" type="checkbox"
                                                                    id="checkAll2">
                                                                <label class="custom-control-label"
                                                                    for="checkAll2"></label>
                                                            </div>
                                                        </th>
                                                        <th class="">S.No.</th>
                                                        <th class="td-width-15">{{ translate('User Detail') }}</th>
                                                        <th class="td-width-60">{{ translate('Category') }}</th>
                                                        <th class="td-width-60">{{ translate('Rejection Reason') }}</th>
                                                        <th class="td-width-10">{{ translate('Created On') }}</th>
                                                        <th class="td-width-10">{{ translate('Product Count') }}</th>
                                                        <th class="td-width-10 text-center">{{ translate('Action') }}
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody id="rejectedData">

                                                </tbody>
                                                <tfoot class="tablePagination">
                                                    {!! $loadmore !!}
                                                </tfoot>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <!--tab-pane-->
                            </div>
                        </div>
                        <div class="text-center"
                            style="min-height: 712px;max-height:750px;position: absolute;top:50%;left:50%;display:none;"
                            id="loaderrr"> <img width="100" src="{{ url('public/assets/img/ZKZg.gif') }}">
                        </div>

                        <!--tab-pane-->
                    </div>
                </div>
                <!--CategoryList-->
                <!--Activity Section Start-->

                <!--Activity Section End-->
            </div>
            <!--cardbody-->
        </div>
    </div>
@endsection

@section('modal')
    @include('modals.delete_modal')
    @include('modals.approve_modal')
    @include('modals.reject_modal')
    @include('modals.sector_modal')
    @include('modals.suggestion_modal')
    <!-- Start Modal Edit CATEGORY SIDEBAR RIGHT-->

    <div class="modal fade right AddNewCatSidebar edit-category" id="sidebar-right" tabindex="-1" role="dialog">

        <div class="modal-dialog modal-md" role="document">
            <div class="modal-content">
                <div class="modal-header close-btn" style="padding: 16px 16px 0px 16px;">
                    <button type="button" class="close" data-dismiss="modal" style="">&times;</button>
                    <h4 class=""
                        style="border-bottom:1px solid rgba(0,0,0,.1);width:100%;padding:0rem 0 12px 0;font-size:18px;">
                        Edit Category</h4>
                    {{-- <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">
                    <i class="fa fa-times"></i></span>
                </button> --}}
                </div>
                <div class="modal-body" style="padding:0 16px 16px 16px;">

                </div>
                <!--modal-body-->

            </div>
        </div>
    </div>

    <!--modal-->
    <!-- Start Modal Edit CATEGORY SIDEBAR RIGHT-->
@endsection
@section('script')
    <script type="text/javascript">
        $(document).ready(function() {

            $(document).on('keypress', 'input.cate-input', function(event) {
                if (event.keyCode === 13) {
                    // $(document).find('#createAutomatics').click();
                    $(this).closest('.addCate-input').find('div.addCateIcon').click();
                    $(this).keyup();
                    $(this).val('');
                }
            });

            $(document).on('click', '#UpdateFromCategoryform', function(event) { 
                event.preventDefault();

                const button = $(this);
                const spinner = button.find('.spinner');
                const saveDataSpan = button.find('#saveData');
                const nameInput = $('#name');

                if (nameInput.val().trim() !== '') {
                    saveDataSpan.hide();
                    spinner.show();

                    setTimeout(function() {
                        spinner.hide();
                        saveDataSpan.show();
                        button.closest('form').submit();
                    }, 2000);
                } else {

                }
            });

            function showLoadingAnimation() {
                $('#productListData').show();
                $('.CategoryListPage').hide();
            }

            function hideLoadingAnimation() {
                $('#productListData').hide();
                $('.CategoryListPage').show();
            }

            $(document).ready(function() {
                $('.CategoryListPage').hide();
                $.ajax({
                    type: "GET",
                    url: "{{ url('/admin/category/count') }}",
                    beforeSend: function() {
                        showLoadingAnimation();
                    },
                    success: function(data) {
                        hideLoadingAnimation();
                    },
                    error: function(xhr, status, error) {
                        hideLoadingAnimation();
                        console.error("AJAX request failed:", error);
                    }

                });
            });

            $(document).find('ul#UserCatTab li a span,ul#CategoryList li a span').text('0');

            function loadcount() {
                $.ajax({
                    type: "GET",
                    url: "{{ url('/admin/category/count') }}",
                    success: function(response) {
                        $('ul#UserCatTab').find('li a span#pendingCountData').text(response
                            .pending_count);
                        $('ul#UserCatTab').find('li a span#approvedCountData').text(response
                            .approved_count);
                        $('ul#UserCatTab').find('li a span#rejcetedCountData').text(response
                            .rejected_count);
                        $('ul#CategoryList').find('li a span#totalPendingCount').text(response
                            .pending_count);
                    }
                });
            }

            loadcount();

            function runCate2(url, type = 'pending') {
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                if (url) {
                    var PassURL = url;
                } else {
                    var PassURL = '{{ url('/admin/categories/get/1') }}';
                }
                if (type == "pending") {
                    var IDSet = "pendingData";
                } else if (type == "approved") {
                    var IDSet = "approvedData";
                } else if (type == "rejected") {
                    var IDSet = "rejectedData";
                }

                $.ajax({
                    url: PassURL,
                    method: 'get',
                    dataType: "json",
                    data: {
                        'type': type,
                    },
                    success: function(data) {
                        //  if(data.status==true){
                        $(document).find('#' + IDSet).html(data.html);
                        if (data.nextpage) {

                            $(document).find('.tablePagination').show();
                            $(document).find('.attribute_conbinations_paginate').attr('data-link', data
                                .nextpage);
                            $(document).find('.attribute_conbinations_paginate').attr('data-type', data
                                .type);
                            $(document).find('.tablePagination .totalMatrix').html(
                                'Total Rows: <span>' + data
                                .left + ' - ' + data.total + ' </span>');

                        } else {
                            $(document).find('.tablePagination').hide();
                        }
                        $('.fancy-spinner').hide();
                        loadcount();
                    },
                });
            }

            $(document).on('click', '.attribute_conbinations_paginate', function(event) {
                var callLink = $(this).attr('data-link');
                var type = $(this).attr('data-type');
                runCate(callLink, type, );
            });

            $(document).on('keyup', '#rejection_comment', 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', '#UserCatTab li a', function() {
                $('#checkAll').prop('checked', false);
                $('#checkAll1').prop('checked', false);
                $('#checkAll2').prop('checked', false);
                $('#sProduct').text('0');
                $("#deletedData").hide();
                $("#approve_catdData").hide();
                //$('input[type=checkbox]').prop('checked', false);
                var type = $(this).attr('data-type');
                if (type == "pending") {
                    var IDSet = "pendingData";
                } else if (type == "approved") {
                    var IDSet = "approvedData";
                } else if (type == "rejected") {
                    var IDSet = "rejectedData";
                }

                $(document).find('#' + IDSet).html('');
                runCate('', type);
            });
            runCate(); 

            $(document).on('click', 'a[title="Edit"]', function(e) {
             
                e.preventDefault();
                var THI = $(this);
                var catID = THI.data('id');

                if (catID == "") {
                    return false;
                }

                $.ajax({
                    url: '{{ url('/admin/categories/edit/') }}/' + catID,
                    dataType: 'html',
                    type: 'get',
                    success: function(data) {
                        var $modal = $(document).find('#sidebar-right');
                        var $modalBody = $modal.find('.modal-body');
                        $modalBody.html(data);
                        $modal.modal('show');
                        AIZ.plugins.tagify();

                        // Add the previous functionality here
                        $('.editChange').removeClass('col-md-5 col-lg-5').addClass('col-12');
                        $('.editChange2').removeClass('col-md-7 col-lg-7').addClass('col-12');

                        // Scroll to top when the modal is shown
                        $modal.off('shown.bs.modal').on('shown.bs.modal', function() {
                            $modalBody.scrollTop(0);
                        });
                    },
                });
            });

            $(document).on('change', '#approval_status', function(e) {
                var selectedValue = $(this).val();
                var commentsSection = $('#commentsSection');
                if (selectedValue == '2') {
                    commentsSection.fadeIn();
                } else {
                    commentsSection.fadeOut();
                }
            });

            $(document).on('click', '#closebtn', function(e) {
                $(document).find('.AddNewCatSidebar').modal('hide');
            });

            $(document).on('click', '#UpdateFromCategoryform', function(e) {
                $(document).find('form.UpdateCategoryform').submit();
            });

            /*$(document).on('submit', 'form.UpdateCategoryform', function(e) {
                e.preventDefault();
                var THI = $(this);
                var catID = THI.data('id');
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });
                var Form = new FormData(this);
                var checkStatusVal = $(document).find('form.UpdateCategoryform select[name="approval_status"]').val();

                $.ajax({
                    url: '{{ url('/admin/categories/') }}/' + catID,
                    dataType: 'json',
                    cache: false,
                    contentType: false,
                    processData: false,
                    data: Form,
                    type: 'POST',
                    success: function(data) {
                        loadcount();
                        AIZ.plugins.notify('success', 'Category Update Sucessfully');
                        $('#sidebar-right').modal('hide');
                      if(checkStatusVal!="0"){
                        $("tr.cat_id_" + data.id).hide();
                      }
                    }
                });
                return false;
            });*/

            $(document).on('submit', 'form.UpdateCategoryform', function(e) {
                e.preventDefault();
                var THI = $(this);
                var catID = THI.data('id');

                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                var Form = new FormData(this);
                var checkStatusVal = THI.find('select[name="approval_status"]').val();
                var commentsVal = THI.find('textarea[name="comments"]').val();

                var description = THI.find('textarea[name="description"]').val().trim();
                description = description.replace(/<p>\s*<\/p>/g, '');
                description = description.replace(/<br\s*\/?>/g, '');
                description = description.replace(/&nbsp;/g, '');
                description = description.trim();


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

                $.ajax({
                    url: '{{ url('/admin/categories/') }}/' + catID,
                    dataType: 'json',
                    cache: false,
                    contentType: false,
                    processData: false,
                    data: Form,
                    type: 'POST',
                    success: function(data) { 
                        loadcount();
                        //$("#form-id .invalid-feedback").remove();

                        console.log('errors', data.errors);

                        if (data.errors) {
                            $("#errorKeywords").css("display", "none").text("");
                            $("#errorRatings").css("display", "none").text("");
                            $("#errorName").css("display", "block").text(data.errors.name);
                            $("#errorDesc").css("display", "block").text(data.errors
                                .description);
                            $("#errorfile1").css("display", "block").text(data.errors.icon);
                            $("#errorfile2").css("display", "block").text(data.errors.image);
                            $("#errorfile3").css("display", "block").text(data.errors.banner);
                            let hasKeywordError = Object.keys(data.errors).some(key => key.startsWith("keywords."));
                            if (hasKeywordError) {
                                    $("#errorKeywords").css("display", "block").text("Duplicate keywords are not allowed.");
                                }
                            let hasRatingError = Object.keys(data.errors).some(key => key.startsWith("ratings."));
                            if (hasRatingError) {
                                $("#errorRatings").css("display", "block").text("Each keyword must have a corresponding rating.");
                            }
                        } else {
                            setTimeout(function() {
    $('.MainCatAddForm').hide();
}, 2000); 

                            AIZ.plugins.notify('success', 'Category Update Successfully');
                            $('#sidebar-right').modal('hide');
                            if (checkStatusVal != "0" || checkStatusVal == "0") {
                                $("tr.cat_id_" + data.id).hide();
                            }
                            $(document).find("#UserCatTab li").find("a.active").trigger(
                                'click');
                        }
                        if (description === "") {
                            $("#errorDesc").css("display", "block").text(
                                'The description field is required.');
                            return false;
                        }
                    }
                });
                return false;
            });


            ///// Validation for name
            // $(document).on('input', '#name', function() {
            //     $('#errorName').text('');
            // });

            /////// Validation for description
            // $(document).on('input', '.note-editor, .note-editing-area', function() {
            //     $('#errorDesc').text('');
            // });

            $('#reject').on('click', function() {
                $('#approve').hide();
            });

            $(document).on('change', '#icon_image, #bannerOpen, #imageLogo', function() {
                var file = this.files[0];
                var inputId = $(this).attr('id');
                var errorElement = '';

                switch (inputId) {
                    case 'icon_image':
                        errorElement = '#errorfile1';
                        break;
                    case 'imageLogo':
                        errorElement = '#errorfile2';
                        break;
                    case 'bannerOpen':
                        errorElement = '#errorfile3';
                        break;
                }

                if (file) {
                    var allowedTypes = ['image/jpeg','image/webp', 'image/png', 'image/gif','image/jpg'];
                    if (allowedTypes.indexOf(file.type) === -1) {
                        $(errorElement).css("display", "block").text(
                            "The file must be a type of: jpeg, png, gif,webp");
                        $('#UpdateFromCategoryform').attr('disabled', true);
                        return false;
                    }
                    var maxSize = 500 * 1024;
                    if (file.size > maxSize) {
                        $(errorElement).css("display", "block").text(
                            "The file may not be greater than 500 KB.");
                        $('#UpdateFromCategoryform').attr('disabled', true);
                        return false;
                    }
                    $(errorElement).css("display", "none").text("");
                    $('#UpdateFromCategoryform').attr('disabled', false);

                    var fileName = $(this).val().split('\\').pop();
                    $(this).siblings('.file-amount').html(fileName);
                    readURL(this);
                }
            });

            function readURL(input) {
                if (input.files && input.files[0]) {
                    var reader = new FileReader();
                    var inputId = $(input).attr('id');
                    var previewId = '';

                    switch (inputId) {
                        case 'icon_image':
                            previewId = '#previewImageIcon';
                            break;
                        case 'imageLogo':
                            previewId = '#previewImageImage';
                            break;
                        case 'bannerOpen':
                            previewId = '#previewImageBanner';
                            break;
                    }

                    reader.onload = function(e) {
                        $(previewId).attr('src', e.target.result).show();
                    }
                    reader.readAsDataURL(input.files[0]);
                }
            }

            function checkErrors() {
                var hasError = false;
                $('.error_class_category').each(function() {
                    if ($(this).css('display') !== 'none') {
                        hasError = true;
                    }
                });

                if (hasError) {
                    $('#UpdateFromCategoryform').attr('disabled', true);
                } else {
                    $('#UpdateFromCategoryform').attr('disabled', false);
                }
            }

            $(document).on('input', '.form-control', function() {
                $(this).siblings('.invalid-feedback').hide();
            });

            $(document).on('click', '#approve', function(e) {
                e.preventDefault();
                var product_id = $(this).closest('.ReasonBox').find('#product_id').val();
                var THI = $(this);
                var catID = THI.data('id');
                var product_id = THI.attr('prop-id');
                var value = THI.val();

                $.ajax({
                    url: '{{ url('/admin/categories/') }}/' + catID,
                    dataType: 'json',
                    data: {
                        'id': catID,
                        'comments': '',
                        'approval_status': 1,
                        'product_id': product_id,
                        '_token': '{{ csrf_token() }}'
                    },
                    type: 'PATCH',
                    success: function(data) {
                        loadcount();
                        AIZ.plugins.notify('success', 'Category Approved');
                        $("tr.cat_id_" + data.id).hide();

                        @if (request()->notify)
                            window.location.href = "{{ url('admin/categories?notify=') }}";
                            return false;
                        @else
                            $(document).find("#UserCatTab li").find("a.active").trigger(
                                'click');
                        @endif
                        //$(document).find("#UserCatTab li").find("a.active").trigger('click');
                    }
                });
                $(document).find('#collapseExample' + catID).collapse('hide');
            });

            $(document).on('click', '.cat_rejected', function(e) {
                var propId = $(this).attr('prop-id');
                $('.updaterejected').attr('prop-id', propId);
                $('#reason_list select').val('');
                $('.cancel_btn').show();
                $('#reason_list').show();
                $('#suggest_new').show();
                $('.suggestion_box').hide();

                const popup = document.getElementById('reason_list');
                if (popup) {
                    const rect = this.getBoundingClientRect();
                    const bodyWidth = document.body.offsetWidth;

                    let rightPosition;
                    let popupWidth = popup.offsetWidth;

                    if (window.innerWidth <= 768) {
                        rightPosition = rect.right -
                            popupWidth;
                    } else if (window.innerWidth >= 769 && window.innerWidth <= 899) {
                        rightPosition = Math.min(rect.right, bodyWidth - popupWidth - 50);
                    } else if (window.innerWidth >= 900 && window.innerWidth <= 1023) {
                        rightPosition = Math.min(rect.right, bodyWidth - popupWidth - 460);
                    } else if (window.innerWidth >= 1024 && window.innerWidth <= 1279) {
                        rightPosition = Math.min(rect.right, bodyWidth - popupWidth - s70);
                        // popup.style.width = '700px';

                    } else if (window.innerWidth >= 1280 && window.innerWidth <= 1556) {
                        popupWidth = 1000;
                        rightPosition = Math.min(rect.right, bodyWidth - popupWidth - 280);
                        // popup.style.width = '700px';
                    } else {
                        rightPosition = Math.min(rect.right, bodyWidth - popupWidth - 1010);
                    }

                    popup.style.right = `${rightPosition}px`;
                    let top = rect.bottom + window.scrollY - (window.innerWidth <= 768 ? 100 : 290);
                    popup.style.top = `${top}px`;
                }
                // Find the nearest item and set its value
                let nearestRow = $(this).closest('tr').find('.userCateListing');
                let nearestItem = nearestRow.find('li .app_cat').last().text().trim();
                let nearestItemId = nearestRow.find('li .app_cat').last().attr('id');

                // $('#suggestion').val(nearestItem);
                $('#product_id').val(result);
                // $.ajax({
                //     url: "{{ url('/admin/category/getProductId') }}" + '/' +
                //         nearestItemId,
                //     type: "get",
                //     success: function(result) {
                //     $('#product_id').val(result);
                //     }
                // });
            });

            $(document).on('click', '.cancel_btn', function(e) {
                $(this).closest('#reason_list').find('.cancel_btn').hide();
                $('#reason_list').hide();
                $('#suggest_new').hide();
                $('.suggestion_box').hide();
            });
            
            $(document).on('click', '.updaterejected', function(e) {

                var getMessage = $(this).closest('.ReasonBox').find('.AddCateComment').val();
                var suggestion = $(this).closest('.ReasonBox').find('#suggestion').val();
                var category_lists = $(this).closest('.ReasonBox').find('#category_lists').val();  
                var THI = $(this);
                var catID = THI.data('id');
                var product_id =   THI.attr('prop-id');
                var type = $("#UserCatTab li").find("a.active").data('type');

                if (getMessage !== "") {
                    $.ajax({
                        url: '{{ url('/admin/categories/') }}/' + catID,
                        dataType: 'json',
                        data: {
                            'id': catID,
                            'comments': getMessage,
                            'suggested_category': suggestion,
                            'category_lists': category_lists,
                            'product_id': product_id,
                            'approval_status': 2,
                            '_token': '{{ csrf_token() }}'
                        },
                        type: 'PATCH',

                        success: function(data) {
                            $('#suggestion_modal').modal('hide');

                            if (data.status == 1) {
                                loadcount();
                                AIZ.plugins.notify('success', 'Category Rejected');
                                $("tr.cat_id_" + data.id).hide();

                                @if (request()->notify)
                                    window.location.href =
                                        "{{ url('admin/categories?notify=') }}";
                                    return false;
                                @else
                                    $(document).find("#UserCatTab li").find("a.active").trigger(
                                        'click');
                                @endif
                                $(this).parent('tr').hide();
                            }
                            //$(document).find("#UserCatTab li").find("a.active").trigger('click');
                        }
                    });
                } else {


                    AIZ.plugins.notify('danger', 'Please adddddd Rejection Reason');
                }
            });

            $('#User-CatActive').click(function() {
                $('#row_action').hide();
            });

            /////Power Cozmo Categories pop up ///// 
            $(document).ready(function() {
                function updateBreadcrumbAndSuggestion() {
                    var breadcrumb = '';
                    var suggestion = ''; 
                    $('#breadcrumps_tree').empty(); 
                    var breadcrumbUl = $('<ul>').attr('id', 'category_tree'); 
                    var breadcrumbIdUl = $('<ul>').attr('id', 'category_list');
 
                    $('ul.mainCategory').each(function(index) {
                        var activeItem = $(this).find('li.active');
                        if (activeItem.length > 0) {
                            var text = activeItem.text().trim();  
                            var dataId = activeItem.data(
                                'id');  

                            if (text) {   
                                var li = $('<li>').text(text).attr('data-id', dataId); 
                                var liId = $('<li>').text(dataId); 
                                if (index > 0) {
                                    breadcrumbUl.append($('<span>').text(' > '));
                                    breadcrumbIdUl.append($('<span>').text(' , '));
                                }
 
                                breadcrumbUl.append(li);
                                breadcrumbIdUl.append(liId);

                                if (breadcrumb) {
                                    breadcrumb += ' > ' + text;
                                    suggestion += ' > ' + text;
                                    // suggestion += ' > ' + text + ' (ID: ' + dataId + ')';
                                } else {
                                    breadcrumb = text;
                                    suggestion = text;
                                    // suggestion = text + ' (ID: ' + dataId + ')';
                                }
                            }
                        }
                    });
 
                    $('#breadcrumps_tree').append(breadcrumbUl);
                    $('#breadcrumps_tree').append(breadcrumbIdUl);
 
                    if (suggestion) {
                        $('#suggestion').val(suggestion);
                    }
                }

                $(document).on('click', 'ul.mainCategory li', function(e) {
                    $('#breadcrumps').show();
                    $('#breadcrumps').css('display', 'flex');

                    e.preventDefault(); 
 
                    $(this).closest('ul').find('li').removeClass('active');
                    $(this).addClass('active');

                    var ID = $(this).data('id');

                    if (!ID) {
                        return false;
                    }

                    var TabIndex = $(this).closest('ul').attr('tabindex');
                    $('.prodCateDescribe').hide();
                    if (TabIndex === "0") {
                        $(document).find('.NormalSelectorWrapper').empty();
                    }
                    var getID = $(this).closest('.subCategory').attr('data-row');
                    $(".subCateCol").find('#tabMain' + getID).nextAll().remove();

                    loadEditForm(ID);
                    $(document).find('.MainCatAddForm').show();

                    calcualte_width();
                    TabIndex = addOne(TabIndex);
                    $('#tabMain' + TabIndex + '++').remove();

                    $('#category_id').val(ID);
                    $(document).find('input[name="parent_id"]').val(ID);

                    updateBreadcrumbAndSuggestion();

                    getChildCategory(ID, $('.NormalSelectorWrapper'), "Sub Category 1", TabIndex);

                    var SERVER = $(document).find('#tabMain' + TabIndex + ' .addCate-input');
                    SERVER.find('input').attr('data-parent', ID);
                    SERVER.find('.submitnewcat').attr('data-parent', ID);
                });

                function getChildCategory(parentId, childElement, emptyText, selectedId) {

                    $('.fancy-spinner').show();
                    $.ajax({
                        url: '{{ route('admin.getChildCategory', '') }}/' + parentId,
                        dataType: 'json',
                        success: function(data) {
                            $('.fancy-spinner').hide();
                            var synced = '';
                            checkExisting = $(document).find(
                                '.NormalSelectorWrapper #tabindex' + selectedId).length;
                            if (checkExisting == "0") {
                                synced += ('<div data-row="' + selectedId + '" id="tabMain' +
                                    selectedId +
                                    '" class="subCategory"><div class="addCate-input category_input" > <input data-parent="' +
                                    parentId +
                                    '" type="text" class="cate-input position-relative" placeholder="Search or Create"> <div data-parent="' +
                                    parentId +
                                    '" class="addCateIcon submitnewcat"  style="display:none;"> <i class="icons icon-plus"></i> </div> </div><span id="category_message" class="" style="font-size:80%;width:100%;display:block;position:absolute;top:42px;"></span><ul tabindex="' +
                                    selectedId +
                                    '" class="CategoryList c-scrollbar mainCategory" id="tabindex' +
                                    selectedId + '">');
                            }

                            $.each(data, function(k, data) {
                                var liClass = data.sector_status == 0 ? 'disableSec' :
                                    '';
                                synced += '<li data-id="' + data.id + '" class="' +
                                    liClass +
                                    '" style="display: flex; justify-content: space-between;">' +
                                    '<span>' + data.name + '</span>' +
                                    '</li>';
                            });

                            // $.each(data, function(k, data) {
                            //     synced += '<li data-id="' + data.id +
                            //         '" style="display: flex;justify-content: space-between";>' +
                            //         '<span>' + data.name + '</span>' +
                            //     '</li>';
                            // });

                            if (checkExisting == "0") {
                                synced += ('</ul> </div>');
                            }
                            if (checkExisting == "0") {
                                childElement.append(synced);
                            } else {
                                childElement.find('#tabindex' + selectedId).html('').append(
                                    synced);
                            }
                        }
                    });
                }

                $(document).on('keyup', ".parentCategory .addCate-input input[type='text']", function() {
                    var value = $(this).val().toLowerCase();
                    if (value.length > 0) {
                        $(this).closest('.parentCategory').find('.submitnewcat').show();
                    } else {
                        $(this).closest('.parentCategory').find('.submitnewcat').hide();
                    }
                    $(this).closest('.parentCategory').find('ul.mainCategory li').each(function() {
                        if ($(this).text().toLowerCase().search(value) > -1) {
                            $(this).show();
                        } else {
                            $(this).hide();
                        }
                    });
                });
            });

            /////Power Cozmo Categories popup end /////

            // $(document).on('click', 'ul.mainCategory li', function(e) {

            //     $(this).closest('ul').find('li').removeClass('active');
            //     var ID = $(this).data('id');

            //     if (ID == "") {
            //         return false;
            //     }



            //     $(this).addClass('active');
            //     var getValue = $(this).text();
            //     var TabIndex = $(this).closest('ul').attr('tabindex');
            //     //class="CategoryList c-scrollbar mainCategory" id="tabindex0" >

            //     $('.prodCateDescribe').hide();
            //     //    var getLenght =  $('ul.mainCategory').length;
            //     // NormalSelectorWrapper
            //     //   TabIndex = TabIndex + parseInt(1);

            //     if (TabIndex == "0") {
            //         $(document).find('.NormalSelectorWrapper').html('');
            //     }

            //     var getID = $(this).closest('.subCategory').attr('data-row');
            //     $(".subCateCol").find('#tabMain' + getID).nextAll().remove();

            //     // $(document).find('input[name="name"]').val(getValue);

            //     //  $(document).find('.MainCatAddForm').attr('action', '{{ url('/admin/categories/') }}/' + ID + '/update_send')
            //     // $(document).find('.MainCatAddForm').show();

            //     // loadEditForm(ID);
            //     //  $(document).find('.MainCatAddForm').show();


            //     var setBREA = $('.SelectedCategory .breadcrumb');
            //     setBREA.html('');

            //     var total = $(document).find('ul.mainCategory').length;
            //     calcualte_width();
            //     TabIndex = addOne(TabIndex)
            //     $('#tabMain' + TabIndex + '++').remove();

            //     $('#category_id').val(ID);

            //     $(document).find('input[name="parent_id"]').val(ID);
            //     getChildCategory(ID, $('.NormalSelectorWrapper'), "Sub Category 1", TabIndex);

            //     var SERVER = $(document).find('#tabMain' + TabIndex + ' .addCate-input');

            //     SERVER.find('input').attr('data-parent', ID);
            //     SERVER.find('.submitnewcat').attr('data-parent', ID);
            // });

            $(document).on('keyup', ".parentCategory .addCate-input input[type='text']", function() {
                var value = $(this).val().toLowerCase();
                if (value.length > 0) {
                    $(this).closest('.parentCategory').find('.submitnewcat').show();
                } else {
                    $(this).closest('.parentCategory').find('.submitnewcat').hide();
                }
                $(this).closest('.parentCategory').find('ul.mainCategory li').each(function() {
                    if ($(this).text().toLowerCase().search(value) > -1) {
                        $(this).show();
                    } else {
                        $(this).hide();
                    }
                });
            });

            $(document).on('keyup', ".subCateCol .addCate-input input[type='text']", function() {

                var value = $(this).val().toLowerCase();
                console.log(value);
                if (value.length > 0) {
                    $(this).closest('.subCategory').find('.submitnewcat').show();
                } else {
                    $(this).closest('.subCategory').find('.submitnewcat').hide();
                }

                $(this).closest('.subCategory').find('ul.mainCategory li').each(function() {
                    if ($(this).text().toLowerCase().search(value) > -1) {
                        $(this).show();
                    } else {
                        $(this).hide();
                    }
                });
            });

            /////Sector Input Name Validation
            var maxLength = 100;
            $(document).on('input keydown', '.sector_input input', function(e) {
                var length = $(this).val().length;

                if (length > maxLength) {
                    $('#sector_message').text('Sector name must be of 100 characters').addClass(
                        'text-danger').show();
                    if (e.type === 'keydown' && e.key === 'Enter') {
                        e.preventDefault();
                    }
                } else {
                    $('#sector_message').text('').removeClass('text-danger').hide();
                }
            });

            ///Category Input Name Validation
            var maxLength = 100;
            $(document).on('input keydown', '.category_input input', function(e) {
                var length = $(this).val().length;

                if (length > maxLength) {
                    $('#category_message').text('Category name must be of 100 characters').addClass(
                        'text-danger').show();
                    if (e.type === 'keydown' && e.key === 'Enter') {
                        e.preventDefault();
                    }
                } else {
                    $('#category_message').text('').removeClass('text-danger').hide();
                }
            });

            $(document).on('click', '.addCateIcon.submitnewcat', function(e) {
                e.preventDefault();

                var THI = $(this);
                var localDIV = $(this).closest('.addCate-input');
                var insert = localDIV.find('input').val();
                var parentID = $(this).attr('data-parent');

                if (insert === "" || parentID === "" || insert.length > maxLength) {
                    return false;
                }
                $.ajax({
                    url: '{{ route('admin.category.createfromTabs') }}',
                    dataType: 'json',
                    data: {
                        'parent_id': parentID,
                        'name': insert,
                        '_token': '{{ csrf_token() }}'
                    },
                    type: 'post',
                    success: function(dataResponse) {
                        if (dataResponse.id) {
                            var list = parentID == "0" ? '.parentCategory ul.CategoryList' : THI
                                .closest('div.subCategory').find('ul.CategoryList');

                            if (parentID == "0") {
                                var newListItem = `
                                    <li data-id="${dataResponse.id}" class="${dataResponse.sector_status == '0' ? 'disableSec' : ''}" style="position: relative;">
                                        <span id="${dataResponse.id}" class="cateProdpic">
                                            <img class="img-fluid" src="${dataResponse.iconImg ? dataResponse.iconImg.source : '{{ url('/public/assets/img/prod-detail.png') }}'}">
                                        </span>
                                        <span id="${dataResponse.id}" class="prodCateName" style="display: flex; justify-content: space-between; padding-left: 0px;">
                                            ${dataResponse.value}
                                            <div class="tbl-action-link"></div>
                                        </span>
                                        <div style="position: absolute; right:7px; top:6px; z-index:10;" class="sectorToggle categorytoggle">
                                            <label class="aiz-switch aiz-switch-success mb-0 m-0" data-toggle="tooltip" data-placement="top" title="">
                                                <input type="checkbox" class="sector_status" data-id="${dataResponse.id}" data-name="${dataResponse.value}" value="${dataResponse.sector_status}" ${dataResponse.sector_status == '1' ? 'checked' : ''}>
                                                <span></span>
                                            </label>
                                        </div>
                                    </li>`;

                                $(list).prepend(newListItem);
                            } else {
                                
                                $(list).prepend('<li data-id="' + dataResponse.id + '">' +
                                    dataResponse.value + '</li>');
                                    $('.CategoryList li[data-id="' + dataResponse.id + '"]').click();
                            }

                            loadEditForm(dataResponse.id);
                            $(document).find('.MainCatAddForm').show();
                            localDIV.find('input').val('');
                        } else {
                            AIZ.plugins.notify('danger', dataResponse.error.name);
                        }
                        if (dataResponse.sector_status == '0') {
                            $(document).find('.NormalSelectorWrapper ul.mainCategory li')
                                .addClass('disableSec');
                        } else {
                            $(document).find('.NormalSelectorWrapper ul.mainCategory li')
                                .removeClass('disableSec');
                        }
                    }
                });
            });

            // Category Search  By Name   & On change  data

            /* $("#search").keyup(function() {
                var query = $(this).val();
                var type = $('ul#UserCatTab').find('li a.active').data('type');
                var ordrBy = $("#type").val();

                if (type == "pending") {
                    var IDSet = "pendingData";
                } else if (type == "approved") {
                    var IDSet = "approvedData";
                } else if (type == "rejected") {
                    var IDSet = "rejectedData";
                }

                $.ajax({
                    url: '{{ url('/admin/get_category_data_by_ajax') }}',
                    method: 'GET',
                    data: {
                        'name': query,
                        'type': type,
                        'ordrBy': ordrBy
                    },

                    success: function(data) {
                        $(document).find('#' + IDSet).empty().append(data.html);
                        if (data.nextpage) {

                            $(document).find('.tablePagination').show();
                            $(document).find('.attribute_conbinations_paginate').attr(
                                'data-link', data.nextpage);
                            $(document).find('.attribute_conbinations_paginate').attr(
                                'data-type', data.type);
                            $(document).find('.tablePagination .totalMatrix').html(
                                'Total Rows: <span>' + data
                                .left + ' - ' + data.total + ' </span>');

                        } else {
                            $(document).find('.tablePagination').hide();
                        }

                        $('.fancy-spinner').hide();

                    },
                });
            }); */

            $("#search").on('keyup', function(event) {
                if (event.keyCode === 13) {
                    getData();
                }
            });

            $("#memberSearch").on('click', function() {
                getData();
            });

            function getData() {
                var query = $("#search").val();
                var type = $('ul#UserCatTab').find('li a.active').data('type');
                var ordrBy = $("#type").val();

                var IDSet;
                if (type === "pending") {
                    IDSet = "pendingData";
                } else if (type === "approved") {
                    IDSet = "approvedData";
                } else if (type === "rejected") {
                    IDSet = "rejectedData";
                }

                $.ajax({
                    url: '{{ url('/admin/get_category_data_by_ajax') }}',
                    method: 'GET',
                    data: {
                        'name': query,
                        'type': type,
                        'ordrBy': ordrBy
                    },
                    success: function(data) {
                        $('#' + IDSet).empty().append(data.html);
                        if (data.nextpage) {
                            $('.tablePagination').show();
                            $('.attribute_conbinations_paginate').attr('data-link', data.nextpage);
                            $('.attribute_conbinations_paginate').attr('data-type', data.type);
                            $('.tablePagination .totalMatrix').html('Total Rows: <span>' + data.left +
                                ' - ' + data.total + ' </span>');
                        } else {
                            $('.tablePagination').hide();
                        }
                        $('.fancy-spinner').hide();
                    },
                });
            }

            $('#type').on('change', function(e) {
                var query = $("#search").val();
                var type = $('ul#UserCatTab').find('li a.active').data('type');
                var ordrBy = $(this).val();
                if (type == "pending") {
                    var IDSet = "pendingData";
                } else if (type == "approved") {
                    var IDSet = "approvedData";
                } else if (type == "rejected") {
                    var IDSet = "rejectedData";
                }
                $.ajax({
                    url: '{{ url('/admin/get_category_data_by_ajax') }}',
                    method: 'GET',
                    data: {
                        'name': query,
                        'type': type,
                        'ordrBy': ordrBy
                    },

                    success: function(data) {
                        $(document).find('#' + IDSet).empty().append(data.html);
                        if (data.nextpage) {

                            $(document).find('.tablePagination').show();
                            $(document).find('.attribute_conbinations_paginate').attr(
                                'data-link', data.nextpage);
                            $(document).find('.attribute_conbinations_paginate').attr(
                                'data-type', data.type);
                            $(document).find('.tablePagination .totalMatrix').html(
                                'Total Rows: <span>' + data
                                .left + ' - ' + data.total + ' </span>');

                        } else {
                            $(document).find('.tablePagination').hide();
                        }

                        $('.fancy-spinner').hide();
                    },
                });
            });


            function loadEditForm(id) {
                
                $.ajax({
                    url: '{{ url('/admin/categories/edit/') }}/' + id,
                    dataType: 'html',
                    type: 'get',
                    success: function(data) {
                        $(document).find('.MainCatAddForm').html(data);
                        var parsedHTML = $(data);
                        var value = parsedHTML.find('input.category_status').val();
                        AIZ.plugins.tagify();
                        AIZ.plugins.textEditor();
                        if (value == 0) {
                            $(document).find('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'false').addClass('disableBTN');
                            $(document).find('.UpdateCategoryform .form-control').prop(
                                    'disabled', true).addClass('disableBTN');
                            // $(document).find('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', true).addClass('disableBTN');
                            $(document).find('.UpdateCategoryform .popular_brands .remove').prop(
                                'disabled', true).addClass('disableBTN').css('pointer-events',
                                'none');
                            $(document).find('.UpdateCategoryform .tagify.aiz-tag-input').attr(
                                'disabled', true).addClass('disableBTN');
                            $(document).find('.publishTxt').text('Currently Inactive');
                        } else {
                            $(document).find('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'true').removeClass('disableBTN');
                            $(document).find('.UpdateCategoryform .form-control').prop(
                                    'disabled', false).removeClass('disableBTN');
                            // $(document).find('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', false).removeClass('disableBTN');
                            $(document).find('.UpdateCategoryform .popular_brands .remove').prop(
                                'disabled', false).removeClass('disableBTN').css('pointer-events',
                                'auto');
                            $(document).find('.UpdateCategoryform .tagify.aiz-tag-input').attr(
                                'disabled', false).removeClass('disableBTN');
                            $(document).find('.publishTxt').text('Currently Active');
                        }
                    }

                });
            }

            function update_featured(el) {
                if (el.checked) {
                    var status = 1;
                } else {
                    var status = 0;
                }
                $.post('{{ route('categories.featured') }}', {
                    _token: '{{ csrf_token() }}',
                    id: el.value,
                    status: status
                }, function(data) {
                    if (data == 1) {
                        AIZ.plugins.notify('success',
                            '{{ translate('Featured categories updated successfully') }}');
                    } else {
                        AIZ.plugins.notify('danger', '{{ translate('Something went wrong') }}');
                    }
                });
            }

            function update_approval_status(el) {
                if (el.checked) {
                    var status = 1;
                } else {
                    var status = 0;
                }
                $.post('{{ route('categories.approved') }}', {
                    _token: '{{ csrf_token() }}',
                    id: el.value,
                    status: status
                }, function(data) {
                    if (data == 1) {
                        AIZ.plugins.notify('success',
                            '{{ translate('Category Approval Status updated successfully') }}');
                    } else {
                        AIZ.plugins.notify('danger', '{{ translate('Something went wrong') }}');
                    }
                });
            }

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

            function runCate(url, type = 'pending') {

                $(document).find('.tablePagination').hide();
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                if (url) {
                    var PassURL = url;
                } else {
                    var PassURL = '{{ url('/admin/categories/get/1') }}';
                }

                if (type == "pending") {
                    var IDSet = "pendingData";
                } else if (type == "approved") {
                    var IDSet = "approvedData";
                } else if (type == "rejected") {
                    var IDSet = "rejectedData";
                }

                $.ajax({
                    url: PassURL,
                    method: 'get',
                    dataType: "json",
                    data: {
                        'type': type,
                        'notify': "{{ request()->notify }}"
                    },
                    success: function(data) {
                        $(document).find('#' + IDSet).append(data.html);
                        $(document).find('.product_checkbox');
                        $(document).find('input#search').val('');

                        if (data.nextpage) {
                            $(document).find('.tablePagination').show();
                            $(document).find('.attribute_conbinations_paginate').attr('data-link', data
                                .nextpage);
                            $(document).find('.attribute_conbinations_paginate').attr('data-type', data
                                .type);
                            $(document).find('.tablePagination .totalMatrix').html(
                                'Total Rows: <span>' + data
                                .left + ' - ' + data.total + ' </span>');

                        } else {
                            $(document).find('.tablePagination').hide();
                        }
                        // $('#approve_catdData').hide();
                        // $('#deletedData').hide();
                        $('.fancy-spinner').hide();

                        if ($("input:checkbox:checked").length > 0) {

                            if (type == "pending") {
                                //  $('#approve_catdData').show();
                            }
                            // $('#deletedData').show();
                        } else {
                            $('#sProduct').text('0');
                            $('#approve_catdData').hide();
                            $('#deletedData').hide();
                        }
                    },

                });
            }

            @if (request()->has('notify'))
                $(document).find('a#OtherUserCat').trigger('click');
            @endif

            function calcualte_width() {
                var TotalWidth = $(document).find('.CategoryListBox ').width();
                /*
                var TotalWidth=$(document).find('.CategoryListBox').width();
                var totalEW= $(document).find('.CategoryListBox').prop('scrollWidth');
                var check =  totalEW-TotalWidth;

                TotalWidth = Math.abs(check);*/
                var LessWidth = $(document).find('.parent-absolute').width();
                var checktota = TotalWidth - LessWidth;
                checktota = checktota - 20;

                $(document).find('.offset-subcate').css('width', checktota);
                //var check= totalEW-totals;
            }

            function addOne(number) {
                var number = +number;
                return number + 1;
            }

            $(document).on('change', '#icon', function(e) {
                var geekss = e.target.files[0].name;
                $('#filename_text').text(geekss);
            });

            $(document).on('change', '#banner', function(e) {
                var geekss = e.target.files[0].name;
                $('#banner_fileName').text(geekss);
            });

            $(document).on('change', '#hover_icon', function(e) {
                var geekss = e.target.files[0].name;
                $('#hover_icon_text').text(geekss);
            });

            $(document).on('click', '#OtherUserCat', function(e) {  

                $('#suggest_new').hide();
                $("#searchdata").show();
                $("#breadcrumps").hide();
                $(".selected-prod").show();
                setTimeout(function() {
                    $('#loaderr').hide();
                }, 500);
            });
 
            $(document).on('click', '#Pc-Cat', function(e) {
                $('.parentCategory .mainCategory li').removeClass('active');
                $("#searchdata").hide();
                $(".selected-prod").hide();
            });

            //Delete Category
            $(document).on('click', '.confirm-delete', function() {
                var type = $("#UserCatTab li").find("a.active").data('type');
                var url = $(this).data('href');
                var checkThis = $(this);
                var id = url.substring(url.lastIndexOf('/') + 1);
                var deleteModal = $('#delete-modal');
                deleteModal.modal({
                    backdrop: 'static',
                    keyboard: false
                });
                $('#delete-link').one('click', function(e) {
                    $.ajax({
                        url: url,
                        type: 'GET',
                        data: {
                            "_token": "{{ csrf_token() }}",
                            '_method': "delete"
                        },
                        success: function(obj) {
                            AIZ.plugins.notify('success',
                                '{{ translate('Category Deleted successfully') }}');

                            //Category delete
                            if ($('.CategoryList li[data-id="' + id + '"]').closest(
                                    '.subCategory')
                                .find('.addCate-input input').data('parent')) {
                                getParent = $('.CategoryList li[data-id="' + id + '"]')
                                    .closest(
                                        '.subCategory').find('.addCate-input input')
                                    .data('parent');
                                $('.CategoryList li[data-id="' + getParent + '"]')
                                    .click();

                            } else {
                                getParent = $('.CategoryList li[data-id="' + id + '"]')
                                    .closest(
                                        '.parentCategory').find('.addCate-input input')
                                    .data(
                                        'parent');
                                $('.parentCategory ul li:first').click();
                            }
                            // Close

                            //  Other Category Delete
                            $('.CategoryList li[data-id="' + id + '"]').remove();
                            $('#delete-modal').modal('hide');
                            checkThis.closest('tbody').find('tr.cat_id_' + id).remove();

                            // $("#pendingData").find('tr.cat_id_'+id).remove();
                            //  $("#approvedData").find('tr.cat_id_'+id).remove();
                            //  $("#rejectedData").find('tr.cat_id_'+id).remove();

                            $(document).find('.MainCatAddForm').hide();
                            //Close  Other Category Delete

                            /*if (type) {
                                let callLink = "";
                                runCate(callLink, type);
                            }*/

                            var checkcount = $('.CategoryList li[data-id="' + id + '"]')
                                .closest('ul.CategoryList').find('li').length;
                            $('.CategoryList li[data-id="' + id + '"]').remove();
                            if (checkcount == "1") {
                                var IDs = $('.CategoryList li[data-id="' + id + '"]')
                                    .closest('.subCategory').attr('id');
                                $(document).find('#' + IDs).remove();
                            }
                            loadcount();
                            $(document).find("#UserCatTab li").find("a.active").trigger(
                                'click');
                        }
                    });
                });
            });

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

            // Delete Multiple Data

            $(document).on('click', '#checkAll', function() {

                $("#sProduct").text("0");
                if ($(this).is(":checked")) {
                    $("#deletedData").css("display", "block");
                    $("#approve_catdData").css("display", "block");
                    $("#restoreData").css("display", "block");
                } else {
                    $("#deletedData").css("display", "none");
                    $("#restoreData").css("display", "none");
                    $("#approve_catdData").css("display", "none");
                }
                $(".product_checkbox").prop("checked", this.checked);
                $("#select_count").html($("input.product_checkbox:checked").length + " Selected");

            });

            $(document).on('click', '#checkAll1', function() {
                $("#sProduct").text("0");
                if ($(this).is(":checked")) {
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");
                } else {
                    $("#deletedData").css("display", "none");
                    $("#restoreData").css("display", "none");
                }
                $(".product_checkbox1").prop("checked", this.checked);
                $("#select_count").html($("input.product_checkbox1:checked").length + " Selected");

            });

            $(document).on('click', '#checkAll2', function() {
                $("#sProduct").text("0");
                if ($(this).is(":checked")) {
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");
                } else {
                    $("#deletedData").css("display", "none");
                    $("#restoreData").css("display", "none");
                }
                $(".product_checkbox2").prop("checked", this.checked);
                $("#select_count").html($("input.product_checkbox2:checked").length + " Selected");
            });

            $(document).on('click', '.product_checkbox,#checkAll', function() {

                if ($('.product_checkbox:checked').length == $('.product_checkbox').length) {
                    $('#checkAll').prop('checked', true);
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");
                    $("#approve_catdData").css("display", "block");

                    $(document).find('tr').each(function() {
                        if ($(this).hasClass('brdr-none')) {
                            $(this).addClass('active');
                        }
                    });

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

                    }
                    // $('#checkAll').prop('checked', false);
                    //  $(this).closest('tr').removeClass('active');

                    if ($(this).hasClass('product_checkbox')) {

                        if ($(this).closest('tr.active').length) {
                            $(this).closest('tr').removeClass('active');
                            $(this).closest('tr').next().removeClass('active');
                        } else {
                            $(this).closest('tr').addClass('active');
                        }
                    } else {
                        $(document).find('tr').removeClass('active');
                        $(document).find('tr').next().removeClass('active');
                    }
                }
                $("#sProduct").text($("input.product_checkbox:checked").length);
            });

            $(document).on('click', '.product_checkbox1,#checkAll1', function() {
                if ($('.product_checkbox1:checked').length == $('.product_checkbox1').length) {
                    $('#checkAll1').prop('checked', true);
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");

                    $(document).find('tr').each(function() {
                        $(this).addClass('active');
                    });

                } else {
                    if ($('.product_checkbox1:checked').length == "0") {
                        $("#deletedData").css("display", "none");
                        $("#restoreData").css("display", "none");
                    } else {
                        $("#deletedData").css("display", "block");
                        $("#restoreData").css("display", "block");
                    }

                    if ($(this).hasClass('product_checkbox1')) {

                        if ($(this).closest('tr.active').length) {
                            $(this).closest('tr').removeClass('active');
                            $(this).closest('tr').next().removeClass('active');
                        } else {
                            $(this).closest('tr').addClass('active');
                        }
                    } else {
                        $(document).find('tr').removeClass('active');
                        $(document).find('tr').next().removeClass('active');
                    }

                    $('#checkAll1').prop('checked', false);
                }
                $("#sProduct").text($("input.product_checkbox1:checked").length);
            });

            $(document).on('click', '.product_checkbox2,#checkAll2', function() {
                if ($('.product_checkbox2:checked').length == $('.product_checkbox2').length) {
                    $('#checkAll2').prop('checked', true);
                    $("#deletedData").css("display", "block");
                    $("#restoreData").css("display", "block");

                    $(document).find('tr').each(function() {
                        $(this).addClass('active');
                    });

                } else {
                    if ($('.product_checkbox2:checked').length == "0") {
                        $("#deletedData").css("display", "none");
                        $("#restoreData").css("display", "none");
                    } else {
                        $("#deletedData").css("display", "block");
                        $("#restoreData").css("display", "block");
                    }

                    if ($(this).hasClass('product_checkbox2')) {

                        if ($(this).closest('tr.active').length) {
                            $(this).closest('tr').removeClass('active');
                            $(this).closest('tr').next().removeClass('active');
                        } else {
                            $(this).closest('tr').addClass('active');
                        }
                    } else {
                        $(document).find('tr').removeClass('active');
                        $(document).find('tr').next().removeClass('active');
                    }

                    $('#checkAll2').prop('checked', false);
                }
                $("#sProduct").text($("input.product_checkbox2:checked").length);
            });

            $(document).on('click', '#delete_records', function() {

                var type = $("#UserCatTab li").find("a.active").data('type');
                var products = [];
                var deleteModal = $('#delete-modal');

                $(".product_checkbox2:checked, .product_checkbox1:checked, .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) {
                        $('#approve_catdData').hide();
                        $('#sProduct').text('0');
                        $.ajax({
                            type: "POST",
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            },
                            url: "{{ url('/admin/multipleCategoryDelete') }}",
                            cache: false,
                            data: {
                                emp_id: selected_values
                            },
                            beforeSend: function() {
                                $('#loaderrr').show();
                                // $('body').addClass('OverlayBg');
                                $('#UserCat').addClass('tester');
                            },
                            success: function(response) {
                                AIZ.plugins.notify('success',
                                    '{{ translate('Category Deleted successfully') }}'
                                );
                                $('#delete-modal').modal('hide');
                                $("#deletedData").hide();
                                loadcount();

                                // $(".product_checkbox2:checked, .product_checkbox1:checked, .product_checkbox:checked").each(function() {
                                //     $(this).parent('tr').remove();
                                // });
                                var emp_ids = selected_values.split(",");
                                for (var i = 0; i < emp_ids.length; i++) {
                                    $(".cat_id_" + emp_ids[i]).closest("tr").remove();
                                }
                                $('#checkAll').prop('checked', false);
                                $('#checkAll1').prop('checked', false);
                                $('#checkAll2').prop('checked', false);
                                let callLink = "{{ url('admin/categories/get/1') }}";
                                var type = $("#UserCatTab li").find("a.active").data(
                                    'type');

                                if ($('.table tbody#pendingData tr').length == 0 &&
                                    type == 'pending') {
                                    runCate(callLink, type);
                                }
                                if ($('.table tbody#approvedData tr').length == 0 &&
                                    type == 'approved') {
                                    runCate(callLink, type);
                                }

                                if ($('.table tbody#rejectedData tr').length == 0 &&
                                    type == 'rejected') {
                                    runCate(callLink, type);
                                }

                                $('#loaderrr').hide();
                                // $('body').removeClass('OverlayBg');
                                $('#UserCat').removeClass('tester');
                                $(document).find("#UserCatTab li").find("a.active")
                                    .trigger('click');

                            },
                            error: function(xhr, status, error) {
                                console.error(xhr.responseText);
                            }
                        });
                    });
                }
            });

            $(document).on('click', '.not_delete', function() {
                AIZ.plugins.notify('danger',
                    '{{ translate('You can not delete this category because this related to product') }}'
                );
            });

            ////////////// REMOVE BANNER AND ICON IMAGE /////////////////////////////////////////////////////////

            $(document).on('click', '.remove-image', function() {
                var imageId = $(this).data('id');
                var type = $('.error-text').data('type');
                var tHis = $(this);
                var parentDiv = tHis.closest('.error-text');

                $.ajax({
                    type: 'GET',
                    url: '{{ url('admin/categories/remove-gallery-image/') }}' + imageId +
                        '?type=' + type,
                    success: function(response) {
                        if (response) {
                            parentDiv.find('.brand-image').html('');
                            parentDiv.find('.file-amount').text(
                                '{{ translate('Choose File') }}');
                            parentDiv.find('input[type="hidden"]').val('');
                            parentDiv.find('input[type="file"]').val('');
                            AIZ.plugins.notify('success', 'Image removed successfully');
                        } else {
                            AIZ.plugins.notify('danger', 'Image not removed');
                        }
                    },
                    error: function() {
                        AIZ.plugins.notify('danger', 'Error: Image removal failed.');
                    }
                });
            });

            $(document).on('change', 'input[type="file"]', function() {
                var fileName = $(this).val().split('\\').pop();
                $(this).siblings('.file-amount').html(fileName);
            });


            $(document).on('click', '#cancelButton , .close', function() {
                $('.categoryList').removeClass('tester');
            });

            $(document).on('click', '.parent-absolute .mainCategory li', function() {
                $('.MainCatAddForm').css('dispaly', 'none !important');
            });

            $(document).on('click', '#approve_records', function() {
                // $('.categoryList').addClass('tester');
                var type = $("#UserCatTab li").find("a.active").data('type');
                var products = [];
                var deleteModal = $('#approve-modal');

                $(".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
                    });

                    $('#approve-link').one('click', function(e) {
                        $('#approve-modal').modal('hide');
                        $("#approve-link").prop("disabled", true);

                        $.ajax({
                            type: "POST",
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            },
                            url: "{{ url('/admin/multipleCategoryApprove') }}",
                            cache: false,
                            data: {
                                emp_id: selected_values
                            },
                            beforeSend: function() {
                                $('#loaderrr').show();
                                // $('body').addClass('OverlayBg');
                                $('#UserCat').addClass('tester');
                            },
                            success: function(response) {
                                $("#approve-link").prop("disabled", false);
                                AIZ.plugins.notify('success',
                                    '{{ translate('Category approved successfully') }}'
                                );
                                $('#sProduct').text('0');
                                $('#approve-modal').modal('hide');
                                $("#deletedData").hide();
                                $("#approve_catdData").hide();
                                loadcount();

                                var emp_ids = response.split(",");
                                for (var i = 0; i < emp_ids.length; i++) {
                                    $(".cat_id_" + emp_ids[i]).closest("tr").remove();
                                }
                                $('#sProduct').text('0');
                                $('#approve_catdData').hide();
                                $('#deletedData').hide();

                                $('#checkAll').prop('checked', false);
                                let callLink = "{{ url('admin/categories/get/1') }}";
                                var type = $("#UserCatTab li").find("a.active").data(
                                    'type');

                                $('#loaderrr').hide();
                                // $('body').removeClass('OverlayBg');
                                $('#UserCat').removeClass('tester');
                                if ($('.table tbody#pendingData tr').length == 0) {
                                    runCate(callLink, type);
                                }
                            },
                            error: function(xhr, status, error) {
                                console.error(xhr.responseText);
                            }
                        });
                    });
                }
            });
        });


        function changeTab(event, targetId) {
            event.preventDefault();
            document.getElementById('loaderr').style.display = 'block';
            document.getElementById('CategoryListTable').style.display = 'none';
            setTimeout(function() {
                document.getElementById('loaderr').style.display = 'none';
                document.getElementById('CategoryListTable').style.display = 'block';
                const tabTrigger = new bootstrap.Tab(event.target);
                tabTrigger.show();
            }, 1000);
        }

        /////////////////////////////////////// SECTOR STATUS CHANGED ////////////////////////////////////////////////////////

        $(document).on('click', '.sector_status', function() {
            var $this = $(this);
            var id = $this.data('id');
            var $li = $this.closest('li');
            var name = $this.data('name');
            var isChecked = $this.is(":checked");
            var SetVal = isChecked ? '1' : '0';
            var sectorModal = $('#sector-modal');

            var modalText = isChecked ?
                `Are you sure you want to activate <strong>${name}</strong> sector?` :
                `Are you sure you want to deactivate <strong>${name}</strong> sector?`;

            sectorModal.find('.modal-body p').html(modalText);

            sectorModal.modal({
                backdrop: 'static',
                keyboard: false
            });

            $('#sector-link').off('click').on('click', function() {
                $.ajax({
                    type: 'POST',
                    url: "{{ route('category.sector.status') }}",
                    data: {
                        'value': SetVal,
                        'id': id
                    },
                    success: function(response) {
                        $('#sector-modal').modal('hide');

                        var finalStatus = response.sector_status == '1';
                        $this.prop('checked', finalStatus).val(response.sector_status);

                        if (finalStatus) {
                            $li.removeClass('disableSec');
                            $('.UpdateCategoryform .tagify.aiz-tag-input').attr('disabled',
                                false).removeClass('disableBTN');
                            // $('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', false).removeClass('disableBTN');
                            $('.UpdateCategoryform .form-control').prop(
                                'disabled', false).removeClass('disableBTN');
                            $('.UpdateCategoryform .popular_brands .remove').prop('disabled',
                                false).removeClass('disableBTN').css('pointer-events',
                                'auto');
                            $('.UpdateCategoryform .disabledInput').prop('disabled', false)
                                .removeClass('disableBTN');
                            $('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'true').removeClass('disableBTN');
                            $('#delbtn, #closebtn, #UpdateFromCategoryform').prop('disabled',
                                false).removeClass('disableBTN');
                            AIZ.plugins.notify('success',
                                'The Activated sector will be added to the live site for all users.'
                            );
                            $(document).find('.NormalSelectorWrapper ul.mainCategory li')
                                .removeClass('disableSec');
                        } else {
                            $li.addClass('disableSec');
                            $('.UpdateCategoryform .tagify.aiz-tag-input').attr('disabled',
                                true).addClass('disableBTN');
                            // $('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', true).addClass('disableBTN');
                            $('.UpdateCategoryform .form-control').prop(
                                    'disabled', true).addClass('disableBTN');
                            $('.UpdateCategoryform .popular_brands .remove').prop('disabled',
                                true).addClass('disableBTN').css('pointer-events', 'none');

                            $('.UpdateCategoryform .disabledInput').prop('disabled', true)
                                .addClass('disableBTN');
                            $('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'false').addClass('disableBTN');
                            $('#delbtn, #closebtn, #UpdateFromCategoryform').prop('disabled',
                                true).addClass('disableBTN');
                            AIZ.plugins.notify('success',
                                'The deactivated sector will be removed from the live site for all users.'
                            );
                            $(document).find('.NormalSelectorWrapper ul.mainCategory li')
                                .addClass('disableSec');

                        }
                        if ($('.NormalSelectorWrapper ul.mainCategory li').hasClass(
                                'disableSec')) {
                            $('.cat_status input.category_status').prop('checked', false).val(
                                '0');
                            $(document).find('.publishTxt').text('Currently Inactive');
                        } else {
                            $('.cat_status input.category_status').prop('checked', true).val(
                                '1');
                            $(document).find('.publishTxt').text('Currently Active');
                        }
                    },
                    error: function(xhr) {
                        $('#sector-modal').modal('hide');
                        AIZ.plugins.notify('danger',
                            'An error occurred while updating the sector status.');
                    }
                });
            });

            sectorModal.find('[data-dismiss="modal"]').off('click').on('click', function() {
                $this.prop('checked', !isChecked);
            });
        });

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

        /////////////////////////////////////// CATEGORY STATUS CHANGED ////////////////////////////////////////////////////////

        $(document).on('click', '.category_status', function() {
            var $this = $(this);
            var id = $this.data('id');
            var name = $this.data('name');
            var isChecked = $this.is(":checked");
            var SetVal = isChecked ? '1' : '0';
            var sectorModal = $('#sector-modal');
            var modalText = isChecked ?
                `Are you sure you want to activate <strong>${name}</strong> category?` :
                `Are you sure you want to deactivate <strong>${name}</strong> category?`;

            sectorModal.find('.modal-body p').html(modalText);

            sectorModal.modal({
                backdrop: 'static',
                keyboard: false
            });

            $('#sector-link').off('click').on('click', function() {
                $.ajax({
                    type: 'POST',
                    url: "{{ route('category.sector.status') }}",
                    data: {
                        'value': SetVal,
                        'id': id
                    },
                    success: function(response) {
                        $('#sector-modal').modal('hide');
                        var finalStatus = response.sector_status == '1';
                        $this.prop('checked', finalStatus).val(response.sector_status);
                        var statusText = finalStatus ? 'Currently Active' :
                            'Currently Inactive';
                        $this.closest('.cat_status').find('.publishTxt').text(statusText);

                        if (finalStatus) {
                            $('.UpdateCategoryform .tagify.aiz-tag-input').attr('disabled',
                                false).removeClass('disableBTN');
                            $('.UpdateCategoryform .form-control').prop(
                                'disabled', false).removeClass('disableBTN');
                            // $('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', false).removeClass('disableBTN');
                            $('.UpdateCategoryform .popular_brands .remove').prop('disabled',
                                false).removeClass('disableBTN').css('pointer-events',
                                'auto');
                            $('.UpdateCategoryform .disabledInput').prop('disabled', false)
                                .removeClass('disableBTN');
                            $('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'true').removeClass('disableBTN');
                            $('#delbtn, #closebtn, #UpdateFromCategoryform').prop('disabled',
                                false).removeClass('disableBTN');
                            $('.NormalSelectorWrapper ul.mainCategory li').removeClass(
                                'disableSec');
                            AIZ.plugins.notify('success',
                                'The Activated category will be added to the live site for all users.'
                            );
                        } else {
                            $('.UpdateCategoryform .tagify.aiz-tag-input').attr('disabled',
                                true).addClass('disableBTN');
                            // $('.UpdateCategoryform .popular_brands').prop(
                            //     'disabled', true).addClass('disableBTN');
                            $('.UpdateCategoryform .form-control').prop(
                                'disabled', true).addClass('disableBTN');
                            $('.UpdateCategoryform .popular_brands .remove').prop('disabled',
                                true).addClass('disableBTN').css('pointer-events', 'none');
                            $('.UpdateCategoryform .disabledInput').prop('disabled', true)
                                .addClass('disableBTN');
                            $('.UpdateCategoryform .note-editing-area .card-block').attr(
                                'contenteditable', 'false').addClass('disableBTN');
                            $('#delbtn, #closebtn, #UpdateFromCategoryform').prop('disabled',
                                true).addClass('disableBTN');

                            var $lastLi = $('.NormalSelectorWrapper ul.mainCategory li').last();
                            var $lastActiveLi = $(
                                '.NormalSelectorWrapper ul.mainCategory li.active').last();

                            $lastLi.addClass('disableSec');
                            $lastActiveLi.addClass('disableSec');

                            AIZ.plugins.notify('success',
                                'The deactivated category will be removed from the live site for all users.'
                            );
                        }
                    },
                    error: function(xhr) {
                        $('#sector-modal').modal('hide');
                        AIZ.plugins.notify('danger',
                            'An error occurred while updating the sector status.');
                    }
                });
            });

            sectorModal.find('[data-dismiss="modal"]').off('click').on('click', function() {
                $this.prop('checked', !isChecked);
            });
        });

        $(document).on('click', '.aiz-switch', function(e) {
            e.stopPropagation();
            let $li = $(this).closest('li');
            $li.addClass('active-aiz');
            setTimeout(function() {
                $li.removeClass('active-aiz');
            }, 100);
        });

        $(document).on('click', '#suggest_new', function(e) {

            $('#suggest_new').hide();
            $('.suggestion_box').show();
            $('#breadcrumps_tree ul').remove();
            $('.subCategory ').hide('');
            $('#suggest_btn').show();
            $('.suggestBTN').show();
            $('#Pc-Cat').click();
        });

        $(document).on('click', '#suggest_btn', function(e) {
            var breadcrumbValue = $('#breadcrumps_tree #category_list').text();
            $('#category_lists').val(breadcrumbValue);
            $('#OtherUserCat').click();
        });

        $(document).on('click', '#reject_cncl, .updaterejected', function(e) {
            $('.subCategory').hide();
            $('.MainCatAddForm').hide();
            $('#suggestion_box').hide();
            // $('.rejectionBox').hide();
            $('#breadcrumps').hide();
            $('#suggest_btn').hide();
        });

        $(document).on('change', '#rejection_comment_select', function(e) {
            e.preventDefault();
            $('#create_suggest').hide();
            $('#suggest_new').show();
            var dataContent = $('#Pc').html();
            $('#create_suggest').html(dataContent);
        });

         ////// Keywords with rating
 let removedKeywordIds = []; 
        $(document).on('click', '.remove-keyword-rating', function() {
            let masterId = $(this).closest('.keyword-rating-pair').find('input[name="master_id[]"]').val();
            
            if (masterId) {
                removedKeywordIds.push(masterId);
            }

            $(this).closest('.keyword-rating-pair').remove();
            $('#removed_keyword_ids').val(removedKeywordIds.join(','));

            updateButtons(); //temp
        });


        //ADD BUTTON
        /*
        $(document).on('click', '.add-keyword-rating', function() {
           
            let newPair = $('.keyword-rating-pair:first').clone(true); 
            var a =  $('.keyword-rating-pair:first').length;
            newPair.find('input').val(''); 
            newPair.find('.remove-keyword-rating').remove();
            newPair.find('.add-keyword-rating').remove(); 
            newPair.find('.input-group-append').append('<button class="btn btn-danger remove-keyword-rating" type="button">Remove</button>');
 
            $('#keywords-container').append(newPair);
        }); 
        */

       // Add keyword-rating pair
        $(document).on('click', '.add-keyword-rating', function() {
            
            let newPair = $('.keyword-rating-pair:first').clone(true);
            newPair.find('input').val('');
            newPair.find('.input-group-append').empty();
            newPair.find('.input-group-append').append(`
                <button class="btn btn-danger remove-keyword-rating" type="button">Remove</button>
            `);
            $('#keywords-container').append(newPair);
             
            updateButtons(); //temp
        }); 

        // Function to update the buttons: add "Add" only to the last pair
        function updateButtons() {
            let pairs = $('.keyword-rating-pair');
    
            pairs.each(function(index) {
                $(this).find('.input-group-append').empty(); // Clear buttons first

                if (pairs.length === 1) {
                    // If only one pair is left, only show the "Add" button
                    $(this).find('.input-group-append').append(`
                        <button class="btn AddMore add-keyword-rating" type="button">Add More</button>
                    `);
                } else if (index === pairs.length - 1) {
                    // If it's the last pair, show both "Add" and "Remove" buttons
                    $(this).find('.input-group-append').append(`
                        <button class="btn RemoveBTN remove-keyword-rating" type="button">Remove</button>
                         <button class="btn AddMore add-keyword-rating" type="button">Add More</button>
                    `);
                } else {
                    // All other pairs should only have "Remove"
                    $(this).find('.input-group-append').append(`
                        <button class="btn RemoveBTN remove-keyword-rating" type="button">Remove</button>
                    `);
                }
            });
        }
        updateButtons(); //temp  



        $(document).ready(function() {
    // Get the current URL
    let currentUrl = window.location.href;

    // Check if the URL ends with 'categories#OtherUserCat'
    if (currentUrl.endsWith('categories#OtherUserCat')) {
        // Trigger a click on the element with ID '#OtherUserCat'
        $('#OtherUserCat').trigger('click');
    }
});
MainCatAddForm
    </script>
@endsection