Enhance inventory and user templates with select inputs for better data handling and navigation
This commit is contained in:
Yaro Kasear
parent
14384c3d22
commit
9c3d32e5a0
2 changed files with 58 additions and 39 deletions
|
|
@ -12,7 +12,7 @@ breadcrumbs=[
|
||||||
{'label': "Inventory", 'url': url_for('main.list_inventory')}
|
{'label': "Inventory", 'url': url_for('main.list_inventory')}
|
||||||
],
|
],
|
||||||
title=title,
|
title=title,
|
||||||
submit_button=False) }}
|
submit_button=True) }}
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<form action="POST">
|
<form action="POST">
|
||||||
|
|
@ -47,14 +47,13 @@ submit_button=False) }}
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<label for="brand" class="form-label">Brand</label>
|
<label for="brand" class="form-label">Brand</label>
|
||||||
<input list="brandList" id="brand" name="brand" class="form-control" placeholder="-"
|
<select class="form-select" id="brand">
|
||||||
value="{{ item.brand.name }}">
|
<option>-</option>
|
||||||
<input type="hidden" id="brandId">
|
|
||||||
<datalist id="brandList">
|
|
||||||
{% for brand in brands %}
|
{% for brand in brands %}
|
||||||
<option data-id="{{ brand.id }}" value="{{ brand.name }}"></option>
|
<option value="{{ brand.id }}" {% if brand.id==item.brand_id %} selected{% endif %}>{{ brand.name }}
|
||||||
|
</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</datalist>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<label for="model" class="form-label">Model</label>
|
<label for="model" class="form-label">Model</label>
|
||||||
|
|
@ -68,26 +67,36 @@ submit_button=False) }}
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<label for="owner" class="form-label">Contact</label>
|
<label for="owner" class="form-label">
|
||||||
<input list="userList" id="owner" class="form-control" name="owner" placeholder="-"
|
Contact
|
||||||
value="{{ item.owner.full_name }}" data-datalist-bind="#userList" data-hidden-target="#userId">
|
<a href="{{ url_for('main.user', id=item.owner_id) }}"
|
||||||
<input type="hidden" id="userId">
|
class="link-success link-underline-opacity-0">
|
||||||
<datalist id="userList">
|
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor"
|
||||||
|
class="bi bi-box-arrow-up-right" viewBox="0 0 16 16">
|
||||||
|
<path fill-rule="evenodd"
|
||||||
|
d="M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5" />
|
||||||
|
<path fill-rule="evenodd"
|
||||||
|
d="M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0z" />
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</label>
|
||||||
|
<select class="form-select" id="userList">
|
||||||
|
<option>-</option>
|
||||||
{% for user in users %}
|
{% for user in users %}
|
||||||
<option data-id="{{ user.id }}" value="{{ user.full_name }}"></option>
|
<option value="{{ user.id }}" {% if user.id==item.owner_id %} selected{% endif %}>{{ user.full_name
|
||||||
|
}}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</datalist>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<label for="location" class="form-label">Location</label>
|
<label for="location" class="form-label">Location</label>
|
||||||
<input list="roomList" id="location" class="form-control" name="location" placeholder="-"
|
<select class="form-select" id="room">
|
||||||
value="{{ item.location.full_name }}" data-datalist-bind="#roomList" data-hidden-target="#roomId">
|
<option>-</option>
|
||||||
<input type="hidden" id="roomId">
|
|
||||||
<datalist id="roomList">
|
|
||||||
{% for room in rooms %}
|
{% for room in rooms %}
|
||||||
<option data-id="{{ room.id }}" value="{{ room.full_name }}"></option>
|
<option value="{{ room.id }}" {% if room.id==item.location_id %} selected{% endif %}>{{
|
||||||
|
room.full_name }}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</datalist>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<label for="condition" class="form-label">Condition</label>
|
<label for="condition" class="form-label">Condition</label>
|
||||||
|
|
|
||||||
|
|
@ -9,10 +9,10 @@
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
{{ breadcrumbs.breadcrumb_header(
|
{{ breadcrumbs.breadcrumb_header(
|
||||||
title=title,
|
title=title,
|
||||||
breadcrumbs=[
|
breadcrumbs=[
|
||||||
{'label': 'Users', 'url': url_for('main.list_users')}
|
{'label': 'Users', 'url': url_for('main.list_users')}
|
||||||
]
|
]
|
||||||
) }}
|
) }}
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
@ -31,29 +31,39 @@
|
||||||
|
|
||||||
<div class="row mt-2">
|
<div class="row mt-2">
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<label for="supervisor" class="form-label">Supervisor</label>
|
<label for="supervisor" class="form-label">
|
||||||
<input list="supervisorList" id="supervisor" name="supervisorName" class="form-control"
|
Supervisor
|
||||||
value="{{ user.supervisor.full_name }}" data-datalist-bind="#supervisorList"
|
{% if user.supervisor %}
|
||||||
data-hidden-target="#supervisorId">
|
<a href="{{ url_for('main.user', id=user.supervisor_id) }}"
|
||||||
<input type="hidden" id="supervisorId">
|
class="link-success link-underline-opacity-0">
|
||||||
<datalist id="supervisorList">
|
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor"
|
||||||
|
class="bi bi-box-arrow-up-right" viewBox="0 0 16 16">
|
||||||
|
<path fill-rule="evenodd"
|
||||||
|
d="M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5" />
|
||||||
|
<path fill-rule="evenodd"
|
||||||
|
d="M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0z" />
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
{% endif %}
|
||||||
|
</label>
|
||||||
|
<select class="form-select" id="supervisor" name="supervisor"
|
||||||
|
value="{{ supervisor.id if supervisor else '' }}">
|
||||||
|
<option>-</option>
|
||||||
{% for supervisor in users %}
|
{% for supervisor in users %}
|
||||||
<option data-id="{{ supervisor.id }}" value="{{ supervisor.full_name }}"></option>
|
<option value="{{ supervisor.id }}"{% if supervisor.id == user.supervisor_id %} selected{% endif %}>
|
||||||
|
{{ supervisor.full_name }}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</datalist>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<label for="location" class="form-label">Location</label>
|
<label for="location" class="form-label">Location</label>
|
||||||
<input list="locationList" id="location" name="locationName" class="form-control"
|
<select class="form-select" id="location" name="location">
|
||||||
value="{{ user.location.full_name }}" data-datalist-bind="#locationList"
|
<option>-</option>
|
||||||
data-hidden-target="#locationId">
|
|
||||||
<input type="hidden" id="locationId">
|
|
||||||
<datalist id="locationList">
|
|
||||||
{% for location in rooms %}
|
{% for location in rooms %}
|
||||||
<option data-id="{{ location.id }}" value="{{ location.full_name }}"></option>
|
<option value="{{ location.id }}"{% if location.id == user.location_id %} selected{% endif %}>{{ location.full_name }}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</datalist>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row mt-4">
|
<div class="row mt-4">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue