@extends('admin.admin_dashboard')
@section('admin')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

<div class="page-content">
    <!--breadcrumb-->
      <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
					<div class="breadcrumb-title pe-3"><b>PASTORS</b></div>
					<div class="ps-3">
						<nav aria-label="breadcrumb">
							<ol class="breadcrumb mb-0 p-0">
								<li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}"><i class="bx bx-home-alt"></i></a>
								</li>
								
                                <li class="breadcrumb-item active" aria-current="page">Pastors</li>
							</ol>
						</nav>
					</div>
					<div class="ms-auto">
						
					</div>
				</div>
    <!--end breadcrumb-->
    <div class="container">
        <div class="main-body">
            <div class="row">
                <div class="col-lg-8">
                    <div class="card">
                        <div class="card-body">
            <div class="table-responsive">
                <table id="example" class="table table-striped table-bordered" style="width:100%">
                    <thead>
                        <tr>
                            <th>S/N</th>
                            <th>Number</th>
                            <th>Name</th>
                             <th>Village</th>
                              <th>Photo</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                    @foreach ($pastors as $key=> $detail) 
                        <tr>
                            <td>{{ $key+1 }}</td>
                            <td>{{ $detail->pastor_number }}</td>
                           <td>{{ $detail->first_name }} {{ $detail->last_name }}</td>
                            <td>{{ $detail->village }}</td>
                           <td>{{ $detail->village_found}}</td><td>
                            <div class="dropdown">
    <!-- Trigger with an Icon -->
    <a href="#" class="dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" style="font-size: 1.5rem; color: #6c757d;">
        <i class="bx bx-dots-vertical-rounded"></i>
    </a>

    <!-- Dropdown Menu -->
    <ul class="dropdown-menu">
        <li><a class="dropdown-item" href="#">Edit</a></li>
        <li><a class="dropdown-item" href="#">Delete</a></li>
    </ul>
</div>

                            </td>
                        </tr>

                        @endforeach

                    </tbody>

                </table>
            </div>
        </div>
                    </div>
                </div>
<div class="col-lg-4">
    <div class="card">

        <form method="POST" action="{{ route('add.church.form') }}" >
            @csrf

        <div class="card-body">
            <div class="row mb-3"> 
                <div class="col-sm-3">
                    <h6 class="mb-0"> Name </h6>
                </div>
                <div class="col-sm-9 text-secondary">
                    <input type="text" name="church_name" class="form-control" id="church_name" />
                   
                </div>
            </div>

             <div class="row mb-3"> 
                <div class="col-sm-3">
                    <h6 class="mb-0">Village </h6>
                </div>
                <div class="col-sm-9 text-secondary">
                    <input type="text" name="village_found" class="form-control" id="village_found" />
                   
                </div>
            </div>

            <div class="row">
                <div class="col-sm-3"></div>
                <div class="col-sm-9 text-secondary">
                    <input type="submit" class="btn btn-primary px-4" value="Save Changes" />
                </div>
            </div>
        </div> 
    </form>


    </div>



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



@endsection