{% extends 'base_assets.html' %}
{% block title %}Asset Audit List{% endblock %}
{% load static %}
{% load paginator from filters %}
{% load widget_tweaks %}

{% block js %}
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script src="{% static "js/interaction.js" %}"></script>
    <script src="{% static "js/modal.js" %}"></script>
    <script>
    $('document').ready(function(){
        $('#asset-search-form').submit(function () {
         $('#searchButton').focus().click();
         return false;
        });
    });
    function onSearchClick() {
         $('#searchButton').attr("href", "{% url 'asset_audit' None %}".replace('None', $('#{{form.query.id_for_label}}').val()));
    }
    function onAuditClick(assetID) {
         $('#' + assetID).remove();
    }
    </script>
{% endblock %}

{% block content %}
<div class="page-header">
  <h1 class="text-center">Asset Audit List</h1>
</div>

<h3>Audit Asset:</h3>
<form id="asset-search-form" class="form-horizontal" method="POST">
  <div class="input-group input-group-lg" style="width: auto;">
    {% render_field form.query|add_class:'form-control' placeholder='Enter Asset ID' autofocus="true" %}
    <label for="query" class="sr-only">Asset ID:</label>
    <span class="input-group-btn"><a id="searchButton" class="btn btn-default modal-href" href="{% url 'asset_audit' None %}" onclick="onSearchClick()" class="submit" type="submit">Search</a></span>
  </div>
</form>

<h3>Assets Requiring Audit:</h3>
<table class="table">
  <thead>
    <tr>
      <th>Asset ID</th>
      <th>Description</th>
      <th>Category</th>
      <th>Status</th>
      <th class="hidden-xs"></th>
    </tr>
  </thead>
  <tbody id="asset_table_body">
    {% include 'partials/asset_list_table_body.html' with audit="true" %}
  </tbody>
</table>

{% if is_paginated %}
<div class="text-center">
  {% paginator %}
</div>
{% endif %}
{% endblock %}