@extends('includes.layouts.admin')
@section('page-title')
    Category List
@endsection

@section('content')
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Category List</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Home</a></li>
                        <li class="breadcrumb-item active">Category List</li>
                    </ol>
                </div>
            </div>
        </div><!-- /.container-fluid -->
    </section>

    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card pdb-75">
                        <div class="card-header">
                            <form action="">
                                <div class="input-group w-25 float-right">
                                    <input type="text" name="name" value="{{ $filter['name'] }}" placeholder="Find by name" id="category_search_name" class="form-control form-control-sm" required >
    
                                    <div class="input-group-append">
                                        <button class="btn btn-sm btn_baseColor" type="submit">Search</button>
                                    </div>
                                    {{-- &nbsp; --}}
                                    <div class="input-group-append">
                                        <a href="{{ route('admin.category.index') }}" class="btn btn-sm btn_baseColor" id="clear-search" type="button">Clear &nbsp;</a>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <!-- /.card-header -->

                        <div class="card-body">

                            <div class="container-fluid table-responsive">
                                <table class="table table-striped table-bordered table-sm text-center ">
                                    <thead>
                                        <tr>
                                            <th>Serial No</th>
                                            <th>Name</th>
                                            <th>Parent Category</th>
                                            <th>Created At</th>
                                            <th>Updated At</th>
                                            <th>Status</th>
                                            <th>Activate/Deactivate</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @forelse ($categorylist as $index => $category)
                                            <tr>
                                                <td> {{ $index+$categorylist->firstItem() }}</td>
                                                <td> {{ Str::title($category->name) }}</td>
                                                <td> {{ Str::title($category->parentCategory->name ?? '-') }}</td>
                                                <td> {{ $category->created_at }}</td>
                                                <td> {{ $category->updated_at }}</td>
                                                <td id="{{ $category->id }}">
                                                    @if ($category->status == 1)
                                                        <span class="badge bg-success"> Active </span>
                                                    @else
                                                        <span class="badge bg-danger"> Inactive </span>
                                                    @endif
                                                </td>                                       
                                                <td>
                                                    <div class="form-group">
                                                        <div class="custom-control custom-switch custom-switch-off-danger custom-switch-on-success">
                                                            <input type="checkbox" data-id="{{ $category->id }}" class="custom-control-input category-warning" 
                                                                {{ $category->status ? 'checked' : '' }} id="customSwitch{{ $category->id }}" data-category="Category "
                                                                data-route="{{ route('admin.category.updateStatus', $category->id) }}"
                                                            >
                                                            <label class="custom-control-label" for="customSwitch{{ $category->id }}"></label>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td>
                                                    <div class="form-group">
                                                        <a href="{{ route('admin.category.edit', $category->id) }}"
                                                            class="" style="color: #1c55ad; padding-right: 6px;">
                                                            <i class="fas fa-edit"></i>
                                                        </a>

                                                        <a href="javascript:{}" class="delete-category"
                                                            data-id={{ $category->id }} data-user="Category "
                                                            data-route="{{ route('admin.category.destroy', $category->id) }}"
                                                            style="color: #f30031">
                                                            <i class="fa fa-trash"></i>
                                                        </a>
                                                    </div>
                                                </td>
                                            </tr>
                                        @empty
                                            <tr>
                                                <td colspan="8">No Record Found.</td>
                                            </tr>
                                        @endforelse
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        @if ($categorylist->hasPages())
                            <!-- Card Footer -->
                            <div class="card-footer">
                                <nav aria-label="Contacts Page Navigation">
                                    {{ $categorylist->links('pagination::bootstrap-5') }}
                                </nav>
                            </div>
                        @endif
                        <!-- /Card Footer -->
                    </div>
                    <!-- /.card -->
                </div>
                <!-- /.col -->
            </div>
        </div><!-- /.container-fluid -->
        @if (Session::has('success'))
            <div class="toast" data-type="success" data-title=" Added Successfully "> {{ Session::get('success') }}</div>
        @endif
    </section>
@endsection

@section('scripts')
    @include('admin.commonScript.script')
@endsection