验证20%

This commit is contained in:
rain
2026-07-31 11:31:26 +08:00
parent 309598bfa6
commit ac5823547a
24 changed files with 751 additions and 279 deletions
+49 -231
View File
@@ -1,4 +1,4 @@
<!doctype html>
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
@@ -15,8 +15,8 @@
><img class="brand-logo" src="public/images/logo.png" alt="我们的家谱,代代相传" /></a
>
<nav class="nav-links">
<a href="profile.html">首页</a>
<a href="profile-families.html">数字家谱</a>
<a class="active" href="profile.html">个人中心</a>
<a href="profile-families.html">我的家谱</a>
<a href="plaza.html">家谱广场</a>
<a href="profile-content.html">家族文化</a>
<a href="surname.html">姓氏百科</a>
@@ -25,10 +25,8 @@
<a href="about.html">关于我们</a>
</nav>
<div class="nav-actions">
<a class="active" href="profile.html">个人中心</a>
<a class="btn primary magnetic" href="profile-create-family.html"
>创建家谱</a
>
<a href="profile-data.html">账户资料</a>
<a class="btn primary magnetic" href="profile-create-family.html">创建家谱</a>
</div>
</div>
</header>
@@ -36,29 +34,33 @@
<main>
<section class="profile-hero">
<div class="container profile-hero-grid">
<div class="profile-card tilt-card">
<div class="profile-card">
<div class="avatar-wrap">
<div class="avatar" data-profile-text="avatarText">鹿</div>
<div class="avatar" data-profile-text="avatarText" aria-hidden="true"></div>
<span></span>
</div>
<div class="profile-info">
<div class="eyebrow">Personal Center</div>
<h1 data-profile-text="displayName">鹿野 Loyel</h1>
<p>
管理家谱、亲属资料、家族内容和协作消息。APP
里的核心功能都收纳在这里,适合 PC 端集中处理。
</p>
<div class="eyebrow">个人中心</div>
<h1 data-profile-text="displayName">正在加载账户</h1>
<p>账户资料与家谱工作区分开呈现。进入家谱后,再处理成员、内容和协作事务。</p>
<div class="profile-tags">
<span>血亲</span><span>第二代 顺字辈</span
><span>已绑定账号</span>
<span>已登录账户</span><span>资料以实际接口为准</span>
</div>
<p class="profile-load-status" data-profile-load-status role="status" aria-live="polite">正在读取账户资料…</p>
<div class="toolbar profile-hero-actions">
<a class="btn primary magnetic" href="profile-families.html">进入我的家谱</a>
<a class="btn ghost magnetic" href="profile-data.html">完善个人资料</a>
</div>
</div>
</div>
<div class="profile-stats tilt-card">
<div><strong>2</strong><span>我的家谱</span></div>
<div><strong>7</strong><span>待处理</span></div>
<div><strong>18</strong><span>已发布内容</span></div>
<div><strong>86%</strong><span>资料完善度</span></div>
<div class="profile-next-card">
<div class="eyebrow">下一步</div>
<h2>从家谱开始</h2>
<p>没有家谱时可创建或申请加入;有多个家谱时,请先选择本次要处理的家谱。</p>
<div class="toolbar">
<a class="link-btn" href="profile-create-family.html">创建家谱</a>
<a class="link-btn" href="profile-join-family.html">申请加入</a>
</div>
</div>
</div>
</section>
@@ -66,216 +68,51 @@
<section class="section dashboard-section">
<div class="container dashboard-layout">
<aside class="dashboard-side">
<div class="side-card user-actions tilt-card">
<div class="side-card user-actions">
<h2>账户入口</h2>
<a href="profile-data.html"
><span>个人资料</span><b>完善成员档案</b></a
>
<a href="profile-messages.html"
><span>消息中心</span><b>审核、邀请与提醒</b></a
>
<a href="profile-services.html"
><span>帮助与服务</span><b>帮助、反馈、推广</b></a
>
<a class="logout-link" href="#logout" data-logout-open
><span>退出登录</span><b>返回首页</b></a
>
</div>
<div class="side-card todo-card tilt-card" id="messages">
<div class="card-head">
<h2>待办消息</h2>
<span>7 条</span>
</div>
<div class="todo-list">
<a href="profile-join-review.html" data-genealogy-context-link
><b>入谱申请</b><span>进入当前家谱查看</span></a
>
<a href="profile-gift.html"
><b>贺礼邀请</b><span>2 条需要确认</span></a
>
<a href="profile-data-reminders.html"
><b>资料提醒</b><span>2 位成员待完善</span></a
>
</div>
<a href="profile-data.html"><span>个人资料</span><b>查看并更新账户资料</b></a>
<a href="profile-messages.html"><span>消息中心</span><b>查看真实通知与业务提醒</b></a>
<a href="profile-services.html"><span>帮助与服务</span><b>反馈、安全设置与会员服务</b></a>
<a class="logout-link" href="#logout" data-logout-open><span>退出登录</span><b>返回首页</b></a>
</div>
</aside>
<div class="dashboard-main">
<section class="panel my-family-panel" id="families">
<section class="panel my-family-panel">
<div class="panel-head">
<div>
<h2>我的家谱</h2>
<p>
对应 APP
首页和家谱主页,进入后可查看家谱主页、世系图、相册和家族圈。
</p>
<p>先从真实列表选择家谱,再进入对应的主页、世系图、成员和内容管理。</p>
</div>
<a class="link-btn" href="profile-families.html">查看全部</a>
<div class="toolbar">
<a
class="btn primary magnetic"
href="profile-create-family.html"
>创建家谱</a
><a class="btn ghost magnetic" href="profile-join-family.html"
>加入家谱</a
>
</div>
</div>
<div class="family-grid">
<a
class="family-card tilt-card"
href="profile-families.html"
>
<div class="book-cover">我 的<br />家 谱</div>
<a class="family-card" href="profile-families.html">
<div class="book-cover">选 择<br />家 谱</div>
<div>
<h3>进入我的家谱</h3>
<p>
从家谱入口选择真实家谱后,再查看主页、成员、世系图和家族内容。
</p>
<p>列表只展示当前账户真实可访问的家谱,避免把示例数据当成自己的内容。</p>
<div class="mini-actions">
<span>家谱主页</span><span>家族圈</span><span>成员管理</span>
<span>选择家谱</span><span>进入主页</span><span>处理事务</span>
</div>
</div>
</a>
</div>
</section>
<section class="panel" id="management">
<section class="panel">
<div class="panel-head compact">
<div>
<h2>家族管理</h2>
<p>
把 APP 里的世代、管理员、权限、入谱审核集中到一个管理区。
</p>
<h2>账户资料</h2>
<p>以下字段由账户资料接口返回;没有填写时会明确显示“待填写”。</p>
</div>
<a class="link-btn" href="profile-family-admin.html" data-genealogy-context-link
>进入管理</a
>
<a class="link-btn" href="profile-data.html">编辑资料</a>
</div>
<div class="feature-grid management-grid">
<a class="feature-tile tilt-card" href="profile-families.html"
><span></span>
<h3>世系图</h3>
<p>查看成员世系、搜索成员、进入树谱模式。</p></a
>
<a class="feature-tile tilt-card" href="profile-families.html"
><span></span>
<h3>字辈谱</h3>
<p>管理字辈、统计各代人数和成员分布。</p></a
>
<a class="feature-tile tilt-card" href="profile-generation.html" data-genealogy-context-link
><span></span>
<h3>管理世代</h3>
<p>设置世代、调整始祖世代、维护排行。</p></a
>
<a class="feature-tile tilt-card" href="profile-join-review.html" data-genealogy-context-link
><span></span>
<h3>入谱审核</h3>
<p>处理当前家谱的待审核加入申请。</p></a
>
<a
class="feature-tile tilt-card"
href="profile-admin-permissions.html"
><span></span>
<h3>管理员权限</h3>
<p>分配全权、全系、支系管理员权限。</p></a
>
<a class="feature-tile tilt-card" href="profile-invite.html"
><span></span>
<h3>邀请家人</h3>
<p>生成邀请入口,引导亲人激活使用。</p></a
>
</div>
</section>
<section class="panel" id="content">
<div class="panel-head compact">
<div>
<h2>内容发布</h2>
<p>
对应 APP
家谱主页中的谱文、视频、相册、功德录、贺礼邀请、成长日志等内容入口。
</p>
</div>
<a class="link-btn" href="profile-content.html">发布中心</a>
</div>
<div class="content-grid">
<a
class="content-tile large tilt-card"
href="profile-article.html" data-genealogy-context-link
><span>谱文</span>
<h3>撰写谱文与族史</h3>
<p>沉淀族训、谱序、谱论、恩荣录等家族文献。</p></a
>
<a class="content-tile tilt-card" href="profile-album.html" data-genealogy-context-link
><span>相册</span>
<h3>家族相册</h3>
<p>新建相册、上传照片、编辑封面。</p></a
>
<a class="content-tile tilt-card" href="profile-video.html" data-genealogy-context-link
><span>视频</span>
<h3>家族视频</h3>
<p>发布视频、管理家族影像。</p></a
>
<a class="content-tile tilt-card" href="profile-merit.html" data-genealogy-context-link
><span>功德</span>
<h3>功德录</h3>
<p>记录功德人、事迹与纪念内容。</p></a
>
<a class="content-tile tilt-card" href="profile-gift.html" data-genealogy-context-link
><span>贺礼</span>
<h3>贺礼邀请</h3>
<p>管理婚礼、生日、升学等贺礼。</p></a
>
<a class="content-tile tilt-card" href="profile-families.html?next=profile-feed.html"
><span>动态</span>
<h3>发布动态</h3>
<p>面向家族圈发布图文近况。</p></a
>
<a class="content-tile tilt-card" href="profile-families.html?next=profile-growth.html"
><span>日志</span>
<h3>成长日志</h3>
<p>记录成员成长和人生节点。</p></a
>
<a class="content-tile tilt-card" href="profile-families.html?next=profile-memo.html"
><span>备忘</span>
<h3>人亲簿 / 备忘录</h3>
<p>保存亲友往来和家族事务。</p></a
>
</div>
</section>
<section class="profile-data-layout" id="profile-data">
<div class="panel data-panel">
<div class="panel-head compact">
<div>
<h2>个人资料</h2>
<p>来自 APP 的个人资料、亲属、完善资料和绑定账号流程。</p>
</div>
<a class="link-btn" href="profile-data.html">编辑资料</a>
</div>
<div class="data-list">
<p><span>绑定账号</span><b data-profile-text="phone">已绑定</b></p>
<p><span>姓名</span><b data-profile-text="displayName">鹿野 Loyel</b></p>
<p><span>出生日期</span><b data-profile-text="birthday">待填写</b></p>
<p><span>现居地区</span><b data-profile-text="regionText">待填写</b></p>
<p><span>亲属关系</span><b>父亲 2 人</b></p>
<p><span>补充资料</span><b>待完善 4 项</b></p>
</div>
</div>
<div class="panel service-panel" id="services">
<div class="panel-head compact">
<div>
<h2>帮助与服务</h2>
<p>我的页面中的常用功能。</p>
</div>
</div>
<div class="service-grid">
<a href="profile-share.html">应用分享</a>
<a href="profile-feedback.html">意见反馈</a>
<a href="help.html">帮助中心</a>
<a href="profile-security.html">安全设置</a>
</div>
<div class="data-list">
<p><span>绑定账号</span><b data-profile-text="phone">加载中</b></p>
<p><span>昵称</span><b data-profile-text="displayName">加载中</b></p>
<p><span>出生日期</span><b data-profile-text="birthday">加载中</b></p>
<p><span>现居地区</span><b data-profile-text="regionText">加载中</b></p>
</div>
</section>
</div>
@@ -294,16 +131,11 @@
</div>
<div>
<h4>产品入口</h4>
<a href="profile-families.html">数字家谱</a
><a href="plaza.html">家谱广场</a><a href="app.html">应用下载</a
><a href="help.html">帮助中心</a>
<a href="profile-families.html">数字家谱</a><a href="plaza.html">家谱广场</a><a href="app.html">应用下载</a><a href="help.html">帮助中心</a>
</div>
<div>
<h4>文化内容</h4>
<a href="profile-content.html">家族文化</a
><a href="surname.html">姓氏百科</a
><a href="profile-article.html">家谱知识</a
><a href="profile-messages.html">平台公告</a>
<a href="profile-content.html">家族文化</a><a href="surname.html">姓氏百科</a><a href="profile-article.html">家谱知识</a><a href="profile-messages.html">平台公告</a>
</div>
<div>
<h4>联系我们</h4>
@@ -320,27 +152,13 @@
</footer>
<div class="logout-modal" id="logoutModal" aria-hidden="true">
<div class="logout-modal-backdrop" data-logout-close></div>
<div
class="logout-dialog"
role="dialog"
aria-modal="true"
aria-labelledby="logoutTitle"
>
<button
class="logout-close"
type="button"
data-logout-close
aria-label="关闭"
>
×
</button>
<div class="logout-dialog" role="dialog" aria-modal="true" aria-labelledby="logoutTitle">
<button class="logout-close" type="button" data-logout-close aria-label="关闭">×</button>
<span class="logout-icon">退</span>
<h2 id="logoutTitle">确认退出登录?</h2>
<p>退出后需要重新登录,才能继续管理家谱、审核消息和编辑资料。</p>
<div class="logout-actions">
<button class="btn ghost magnetic" type="button" data-logout-close>
取消
</button>
<button class="btn ghost magnetic" type="button" data-logout-close>取消</button>
<a class="btn primary magnetic" href="index.html" data-logout-confirm>确认退出</a>
</div>
</div>