@extends ('Layouts.Application')

@section ('MainContent')

<style>
@media only screen and (max-width: 767px) {
  #view_submit {
    margin-top: 5px;
  }
}
</style>

<div class="row">
  <div class="col-sm-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">Administrations</h3>
      </div>
      <div class="panel-body">
        @include ('Layouts.FormValidationErrors')
        @include ('Layouts.ErrorSuccessAndWarninMessages')

        @if (\App\Models\Permission::checkLinkPermission('EmployeeController', 'Settings', 'create'))
          <a class="btn btn-primary btn-xs" href="{{ route('LoggedIn.Settings.Administration.Create') }}">
            <i class="fa fa-plus-circle"></i> Add New
          </a>&nbsp;&nbsp;<br>&nbsp;
        @endif

        <form class="form-inline" id='administration_view_form'>
          @csrf

          @include ('includes.branch_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])

          @include ('includes.branch_shift_version_names', ['labelColWidth' => 2, 'fieldColWidth' => 3])

          <div class="col-sm-1">
            <button class="btn btn-primary btn-sm" type="button" id="view_submit">
              <i class="fa fa-list"></i> View Administration
            </button>
          </div>
        </form>
      </div>

      <div class="table-responsive">
        <div id="administration_view_table">
          <table class="table table-condensed table-striped table-bordered table-hover" id="AdministrationTable"></table>
        </div>
      </div>
    </div>
  </div>
</div>

@if (\App\Models\Permission::checkLinkPermission('AdministrationController', 'Settings', 'Edit'))
  <script>
  var canEditAdministration = true;
  </script>
@endif

@if (\App\Models\Permission::checkLinkPermission('AdministrationController', 'Settings', 'Delete'))
  <script>
  var canDeleteAdministration = true;
  </script>
@endif

<script language="JavaScript" type="text/javascript">
function checkDelete() {
  return confirm('Are you sure?');
}

$(document).ready(function () {
  var csrf_token = @json(csrf_token());
  var dataSet = @json($Administrations);
  let columns = [
    {
      title: "Sl",
      render: function (data, type, row, meta) {
        return meta.row + meta.settings._iDisplayStart + 1;
      }
    },
    {
      title: "Administration ID",
      data: "username",
    },
    {
      title: "Full Name",
      data: "full_name",
    },
    {
      title: "Contact No",
      data: "phone_no",
    },
    {
      title: "Branach-Shif-Version",
      data: "branch_and_version_name"
    },
    {
      title: "Status",
      data: "is_active",
      render: function (data) {
        return data == 1 ? '<span class="label label-success">Active</span>' : '<span class="label label-danger">Inactive</span>';
      }
    }
  ];

  if (canEditAdministration) {
    columns.push({
      title: "Link",
      data: "user_id",
      render: function (data) {
        return '<a class="btn btn-primary btn-xs" href="' + baseURL + '/!/Settings/Administration/'
          + data + '/edit"><i class="fa fa-pencil-square-o"></i> Edit</a>';
      }
    });
  }

  if (canDeleteAdministration) {
    columns.push({
      title: "Action",
      data: "user_id",
      render: function (data) {
        return '<form role="form" method="POST" class="form-horizontal" action="' + baseURL
          + '/!/Settings/Administration/' + data + '" onclick="return checkDelete()">\
        <input type="hidden" name="_method" value="DELETE">\
        <input type="hidden" name="_token" value="' + csrf_token + '">\
        <input type="hidden" name="id" value="' + data + '">\
        <button type="submit" class="btn btn-danger btn-xs"><i class="fa fa-trash"></i> Delete</button>\
        </form>';
      }
    });
  }

  $("#AdministrationTable").DataTable({
    data: dataSet,
    columns: columns
  });

  $(document).on('click', '#view_submit', function () {
    $.ajax({
      url: baseURL + '/!/Settings/ViewAdministration',
      type: 'POST',
      data: $('#administration_view_form').serialize(),
      success: function (response) {
        $('#administration_view_table').html(response);
      }
    });
  });
});
</script>

@endsection