Mk
/
supersam
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add-user modal dialog — compact, centered, backdrop

This commit is contained in:
root 2026-05-27 11:53:54 +00:00
parent 696f275567
commit e04485c446
1 changed files with 40 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/admin/UserManagementPanel.jsx
View File

@ -206,9 +206,12 @@ export default function UserManagementPanel() {
</button> </button>
</div> </div>
{/* Add form */} {/* Add user modal */}
{showAddForm && ( {showAddForm && (
<form onSubmit={handleAddUser} className="mb-4 rounded-2xl border border-[var(--color-border)] bg-[var(--color-surface-strong)] p-4 space-y-3"> <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40 backdrop-blur-sm" onClick={() => { setShowAddForm(false); setAddError(null); }}>
<div className="w-[340px] rounded-[28px] border border-[var(--color-border)] bg-[var(--color-surface)] p-6 shadow-soft" onClick={(e) => e.stopPropagation()}>
<h3 className="mb-4 text-base font-semibold">Новый пользователь</h3>
<form onSubmit={handleAddUser} className="space-y-3">
<Input <Input
placeholder="Имя" placeholder="Имя"
value={addForm.name} value={addForm.name}
@ -225,14 +228,25 @@ export default function UserManagementPanel() {
onChange={(r) => setAddForm((f) => ({ ...f, role: r }))} onChange={(r) => setAddForm((f) => ({ ...f, role: r }))}
/> />
{addError && <div className="text-sm text-[var(--color-danger)]">{addError}</div>} {addError && <div className="text-sm text-[var(--color-danger)]">{addError}</div>}
<div className="flex justify-end gap-2 pt-1">
<button
type="button"
onClick={() => { setShowAddForm(false); setAddError(null); }}
className="rounded-full border border-[var(--color-border)] px-4 py-2 text-sm font-semibold text-[var(--color-text-muted)] hover:bg-[var(--color-surface-strong)] transition"
>
Отмена
</button>
<button <button
type="submit" type="submit"
disabled={addSubmitting} disabled={addSubmitting}
className="rounded-full bg-[var(--color-accent)] px-5 py-2 text-sm font-semibold text-white hover:opacity-90 transition disabled:opacity-50" className="rounded-full bg-[var(--color-accent)] px-4 py-2 text-sm font-semibold text-white hover:opacity-90 transition disabled:opacity-50"
> >
{addSubmitting ? 'Добавление…' : 'Добавить'} {addSubmitting ? 'Добавление…' : 'Добавить'}
</button> </button>
</div>
</form> </form>
</div>
</div>
)} )}
{/* Error */} {/* Error */}