Let admins create and delete users in Benutzerverwaltung, modernize list
Playwright Tests / test (push) Canceled after 0s
Playwright Tests / test (push) Canceled after 0s
Wire up two previously-unwired stored procedures for the usr module: - fis_admin_createUserAccount gained the missing @authaccount + intranet_admin auth gate, a duplicate-email check, and now returns the (possibly auto-generated) password so it can be emailed to the new user, mirroring fis_admin_resetUserPassword's pattern. - fis_admin_delUserAccount gained the same missing auth gate plus a guard against an admin deleting their own account. New /do/usr/create and /do/usr/delete endpoints in IntranetController.AdminUsers.cs, a "Neuer Benutzer" button and a "Benutzer löschen" ribbon action in fis.usr.js, and unit tests for the new welcome-email content (BuildWelcomeEmail). Also restyle the user list (fis.usr.scss) from a plain bordered table to a card-style row grid with avatar-initial badges and status pills, matching the Admin dashboard's visual language. Documented as ADR 0020 and in the admin-user-management concept doc. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Stefan
co-authored by
Claude Sonnet 5
Claude Sonnet 5
parent
38145a917e
commit
4386a6336a
@@ -12,7 +12,7 @@ let $usr = {
|
||||
},
|
||||
/* Default ribbon (nothing selected). */
|
||||
eM: function (r) {
|
||||
let m = [];
|
||||
let m = [{ lbl: $uct.newuser_btn, fnc: $usr.createDlg }];
|
||||
if (bool(r, false) === true) { m.push({ lbl: $uct.rel, fnc: $usr.renderLst }); }
|
||||
return $('#topbar').ocmsmenu(m);
|
||||
},
|
||||
@@ -21,28 +21,43 @@ let $usr = {
|
||||
return $('#topbar').ocmsmenu([
|
||||
{ lbl: $uct.pwdreset, fnc: function () { $usr.pwdResetDlg(rw); } },
|
||||
{ lbl: $uct.email, fnc: function () { $usr.emailDlg(rw); } },
|
||||
{ lbl: $uct.groups, fnc: function () { $usr.groupsDlg(rw); } }
|
||||
{ lbl: $uct.groups, fnc: function () { $usr.groupsDlg(rw); } },
|
||||
{ lbl: $uct.delete, fnc: function () { $usr.deleteUser(rw); } }
|
||||
]);
|
||||
},
|
||||
/* initials for the avatar badge, e.g. "Nadine Beckmann" -> "NB" */
|
||||
initials: function (firstname, name) {
|
||||
let f = (firstname || '').trim().charAt(0), n = (name || '').trim().charAt(0);
|
||||
return (f + n).toUpperCase() || '?';
|
||||
},
|
||||
renderLst: function () {
|
||||
let usrlst = $fis.frm_list(true, true).ldng(1), usrfrm = $$.dc('usrfrm', usrlst);
|
||||
$usr.eM(true);
|
||||
$ocms.postXT({
|
||||
url: $ocms.url('usr/list'), success: function (r) {
|
||||
usrfrm.empty();
|
||||
let ts = $$.tblset({}, usrfrm);
|
||||
let thr = $$.tr(ts.hd);
|
||||
$.each([$uct.col_name, $uct.col_email, $uct.col_status], function (i, lbl) {
|
||||
$$.th(thr).text(lbl);
|
||||
});
|
||||
let grid = $$.dc('usr_grid', usrfrm);
|
||||
let hdr = $$.dc('usr_row usr_row_hd', grid);
|
||||
$$.dc('usr_col_avatar', hdr);
|
||||
$$.dc('usr_col_name', hdr).text($uct.col_name);
|
||||
$$.dc('usr_col_email', hdr).text($uct.col_email);
|
||||
$$.dc('usr_col_status', hdr).text($uct.col_status);
|
||||
if ((r.users || []).length === 0) {
|
||||
$$.dc('usr_empty', grid).text($uct.empty);
|
||||
return;
|
||||
}
|
||||
$.each(r.users || [], function (ri, rw) {
|
||||
let tr = $$.tr(ts.bdy, { id: 'usr' + rw.useraccount_id });
|
||||
$$.td(tr).text(`${rw.firstname || ''} ${rw.name || ''}`.trim());
|
||||
$$.td(tr).text(rw.email || '');
|
||||
$$.td(tr).text(bool(rw.disabled, false) === true ? $uct.disabled : $uct.active);
|
||||
tr.click(function () {
|
||||
tr.toggleClass('selected').siblings().rC('selected');
|
||||
if (tr.is('.selected') === true) { $usr.iMn(rw); } else { $usr.eM(true); }
|
||||
let disabled = bool(rw.disabled, false) === true;
|
||||
let row = $$.dc('usr_row', grid, { id: 'usr' + rw.useraccount_id });
|
||||
$$.dc('usr_avatar', row).text($usr.initials(rw.firstname, rw.name));
|
||||
$$.dc('usr_col_name', row).text(`${rw.firstname || ''} ${rw.name || ''}`.trim());
|
||||
$$.dc('usr_col_email', row).text(rw.email || '');
|
||||
$$.dc('usr_col_status', row).append(
|
||||
$$.dc(disabled ? 'usr_pill usr_pill_off' : 'usr_pill usr_pill_on').text(disabled ? $uct.disabled : $uct.active)
|
||||
);
|
||||
row.click(function () {
|
||||
row.toggleClass('selected').siblings().rC('selected');
|
||||
if (row.is('.selected') === true) { $usr.iMn(rw); } else { $usr.eM(true); }
|
||||
});
|
||||
});
|
||||
}, error: function () {
|
||||
@@ -51,6 +66,45 @@ let $usr = {
|
||||
}, complete: function () { usrlst.ldng(0); }
|
||||
});
|
||||
},
|
||||
createDlg: function () {
|
||||
$ocms.dlgform([
|
||||
{ name: 'firstname', label: $uct.firstname_field, type: 'string', required: true },
|
||||
{ name: 'name', label: $uct.name_field, type: 'string', required: true },
|
||||
{ name: 'email', label: $uct.email_field, type: 'email', required: true },
|
||||
{ name: 'title', label: $uct.title_field, type: 'string' },
|
||||
{ name: 'gender', label: $uct.gender_field, type: 'select', url: [['', ''], ['m', $uct.gender_m], ['f', $uct.gender_f]] },
|
||||
{ name: 'mobile', label: $uct.mobile_field, type: 'string' }
|
||||
], {
|
||||
title: $uct.newuser,
|
||||
button: $uct.newuser_btn,
|
||||
submit: function (e) {
|
||||
let c = $(this).ldng(1);
|
||||
let qs = c.serializeObject(true, { typedvalues: true });
|
||||
$ocms.postXT({
|
||||
url: $ocms.url('usr/create'), data: qs, success: function (response) {
|
||||
alert(response.emailed === true ? $uct.create_sent : $uct.create_noemail);
|
||||
c.trigger('modal_close');
|
||||
}, error: function (jqXHR) {
|
||||
let code = ((jqXHR || {}).responseJSON || {}).error;
|
||||
alert($uct.err[code] || $uct.err_generic);
|
||||
}, complete: function () { c.ldng(0); $usr.renderLst(); }
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
deleteUser: function (rw) {
|
||||
let displayName = `${rw.firstname || ''} ${rw.name || ''}`.trim();
|
||||
if (confirm(string($uct.delete_confirm, [displayName]))) {
|
||||
$ocms.postXT({
|
||||
url: $ocms.url('usr/delete'), data: { useraccount_id: rw.useraccount_id }, success: function () {
|
||||
$usr.eM(true);
|
||||
}, error: function (jqXHR) {
|
||||
let code = ((jqXHR || {}).responseJSON || {}).error;
|
||||
alert($uct.err[code] || $uct.err_generic);
|
||||
}, complete: function () { $usr.renderLst(); }
|
||||
});
|
||||
}
|
||||
},
|
||||
pwdResetDlg: function (rw) {
|
||||
$ocms.dlgform([
|
||||
{ name: 'useraccount_id', type: 'hidden', value: rw.useraccount_id },
|
||||
|
||||
@@ -1,33 +1,78 @@
|
||||
.usrfrm {
|
||||
> table {
|
||||
border-collapse: collapse;
|
||||
margin: 2rem;
|
||||
padding: 1.5rem 2rem;
|
||||
|
||||
th {
|
||||
padding: 0.2rem 0.35rem;
|
||||
border: 1px solid #CCC;
|
||||
.usr_grid {
|
||||
border: 1px solid #e2e2e2;
|
||||
border-radius: 0.5rem;
|
||||
background: #fff;
|
||||
box-shadow: 0 1px 3px rgba(50, 50, 50, 0.1);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.usr_row {
|
||||
display: grid;
|
||||
grid-template-columns: 2.75rem 1.6fr 1.8fr 8rem;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 0.55rem 1rem;
|
||||
border-bottom: 1px solid #eee;
|
||||
|
||||
&:last-child { border-bottom: none; }
|
||||
}
|
||||
|
||||
.usr_row_hd {
|
||||
background: $fuchs_blau;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.02em;
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
|
||||
.usr_row:not(.usr_row_hd) {
|
||||
cursor: pointer;
|
||||
transition: background-color 0.12s ease-in-out;
|
||||
|
||||
&:hover { background-color: #f3f6fb; }
|
||||
|
||||
&.selected {
|
||||
background-color: rgba($fuchs_akzent, 0.12);
|
||||
box-shadow: inset 3px 0 0 $fuchs_akzent;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 0.2rem 0.35rem;
|
||||
border: 1px solid #CCC;
|
||||
}
|
||||
.usr_avatar {
|
||||
width: 2.1rem;
|
||||
height: 2.1rem;
|
||||
border-radius: 50%;
|
||||
background: $fuchs_blau;
|
||||
color: #fff;
|
||||
font-size: 0.78rem;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
tr {
|
||||
cursor: pointer;
|
||||
.usr_col_name { font-weight: 600; color: #222; }
|
||||
.usr_col_email { color: #555; overflow-wrap: anywhere; }
|
||||
|
||||
&:nth-child(2n+1) td {
|
||||
background-color: #EEE;
|
||||
}
|
||||
.usr_pill {
|
||||
display: inline-block;
|
||||
padding: 0.1rem 0.6rem;
|
||||
border-radius: 1rem;
|
||||
font-size: 0.78rem;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.usr_pill_on { background: #e2f3da; color: #2f6d18; }
|
||||
.usr_pill_off { background: #ececec; color: #777; }
|
||||
|
||||
&:hover td {
|
||||
background-color: #f3f6fb;
|
||||
}
|
||||
|
||||
&.selected td {
|
||||
background-color: lightblue;
|
||||
}
|
||||
}
|
||||
.usr_empty {
|
||||
padding: 1.5rem 1rem;
|
||||
text-align: center;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.usr_err {
|
||||
@@ -37,6 +82,19 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.usrfrm {
|
||||
padding: 0.75rem;
|
||||
|
||||
.usr_row { grid-template-columns: 2.25rem 1fr; grid-template-areas: "avatar name" "avatar email" "avatar status"; }
|
||||
.usr_row_hd { display: none; }
|
||||
.usr_avatar { grid-area: avatar; }
|
||||
.usr_col_name { grid-area: name; }
|
||||
.usr_col_email { grid-area: email; font-size: 0.85rem; }
|
||||
.usr_col_status { grid-area: status; }
|
||||
}
|
||||
}
|
||||
|
||||
.usr_groups_dlg {
|
||||
padding: 0.25rem 0;
|
||||
|
||||
|
||||
@@ -7,6 +7,20 @@ let $uct = {
|
||||
, active: 'Aktiv'
|
||||
, disabled: 'Deaktiviert'
|
||||
, loadfail: 'Die Benutzerliste konnte nicht geladen werden.'
|
||||
, empty: 'Es sind keine Benutzerkonten vorhanden.'
|
||||
, newuser: 'Neuer Benutzer'
|
||||
, newuser_btn: 'Neuer Benutzer'
|
||||
, firstname_field: 'Vorname'
|
||||
, name_field: 'Nachname'
|
||||
, title_field: 'Titel'
|
||||
, gender_field: 'Anrede'
|
||||
, gender_m: 'Herr'
|
||||
, gender_f: 'Frau'
|
||||
, mobile_field: 'Mobil'
|
||||
, create_sent: 'Das Benutzerkonto wurde angelegt, die Zugangsdaten wurden per E-Mail versendet.'
|
||||
, create_noemail: 'Das Benutzerkonto wurde angelegt, die Zugangsdaten konnten aber nicht per E-Mail zugestellt werden.'
|
||||
, delete: 'Benutzer löschen'
|
||||
, delete_confirm: 'Soll der Benutzer "{0}" wirklich gelöscht werden?'
|
||||
, pwdreset: 'Passwort zurücksetzen'
|
||||
, pwdreset_btn: 'Zurücksetzen'
|
||||
, pwd_field: 'Neues Passwort'
|
||||
@@ -21,7 +35,10 @@ let $uct = {
|
||||
requirements: 'Das Passwort erfüllt nicht die Mindestanforderungen (mind. 6 Zeichen).',
|
||||
duplicate_email: 'Diese E-Mail-Adresse ist bereits einem anderen Benutzerkonto zugeordnet.',
|
||||
reset_failed: 'Das Passwort konnte nicht zurückgesetzt werden.',
|
||||
change_failed: 'Die Änderung konnte nicht gespeichert werden.'
|
||||
change_failed: 'Die Änderung konnte nicht gespeichert werden.',
|
||||
create_failed: 'Das Benutzerkonto konnte nicht angelegt werden.',
|
||||
delete_failed: 'Der Benutzer konnte nicht gelöscht werden.',
|
||||
cannot_delete_self: 'Das eigene Benutzerkonto kann nicht gelöscht werden.'
|
||||
}
|
||||
, err_generic: 'Die Änderung konnte nicht gespeichert werden.'
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user