Add wedding info to tree
This commit is contained in:
		@@ -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 {
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user