@extends('admin.layout')
    @section('content')
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="d-flex align-items-center">
                <div class="mr-auto">
                    <h3 class="page-title">{{ translate('Categories') }}</h3>
                    <div class="d-inline-block align-items-center">
                        <nav>
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ route('dashboard') }}"><i
                                            class="mdi mdi-home-outline"></i></a></li>
                                <li class="breadcrumb-item" aria-current="page">
                                    <a href="{{ route('Product.index') }}">
                                        {{ translate('Products') }}
                                    </a>
                                </li>

                                <li class="breadcrumb-item" aria-current="page">{{ translate('Categories') }}</li>

                            </ol>
                        </nav>
                    </div>
                </div>

            </div>
        </div>
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-lg-8 col-12">
                    <div class="box">
                        <div class="box-header box-header-custem">
                            <div class="app-menu">
                                <div class="row">
                                    <div class="col-lg-5 col-12">
                                        <div class="search-bx mx-5">
                                            <form action="{{ route('Category.index') }}" method="GET">
                                                <div class="input-group full-width">
                                                    <input type="search" id="search" class="form-control" name="search"
                                                        @isset($sort_search) value="{{ $sort_search }}" @endisset
                                                        placeholder="{{ translate('Search Category Name') }}"
                                                        aria-label="Search" aria-describedby="button-addon2">
                                                    <div class="input-group-append">
                                                        <button class="btn" type="submit" id="button-addon3"><i
                                                                class="ti-search"></i></button>
                                                    </div>

                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-12 d-none d-xl-block">
                                    </div>
                                    <div class="col-lg-2 col-6">
                                        <a href=""
                                            class="waves-effect waves-light btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg  animation"
                                            data-animation="flash">
                                            {{ translate('Add Category') }}
                                        </a>
                                    </div>
                                    <div class="col-lg-2 col-6">
                                        <a href="#"
                                            class=" brand_multy_delete empty-selected btn-rounded waves-light btn btn-light-broken padding-label-dashbord">
                                            {{ translate('Delete') }}
                                        </a>

                                        <a href="#" style="display: none"
                                            class="brand_multy_delete hove-selected btn-rounded waves-light btn btn-dark padding-label-dashbord">
                                            {{ translate('Delete') }}

                                            <div class="hove-selected-counter">
                                                0
                                            </div>
                                        </a>
                                    </div>

                                </div>
                            </div>

                        </div>
                        <div class="box-body">
                            @if (Session::get('tenant_subscribtion_data')['categories']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['categories'] == 1)
                                @if (sizeof($categories) > 0)
                                    <div class="table-responsive">
                                        <table id="complex_header" class="table table-lg table-separated"
                                            style="width:100%">
                                            <thead>
                                                <tr class="bg-dark">
                                                    <th class="text-center">
                                                        <div
                                                            class="th_dalet form-group  custom-control custom-checkbox pl-0">
                                                            <div class="checkbox">
                                                                <input type="checkbox" id="Checkbox_delet_all"
                                                                    class="checkbox-toggle" />
                                                                <label for="Checkbox_delet_all"></label>
                                                            </div>
                                                        </div>
                                                    </th>
                                                    <th class="text-center">{{ translate('Main Category') }}</th>
                                                    <th class="text-center">{{ translate('Title') }}</th>
                                                    <th class="text-center">{{ translate('Logo web') }}</th>
                                                    @if (Session::get('tenant_subscribtion_data')['mobile_app']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['mobile_app'] == 1)
                                                        <th class="text-center">{{ translate('Logo mob') }}</th>
                                                    @endif
                                                    <th class="text-center">{{ translate('Home category') }}</th>
                                                    <th class="text-center">{{ translate('Active') }}</th>
                                                    <th class="text-center">{{ translate('Options') }}</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach ($categories as $key => $category)
                                                    <tr class="bg-table-gray changnametr"
                                                        id="changnametr_{{ $category->id }}">
                                                        <td class="text-center">

                                                            <div class="form-group td_dalet">
                                                                <div class="checkbox">
                                                                    <input type="checkbox" class="type_select_input"
                                                                        id="Checkboxs_{{ $category->id }}"
                                                                        value="{{ $category->id }}" />
                                                                    <label for="Checkboxs_{{ $category->id }}"></label>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td class="text-center">
                                                            @if ($category->category == null)
                                                                {{ translate('Main Category') }}
                                                            @elseif( $category->category != null && $category->category)
                                                                {{ getTranslation($category->category, 'category_translations', 'title') }}
                                                            @else
                                                                {{ translate('Parent was deleted') }}
                                                            @endif
                                                        </td>
                                                        <td class="text-center">
                                                            {{ getTranslation($category, 'category_translations', 'title') }}
                                                        </td>
                                                        <td class="text-center">
                                                            @php
                                                                if ($category->logo_web) {
                                                                    $link = $category->logo_web;
                                                                } else {
                                                                    $link = '/images/noimg.png';
                                                                }
                                                            @endphp
                                                            <a class="image-popup-vertical-fit" href="{{ url($link) }}">
                                                                <img id="logo_web" src="{{ url($link) }}"
                                                                    alt="your image" style="width: 50px; height: 49px;" />
                                                            </a>
                                                        </td>
                                                        @if (Session::get('tenant_subscribtion_data')['mobile_app']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['mobile_app'] == 1)
                                                            <td class="text-center">
                                                                @php
                                                                    if ($category->logo_mob) {
                                                                        $link = $category->logo_mob;
                                                                    } else {
                                                                        $link = '/images/noimg.png';
                                                                    }
                                                                @endphp
                                                                <a class="image-popup-vertical-fit"
                                                                    href="{{ url($link) }}">
                                                                    <img id="logo_mob" src="{{ url($link) }}"
                                                                        alt="your image"
                                                                        style="width: 50px; height: 49px;" />
                                                                </a>
                                                            </td>
                                                        @endif
                                                        <td class="text-center">
                                                            @if ($category->level == 0)
                                                                <div class="form-group">
                                                                    <div class="checkbox">
                                                                        <input type="checkbox"
                                                                            id="Checkbox_{{ $key }}"
                                                                                                                                                        onchange="update_home_category(this)"
                                                                            value="{{ $category->id }}" />
                                                                        <label for="Checkbox_{{ $key }}"></label>
                                                                    </div>
                                                                </div>
                                                            @else
                                                                ------
                                                            @endif

                                                        </td>
                                                        <td class="text-center">
                                                            <div class="form-group">
                                                                <div class="checkbox">
                                                                    <input type="checkbox"
                                                                        id="Checkbox_active_{{ $key }}"
                                                                         onchange="update_active(this)"
                                                                        value="{{ $category->id }}" />
                                                                    <label
                                                                        for="Checkbox_active_{{ $key }}"></label>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td class="text-center">
                                                            <div class="dropdown">
                                                                <a class="text-fade" href="#" data-toggle="dropdown"><i
                                                                        class="si-options-vertical si"></i></a>
                                                                <div class="dropdown-menu dropdown-menu-right">
                                                                    <a class="dropdown-item" href="#"
                                                                        onclick="view_cate({{ $category->id }})"><i
                                                                            class="mdi mdi-magnify"></i>
                                                                        {{ translate('View') }}</a>
                                                                    <a class="dropdown-item"
                                                                        href="{{ route('Category.edit', encrypt($category->id)) }}"><i
                                                                            class="fa fa-edit"></i>
                                                                        {{ translate('Edit') }}</a>
                                                                    <a class="dropdown-item"
                                                                        href="{{ route('Category.translate', encrypt($category->id)) }}"><i
                                                                            class="fa fa-language"></i>
                                                                        {{ translate('Translate') }}</a>
                                                                    <a class="sa-warning dropdown-item submit_delete_form"
                                                                        data-title="{{ translate('Are you sure?') }}"
                                                                        data-no="{{ translate('Cancel') }}"
                                                                        data-yes="{{ translate('Yes, delete it!') }}"
                                                                        data-desc="{{ translate('You will not be able to recover this!') }}"
                                                                        href="#"
                                                                        data-href="{{ route('Category.destroy', $category->id) }}"><i
                                                                            class="fa fa-fw fa-trash"></i>{{ translate('Delete') }}
                                                                    </a>
                                                                </div>
                                                            </div>


                                                        </td>


                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>

                                    </div>
                                @else
                                    <div class="container">
                                        <div class="row">
                                            <div class="col-12 ">
                                                <div
                                                    class="flex-grow-1 bg-img-dashbord-nodata p-30 flex-grow-1 bg-img card-dashbord-nodata-table card-dashbord-nodata-table-Category">
                                                    <div class="row">
                                                        <div class="col-8 col-md-8">
                                                            <h4> {{ translate('There is nothing you are looking for') }}
                                                            </h4>
                                                            <p class="text-white-60 my-10 font-size-14">
                                                                {{ translate('Add new Category to your store') }}
                                                                <button type="button"
                                                                    class="waves-effect waves-circle btn btn-circle btn-light mb-5 animation"
                                                                    data-animation="flash"><i
                                                                        class="si-plus si"></i></button>
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                            @else
                                <div class="row">
                                    <div class="col-8 mx-auto text-center">
                                        <br>
                                        <img style="width: 12em;margin-bottom: 1em;"
                                            src="{{ url('/images/upgrad_limit.png') }}" alt="">
                                        <h4>
                                            {{ translate('You need to upgrade to use this feature.') }}
                                        </h4>
                                        <h4 style="color: chocolate">
                                            {{ translate('Please Upgrade to use this feature.') }}
                                        </h4>
                                        <br>
                                        <a class="btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                            href="#">{{ translate('Upgrade now') }}</a>
                                    </div>
                                </div>
                            @endif
                        </div>
                    </div>
                    <div class="dataTables_paginate paging_simple_numbers" id="example_paginate">
                        {{ $categories->links() }}
                    </div>
                </div>
                <div class="col-lg-4 col-12">
                    <div class="box box-animate-custom">
                        <div class="box-header with-border">
                            <h4 class="box-title">{{ translate('Add Category') }}</h4>
                        </div>
                        <!-- /.box-header -->
                        {!! Form::open(['method' => 'post', 'action' => 'Admin\CategoryController@store', 'files' => true, 'id' => 'add_category_form']) !!}
                        <div class="box-body">
                            <div class="form-group row">

                                <div class="col-lg col-md col-sm-12">

                                    <div class="custom-file-container">
                                        <div class="custom-file">
                                            <input type="file" name="logo_web" class="custom-file-input" id="logo_web">
                                            <label class="custom-file-label"
                                                for="logo_web">{{ translate('Logo web') }}</label>
                                        </div>

                                        <div class="bg-lightest p-10 rounded5 dvPreview text-center"
                                            style="width: 100%;margin-top: 1em;height: 10em;">
                                            <img style="max-width: 100%;height: 100%;"
                                                src="{{ url('/images/noimg.png') }}" alt="">
                                        </div>
                                    </div>
                                    @error('logo_web')
                                        <div class="badge badge-danger text-center" style="width: 100%">{{ $message }}
                                        </div>
                                    @enderror
                                </div>

                                @if (Session::get('tenant_subscribtion_data')['mobile_app']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['mobile_app'] == 1)
                                    <div class="col-lg col-md col-sm-12">

                                        <div class="custom-file-container">
                                            <div class="custom-file">
                                                <input type="file" name="logo_mob" class="custom-file-input" id="logo_mob">
                                                <label class="custom-file-label"
                                                    for="logo_mob">{{ translate('Logo mobile') }}</label>
                                            </div>

                                            <div class="bg-lightest p-10 rounded5 dvPreview text-center"
                                                style="width: 100%;margin-top: 1em;height: 10em;">
                                                <img style="max-width: 100%;height: 100%;"
                                                    src="{{ url('/images/noimg.png') }}" alt="">
                                            </div>
                                        </div>
                                        @error('logo_mob')
                                            <div class="badge badge-danger text-center" style="width: 100%">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    </div>
                                @endif
                            </div>
                            @isset($id)
                                {!! Form::hidden('category_id', $id, []) !!}
                            @endisset
                            @isset($main)
                                <div class="form-group" id="category">
                                    <label for="name">{{ translate('Parent Category') }}
                                    </label>
                                    <div>
                                        <select class="form-control select2" name="category_id"
                                            data-placeholder="{{ translate('Categories') }}" id="category_id" required>
                                            <option value="{{ null }}">{{ translate('Category') }}
                                            </option>
                                            @foreach ($categoriesAdd as $category)
                                                <option value="{{ $category->id }}">
                                                    {{ $category->getTranslation('title') }}
                                                </option>
                                                @foreach ($category->childrenCategories as $childCategory)
                                                    @include('categories.child_category_category', ['child_category' =>
                                                    $childCategory ,
                                                    'category_id' => null])
                                                @endforeach
                                            @endforeach
                                        </select>
                                    </div>
                                    @error('category_id')
                                        <div class="badge badge-danger text-center" style="width: 100%">{{ $message }}</div>
                                    @enderror
                                </div>

                            @endisset
                            <div class="form-group">
                                <label for="arrangment">{{ translate('Arrangment') }}
                                </label>
                                <div>
                                    {!! Form::number('arrangment', null, ['class' => 'form-control', 'placeholder' => translate('Arrangment')]) !!}
                                </div>
                                @error('arrangment')
                                    <div class="badge badge-danger text-center" style="width: 100%">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="title">{{ translate('Title') }}
                                </label>
                                <div>
                                    {!! Form::text('title', null, ['class' => 'form-control', 'placeholder' => translate('Title')]) !!}
                                </div>
                                @error('title')
                                    <div class="badge badge-danger text-center" style="width: 100%">{{ $message }}
                                    </div>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label for="description">{{ translate('Description') }}
                                </label>
                                <div>
                                    {!! Form::textarea('description', null, ['class' => 'form-control', 'placeholder' => translate('Description')]) !!}
                                </div>
                                @error('description')
                                    <div class="badge badge-danger text-center" style="width: 100%">{{ $message }}
                                    </div>
                                @enderror
                            </div>
                            @if (Session::get('tenant_subscribtion_data')['meta_data']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['meta_data'] == 1)
                                <div class="p-15">
                                    <div class="box-header">
                                        {{ translate('Meta') }}
                                    </div>
                                    <br>
                                    <div class="form-group row ">
                                        <div class="col-lg-6 col-12">
                                            <div class="custom-file-container">
                                                <div class="custom-file">
                                                    <input type="file" name="meta_image" class="custom-file-input"
                                                        id="meta_image">
                                                    <label class="custom-file-label"
                                                        for="meta_image">{{ translate('Meta image') }}</label>
                                                </div>
                                                <div class="bg-lightest p-10 rounded5 dvPreview"
                                                    style="width: 100%;margin-top: 1em;height: 10em;">
                                                    {{-- <a class="image-popup-vertical-fit" href="{{ url($link) }}"> --}}
                                                    <img id="logo_web" src="{{ url('/images/noimg.png') }}"
                                                        alt="your image" style="    max-width: 100%; height: 150px;" />
                                                    {{-- </a> --}}
                                                </div>

                                            </div>

                                        </div>
                                        <div class="col-lg-12 col-12">
                                            @error('meta_image')
                                                <div class="badge badge-danger text-center" style="width: 100%">
                                                    {{ $message }}
                                                </div>
                                            @enderror
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="meta_title">{{ translate('Meta title') }}
                                        </label>
                                        <div>
                                            {!! Form::text('meta_title', null, ['class' => 'form-control', 'placeholder' => translate('Meta title')]) !!}
                                        </div>
                                        @error('meta_title')
                                            <div class="badge badge-danger text-center" style="width: 100%">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    </div>
                                    <div class="form-group">
                                        <label for="meta_description">{{ translate('Meta description') }}
                                        </label>
                                        <div>
                                            {!! Form::textarea('meta_description', null, ['rows' => 4, 'class' => 'form-control', 'placeholder' => translate('Meta description')]) !!}
                                        </div>
                                        @error('meta_description')
                                            <div class="badge badge-danger text-center" style="width: 100%">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    </div>

                                </div>
                            @endif
                            <div class="form-group">
                                <div class="checkbox">
                                    {!! Form::checkbox('active', null, 0, ['id' => 'active_2']) !!}
                                    <label for="active_2">{{ translate('Active') }}</label>
                                </div>
                            </div>
                        </div>
                        {!! Form::Close() !!}
                        <!-- /.box-body -->
                        <div class="box-footer">
                            <button type="button" onclick="checkAddBrand()"
                                class="waves-effect waves-light btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                style="width: 100%;">
                                <i class="ti-save-alt"></i> {{ translate('Save') }}
                            </button>
                        </div>

                    </div>
                </div>
            </div>
        </section>
    @endsection
    @section('modal')
        <div class="modal modal-left fade" id="modal-left" tabindex="-1">
            <div class="modal-dialog">
                <div class="modal-content" id="view-category">

                </div>
            </div>
        </div>
    @endsection
    @section('script')
        @if (Session::get('tenant_subscribtion_data')['categories']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['categories'] == 1)
            <script type="text/javascript">
                function checkAddBrand() {
                    if (("{{ Session::get('tenant_subscribtion_data')['categories']['value'] }}" == 'limited' &&
                            {{ Session::get('tenant_subscribtion_data')['categories']['quantity'] }} > {{ $categoryCount }}
                        ) ||
                        "{{ Session::get('tenant_subscribtion_data')['categories']['value'] }}" == 'unlimt') {
                        $('#add_category_form').submit();
                    } else {
                        $('#UpgradLimitModelH41').text("{{ translate('You have exceeded the maximum number of add-ons') }} " +
                            {{ Session::get('tenant_subscribtion_data')['categories']['quantity'] }} +
                            " {{ translate('of categories') }}");
                        $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                        $('#UpgradLimitModel').modal();
                    }
                }
            </script>
        @else
            <script type="text/javascript">
                function checkAddBrand() {
                    $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                    $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                    $('#UpgradLimitModel').modal();
                }
            </script>
        @endif
        <script src="{{ url('js/custem/muilti_select_delete.js') }}"></script>
        <script type="text/javascript">
            // Start  select all row to delete
            // in select one
            $('.brand_multy_delete').click(function() {
                var id = [];
                $('.type_select_input:checked').each(function() {
                    id.push($(this).val());
                });
                if (id.length > 0) {
                    console.log(id);
                    swal({
                        title: `{{ translate('Are you sure to delete') }} ${id.length}  {{ translate('Categories') }}`,
                        text: "{{ translate('You will not be able to recover this!') }}",
                        type: "warning",
                        showCancelButton: true,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "{{ translate('Yes, delete it!') }}",
                        cancelButtonText: "{{ translate('Cancel') }}",
                        closeOnConfirm: false
                    }, function() {
                        // ajax to remove here
                        $.ajax({
                            url: "{{ route('categoryMultidelete') }}",
                            method: "post",
                            data: {
                                id: id,
                                _token: '{{ csrf_token() }}',
                            },
                            success: function(data) {
                                $('.bg-warning').remove().countSeletToDelete();
                                swal({
                                    title: `{{ translate('The deletion was completed successfully') }}`,
                                    text: "{{ translate('not related to products') }}",
                                    type: "success",
                                    confirmButtonColor: "#DD6B55",
                                    confirmButtonText: "{{ translate('Okey') }}",
                                    confirmOnConfirm: false
                                });
                                window.location.replace("{{ route('Category.index') }}");
                            }
                        });
                        id = [];
                        swal.close();
                    });
                } else {
                    swal({
                        title: `{{ translate('please select one.') }}`,
                        confirmButtonText: "{{ translate('Okey') }}",
                    });
                }
            });

            // End  select all row to delete




            $('.select2').select2();

            function view_cate(id) {
                $('#modal-left').modal();
                var url = `{{ route('Category.show', 'cat_id') }}`;
                url = url.replace('cat_id', id);
                $.get(url, {}, function(data) {
                    $('#view-category').html(data);
                });
            }

            function update_home_category(el) {
                if (el.checked) {
                    var home_category = 1;
                } else {
                    var home_category = 0;
                }
                $.post(`{{ route('Category.home_category') }}`, {
                    _token: '{{ csrf_token() }}',
                    id: el.value,
                    home_category: home_category
                }, function(data) {

                });
            }

            function update_active(el) {
                if (el.checked) {
                    var active = 1;
                } else {
                    var active = 0;
                }
                $.post(`{{ route('Category.update_active_category') }}`, {
                    _token: '{{ csrf_token() }}',
                    id: el.value,
                    active: active
                }, function(data) {

                });
            }
        </script>
    @endsection