show disabled cursor when hovering over disabled buttons in admin admin view

This commit is contained in:
bytedream 2023-08-28 17:21:54 +02:00
parent 01df127430
commit a88ae62edf

View File

@ -125,56 +125,64 @@
<td> <td>
<div> <div>
{#if admin.edit} {#if admin.edit}
<button <span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
class="btn btn-square" <button
disabled={!permissions.adminWrite()} class="btn btn-square"
on:click={async (e) => { disabled={!permissions.adminWrite()}
await buttonTriggeredRequest( on:click={async (e) => {
e, await buttonTriggeredRequest(
updateAdmin( e,
admin.id, updateAdmin(
admin.username, admin.id,
admin.password, admin.username,
new Permissions(admin.permissions) admin.password,
) new Permissions(admin.permissions)
); )
admin.edit = false; );
}} admin.edit = false;
> }}
<IconOutline name="check-outline" width="24" height="24" /> >
</button> <IconOutline name="check-outline" width="24" height="24" />
<button </button>
class="btn btn-square" </span>
disabled={!permissions.adminWrite()} <span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
on:click={() => { <button
admin.username = admin.before.username; class="btn btn-square"
admin.permissions = admin.before.permissions; disabled={!permissions.adminWrite()}
admin.edit = false; on:click={() => {
}} admin.username = admin.before.username;
> admin.permissions = admin.before.permissions;
<IconOutline name="no-symbol-outline" width="24" height="24" /> admin.edit = false;
</button> }}
>
<IconOutline name="no-symbol-outline" width="24" height="24" />
</button>
</span>
{:else} {:else}
<button <span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
class="btn btn-square" <button
disabled={!permissions.adminWrite()} class="btn btn-square"
on:click={() => { disabled={!permissions.adminWrite()}
admin.edit = true; on:click={() => {
admin.before = { admin.edit = true;
username: admin.username, admin.before = {
permissions: admin.permissions username: admin.username,
}; permissions: admin.permissions
}} };
> }}
<IconOutline name="pencil-square-outline" width="24" height="24" /> >
</button> <IconOutline name="pencil-square-outline" width="24" height="24" />
<button </button>
class="btn btn-square" </span>
disabled={!permissions.adminWrite()} <span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
on:click={(e) => buttonTriggeredRequest(e, deleteAdmin(admin.id))} <button
> class="btn btn-square"
<IconOutline name="trash-outline" width="24" height="24" /> disabled={!permissions.adminWrite()}
</button> on:click={(e) => buttonTriggeredRequest(e, deleteAdmin(admin.id))}
>
<IconOutline name="trash-outline" width="24" height="24" />
</button>
</span>
{/if} {/if}
</div> </div>
</td> </td>
@ -192,21 +200,28 @@
/></td /></td
> >
<td> <td>
<button <span
class="btn btn-square" class="w-min"
disabled={!permissions.adminWrite() || !newAdminUsername || !newAdminPassword} class:cursor-not-allowed={!permissions.adminWrite() ||
on:click={async (e) => { !newAdminUsername ||
await buttonTriggeredRequest( !newAdminPassword}
e,
addAdmin(newAdminUsername, newAdminPassword, new Permissions(newAdminPermissions))
);
newAdminUsername = '';
newAdminPassword = '';
newAdminPermissions = [];
}}
> >
<IconOutline name="user-plus-outline" width="24" height="24" /> <button
</button> class="btn btn-square"
disabled={!permissions.adminWrite() || !newAdminUsername || !newAdminPassword}
on:click={async (e) => {
await buttonTriggeredRequest(
e,
addAdmin(newAdminUsername, newAdminPassword, new Permissions(newAdminPermissions))
);
newAdminUsername = '';
newAdminPassword = '';
newAdminPermissions = [];
}}
>
<IconOutline name="user-plus-outline" width="24" height="24" />
</button>
</span>
</td> </td>
</tr> </tr>
</tbody> </tbody>