cityssm/parking-ticket-system

<%- include('_header'); -%>

<div class="columns is-variable is-4-mobile is-4-tablet is-block-print" id="is-site-layout">
  <%- include("_sideMenu-tickets"); -%>
  <div class="column">
    <nav class="breadcrumb">
      <ul>
        <li><a href="<%= urlPrefix %>/dashboard">Home</a></li>
        <li class="is-active"><a href="#" aria-current="page">Parking Tickets</a></li>
      </ul>
    </nav>

    <h1 class="title is-1">
      Find a Parking Ticket
    </h1>

    <div class="box">
      <form id="form--filters">
        <input id="filter--limit" name="limit" type="hidden" value="50" />
        <input id="filter--offset" name="offset" type="hidden" value="0" />
        <div class="columns is-multiline is-tablet">
          <div class="column is-one-quarter-widescreen is-half-tablet">
            <div class="field">
              <label class="label" for="filter--ticketNumber"><%= configFunctions.getConfigProperty("parkingTickets.ticketNumber.fieldLabel") %></label>
              <div class="control has-icons-left">
                <input class="input" id="filter--ticketNumber" name="ticketNumber" maxlength="10" />
                <span class="icon is-left is-small">
                  <i class="fas fa-filter" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
          <div class="column is-one-quarter-widescreen is-half-tablet">
            <div class="field">
              <label class="label" for="filter--licencePlateNumber">Licence Plate Number</label>
              <div class="control has-icons-left">
                <input class="input" id="filter--licencePlateNumber" name="licencePlateNumber" maxlength="15" />
                <span class="icon is-left is-small">
                  <i class="fas fa-filter" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
          <div class="column is-one-quarter-widescreen is-half-tablet">
            <div class="field">
              <label class="label" for="filter--location">Location</label>
              <div class="control has-icons-left">
                <input class="input" id="filter--location" name="location" maxlength="10" />
                <span class="icon is-left is-small">
                  <i class="fas fa-filter" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
          <div class="column is-one-quarter-widescreen is-half-tablet">
            <div class="field">
              <label class="label" for="filter--isResolved">Resolution Status</label>
              <div class="control is-expanded has-icons-left">
                <div class="select is-fullwidth">
                  <select id="filter--isResolved" name="isResolved">
                    <option value="">(All Resolution Statuses)</option>
                    <option value="0" selected>Unresolved Tickets</option>
                    <option value="1">Resolved Tickets</option>
                  </select>
                </div>
                <span class="icon is-left is-small">
                  <i class="fas fa-filter" aria-hidden="true"></i>
                </span>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>

    <div id="container--searchResults" data-cy="results"></div>
  </div>
</div>

<% if (user.canUpdate) { %>
  <div class="fixed-container is-fixed-bottom-right mr-4 mb-4 has-text-right is-hidden-print">
    <a class="button is-circle is-primary has-tooltip-left" data-tooltip="Create a New Ticket" href="<%= urlPrefix %>/tickets/new">
      <i class="fas fa-plus" aria-hidden="true"></i>
      <span class="sr-only">Create a New Ticket</span>
    </a>
  </div>
<% } %>

<%- include('_footerA'); -%>

<script src="<%= urlPrefix %>/javascripts/ticket-search.js"></script>

<%- include('_footerB'); -%>