@extends('layouts.main')

@section('title', 'User Management')

@section('breadcrumb')
  <div class="row">
    <div class="col-sm-12">
      <div class="page-title-box">
        <h4 class="page-title">User Management</h4>
        <ol class="breadcrumb float-right">
          <li class="breadcrumb-item"><a href="/">Home</a></li>
          <li class="breadcrumb-item active">Settings</li>
          <li class="breadcrumb-item active">User Management</li>
        </ol>
        <div class="clearfix"></div>
      </div>
    </div>
  </div>

@endsection

@section('content')

  <div class="clearfix"></div>
  @include('flash::message')
  <div class="clearfix"></div>
  <div class="content-body">
    <div class="row">
      <div class="col-md-12">
        <!--- BEHIND CARD -->
        <section id="description" class="card">
          <div class="card-header">
            <h4 class="m-t-10 header-title" style="float: left;">List Users</h4>
            <div class="rt_sd" style="float: right;">
              <h5 style="    float: left;   padding-right: 15px;    padding-top: 10px;">Total
                Users: {{ count($users) }} </h5>
              @if(\App\Models\GmpRoles::canSeeLink([\App\Models\GmpRoles::SUPER_ADMIN, \App\Models\GmpRoles::USER_MANAGER]))
                @if($active_contracts<$limit_contracts)
                  <a class="btn btn-success waves-effect waves-light" href="{{ url('settings/user-edit') }}">
                    Add User
                  </a>
                @else
                  <button type="button" style="margin-right:15px;"
                          class="btn btn-success waves-effect waves-light top_inform  pull-right" href="#custom-modal"
                          data-animation="fadein" data-plugin="custommodal"
                          data-overlaySpeed="200" data-overlayColor="#f1f5f7">
                    Add User
                  </button>
                @endif
              @endif
            </div>
          </div>
          <div class="card-body ">
            <div class="table-responsive">
              <table class="table table-chrome table-striped not-wrapped-results" id="users-table">
                <thead>
                <tr>
                  <th>#</th>
                  <th>Firt Name</th>
                  <th>Last Name</th>
                  <th>Role</th>
                  <th>Position</th>
                  <th>Division</th>
                  @if(\App\Models\GmpRoles::canSeeLink([\App\Models\GmpRoles::SUPER_ADMIN, \App\Models\GmpRoles::USER_MANAGER]))
                    <th>Edit</th>
                    <th>Delete</th>
                  @endif
                </tr>
                </thead>
                <tbody>

                @forelse ($users as $user=>$userdata)
                  <tr>
                    <th scope="row">
                      {{ $user+1 }}
                    </th>
                    <td>{{ \App\Models\IUser::getCountactFirstName($userdata->id) }}</td>
                    <td>{{ \App\Models\IUser::getCountactLastName($userdata->id) }}</td>

                    <td>{{ \App\Models\GmpRoles::getNameUserRole($userdata->id) }}</td>

                    <td>{{ $userdata->contact->positions->first()?$userdata->contact->positions->first()->name:'' }}</td>
                    <td>{{ $userdata->contact->positions->first()?($userdata->contact->positions->first()->division?$userdata->contact->positions->first()->division->name:'No Division for this position'):'' }}</td>

                  @if(\App\Models\GmpRoles::canSeeLink([\App\Models\GmpRoles::SUPER_ADMIN, \App\Models\GmpRoles::USER_MANAGER]))
                      <td>
                        <a data-userid="{{ $userdata->id }}"
                           href="{{ url('settings/user-edit', ['user_id'=>$userdata->id]) }}" class=" ion-edit">
                          <i class="icon-pencil2"></i>
                        </a>
                      </td>
                      <td>
                        @if($userdata->id!=\Auth::id())
                          <a href="/settings/user-delete/{{ $userdata->id }}" onclick="return confirm('Are you sure?')"
                             class="ion-close-circled">
                            <i class="icon-remove"></i>
                          </a>
                        @endif
                      </td>
                    @endif
                  </tr>
                  @endforeach


                </tbody>
              </table>
            </div>
          </div>
        </section><!--- END  CARD -->
      </div>

    </div>
  </div>
  <script>
    var glob_userid = 0;

    window.onload = function () {

      $('#remove').on('shown.bs.modal', function (event) {
        var element = $(event.relatedTarget);
        var userid = element.data('userid');
        glob_userid = userid;

      });


    };

    function modal_dialog_delete() {
      location.href = '{{ url('settings/user-delete') }}/' + glob_userid;
    }
  </script>

  <div id="custom-modal" class="modal-demo">
    <button type="button" class="close" onclick="Custombox.close();">
      <span>&times;</span><span class="sr-only">Close</span>
    </button>
    <h4 class="custom-modal-title">Alert!</h4>
    <div class="custom-modal-text" style="overflow:hidden;">
      <p>You have exceeded Skywatch Users Number Quota for your Company. <br/>Our support will contact with you about
        additional payment.</p>
      <br>
    </div>
  </div>
@endsection

@section('scripts')
  <script type="text/javascript">
    var dataTable = new DataTable(document.querySelector('#users-table'), {
      perPageSelect: [5, 15, 25, 50, 100],
      perPage: 15,
    });
  </script>
@endsection