Add Sound Level Meter support to roster management

- Updated roster.html to include a new option for Sound Level Meter in the device type selection.
- Added specific fields for Sound Level Meter information, including model, host/IP address, TCP and FTP ports, serial number, frequency weighting, and time weighting.
- Enhanced JavaScript to handle the visibility and state of Sound Level Meter fields based on the selected device type.
- Modified the unit editing functionality to populate Sound Level Meter fields with existing data when editing a unit.
- Updated settings.html to change the deployment status display from badges to radio buttons for better user interaction.
- Adjusted the toggleDeployed function to accept the new state directly instead of the current state.
- Changed the edit button in unit_detail.html to redirect to the roster edit page with the appropriate unit ID.
This commit is contained in:
serversdwn
2026-01-14 21:59:13 +00:00
parent be83cb3fe7
commit d349af9444
4 changed files with 805 additions and 82 deletions

View File

@@ -859,11 +859,6 @@ async function loadRosterTable() {
function createRosterRow(unit) {
const statusBadges = [];
if (unit.deployed) {
statusBadges.push('<span class="inline-flex items-center px-2 py-1 rounded text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-300">Deployed</span>');
} else {
statusBadges.push('<span class="inline-flex items-center px-2 py-1 rounded text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300">Benched</span>');
}
if (unit.retired) {
statusBadges.push('<span class="inline-flex items-center px-2 py-1 rounded text-xs font-medium bg-purple-100 text-purple-800 dark:bg-purple-900 dark:text-purple-300">Retired</span>');
}
@@ -880,8 +875,24 @@ function createRosterRow(unit) {
<div class="text-xs text-gray-500 dark:text-gray-400">${unit.unit_type}</div>
</td>
<td class="px-4 py-3">
<div class="flex flex-wrap gap-1">
${statusBadges.join('')}
<div class="flex flex-col gap-2">
<div class="flex gap-3">
<label class="flex items-center gap-2 cursor-pointer">
<input type="radio" name="deployed-${unit.id}" value="true"
${unit.deployed ? 'checked' : ''}
onchange="toggleDeployed('${unit.id}', true)"
class="w-4 h-4 text-green-600 focus:ring-green-500">
<span class="text-sm text-gray-700 dark:text-gray-300">Deployed</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<input type="radio" name="deployed-${unit.id}" value="false"
${!unit.deployed ? 'checked' : ''}
onchange="toggleDeployed('${unit.id}', false)"
class="w-4 h-4 text-gray-600 focus:ring-gray-500">
<span class="text-sm text-gray-700 dark:text-gray-300">Benched</span>
</label>
</div>
${statusBadges.length > 0 ? '<div class="flex flex-wrap gap-1">' + statusBadges.join('') + '</div>' : ''}
</div>
</td>
<td class="px-4 py-3">
@@ -896,13 +907,6 @@ function createRosterRow(unit) {
</td>
<td class="px-4 py-3 whitespace-nowrap text-right text-sm">
<div class="flex justify-end gap-1">
<button onclick="toggleDeployed('${unit.id}', ${unit.deployed})"
class="p-2 hover:bg-gray-100 dark:hover:bg-gray-600 rounded transition-colors"
title="${unit.deployed ? 'Bench Unit' : 'Deploy Unit'}">
<svg class="w-4 h-4 ${unit.deployed ? 'text-green-600 dark:text-green-400' : 'text-gray-400'}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
</button>
<button onclick="toggleRetired('${unit.id}', ${unit.retired})"
class="p-2 hover:bg-gray-100 dark:hover:bg-gray-600 rounded transition-colors"
title="${unit.retired ? 'Unretire Unit' : 'Retire Unit'}">
@@ -930,12 +934,12 @@ function createRosterRow(unit) {
`;
}
async function toggleDeployed(unitId, currentState) {
async function toggleDeployed(unitId, newState) {
try {
const response = await fetch(`/api/roster/set-deployed/${unitId}`, {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: `deployed=${!currentState}`
body: `deployed=${newState}`
});
if (response.ok) {
@@ -969,7 +973,7 @@ async function toggleRetired(unitId, currentState) {
}
function editUnit(unitId) {
window.location.href = `/unit/${unitId}`;
window.location.href = `/roster?edit=${unitId}`;
}
async function confirmDeleteUnit(unitId) {