nngo/GOV_QR_Codes_Management
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change create/edit qr code event to dropdown menu

Browse Source
This commit is contained in:
nngo
2025-08-14 20:58:33 -04:00
parent a313943ee1
commit 7341a23d39
3 changed files with 84 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app.py
+5
View File
@@ -2400,6 +2400,11 @@ def create_qr_code():
'coordinate_accuracy': coordinate_accuracy 'coordinate_accuracy': coordinate_accuracy
} }
logger_handler.logger.info(f"User {session['username']} created QR code: {json.dumps(log_data)}") logger_handler.logger.info(f"User {session['username']} created QR code: {json.dumps(log_data)}")
logger_handler.log_user_action(
f'QR Code created: {name} with event type: {location_event}',
'create',
additional_info={'location_event': location_event}
)
# Success message with coordinates info # Success message with coordinates info
project_info = f" in project '{project.name}'" if project else "" project_info = f" in project '{project.name}'" if project else ""
templates/create_qr_code.html
+44 -40
View File
@@ -542,27 +542,31 @@
Event or Purpose Event or Purpose
<span style="color: var(--error-color)">*</span> <span style="color: var(--error-color)">*</span>
</label> </label>
<input <select
type="text"
id="location_event" id="location_event"
name="location_event" name="location_event"
required required
placeholder="e.g., Weekly Team Meeting, Customer Check-in, Training Session" class="form-control"
maxlength="200" >
/> <option value="">Select Event Type</option>
<small class="form-help" <option value="Check In">Check In</option>
>Describe the event or purpose for this QR code</small <option value="Check Out">Check Out</option>
</select>
<small class="form-help"
>Select the event type for this QR code</small
> >
<div class="character-counter">
<span id="eventCounter">0/200</span>
</div>
</div> </div>
</div> </div>
<!-- Hidden coordinate fields for form submission --> <!-- Hidden coordinate fields for form submission -->
<input type="hidden" id="latitude" name="latitude" value="" /> <input type="hidden" id="latitude" name="latitude" value="" />
<input type="hidden" id="longitude" name="longitude" value="" /> <input type="hidden" id="longitude" name="longitude" value="" />
<input type="hidden" id="coordinate_accuracy" name="coordinate_accuracy" value="" /> <input
type="hidden"
id="coordinate_accuracy"
name="coordinate_accuracy"
value=""
/>
<!-- Form Actions --> <!-- Form Actions -->
<div class="form-actions"> <div class="form-actions">
@@ -614,32 +618,30 @@
} }
function initializeCharacterCounters() { function initializeCharacterCounters() {
const counters = [ const fields = [
{ input: "name", counter: "nameCounter", max: 100 }, { id: "name", counter: "nameCounter", max: 100 },
{ input: "location", counter: "locationCounter", max: 100 }, { id: "location", counter: "locationCounter", max: 150 },
{ input: "location_address", counter: "addressCounter", max: 500 }, { id: "location_address", counter: "addressCounter", max: 255 },
{ input: "location_event", counter: "eventCounter", max: 200 },
]; ];
counters.forEach((item) => { fields.forEach((field) => {
const input = document.getElementById(item.input); const input = document.getElementById(field.id);
const counter = document.getElementById(item.counter); const counter = document.getElementById(field.counter);
if (input && counter) { if (input && counter) {
input.addEventListener("input", function () { function updateCounter() {
const length = this.value.length; const length = input.value.length;
counter.textContent = `${length}/${item.max}`; counter.textContent = `${length}/${field.max}`;
if (length > item.max * 0.9) { if (length > field.max * 0.9) {
counter.classList.add("warning"); counter.style.color = "var(--warning-color)";
} else { } else {
counter.classList.remove("warning"); counter.style.color = "";
} }
}); }
// Initial count input.addEventListener("input", updateCounter);
const length = input.value.length; updateCounter();
counter.textContent = `${length}/${item.max}`;
} }
}); });
} }
@@ -752,18 +754,18 @@
if (coordinatesData.latitude && coordinatesData.longitude) { if (coordinatesData.latitude && coordinatesData.longitude) {
latitudeField.value = coordinatesData.latitude; latitudeField.value = coordinatesData.latitude;
longitudeField.value = coordinatesData.longitude; longitudeField.value = coordinatesData.longitude;
accuracyField.value = coordinatesData.accuracy || 'geocoded'; accuracyField.value = coordinatesData.accuracy || "geocoded";
console.log("✓ Hidden fields updated:", { console.log("✓ Hidden fields updated:", {
latitude: latitudeField.value, latitude: latitudeField.value,
longitude: longitudeField.value, longitude: longitudeField.value,
accuracy: accuracyField.value accuracy: accuracyField.value,
}); });
} else { } else {
// Clear fields if no coordinates // Clear fields if no coordinates
latitudeField.value = ''; latitudeField.value = "";
longitudeField.value = ''; longitudeField.value = "";
accuracyField.value = ''; accuracyField.value = "";
console.log("✓ Hidden fields cleared"); console.log("✓ Hidden fields cleared");
} }
@@ -816,7 +818,9 @@
function validateForm() { function validateForm() {
const name = document.getElementById("name").value.trim(); const name = document.getElementById("name").value.trim();
const location = document.getElementById("location").value.trim(); const location = document.getElementById("location").value.trim();
const address = document.getElementById("location_address").value.trim(); const address = document
.getElementById("location_address")
.value.trim();
if (!name || !location || !address) { if (!name || !location || !address) {
alert("Please fill in all required fields"); alert("Please fill in all required fields");
@@ -835,8 +839,8 @@
coordinates: { coordinates: {
latitude: latitude, latitude: latitude,
longitude: longitude, longitude: longitude,
accuracy: accuracy accuracy: accuracy,
} },
}); });
return true; return true;
@@ -868,16 +872,16 @@
// Project dropdown functionality // Project dropdown functionality
function initializeProjectDropdown() { function initializeProjectDropdown() {
const projectSelect = document.getElementById('project_id'); const projectSelect = document.getElementById("project_id");
if (projectSelect) { if (projectSelect) {
// Load projects dynamically (optional enhancement) // Load projects dynamically (optional enhancement)
// For now, projects are loaded server-side // For now, projects are loaded server-side
projectSelect.addEventListener('change', function() { projectSelect.addEventListener("change", function () {
const selectedOption = this.options[this.selectedIndex]; const selectedOption = this.options[this.selectedIndex];
if (selectedOption.value) { if (selectedOption.value) {
console.log('Selected project:', selectedOption.text); console.log("Selected project:", selectedOption.text);
} }
}); });
} }
templates/edit_qr_code.html
+26 -28
View File
@@ -657,24 +657,20 @@
Event or Purpose Event or Purpose
<span style="color: var(--error-color)">*</span> <span style="color: var(--error-color)">*</span>
</label> </label>
<input <select
type="text"
id="location_event" id="location_event"
name="location_event" name="location_event"
required required
value="{{ qr_code.location_event }}" class="form-control"
data-original="{{ qr_code.location_event }}" data-original="{{ qr_code.location_event }}"
placeholder="e.g., Weekly Team Meeting, Customer Check-in, Training Session"
maxlength="200"
/>
<small class="form-help"
>Describe the event or purpose for this QR code</small
> >
<div class="character-counter"> <option value="">Select Event Type</option>
<span id="eventCounter" <option value="Check In" {% if qr_code.location_event == 'Check In' %}selected{% endif %}>Check In</option>
>{{ qr_code.location_event|length }}/200</span <option value="Check Out" {% if qr_code.location_event == 'Check Out' %}selected{% endif %}>Check Out</option>
> </select>
</div> <small class="form-help"
>Select the event type for this QR code</small
>
</div> </div>
</div> </div>
@@ -816,28 +812,30 @@
} }
function initializeCharacterCounters() { function initializeCharacterCounters() {
const counters = [ const fields = [
{ input: 'name', counter: 'nameCounter', max: 100 }, { id: 'name', counter: 'nameCounter', max: 100 },
{ input: 'location', counter: 'locationCounter', max: 100 }, { id: 'location', counter: 'locationCounter', max: 150 },
{ input: 'location_address', counter: 'addressCounter', max: 500 }, { id: 'location_address', counter: 'addressCounter', max: 255 }
{ input: 'location_event', counter: 'eventCounter', max: 200 }
]; ];
counters.forEach(item => { fields.forEach(field => {
const input = document.getElementById(item.input); const input = document.getElementById(field.id);
const counter = document.getElementById(item.counter); const counter = document.getElementById(field.counter);
if (input && counter) { if (input && counter) {
input.addEventListener('input', function() { function updateCounter() {
const length = this.value.length; const length = input.value.length;
counter.textContent = `${length}/${item.max}`; counter.textContent = `${length}/${field.max}`;
if (length > item.max * 0.9) { if (length > field.max * 0.9) {
counter.classList.add('warning'); counter.style.color = 'var(--warning-color)';
} else { } else {
counter.classList.remove('warning'); counter.style.color = '';
} }
}); }
input.addEventListener('input', updateCounter);
updateCounter();
} }
}); });
} }