Add wedding info to tree

This commit is contained in:
Pierre HUBERT 2023-08-23 11:25:33 +02:00
parent 89471ba16d
commit 263a62c1a4
2 changed files with 35 additions and 9 deletions

View File

@ -3,6 +3,7 @@ import f3, { f3Data } from "family-chart";
import "./family-chart.css"; import "./family-chart.css";
import { FamilyTreeNode } from "../../utils/family_tree"; import { FamilyTreeNode } from "../../utils/family_tree";
import { Member, fmtDate } from "../../api/MemberApi"; import { Member, fmtDate } from "../../api/MemberApi";
import { Couple } from "../../api/CoupleApi";
export function ComplexFamilyTree(p: { export function ComplexFamilyTree(p: {
tree: FamilyTreeNode; tree: FamilyTreeNode;
@ -24,7 +25,7 @@ export function ComplexFamilyTree(p: {
store, store,
svg: view.svg, svg: view.svg,
card_dim: { card_dim: {
w: 220, w: 230,
h: 70, h: 70,
text_x: 75, text_x: 75,
text_y: 15, text_y: 15,
@ -34,8 +35,27 @@ export function ComplexFamilyTree(p: {
img_y: 5, img_y: 5,
}, },
card_display: [ card_display: [
(d) => `${d.data.first_name || ""} ${d.data.last_name || ""}`, (d) =>
(d) => `${d.data["birthday"] || ""}`, `${d.data.first_name || ""} ${d.data.last_name || ""} ${
d.data.dead ? "✝" : ""
}`,
(d) => {
let s = `${d.data.birthday || ""} ${
d.data.deathday ? " ✝ " + d.data.deathday : ""
}`;
if (d.data.wedding_state || d.data.dateOfWedding) {
let weddingInfo = [];
if (d.data.wedding_state) weddingInfo.push(d.data.wedding_state);
if (d.data.dateOfWedding)
weddingInfo.push("Mariage : " + d.data.dateOfWedding);
s += `</tspan> <tspan x="0" dy="14" font-size="10">${weddingInfo.join(
" - "
)}`;
}
return s;
},
], ],
mini_tree: true, mini_tree: true,
link_break: false, link_break: false,
@ -54,10 +74,8 @@ function treeToF3Data(node: FamilyTreeNode, isUp: boolean): f3Data[] {
getAvailableMembers(node, availableMembers); getAvailableMembers(node, availableMembers);
const list: f3Data[] = []; const list: f3Data[] = [];
if (isUp) { if (isUp) treeToF3DataUpRecurse(node, list, availableMembers);
treeToF3DataUpRecurse(node, list, availableMembers); else treeToF3DataDownRecurse(node, list, availableMembers);
} else treeToF3DataDownRecurse(node, list, availableMembers);
console.info(list);
return list; return list;
} }
@ -72,13 +90,17 @@ function getAvailableMembers(t: FamilyTreeNode, s: Set<number>) {
t.down?.forEach((e) => getAvailableMembers(e, s)); t.down?.forEach((e) => getAvailableMembers(e, s));
} }
function memberData(m: Member): f3.f3DataData { function memberData(m: Member, c?: Couple): f3.f3DataData {
return { return {
first_name: m.first_name ?? "_", first_name: m.first_name ?? "_",
last_name: m.last_name ?? "_", last_name: m.last_name ?? "_",
gender: m.sex ?? "M", gender: m.sex ?? "M",
avatar: m.thumbnailURL ?? undefined, avatar: m.thumbnailURL ?? undefined,
dead: m.dead,
birthday: m.dateOfBirth ? fmtDate(m.dateOfBirth) : undefined, birthday: m.dateOfBirth ? fmtDate(m.dateOfBirth) : undefined,
deathday: m.dateOfDeath ? fmtDate(m.dateOfDeath) : undefined,
wedding_state: c?.stateFr,
dateOfWedding: c?.dateOfWedding ? fmtDate(c?.dateOfWedding) : undefined,
}; };
} }
@ -158,7 +180,7 @@ function treeToF3DataDownRecurse(
if (node.couples) { if (node.couples) {
for (const c of node.couples) { for (const c of node.couples) {
array.push({ array.push({
data: memberData(c.member), data: memberData(c.member, c.couple),
id: c.member.id.toString(), id: c.member.id.toString(),
rels: { rels: {
father: father:

View File

@ -12,9 +12,13 @@ declare module "family-chart" {
interface f3DataData { interface f3DataData {
gender: "M" | "F"; gender: "M" | "F";
avatar?: string; avatar?: string;
dead: boolean;
birthday?: string; birthday?: string;
deathday?: string;
first_name: string; first_name: string;
last_name: string; last_name: string;
dateOfWedding?: string;
wedding_state?: string;
} }
interface f3Data { interface f3Data {