Show couple state in basic family tree
This commit is contained in:
parent
365b71ba2d
commit
51dbd04f7d
@ -1,5 +1,6 @@
|
||||
import { APIClient } from "./ApiClient";
|
||||
import { DateValue, Member } from "./MemberApi";
|
||||
import { ServerApi } from "./ServerApi";
|
||||
|
||||
interface CoupleApiInterface {
|
||||
id: number;
|
||||
@ -103,6 +104,13 @@ export class Couple implements CoupleApiInterface {
|
||||
otherPersonID(id: number): number | undefined {
|
||||
return id === this.wife ? this.husband : this.wife;
|
||||
}
|
||||
|
||||
get stateFr(): string {
|
||||
return (
|
||||
ServerApi.Config.couples_states.find((c) => c.code === this.state)?.fr ??
|
||||
""
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export class CouplesList {
|
||||
|
@ -7,6 +7,7 @@ import { MemberPhoto } from "./MemberPhoto";
|
||||
import { Member, fmtDate } from "../api/MemberApi";
|
||||
import Icon from "@mdi/react";
|
||||
import { mdiBabyCarriage, mdiCross } from "@mdi/js";
|
||||
import { Couple } from "../api/CoupleApi";
|
||||
|
||||
export function BasicFamilyTree(p: {
|
||||
tree: FamilyTreeNode;
|
||||
@ -46,7 +47,7 @@ function FamilyTreeItem(p: { n: FamilyTreeNode }): React.ReactElement {
|
||||
marginLeft: "20px",
|
||||
}}
|
||||
>
|
||||
<BasicFamilyMemberItem member={c.member} />
|
||||
<BasicFamilyMemberItem member={c.member} couple={c.couple} />
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
@ -62,6 +63,7 @@ function FamilyTreeItem(p: { n: FamilyTreeNode }): React.ReactElement {
|
||||
function BasicFamilyMemberItem(p: {
|
||||
member: Member;
|
||||
primary?: boolean;
|
||||
couple?: Couple;
|
||||
}): React.ReactElement {
|
||||
return (
|
||||
<div style={{ display: "flex", alignItems: "center" }}>
|
||||
@ -69,7 +71,7 @@ function BasicFamilyMemberItem(p: {
|
||||
<span style={{ width: "10px" }}></span>
|
||||
<div style={{ display: "flex", flexDirection: "column" }}>
|
||||
<span style={{ fontWeight: p.primary ? "bold" : "unset" }}>
|
||||
{p.member.fullName}{" "}
|
||||
{p.member.fullName} {p.couple?.state && `(${p.couple.stateFr}) `}
|
||||
{p.member?.dead && <Icon path={mdiCross} size={"1rem"} />}
|
||||
</span>
|
||||
<span style={{ display: "inline-flex", alignItems: "center" }}>
|
||||
|
Loading…
Reference in New Issue
Block a user