@extends('space_portal.layouts.master')

@section('title','Creating the third workspace. Join today')

@section('header')
	@include('space_portal.partials.header')
@endsection

@section('content')
<section class="main-container">
  <div class="padding">

        <div class="box-white">
        <form action="{{ route('store_space_user_manager') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="d-flex align-items-start justify-content-start align-items-md-center justify-content-md-between flex-column flex-md-row mb-3 mb-md-0">
                <div class="mb-2 m-md-0">
                    <h1 class="mb-0">Add new user manager</h1>
                </div>
                <div>
                    <ul class="list-inline mb-0">
                        <li class="list-inline-item py-1">
                            <a href="{{route('view_users_managers')}}" class="btn invert">Cancel</a>
                        </li>
                    </ul>
                </div>
            </div>

          <hr class="my-4">

          {{-- <div class="d-flex avatar-inline flex-row flex-wrap  align-items-center mb-2 mb-sm-4">
              <div class="single">Avatar</div>
              <div class="single">
                  <div class="avatar">
                      <img src="{{asset('images/reef-logo-rounded.png')}}" alt="#">
                  </div>
              </div>
              <div class="single">
                  <p class="mb-1"><a href="#" class="btn upload">Upload new photo</a></p>
                  <p class="mb-0 smaller">Allowed JPG, GIF or PNG. Max Size of 800KB</p>
              </div>
              <div class="single">
                  <p class="mb-0"><a href="#" class="btn reset invert">Reset</a></p>
                  <p class="mb-0 smaller">&nbsp;</p>
              </div>
          </div> --}}

          <div class="form-max">
            <div class="d-flex flex-column flex-sm-row flex-wrap mb-2 align-items-start align-items-sm-center">
                <div class="label"><label>Name</label></div>
                <div class="input"><input type="text" class="form-control" placeholder="Name" name="name" value="{!! old('name') !!}" required></div>
                @if ($errors->has('name'))
                    <span class="help-block error">
                        <strong>{{ $errors->first('name') }}</strong>
                    </span>
                @endif
            </div>
                <div class="d-flex flex-column flex-sm-row flex-wrap mb-2 align-items-start align-items-sm-center">
                    <div class="label"><label>Email</label></div>
                    <div class="input"><input type="text"  name="username" class="form-control mb-1" value="{!! old('username') !!}"  placeholder="Email" required></div>
                    @if ($errors->has('username'))
                        <span class="help-block error">
                            <strong>{{ $errors->first('username') }}</strong>
                        </span>
                    @endif 
                </div>

              

              <div class="d-flex flex-column flex-sm-row flex-wrap mb-2 align-items-start align-items-sm-center">
                    <div class="label"><label>Confirm Email</label></div>
                    <div class="input"><input type="text" placeholder="Confirm email" name="email" class="form-control mb-1" value="{!! old('email') !!}"></div>
                    @if ($errors->has('email'))
                        <span class="help-block error">
                            <strong>{{ $errors->first('email') }}</strong>
                        </span>
                    @endif
              </div>
          </div>
          
          <hr class="my-4">

            <div class="d-flex flex-column flex-md-row align-items-start align-items-md-center justify-content-start justify-content-md-between mb-4">
                <div class="py-1 pe-4"><p class="mb-0">Check which spaces from below the manager is responsible for :</p></div>
                {{-- <div class="py-1">
                    <div class="search-box white">
                        <input type="text" name="#" class="form-control" id="manager-table-search-field" placeholder="Search">
                        <button type="submit">
                              <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
                                  <path fill-rule="evenodd" clip-rule="evenodd" d="M12.668 0.666656C6.04055 0.666656 0.667969 6.03924 0.667969 12.6667C0.667969 19.2941 6.04055 24.6667 12.668 24.6667C15.5013 24.6667 18.1053 23.6847 20.1582 22.0425L25.0588 26.9428C25.5796 27.4635 26.4238 27.4635 26.9445 26.9428C27.4652 26.4221 27.4651 25.5778 26.9444 25.0572L22.0438 20.1569C23.686 18.104 24.668 15.5 24.668 12.6667C24.668 6.03924 19.2954 0.666656 12.668 0.666656ZM3.33463 12.6667C3.33463 7.512 7.51331 3.33332 12.668 3.33332C17.8226 3.33332 22.0013 7.512 22.0013 12.6667C22.0013 17.8213 17.8226 22 12.668 22C7.51331 22 3.33463 17.8213 3.33463 12.6667Z" fill="#939393"/>
                              </svg>
                        </button>
                    </div>
                </div> --}}
            </div>
            @foreach($venues as $venue)
                <input title="{{ $venue->name }}" id="CertImg{{ $venue->id }}" class="pb-2" type="checkbox" name="venues[]" value="{{ $venue->id }}"/><label class="ps-3 pb-2" for="CertImg{{ $venue->id }}">{{ $venue->name }}</label>
                <br>
            @endforeach

          {{-- <table id="manager-table" class="table" style="width:100%">
              <thead>
                  <tr>
                      <th class="text-center no-sort">&nbsp;</th>
                      <th class="text-center">ID</th>
                      <th class="text-start">Space Name</th>
                      <th class="text-start">City</th>
                      <th class="text-start">Email</th>
                      <th class="text-start">Date Created</th>
                      <th class="text-center">Bookings</th>
                      <th class="text-end">Status</th>
                  </tr>
              </thead>
              <tbody>
                  <tr>
                      <td class="text-center">
                          <div>
                            <input class="form-check-input" type="checkbox" id="checkboxNoLabel" value="">
                          </div>
                      </td>
                      <td class="text-center">
                          <div class="avatar">
                              <img src="{{asset('images/table-avatar.png')}}" alt="#">
                          </div>
                      </td>
                      <td class="text-start">Acme Co.</td>
                      <td class="text-start">Wuppertal</td>
                      <td class="text-start">vuhaithuongnute@gmail.com</td>
                      <td class="text-start">2020-05-04 09:18:16</td>
                      <td class="text-center">65</td>
                      <td class="text-end"><span class="status">Active</span></td>
                  </tr>

                  <tr>
                      <td class="text-center no-sort">
                          <div>
                            <input class="form-check-input" type="checkbox" id="checkboxNoLabel" value="">
                          </div>
                      </td>
                      <td class="text-center">
                          <div class="avatar">
                              <img src="{{asset('images/table-avatar.png')}}" alt="#">
                          </div>
                      </td>
                      <td class="text-start">Acme Co.</td>
                      <td class="text-start">Wuppertal</td>
                      <td class="text-start">vuhaithuongnute@gmail.com</td>
                      <td class="text-start">2020-05-04 09:18:16</td>
                      <td class="text-center">65</td>
                      <td class="text-end"><span class="status inactive">Inactive</span></td>
                  </tr>
              </tbody>
          </table> --}}

          <hr class="my-4">
            <div class="text-left pt-3">
                @if(session()->has('success-add'))
                    <p class="success-msg text-success text-left"><strong>User has been created successfully.</strong></small>
                @endif
                @if(session()->has('msg_error'))
                <small class="error-msg text-error text-center" style="display: none;">Something went wrong. Please try again</small>
                @endif
            </div>
          <ul class="list-inline mb-0">
            <li class="list-inline-item"><button type="submit" class="btn"> Save User </button></li>
            <li class="list-inline-item"><a class="btn invert" href="{{route('view_users_managers')}}">Cancel</a></li>
          </ul>
        </form>
      </div>
  </div>
</section>

@endsection