Can set the father and the mother of a member

This commit is contained in:
2023-08-11 10:30:04 +02:00
parent e237abe4e1
commit 335ff0f178
7 changed files with 223 additions and 45 deletions

View File

@ -1,21 +1,16 @@
import { Stack, TextField, Typography } from "@mui/material";
import { NumberConstraint, ServerApi } from "../../api/ServerApi";
export interface DateValue {
year?: number;
month?: number;
day?: number;
}
import { DateValue, fmtDate } from "../../api/MemberApi";
export function DateInput(p: {
id: string;
label: string;
editable: boolean;
value: DateValue;
value?: DateValue;
onValueChange: (newVal: DateValue) => void;
}): React.ReactElement {
if (!p.editable) {
if (!p.value.year && !p.value.month && !p.value.day) return <></>;
if (!p.value) return <></>;
return (
<Typography
@ -23,8 +18,7 @@ export function DateInput(p: {
display="block"
style={{ marginBottom: "15px" }}
>
{p.label} : {p.value.day ?? "__"} / {p.value.month ?? "__"} /{" "}
{p.value.year ?? "__"}
{p.label} : {fmtDate(p.value!)}
</Typography>
);
}
@ -41,8 +35,8 @@ export function DateInput(p: {
required
id={`${p.id}-day`}
label="Jour"
value={p.value.day}
error={isValErr(p.value.day, ServerApi.Config.constraints.date_day)}
value={p.value?.day}
error={isValErr(p.value?.day, ServerApi.Config.constraints.date_day)}
variant="filled"
style={{ flex: 20 }}
type="number"
@ -50,8 +44,8 @@ export function DateInput(p: {
const val = Number(e.target.value);
p.onValueChange({
day: val > 0 ? val : undefined,
month: p.value.month,
year: p.value.year,
month: p.value?.month,
year: p.value?.year,
});
}}
inputProps={{
@ -64,17 +58,20 @@ export function DateInput(p: {
required
id={`${p.id}-month`}
label="Mois"
value={p.value.month}
error={isValErr(p.value.month, ServerApi.Config.constraints.date_month)}
value={p.value?.month}
error={isValErr(
p.value?.month,
ServerApi.Config.constraints.date_month
)}
variant="filled"
style={{ flex: 20 }}
type="number"
onChange={(e) => {
const val = Number(e.target.value);
p.onValueChange({
day: p.value.day,
day: p.value?.day,
month: val > 0 ? val : undefined,
year: p.value.year,
year: p.value?.year,
});
}}
inputProps={{
@ -87,16 +84,16 @@ export function DateInput(p: {
required
id={`${p.id}-year`}
label="Année"
value={p.value.year}
value={p.value?.year}
onChange={(e) => {
const val = Number(e.target.value);
p.onValueChange({
day: p.value.day,
month: p.value.month,
day: p.value?.day,
month: p.value?.month,
year: val > 0 ? val : undefined,
});
}}
error={isValErr(p.value.year, ServerApi.Config.constraints.date_year)}
error={isValErr(p.value?.year, ServerApi.Config.constraints.date_year)}
variant="filled"
style={{ flex: 30 }}
type="number"