@extends('_layouts.app')

@section('content')
  <section class="content page-office page-office-user">
    <div class="card">
      <div class="card-body table-responsive">
        <table id="dt-office-user" class="table">
          <thead>
          <tr>
            <th>Name</th>
            <th>Email</th>
            <th>Status</th>
            <th style="width: 10%;">Action</th>
          </tr>
          </thead>
        </table>
      </div>
    </div>
  </section>

  <div class="modal fade" id="modal-add-user">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">Add user</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div id="form-error"></div>
        <form action="" id="form-office-user">
          <div class="modal-body">
            <div class="row">
              <div class="col-md-12">
                <div class="form-group">
                  <select name="user_id" class="form-control select2" id="user_id" style="width: 100%;" data-placeholder="Select user" {!! dropDownColor() !!}>
                    <option></option>
                    @foreach ($users as $user)
                      <option value="{{ $user->id }}">{{ $user->name }} ({{ $user->email }})</option>
                    @endforeach
                  </select>
                </div>
              </div>
            </div>
          </div>
          <div class="modal-footer justify-content-between">
            {!! showButton('submit') !!}
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
          </div>
        </form>
      </div>
    </div>

    <script>
      var itemData = {!! $item !!};
    </script>
    @endsection

    @section('buttons')
      <button type="button" class="btn btn-outline-primary float-sm-right" data-toggle="modal" data-target="#modal-add-user">
        Add user
      </button>
    @endsection

    @section('title')
      Users of {{ $item->name }}
@endsection