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:
@@ -288,6 +288,7 @@
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
<option value="seismograph">Seismograph</option>
|
||||
<option value="modem">Modem</option>
|
||||
<option value="sound_level_meter">Sound Level Meter</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
@@ -351,6 +352,56 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sound Level Meter-specific fields -->
|
||||
<div id="editSlmFields" class="hidden space-y-4 border-t border-gray-200 dark:border-gray-700 pt-4">
|
||||
<p class="text-sm font-semibold text-gray-700 dark:text-gray-300">Sound Level Meter Information</p>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">SLM Model</label>
|
||||
<input type="text" name="slm_model" id="editSlmModel" placeholder="NL-43"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Host/IP Address</label>
|
||||
<input type="text" name="slm_host" id="editSlmHost" placeholder="192.168.1.100"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">TCP Port</label>
|
||||
<input type="number" name="slm_tcp_port" id="editSlmTcpPort" placeholder="2255"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">FTP Port</label>
|
||||
<input type="number" name="slm_ftp_port" id="editSlmFtpPort" placeholder="21"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Serial Number</label>
|
||||
<input type="text" name="slm_serial_number" id="editSlmSerialNumber" placeholder="SN123456"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Frequency Weighting</label>
|
||||
<select name="slm_frequency_weighting" id="editSlmFrequencyWeighting"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
<option value="">Not set</option>
|
||||
<option value="A">A-weighting</option>
|
||||
<option value="C">C-weighting</option>
|
||||
<option value="Z">Z-weighting (Flat)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Time Weighting</label>
|
||||
<select name="slm_time_weighting" id="editSlmTimeWeighting"
|
||||
class="w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-slate-700 text-gray-900 dark:text-white focus:ring-2 focus:ring-seismo-orange">
|
||||
<option value="">Not set</option>
|
||||
<option value="F">F (Fast)</option>
|
||||
<option value="S">S (Slow)</option>
|
||||
<option value="I">I (Impulse)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-4">
|
||||
<label class="flex items-center gap-2 cursor-pointer">
|
||||
<input type="checkbox" name="deployed" id="editDeployedCheckbox" value="true" onchange="toggleEditModemPairing()"
|
||||
@@ -648,20 +699,30 @@
|
||||
const deviceType = document.getElementById('editDeviceTypeSelect').value;
|
||||
const seismoFields = document.getElementById('editSeismographFields');
|
||||
const modemFields = document.getElementById('editModemFields');
|
||||
const slmFields = document.getElementById('editSlmFields');
|
||||
|
||||
if (deviceType === 'seismograph') {
|
||||
seismoFields.classList.remove('hidden');
|
||||
modemFields.classList.add('hidden');
|
||||
// Enable seismograph fields, disable modem fields
|
||||
slmFields.classList.add('hidden');
|
||||
setFieldsDisabled(seismoFields, false);
|
||||
setFieldsDisabled(modemFields, true);
|
||||
setFieldsDisabled(slmFields, true);
|
||||
toggleEditModemPairing();
|
||||
} else {
|
||||
} else if (deviceType === 'modem') {
|
||||
seismoFields.classList.add('hidden');
|
||||
modemFields.classList.remove('hidden');
|
||||
// Enable modem fields, disable seismograph fields
|
||||
slmFields.classList.add('hidden');
|
||||
setFieldsDisabled(seismoFields, true);
|
||||
setFieldsDisabled(modemFields, false);
|
||||
setFieldsDisabled(slmFields, true);
|
||||
} else if (deviceType === 'sound_level_meter') {
|
||||
seismoFields.classList.add('hidden');
|
||||
modemFields.classList.add('hidden');
|
||||
slmFields.classList.remove('hidden');
|
||||
setFieldsDisabled(seismoFields, true);
|
||||
setFieldsDisabled(modemFields, true);
|
||||
setFieldsDisabled(slmFields, false);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -711,6 +772,15 @@
|
||||
document.getElementById('editPhoneNumber').value = unit.phone_number;
|
||||
document.getElementById('editHardwareModel').value = unit.hardware_model;
|
||||
|
||||
// SLM fields
|
||||
document.getElementById('editSlmModel').value = unit.slm_model || '';
|
||||
document.getElementById('editSlmHost').value = unit.slm_host || '';
|
||||
document.getElementById('editSlmTcpPort').value = unit.slm_tcp_port || '';
|
||||
document.getElementById('editSlmFtpPort').value = unit.slm_ftp_port || '';
|
||||
document.getElementById('editSlmSerialNumber').value = unit.slm_serial_number || '';
|
||||
document.getElementById('editSlmFrequencyWeighting').value = unit.slm_frequency_weighting || '';
|
||||
document.getElementById('editSlmTimeWeighting').value = unit.slm_time_weighting || '';
|
||||
|
||||
// Store unit ID for form submission
|
||||
document.getElementById('editUnitForm').dataset.unitId = unitId;
|
||||
|
||||
@@ -1206,6 +1276,18 @@
|
||||
alert(`Error renaming unit: ${error.message}`);
|
||||
}
|
||||
});
|
||||
|
||||
// Auto-open edit modal if ?edit=UNIT_ID query parameter is present
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const editUnitId = urlParams.get('edit');
|
||||
if (editUnitId) {
|
||||
// Wait a bit for the page to fully load, then open the edit modal
|
||||
setTimeout(() => {
|
||||
editUnit(editUnitId);
|
||||
}, 500);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
Reference in New Issue
Block a user