Add wedding info to tree
This commit is contained in:
parent
89471ba16d
commit
263a62c1a4
@ -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:
|
||||||
|
@ -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 {
|
||||||
|
Loading…
Reference in New Issue
Block a user