89 lines
3.2 KiB
TypeScript
89 lines
3.2 KiB
TypeScript
"use client";
|
|
|
|
import { useRouter } from "next/navigation";
|
|
import { useState, type FormEvent } from "react";
|
|
import { WindowFields } from "@/components/WindowFields";
|
|
import { apiFetch, errorMessage } from "@/lib/client-api";
|
|
import type { QueryWindow, WindowPreview } from "@/lib/types";
|
|
|
|
export function SettingsForm({ initial, disabled }: { initial: QueryWindow; disabled: boolean }) {
|
|
const router = useRouter();
|
|
const [value, setValue] = useState<QueryWindow>(initial);
|
|
const [preview, setPreview] = useState<WindowPreview | null>(null);
|
|
const [message, setMessage] = useState<{ ok: boolean; text: string } | null>(null);
|
|
const [busy, setBusy] = useState(false);
|
|
|
|
async function runPreview() {
|
|
setBusy(true);
|
|
setMessage(null);
|
|
try {
|
|
setPreview(await apiFetch<WindowPreview>("/settings/preview", { method: "POST", body: value }));
|
|
} catch (err) {
|
|
setMessage({ ok: false, text: errorMessage(err) });
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
}
|
|
|
|
async function save(e: FormEvent) {
|
|
e.preventDefault();
|
|
if (!window.confirm("Salvar a nova janela global? Ela vale para todos os usuários sem janela personalizada.")) return;
|
|
setBusy(true);
|
|
setMessage(null);
|
|
try {
|
|
await apiFetch("/settings", { method: "PUT", body: value });
|
|
setMessage({ ok: true, text: "Janela salva." });
|
|
router.refresh();
|
|
} catch (err) {
|
|
setMessage({ ok: false, text: errorMessage(err) });
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<form onSubmit={save}>
|
|
<WindowFields value={value} onChange={(w) => { setValue(w); setPreview(null); }} disabled={disabled} />
|
|
{!disabled && (
|
|
<div className="actions">
|
|
<button className="btn secondary" type="button" onClick={runPreview} disabled={busy}>
|
|
Pré-visualizar efeito
|
|
</button>
|
|
<button className="btn primary" type="submit" disabled={busy}>
|
|
Salvar
|
|
</button>
|
|
</div>
|
|
)}
|
|
{message && <p className={message.ok ? "ok-text" : "error-text"}>{message.text}</p>}
|
|
|
|
{preview && (
|
|
<div className="preview">
|
|
{preview.errors.length > 0 ? (
|
|
<ul className="error-text">
|
|
{preview.errors.map((e) => (
|
|
<li key={e.field + e.message}>{e.message}</li>
|
|
))}
|
|
</ul>
|
|
) : (
|
|
<dl className="kv">
|
|
<dt>Consultas por usuário (máximo)</dt>
|
|
<dd>{preview.max_queries_per_user} por dia</dd>
|
|
<dt>Consultas num dia típico</dt>
|
|
<dd>{preview.typical_queries_per_user} por usuário</dd>
|
|
<dt>Consultas num dia de folga</dt>
|
|
<dd>{preview.day_off_queries_per_user} por usuário</dd>
|
|
<dt>Lembretes que sairiam atrasados</dt>
|
|
<dd>
|
|
{preview.affected_users} usuário(s), {preview.affected_days} dia(s) nos últimos 30 dias (aviso de retorno
|
|
antes do início da janela)
|
|
</dd>
|
|
<dt>Não afetados</dt>
|
|
<dd>{preview.custom_window_users} usuário(s) com janela personalizada</dd>
|
|
</dl>
|
|
)}
|
|
</div>
|
|
)}
|
|
</form>
|
|
);
|
|
}
|