@extends('admin.layouts.master')
@section('content')
<div class="card bg-body-white hoverable card-xl-stretch mb-xl-8">	
	<div class="card card-custom">
		<div class="card-header">
			<h3 class="card-title">
				Pages List
			</h3>
		</div>
		@if(session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif
        <div class="card-header border-0 pt-6" data-select2-id="select2-data-82-td10">
			<div class="card-title">
				<div class="d-flex align-items-center position-relative my-1">
					<span class="svg-icon svg-icon-1 position-absolute ms-6">
						<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
							<rect opacity="0.5" x="17.0365" y="15.1223" width="8.15546" height="2" rx="1" transform="rotate(45 17.0365 15.1223)" fill="black"></rect>
							<path d="M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z" fill="black"></path>
						</svg>
					</span>
					<input type="text" data-kt-user-table-filter="search" class="form-control form-control-solid w-250px ps-14" placeholder="Search user">
				</div>
				
			</div>
			<div class="card-toolbar">
					<a href="{{ route('admin.pages.create') }}" class="btn btn-primary">
					<span class="svg-icon svg-icon-2">
						<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
							<rect opacity="0.5" x="11.364" y="20.364" width="16" height="2" rx="1" transform="rotate(-90 11.364 20.364)" fill="black"></rect>
							<rect x="4.36396" y="11.364" width="16" height="2" rx="1" fill="black"></rect>
						</svg>
					</span>
				Add New</a>
				</div>
			</div>
		</div>
		<div class="card-body pt-0">
			<div class="table-responsive">
				<table class="table align-middle table-row-dashed fs-6 gy-5 dataTable no-footer" id="kt_table_users">
			        <thead>
			            <tr>
			                <th>#</th>
			                <th>Title</th>
			                <th>Meta Title</th>
			                <th>Action</th>
			            </tr>
			        </thead>
			        <tbody>
			            @forelse($pages as $i => $page)
			                <tr>
			                    <td>{{ $i + 1 }}</td>
			                    <td>{{ $page->title }}</td>
			                    <td>{{ $page->meta_title }}</td>
			                    <td>
			                        <a href="{{ route('admin.pages.edit', $page) }}" class="btn btn-primary btn-sm">Edit</a>
			                        <form action="{{ route('admin.pages.destroy', $page) }}" method="POST" style="display:inline-block;">
			                            @csrf
			                            @method('DELETE')
			                            <button onclick="return confirm('Are you sure?')" type="submit" class="btn btn-danger btn-sm">
			                                Delete
			                            </button>
			                        </form>
			                    </td>
			                </tr>
			            @empty
			                <tr><td colspan="4">No pages found.</td></tr>
			            @endforelse
			        </tbody>
			    </table>
			</div>
		</div>
	</div>
</div>
@endsection