Skip to content

Commit e65678c

Browse files
authored
Update UI with bootswatch Yeti theme (#30)
* style: freshen up GUI * style: ui updated to use bootstrap css * chore: linting * chore: remove unused imports
1 parent 45faf64 commit e65678c

File tree

7 files changed

+131
-65
lines changed

7 files changed

+131
-65
lines changed

pyproject.toml

+4-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,10 @@ requires-python = ">=3.10"
1111
dependencies = [
1212
"flask >=2.2.2, <3",
1313
"toml >=0.10.2, <1",
14-
"pandas==1.5.3"
14+
"pandas==1.5.3",
15+
"flask-assets >=2.0",
16+
"flask-bootstap5 >=0.1.dev1",
17+
"Bootstrap-flask >=2.2.0"
1518

1619
]
1720

requirements.txt

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
Bootstrap-Flask 2.2.0
2+
click 8.1.3
3+
dominate 2.7.0
4+
Flask 2.2.3
5+
Flask-Assets 2.0
6+
flask-bootstrap5 0.1.dev1
7+
importlib-metadata 6.0.0
8+
install 1.3.5
9+
invenflask 2.0.0
10+
itsdangerous 2.1.2
11+
Jinja2 3.1.2
12+
libsass 0.22.0
13+
MarkupSafe 2.1.2
14+
numpy 1.24.2
15+
pandas 1.5.3
16+
pip 22.3.1
17+
python-dateutil 2.8.2
18+
pytz 2022.7.1
19+
setuptools 65.6.3
20+
six 1.16.0
21+
toml 0.10.2
22+
typing_extensions 4.5.0
23+
visitor 0.1.3
24+
webassets 2.0
25+
Werkzeug 2.2.3
26+
WTForms 3.0.1
27+
zipp 3.14.0

src/invenflask/app.py

+11-9
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
from flask import Flask
2-
from flask import render_template, request, url_for, flash, redirect, abort, g, session
3-
from pathlib import Path
4-
import sqlite3
51
import os
2+
import sqlite3
3+
from pathlib import Path
4+
65
import pandas as pd
6+
from flask import (Flask, flash, g, redirect, render_template, request,
7+
session, url_for)
8+
from flask_bootstrap import Bootstrap5
79
from werkzeug.utils import secure_filename
810

9-
1011
config_path = Path.cwd().joinpath('config.py')
1112

1213
upload_folder = os.path.join('static', 'uploads')
@@ -17,6 +18,7 @@
1718
app.config['upload_folder'] = upload_folder
1819
os.makedirs(app.config['upload_folder'], exist_ok=True)
1920
print(config_path)
21+
bootstrap = Bootstrap5(app)
2022

2123
# print(app.config)
2224

@@ -50,7 +52,7 @@ def get_asset(asset_id, action):
5052
conn.commit()
5153
if action == "edit":
5254
if asset is None:
53-
abort(404)
55+
return False
5456
else:
5557
print(asset)
5658
return asset
@@ -244,7 +246,7 @@ def staff_edit(id):
244246
return render_template('staff_edit.html', staff=staff)
245247

246248

247-
@app.route('/staff', methods=('GET', 'POST'))
249+
@app.route('/staff/', methods=('GET', 'POST'))
248250
def staff():
249251
conn = get_db()
250252
if request.method == 'POST':
@@ -315,8 +317,8 @@ def checkin():
315317
if not asset_id:
316318
flash('Asset ID is required')
317319
elif get_asset(asset_id, "edit") is False:
318-
flash("Asset does not exist. Please make it below")
319-
return redirect(url_for('create_asset'))
320+
flash("Asset does not exist. Please Try again")
321+
return redirect(url_for('checkin'))
320322
elif get_checkout(asset_id) is None:
321323
flash("Asset Not checked out")
322324
return redirect(url_for('checkin'))

src/invenflask/templates/base.html

+60-44
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,72 @@
11
<!DOCTYPE html>
2-
<html lang="en">
2+
<html>
3+
34
<head>
4-
<meta charset="UTF-8">
55
<title>{% block title %} {% endblock %}AssetCheckout</title>
6-
<style>
7-
nav a {
8-
color: #d64161;
9-
font-size: 2em;
10-
margin-left: 5px;
11-
text-decoration: none;
12-
13-
14-
}
15-
nav a:not(:first-child):before {
16-
content: " | ";
17-
}
18-
19-
.alert {
20-
padding: 20px;
21-
margin: 5px;
22-
color: #970020;
23-
background-color: #ffd5de;
24-
}
25-
26-
table, th, td {
27-
border: 1px solid black;
28-
}
29-
</style>
6+
<link rel="stylesheet" href="{{ url_for('static', filename='css/min.css') }}">
7+
{{ bootstrap.load_css() }}
8+
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
9+
<div class="container-fluid">
10+
<a class="navbar-brand" href="#">Asset Manager</a>
11+
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarColor01"
12+
aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
13+
<span class="navbar-toggler-icon"></span>
14+
</button>
15+
<div class="collapse navbar-collapse" id="navbarColor01">
16+
<ul class="navbar-nav me-auto">
17+
<li class="nav-item">
18+
<a class="nav-link" href="{{ url_for('index') }}">Home
19+
</a>
20+
</li>
21+
<li class="nav-item">
22+
<a class="nav-link" href="{{ url_for('checkin') }}">Check In
23+
</a>
24+
</li>
25+
<li class="nav-item">
26+
<a class="nav-link" href="{{ url_for('checkout') }}">Check Out
27+
</a>
28+
</li>
29+
<li class="nav-item dropdown">
30+
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button"
31+
aria-haspopup="true" aria-expanded="false">Create</a>
32+
<div class="dropdown-menu">
33+
<a class="dropdown-item" href="{{ url_for('create_asset') }}">Create Asset</a>
34+
<a class="dropdown-item" href="{{ url_for('staff_create') }}">Create Staff</a>
35+
<div class="dropdown-divider"></div>
36+
<a class="dropdown-item" href="{{ url_for('bulk_import') }}">Bulk Import</a>
37+
</div>
38+
</li>
39+
<li class="nav-item dropdown">
40+
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button"
41+
aria-haspopup="true" aria-expanded="false">Status</a>
42+
<div class="dropdown-menu">
43+
<a class="dropdown-item" href="{{ url_for('status') }}">Asset Status</a>
44+
<a class="dropdown-item" href="{{ url_for('staff') }}">Staff List</a>
45+
</div>
46+
</li>
47+
<li class="nav-item">
48+
<a class="nav-link" href="{{ url_for('history') }}">History
49+
</a>
50+
</li>
51+
</ul>
52+
<!-- <form class="d-flex">
53+
<input class="form-control me-sm-2" type="search" placeholder="Search">
54+
<button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>
55+
</form> -->
56+
</div>
57+
</div>
58+
</nav>
3059
</head>
60+
3161
<body>
32-
<nav>
33-
<a href="{{ url_for('index') }}">Home</a>
34-
<a href="{{ url_for('create_asset') }}">Create Asset</a>
35-
<a href="{{ url_for('checkin') }}">Check In</a>
36-
<a href="{{ url_for('checkout') }}">Check Out</a>
37-
<a href="{{ url_for('status') }}">Asset Status</a>
38-
<a href="{{ url_for('staff_create') }}">Create Staff</a>
39-
<a href="{{ url_for('staff') }}">Staff</a>
40-
<a href="{{ url_for('bulk_import') }}">Bulk Import</a>
41-
<a href="{{ url_for('history') }}">History</a>
42-
<!-- <a href="{{ url_for('status') }}">Asset Status</a>
43-
<a href="{{ url_for('status') }}">Asset Status</a>
44-
-->
45-
<a href="#">About</a>
46-
47-
</nav>
4862
<hr>
4963
<div class="content">
5064
{% for message in get_flashed_messages() %}
51-
<div class="alert">{{ message }}</div>
65+
<div class="alert alert-danger">{{ message }}</div>
5266
{% endfor %}
5367
{% block content %} {% endblock %}
5468
</div>
69+
{{ bootstrap.load_js() }}
5570
</body>
56-
</html>
71+
72+
</html>

src/invenflask/templates/bulk_import.html

+15-1
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,22 @@ <h1>{% block title %} Bulk Asset Create {% endblock %}</h1>
88
<option value="assets">Assets</option>
99
<option value="staff">Staff</option>
1010
</select>
11-
<p><input type=file name=file></p>
11+
<div class="form-group">
12+
<label for="formFile" class="form-label-lg mt-4">Select CSV File</label>
13+
<input class="form-control" type="file" id="formFile" name="file">
14+
</div>
1215
<p><input type=submit value=Submit></p>
1316
</form>
1417
{% endblock %}
1518

19+
20+
21+
<div class="form-group">
22+
<label class="col-form-label mt-4" for="inputDefault">Default input</label>
23+
<input type="text" class="form-control" placeholder="Default input" id="inputDefault">
24+
</div>
25+
26+
<div class="form-group">
27+
<label for="formFile" class="form-label mt-4">Default file input example</label>
28+
<input class="form-control" type="file" id="formFile" name="file">
29+
</div>

src/invenflask/templates/checkin.html

+13-9
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,18 @@
22

33
{% block content %}
44
<h1>{% block title %} Checkin Asset {% endblock %}</h1>
5-
<form method="POST">
6-
<label for="title">ID</label>
7-
<br>
8-
<input type="text" name="id"
9-
placeholder="Asset ID"
10-
value="{{ request.form['id'] }}"></input>
11-
<br>
12-
<button type="submit">Checkin</button>
13-
</form>
5+
<fieldset>
6+
<form method="POST">
7+
<div class="form-group">
8+
<label class="form-lable mt-4" for="title">ID</label>
9+
<br>
10+
<input type="text" name="id"
11+
placeholder="Asset ID"
12+
value="{{ request.form['id'] }}"></input>
13+
<br>
14+
<button type="submit">Checkin</button>
15+
</div>
16+
</form>
17+
</fieldset>
1418
{% endblock %}
1519

src/invenflask/templates/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
{% block content %}
44
<h1>{% block title %} Asset Total "{{ asset_total }}" {% endblock %}</h1>
5-
<table>
5+
<table class="table table-striped">
66
<thead>
77
<tr>
88
<th style="text-align:left">Category</th>

0 commit comments

Comments
 (0)