Created the pages for viewing and adding data

This commit is contained in:
Billy 2024-04-29 14:40:03 -04:00
parent 5d9ac5e18b
commit 17e0d560cc
5 changed files with 232 additions and 18 deletions

43
app.py
View File

@ -5,11 +5,52 @@ app = Flask(__name__)
connection = sql_utils.connect_database('ubuntu-mariadb.home','admin','password','inventory')
@app.route('/user_search')
def user_search():
data = request.args.get('data')
query = f'''
SELECT u.name,u.id_num,u.assigned_asset,u.assigned_card
FROM users u
WHERE u.name like '%{data.upper()}%\''''
response = sql_utils.read_query(connection, query)
print(response)
return response
@app.route('/asset_tag_search')
def asset_tag_search():
data = request.args.get('data')
query = f'''SELECT a.asset_id, a.serial, a.model, a.category, u.name
FROM assets a
left JOIN users u ON u.assigned_asset=a.asset_id
WHERE a.asset_id = {data.upper()}'''
response = sql_utils.read_query(connection, query)
return response
@app.route('/serial_search')
def serial_search():
data = request.args.get('data')
query = f'''SELECT a.asset_id, a.serial, a.model, a.category, u.name
FROM assets a
left JOIN users u ON u.assigned_asset=a.asset_id
WHERE a.serial LIKE "{data.upper()}"'''
response = sql_utils.read_query(connection, query)
return response
@app.route('/asset_list')
def asset_list():
data = sql_utils.read_query(connection,'select * from assets;')
query = '''
select a.asset_id,a.serial,a.model,a.category,u.name
from assets a
left join users u on u.assigned_asset=a.asset_id
'''
data = sql_utils.read_query(connection,query)
return data
@app.route('/add')
def add_data():
return render_template('adding.html')
@app.route("/")
def default():
return render_template('main.html')

View File

@ -10,3 +10,5 @@ for i in range(0,100):
query = f'insert into assets (serial) values ("{serial}")'
sql_utils.send_query(connection, query)
print(f'Inserting: {serial}')
print("test")

3
templates/add.js Normal file
View File

@ -0,0 +1,3 @@
function update_add_asset_model() {
}

71
templates/adding.html Normal file
View File

@ -0,0 +1,71 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Adding</title>
<style>
td {
outline: black 1px solid;
margin: 2px;
padding: 2px;
}
.col {
width: 32%;
display: inline-block;
vertical-align: top;
}
</style>
</head>
<body>
<div class="col">
<h1>Add asset</h1>
<form action="javascript:add_asset()">
<label for="asset-serial">Serial:</label>
<input type="text" name="asset-serial" id="asset-serial">
<br>
<br>
<label for="asset-category">Category:</label>
<select name="asset-category" id="asset-category">
<option value="LAPTOP">Laptop</option>
<option value="IPAD">iPad</option>
</select>
<br>
<br>
<label for="asset-model">Model:</label>
<select name="asset-model" id="asset-model" disabled="disabled">
<option value="AIR_M1">Air M1</option>
<option value="AIR_M2">Air M2</option>
<option value="PRO_M1">Pro M1</option>
<option value="PRO_M2">Pro M2</option>
</select>
<br>
<br>
<button>Submit</button>
</form>
</div>
<div class="col">
<h1>Add user</h1>
</div>
<div class="col">
<h1>Add access card</h1>
</div>
<div class="col">
<h1>Modify asset</h1>
</div>
<div class="col">
<h1>Modify user</h1>
</div>
<div class="col">
<h1>Modify access card</h1>
</div>
<script src="add.js"></script>
</body>
</html>

View File

@ -4,18 +4,24 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<title>Searching</title>
<style>
td {
outline: black 1px solid;
margin: 2px;
padding: 2px;
}
.col {
width: 32%;
display: inline-block;
vertical-align: top;
}
</style>
</head>
<body>
<div class="col">
<h1>Assets</h1>
<table id="asset_table">
<tr>
@ -23,17 +29,108 @@
<td>Serial Number</td>
<td>Model</td>
<td>Category</td>
<td>Assigned to</td>
</tr>
</table>
<button type="button" onclick="get_assets()">get assets</button>
</div>
<div class="col">
<h1>User info search</h1>
<label for="user-name">Name:</label>
<input type="text" name="user-name" id="user-name">
<button type="button" onclick="user_search()">Search</button>
<h2>results</h2>
<table id="user-search-results">
<tr>
<td>Name</td>
<td>ID number</td>
<td>Assigned asset</td>
<td>Assigned card</td>
</tr>
</table>
</div>
<div class="col">
<h1>Asset number search</h1>
<label for="asset-tag">Asset tag:</label>
<input type="text" name="asset-tag" id="asset-tag">
<button type="button" onclick="asset_search()">Search</button>
<h2>results</h2>
<div id="asset-tag-search-results">
<p>use the search box above to get results</p>
</div>
</div>
<script>
async function get_assets() {
for (let element of document.getElementsByClassName('asset_data')) {
element.remove();
async function asset_search() {
let tag = document.getElementById("asset-tag").value;
await fetch('/asset_tag_search?data='+tag)
.then(response => response.json())
.then(data => {
data = data[0];
let result_element = document.getElementById('asset-tag-search-results');
result_element.innerHTML = `
<p>ID: ${data[0]}</p>
<p>Serial: ${data[1]}</p>
<p>Model: ${data[2]}</p>
<p>Category: ${data[3]}</p>
<p>Assigned to: ${data[4]}</p>
`;
});
}
let table = document.getElementById("asset_table")
async function user_search() {
let user_name = document.getElementById("user-name").value;
let user_table = document.getElementById("user-search-results");
let user_entries = document.getElementsByClassName('user_data');
while (user_entries[0]) {
user_entries[0].remove();
}
await fetch('/user_search?data='+user_name)
.then(response => response.json())
.then(data => {
for (entry of data) {
let tr = document.createElement('tr');
tr.classList.add('user_data');
for (let datum of entry) {
let td = document.createElement('td');
td.innerHTML = datum;
tr.appendChild(td);
}
user_table.appendChild(tr);
}
});
}
async function serial_search() {
let serial = document.getElementById("asset-serial").value;
await fetch('/serial_search?data='+serial)
.then(response => response.json())
.then(data => {
data = data[0];
console.log(data);
let result_element = document.getElementById('search-results');
result_element.innerHTML = `
<p>ID: ${data[0]}</p>
<p>Serial: ${data[1]}</p>
<p>Model: ${data[2]}</p>
<p>Category: ${data[3]}</p>
<p>Assigned to: ${data[4]}</p>
`;
});
}
async function get_assets() {
let elements = document.getElementsByClassName("asset_data");
while (elements[0]) {
elements[0].remove();
}
let table = document.getElementById("asset_table");
await fetch('/asset_list')
.then(response => response.json())
.then(data => {