@extends('layouts.admin')

@section('content')
<div class="page-heading">
  <div class="page-title">
      <div class="row">
          <div class="col-12 col-md-6 order-md-1 order-last">
              <h3>Admins List</h3>
              <p class="text-subtitle text-muted">Here you can view the Admin Users</p>
          </div>
          <div class="col-12 col-md-6 order-md-2 order-first">
              <nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
                  <ol class="breadcrumb">
                      <li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
                      <li class="breadcrumb-item active" aria-current="page">DataTable Jquery</li>
                  </ol>
              </nav>
          </div>
      </div>
  </div>

  <!-- Basic Tables start -->
  <section class="section">
      <div class="card">
          <div class="card-header">
            <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModalCenter">
              Add
           </button>
          </div>
          <div class="modal" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="exampleModalLongTitle"> <b> Add a Nas </b></h5>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span data-bs-dismiss="modal">&times;</span>
                  </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('storeAdmin') }}" method="post">
                        @csrf
                          <div class="form-group">
                            <label for="recipient-name" class="col-form-label">Name*</label>
                            <input class="form-control" id="recipient-name" name="name" required>
                          </div>
                          <div class="form-group">
                            <label for="message-text" class="col-form-label">Email Address*</label>
                            <input class="form-control" id="message-text" name="email" required></input>
                          </div>
                          <div class="form-group">
                            <label for="message-text" class="col-form-label">Password*</label>
                            <input class="form-control" id="message-text" name="password" required></input>
                          </div>
                        </div>
                        <div class="modal-footer">
                          <button  class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                          <button type="submit" class="btn btn-primary">Save changes</button>
                        </div>
                    </form>
              </div>
            </div>
          </div>
          <div class="card-body">
              <table class="table" id="table1">
                  <thead>
                      <tr>
                        <th scope="col">#</th>
                        <th scope="col">Name</th>
                        <th scope="col">Email</th>
                        <th scope="col">Password</th>
                        <th scope="col">Actions</th>
                      </tr>
                  </thead>
                  <tbody>
                    @foreach ($users as $user)
                      <tr>
                        <th scope="row">{{ $loop->iteration }}</th>
                        <td>{{ $user->name }}</td>
                        <td>{{ $user->email }}</td>
                        <td>{{ $user->password}}</td>
                        <td>
                          <button class="btn btn-primary" type="button" onclick="window.location='{{ route("showAdmin", $user->id) }}'">Edit</button>
                        </td>
                      </tr>
                    @endforeach
                  </tbody>
              </table>
          </div>
      </div>

      

  </section>
  <!-- Basic Tables end -->
</div>
@endsection