Refactor settings form and layout; enhance form submission with JSON handling and improve modal functionality for room management
This commit is contained in:
parent
d7e38cb8da
commit
5a3176cad1
3 changed files with 201 additions and 219 deletions
90
routes.py
90
routes.py
|
@ -1,4 +1,4 @@
|
|||
from flask import Blueprint, render_template, url_for, request, redirect, flash
|
||||
from flask import Blueprint, render_template, url_for, request, redirect, flash, jsonify
|
||||
from flask import current_app as app
|
||||
from .models import Brand, Item, Inventory, RoomFunction, User, WorkLog, Room, Area
|
||||
from sqlalchemy import or_, delete
|
||||
|
@ -152,8 +152,7 @@ def index():
|
|||
active_worklog_headers=active_worklog_headers,
|
||||
active_worklog_rows=active_worklog_rows,
|
||||
labels=labels,
|
||||
datasets=datasets,
|
||||
endpoint='index'
|
||||
datasets=datasets
|
||||
)
|
||||
|
||||
def link(text, endpoint, **values):
|
||||
|
@ -205,8 +204,7 @@ def list_inventory():
|
|||
breadcrumb=[{'label': 'Inventory', 'url': url_for('main.inventory_index')}],
|
||||
header=inventory_headers,
|
||||
rows=[{"id": item.id, "cells": [row_fn(item) for row_fn in inventory_headers.values()]} for item in inventory],
|
||||
entry_route = 'inventory_item',
|
||||
endpoint='list_inventory'
|
||||
entry_route = 'inventory_item'
|
||||
)
|
||||
|
||||
@main.route("/inventory/index")
|
||||
|
@ -235,8 +233,7 @@ def inventory_index():
|
|||
'inventory_index.html',
|
||||
title=f"Inventory ({category.capitalize()} Index)" if category else "Inventory",
|
||||
category=category,
|
||||
listing=listing,
|
||||
endpoint='inventory_index'
|
||||
listing=listing
|
||||
)
|
||||
|
||||
@main.route("/inventory_item/<id>", methods=['GET', 'POST'])
|
||||
|
@ -271,9 +268,7 @@ def inventory_item(id):
|
|||
worklog=worklog,
|
||||
worklog_headers=filtered_worklog_headers,
|
||||
worklog_rows=[{"id": log.id, "cells": [fn(log) for fn in filtered_worklog_headers.values()]} for log in worklog],
|
||||
types=types,
|
||||
endpoint='inventory_item',
|
||||
endpoint_args={'id': item.id}
|
||||
types=types
|
||||
)
|
||||
|
||||
@main.route("/users")
|
||||
|
@ -285,8 +280,7 @@ def list_users():
|
|||
header = user_headers,
|
||||
rows = [{"id": user.id, "cells": [fn(user) for fn in user_headers.values()]} for user in users],
|
||||
title = "Users",
|
||||
entry_route = 'user',
|
||||
endpoint='list_users'
|
||||
entry_route = 'user'
|
||||
)
|
||||
|
||||
@main.route("/user/<id>")
|
||||
|
@ -322,9 +316,7 @@ def user(id):
|
|||
return render_template(
|
||||
'error.html',
|
||||
title=title,
|
||||
message=f"User with id {id} not found!",
|
||||
endpoint='user',
|
||||
endpoint_args={'id': -1}
|
||||
message=f"User with id {id} not found!"
|
||||
)
|
||||
|
||||
return render_template(
|
||||
|
@ -335,9 +327,7 @@ def user(id):
|
|||
inventory_rows=[{"id": item.id, "cells": [fn(item) for fn in filtered_inventory_headers.values()]} for item in inventory],
|
||||
worklog=worklog,
|
||||
worklog_headers=filtered_worklog_headers,
|
||||
worklog_rows=[{"id": log.id, "cells": [fn(log) for fn in filtered_worklog_headers.values()]} for log in worklog],
|
||||
endpoint='user',
|
||||
endpoint_args={'id': user.id}
|
||||
worklog_rows=[{"id": log.id, "cells": [fn(log) for fn in filtered_worklog_headers.values()]} for log in worklog]
|
||||
)
|
||||
|
||||
@main.route("/worklog")
|
||||
|
@ -349,8 +339,7 @@ def list_worklog(page=1):
|
|||
header=worklog_headers,
|
||||
rows=[{"id": log.id, "cells": [fn(log) for fn in worklog_headers.values()]} for log in query.all()],
|
||||
title="Work Log",
|
||||
entry_route='worklog_entry',
|
||||
endpoint='list_worklog'
|
||||
entry_route='worklog_entry'
|
||||
)
|
||||
|
||||
@main.route("/worklog/<id>")
|
||||
|
@ -373,9 +362,7 @@ def worklog_entry(id):
|
|||
return render_template(
|
||||
'error.html',
|
||||
title=title,
|
||||
message=f"The work log with ID {id} is not found!",
|
||||
endpoint='worklog_entry',
|
||||
endpoint_args={'id': -1}
|
||||
message=f"The work log with ID {id} is not found!"
|
||||
)
|
||||
|
||||
return render_template(
|
||||
|
@ -384,9 +371,7 @@ def worklog_entry(id):
|
|||
log=log,
|
||||
users=users,
|
||||
items=items,
|
||||
form_fields=worklog_form_fields,
|
||||
endpoint='worklog_entry',
|
||||
endpoint_args={'id': log.id}
|
||||
form_fields=worklog_form_fields
|
||||
)
|
||||
|
||||
@main.route("/search")
|
||||
|
@ -446,7 +431,7 @@ def search():
|
|||
}
|
||||
}
|
||||
|
||||
return render_template('search.html', title=f"Database Search ({query})" if query else "Database Search", results=results, query=query, endpoint='search')
|
||||
return render_template('search.html', title=f"Database Search ({query})" if query else "Database Search", results=results, query=query)
|
||||
|
||||
@main.route('/settings', methods=['GET', 'POST'])
|
||||
def settings():
|
||||
|
@ -518,29 +503,15 @@ def settings():
|
|||
types=[{"id": t.id, "name": t.description} for t in types],
|
||||
sections=[s.serialize() for s in sections],
|
||||
functions=[f.serialize() for f in functions],
|
||||
rooms=[r.serialize() for r in rooms],
|
||||
endpoint='settings'
|
||||
rooms=[r.serialize() for r in rooms]
|
||||
)
|
||||
|
||||
@main.route('/api/settings', methods=['POST'])
|
||||
@main.route("/api/settings", methods=["POST"])
|
||||
def api_settings():
|
||||
try:
|
||||
payload = request.get_json()
|
||||
if not payload:
|
||||
return {'error': 'No JSON payload'}, 400
|
||||
|
||||
for label, entries in [
|
||||
('brands', payload.get('brands', [])),
|
||||
('types', payload.get('types', [])),
|
||||
('sections', payload.get('sections', [])),
|
||||
('functions', payload.get('functions', [])),
|
||||
('rooms', payload.get('rooms', [])),
|
||||
]:
|
||||
if not isinstance(entries, list):
|
||||
return {'error': f"{label} must be a list"}, 400
|
||||
for entry in entries:
|
||||
if not isinstance(entry, dict):
|
||||
return {'error': f'Each {label} entry must be a dict'}, 400
|
||||
payload = request.get_json(force=True)
|
||||
except Exception as e:
|
||||
return jsonify({"error": "Invalid JSON"}), 400
|
||||
|
||||
errors = []
|
||||
errors += Brand.validate_state(payload.get("brands", []))
|
||||
|
@ -550,22 +521,17 @@ def api_settings():
|
|||
errors += Room.validate_state(payload.get("rooms", []))
|
||||
|
||||
if errors:
|
||||
return {'status': 'error', 'errors': errors}, 400
|
||||
return jsonify({"errors": errors}), 400
|
||||
|
||||
try:
|
||||
with db.session.begin():
|
||||
brand_map = Brand.sync_from_state(payload.get('brands', []))
|
||||
type_map = Item.sync_from_state(payload.get('types', []))
|
||||
section_map = Area.sync_from_state(payload.get('sections', []))
|
||||
function_map = RoomFunction.sync_from_state(payload.get('functions', []))
|
||||
|
||||
Room.sync_from_state(
|
||||
submitted_rooms=payload.get('rooms', []),
|
||||
section_map=section_map,
|
||||
function_map=function_map
|
||||
)
|
||||
|
||||
return {'status': 'ok'}, 200
|
||||
|
||||
section_map = Area.sync_from_state(payload["sections"])
|
||||
function_map = RoomFunction.sync_from_state(payload["functions"])
|
||||
Brand.sync_from_state(payload["brands"])
|
||||
Item.sync_from_state(payload["types"])
|
||||
Room.sync_from_state(payload["rooms"], section_map, function_map)
|
||||
except Exception as e:
|
||||
traceback.print_exc()
|
||||
return {'status': 'error', 'message': str(e)}, 500
|
||||
db.session.rollback()
|
||||
return jsonify({"errors": [str(e)]}), 500
|
||||
|
||||
return jsonify({"message": "Settings updated successfully."}), 200
|
||||
|
|
|
@ -53,10 +53,7 @@
|
|||
</div>
|
||||
</nav>
|
||||
<main class="container-flex m-5">
|
||||
<form method="POST" id="settingsForm" action="{{ url_for('main.' + endpoint, **(endpoint_args or {})) }}">
|
||||
{% block content %}{% endblock %}
|
||||
<input type="hidden" name="formState" id="formStateField">
|
||||
</form>
|
||||
</main>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"
|
||||
|
|
|
@ -3,12 +3,13 @@
|
|||
{% block title %}{{ title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
title=title,
|
||||
submit_button=True
|
||||
) }}
|
||||
<form id="settingsForm">
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
title=title,
|
||||
submit_button=True
|
||||
) }}
|
||||
|
||||
<div class="container">
|
||||
<div class="container">
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">
|
||||
|
@ -91,8 +92,8 @@ submit_button=True
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal fade" id="roomEditor" data-bs-backdrop="static" tabindex="-1">
|
||||
</div>
|
||||
<div class="modal fade" id="roomEditor" data-bs-backdrop="static" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
|
@ -134,7 +135,8 @@ submit_button=True
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
|
@ -219,15 +221,32 @@ submit_button=True
|
|||
});
|
||||
});
|
||||
|
||||
// Replace the whole submission logic with just JSON
|
||||
form.addEventListener('submit', (event) => {
|
||||
event.preventDefault(); // 🚨 Stop form from leaving the building
|
||||
event.preventDefault();
|
||||
try {
|
||||
const state = buildFormState();
|
||||
document.getElementById('formStateField').value = JSON.stringify(state);
|
||||
form.submit(); // 🟢 Now it can go
|
||||
fetch('/api/settings', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(state)
|
||||
})
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
return response.json().then(data => {
|
||||
throw new Error(data.errors?.join("\n") || "Unknown error");
|
||||
});
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(data => {
|
||||
console.log("Sync result:", data);
|
||||
})
|
||||
.catch(err => {
|
||||
console.error("Submission error:", err);
|
||||
});
|
||||
} catch (err) {
|
||||
alert("Form submission failed: " + err.message);
|
||||
console.error("Failed to build form state:", err);
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue