freedak/chinese-family-tree-2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

0.6.0.2

Browse Source
This commit is contained in:
freedakgmail
2025-12-10 10:19:29 +08:00
parent 09809c0e49
commit e9b1641509
144 changed files with 1736 additions and 453 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/tree/d3-org-chart-flow.tsx
+12 -11
View File
@@ -295,9 +295,9 @@ const D3OrgChartFlowComponent = forwardRef<D3OrgChartRef, D3OrgChartFlowProps>(
.neighbourMargin(() => 50)
.siblingsMargin(() => 50)
.linkUpdate(function (d: any, i: any, arr: any) {
// 中国风连线颜色 - 使用深褐色
// 中国风连线颜色 - 使用琥珀色
d3.select(arr[i])
.attr('stroke', '#78716c')
.attr('stroke', '#b45309')
.attr('stroke-width', 2)
})
.buttonContent(({ node }: any) => {
@@ -311,37 +311,37 @@ const D3OrgChartFlowComponent = forwardRef<D3OrgChartRef, D3OrgChartFlowProps>(
const isFounder = node.isFounder === true
// 庄严正式的中国风配色 - 主成员
// 始祖使用尊贵的金色配色
// 始祖使用尊贵的金色配色，已故成员使用灰色
const borderColor = isFounder
? '#d97706' // amber-600 更亮的金色
: isDead ? '#78716c' : isMale ? '#92400e' : '#9f1239'
: isDead ? '#78716c' : isMale ? '#92400e' : '#be123c' // 已故用灰色
const bgGradient = isFounder
? 'linear-gradient(to bottom, #fef3c7, #fde68a, #fcd34d)' // 更亮的金色渐变
: isDead
? 'linear-gradient(to bottom, #f5f5f4, #e7e5e4)'
? 'linear-gradient(to bottom, #f5f5f4, #e7e5e4)' // 已故用灰色渐变
: isMale
? 'linear-gradient(to bottom, #fffbeb, #fef3c7, #fffbeb)'
: 'linear-gradient(to bottom, #fff1f2, #fce7f3, #fff1f2)'
const avatarBorder = isFounder
? '#d97706' // amber-600
: isDead ? '#78716c' : isMale ? '#b45309' : '#be185d'
: isDead ? '#78716c' : isMale ? '#b45309' : '#be185d' // 已故用灰色
const textColor = isDead ? '#57534e' : '#1c1917'
const subTextColor = isDead ? '#78716c' : '#57534e'
const textColor = isDead ? '#57534e' : '#1c1917' // 已故用灰色文字
const subTextColor = isDead ? '#78716c' : '#57534e' // 已故用灰色副文字
const badgeBg = isFounder
? '#d97706' // amber-600
: isDead ? '#57534e' : isMale ? '#92400e' : '#9f1239'
: isDead ? '#57534e' : isMale ? '#92400e' : '#be123c' // 已故用灰色
const badgeText = '#fef3c7'
// 配偶配色
const spIsMale = node.spouseGender === '男'
const spIsDead = !!node.spouseDeathYear
const spAvatarBorder = spIsDead ? '#78716c' : spIsMale ? '#b45309' : '#be185d'
const spTextColor = spIsDead ? '#57534e' : '#1c1917'
const spAvatarBorder = spIsDead ? '#78716c' : spIsMale ? '#b45309' : '#be185d' // 已故用灰色
const spTextColor = spIsDead ? '#57534e' : '#1c1917' // 已故用灰色
// 获取头像URL
const avatarUrl = node.avatarUrl ? avatarCache.get(node.avatarUrl) : null
@@ -524,6 +524,7 @@ const D3OrgChartFlowComponent = forwardRef<D3OrgChartRef, D3OrgChartFlowProps>(
})
.render()
.expandAll() // 初始化时展开所有节点
.fit() // 自适应全图显示
// 注册全局配偶点击处理函数
window.d3ChartSpouseClick = (event: Event, spouseId: string) => {