@extends('layout.adminapp')
@section('page-css')
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap4.min.css">
  <link href="{{ asset('css/buttons.bootstrap.min.css') }}" rel="stylesheet">
    <link href="{{ asset('css/buttons.dataTables.min.css') }}" rel="stylesheet">
    {{-- <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.0.3/css/buttons.dataTables.min.css"> --}}
          <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css"/>

@endsection
@section('page-content')

      <section class="content mb-5">

        <div class="content-inner content-docs">
          <div class="row">
    <div class="col-12">
      <div class="card mb-5">
        <div class="card-header">
        Admin Users
        <div class="float-right">
              <button type="button"  class="btn btn-sm btn-primary " data-toggle="collapse" href="#addstaff" role="button" aria-expanded="false" aria-controls="collapseform" name="button">Add Admin Users</button>
            </div>
        </div>
        <div class="card-body">
          <div id="addstaff" class="collapse col-lg mx-auto bg-whitesmoke p-3 jumbotron">
            <form class="" action="{!! route('admin.add.user') !!}" method="post">
              @csrf
              <div class="row ">
                <div class="col-lg">
                  <div class="form-group">
                    <label for="">Name</label>
                    <input type="text" class="form-control" required name="name">
                  </div>
                </div>
                <div class="col-lg">
                  <div class="form-group">
                    <label for="">Email</label>
                    <input type="email" class="form-control" required name="email">
                  </div>
                </div>
                <div class="col-lg">
                  <h4>Access Rights</h4>
                  <div class="row pr-4">
                    <div class="col-lg">
                      <div class="form-check">
            <input class="form-check-input" type="checkbox" value="1"  id="annex" name="annex">
            <label class="form-check-label" for="annex">
              COI & Annexures
            </label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" value="1"  id="reports" name="reports">
            <label class="form-check-label" for="reports">
              Reports
            </label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" value="1"  id="assessment" name="assessment">
            <label class="form-check-label" for="assessment">
              Assessment
            </label>
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox" value="1"  id="reminder" name="reminder">
            <label class="form-check-label" for="reminder">
              Reminder
            </label> 
          </div>
                    </div>
                    <div class="col-g">
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1"  id="helpdesk" name="helpdesk">
                        <label class="form-check-label" for="helpdesk">
                          Help Desk
                        </label>
                      </div>
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1"  id="analytics" name="analytics">
                        <label class="form-check-label" for="analytics">
                          Analytics
                        </label>
                      </div>
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1"  id="setup" name="setup">
                        <label class="form-check-label" for="setup">
                          Setup
                        </label>
                      </div>
                    </div>
                  </div>




                </div>
              </div>

              <div class="text-center mt-4 mb-2">
                <button type="submit" class="btn btn-success btn-sm col-lg-4 " name="button">Create New Admin User</button>
              </div>
            </form>
          </div>
          <div class="row">
            <div class="col-lg-4 mx-auto">
              @include('layout.alert')
            </div>
          </div>
          <div class="table-responsive">
            {{$dataTable->table(['class' => 'table table-bordered table-striped  table-centered table-hover w-100 dt-responsive nowrap mb-0',])}}
          </div>

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

@endsection

@section('page-js')
  <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
    <script src="{!! asset('vendor/datatables/buttons.server-side.js') !!}"></script>
    <script src="{!! asset('js/dataTables.buttons.min.js') !!}"></script>
    <script src="{!! asset('js/buttons.server-side.js') !!}"></script>
    {{$dataTable->scripts()}}
@endsection