@extends('layouts.admin')

@section('content')

<div class="page-wrapper">
	<div class="content">
		<div class="page-header">
			<div class="add-item d-flex">
				<div class="page-title">
					<h4>Categories List</h4>
					<h6>Manage your category</h6>
				</div>
			</div>

			<div class="page-btn" style="border-radius: 20px;">
				<a href="{{ route('category.create') }}" class="btn btn-added Primary">
					<i data-feather="plus" class="me-2"></i>Add New
				</a>
			</div>
		</div>
		@include('layouts.errors')
		<div class="card table-list-card">
			<div class="card-body">
				<div class="table-top">
					<div class="search-set">
						<div class="search-input">
							<a href="javascript:void(0);" class="btn btn-searchset"><i data-feather="search" class="feather-search"></i></a>
						</div>
					</div>

				</div>

				@include('layouts.errors')
				<div class="table-responsive product-list">
					<table class="table datanew">
						<thead>
							<tr>
								<th>Category Name</th>
								<th>Type</th>
								<th class="no-sort">Action</th>
							</tr>
						</thead>
						<tbody>
							@foreach($categories as $category)
							<tr>
								<td>{{ $category->name }}</td>
								<td>{{ $category->type }}</td>

								<td class="action-table-data">
                                    <div class="edit-delete-action">
                                        <a class="me-2 p-2" href="{{ route('categories.edit', $category->id) }}" >
                                            <i data-feather="edit" class="feather-edit"></i>
                                        </a> 

                                        <form action="{{ route('categories.destroy', $category->id) }}" method="POST" class="deleteBtnForm">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="deleteBtn"
                                            onclick="return confirm('Are you sure you want to delete this category?');">
                                            <i data-feather="trash-2" class="feather-trash-2" 
                                            style="width: 14px;height: 14px;"></i>
                                        </form>
                                    </div>
                                </td>
							</tr>
							@endforeach
						</tbody>
					</table>
				</div>
			</div>
		</div>

	</div>
</div>

@endsection