Properly hide dashboard buttons

This commit is contained in:
Jonathan Senecal 2023-08-16 17:34:48 -04:00
parent 16e2283d19
commit 3c7ad61f8b
2 changed files with 17 additions and 1 deletions

View File

@ -4,16 +4,28 @@ import { apiPatch, hasError } from './util';
function lockDashboard(): void {
const dashboard = document.getElementById('dashboard') as any;
const gridUnlockButton = document.getElementById('unlock_dashboard') as HTMLButtonElement;
const gridLockButton = document.getElementById('lock_dashboard') as HTMLButtonElement;
if (dashboard) {
dashboard.gridstack.disable();
}
if (gridUnlockButton && gridLockButton) {
gridUnlockButton.classList.remove('invisible');
gridLockButton.classList.add('invisible');
}
}
function unlockDashboard(): void {
const dashboard = document.getElementById('dashboard') as any;
const gridUnlockButton = document.getElementById('unlock_dashboard') as HTMLButtonElement;
const gridLockButton = document.getElementById('lock_dashboard') as HTMLButtonElement;
if (dashboard) {
dashboard.gridstack.enable();
}
if (gridUnlockButton && gridLockButton) {
gridUnlockButton.classList.add('invisible');
gridLockButton.classList.remove('invisible');
}
}
async function saveDashboardLayout(

View File

@ -41,7 +41,11 @@
<div class="collapse multi-collapse">
<div class="d-flex px-3">
<div class="flex-grow-1">
<button type="button" id="lock_dashboard" class="btn btn-light btn-sm" data-bs-toggle="collapse" data-bs-target=".multi-collapse">
<button type="button"
id="lock_dashboard"
class="btn btn-light btn-sm invisible"
data-bs-toggle="collapse"
data-bs-target=".multi-collapse">
<i class="mdi mdi-lock-outline"></i> Lock Dashboard
</button>
</div>