bolade/bio-performx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

made ui chnages

Browse Source
This commit is contained in:
bolade
2025-11-26 12:57:11 +01:00
parent 100b47e947
commit 9d61ebb533
8 changed files with 202 additions and 319 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/upload.html
+97 -4
View File
@@ -14,6 +14,7 @@ Generator{% endblock %} {% block content %}
{% endif %}
<form
id="upload-form"
action="/upload"
method="post"
enctype="multipart/form-data"
@@ -147,19 +148,111 @@ Generator{% endblock %} {% block content %}
</div>
<div>
<label
for="next_testing_date"
class="block text-sm font-medium text-gray-700"
>Recommended Next Testing Date</label
>
<div class="mt-1 grid grid-cols-2 gap-3">
<select
id="next_testing_month"
required
class="block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm px-3 py-2 border"
>
<option value="">Month</option>
<option value="January">January</option>
<option value="February">February</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select
id="next_testing_year"
required
class="block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm px-3 py-2 border"
>
<option value="">Year</option>
</select>
</div>
<input
type="text"
type="hidden"
name="next_testing_date"
id="next_testing_date"
required
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm px-3 py-2 border"
placeholder="e.g., October 2025"
/>
</div>
<script>
// Populate year dropdown
(function () {
const yearSelect =
document.getElementById(
"next_testing_year"
);
const currentYear = new Date().getFullYear();
for (
let i = currentYear;
i <= currentYear + 10;
i++
) {
const option =
document.createElement("option");
option.value = i;
option.textContent = i;
yearSelect.appendChild(option);
}
// Combine month and year into hidden input
const monthSelect =
document.getElementById(
"next_testing_month"
);
const dateInput =
document.getElementById(
"next_testing_date"
);
function updateDateInput() {
const month = monthSelect.value;
const year = yearSelect.value;
if (month && year) {
dateInput.value = month + " " + year;
} else {
dateInput.value = "";
}
}
monthSelect.addEventListener(
"change",
updateDateInput
);
yearSelect.addEventListener(
"change",
updateDateInput
);
// Validate form submission
const form =
document.getElementById("upload-form");
form.addEventListener("submit", function (e) {
const month = monthSelect.value;
const year = yearSelect.value;
if (!month || !year) {
e.preventDefault();
alert(
"Please select both month and year for the recommended next testing date."
);
return false;
}
// Ensure hidden input is set before submission
updateDateInput();
});
})();
</script>
</div>
</div>