修改完成待测试

pages/genealogy/overview.vue

@@ -198,15 +198,26 @@
             </template>
           </view>
 
-          <view class="overview-family" @click="toFamily">
-            <view>
-              <text>家族近况</text>
-              <text>进入家族圈查看动态</text>
+          <view class="overview-family-content">
+            <view class="overview-family-content__heading">
+              <text>家族内容</text>
+              <text>按用途进入动态、影像与家族事务</text>
+            </view>
+            <view
+              v-for="group in familyContentGroups"
+              :key="group.key"
+              class="overview-family-group"
+            >
+              <text class="overview-family-group__title">{{ group.title }}</text>
+              <view class="overview-family-grid">
+                <button
+                  v-for="item in group.items"
+                  :key="item.key"
+                  class="overview-family-link"
+                  @click="openFamilySection(item.key)"
+                >{{ item.label }}</button>
+              </view>
             </view>
-            <image
-              src="/static/assets/foundation/transparent/chevron-right.png"
-              mode="aspectFit"
-            />
           </view>
           <view class="overview-note">
             <text class="overview-note__title">成员资料按家谱访问规则保护</text>
@@ -280,7 +291,6 @@ import { getRequestErrorMessage } from "@/services/api/request-error-message.js"
 import { getGenealogyAccessPresetLabel } from "@/utils/genealogy/access-policy.js";
 import {
   goBack,
-  goRoot,
   handleBackPress,
   openPage,
   returnTo,
@@ -378,7 +388,53 @@ onUnload(() => {
 const reloadOverview = () => loadGenealogy({ genealogyId: genealogyId.value });
 const toGenealogies = () => returnTo("G01", {});
 const toTree = () => openPage("T01", { genealogyId: genealogyId.value }, "G05");
-const toFamily = () => goRoot("F01", { genealogyId: genealogyId.value });
+const familyContentGroups = [
+  {
+    key: "memories",
+    title: "家族记录",
+    items: [
+      { key: "feed", label: "家族动态" },
+      { key: "articles", label: "谱文" },
+      { key: "albums", label: "相册" },
+      { key: "videos", label: "家族视频" },
+    ],
+  },
+  {
+    key: "affairs",
+    title: "家族事务",
+    items: [
+      { key: "rituals", label: "礼仪" },
+      { key: "memos", label: "备忘" },
+      { key: "benefactors", label: "家族恩人" },
+      { key: "people", label: "人物录" },
+      { key: "gifts", label: "贺礼簿" },
+      { key: "merits", label: "功德录" },
+    ],
+  },
+];
+const openFamilySection = (key) => {
+  if (!genealogyId.value) return;
+  if (key === "feed") return openPage("F12", { genealogyId: genealogyId.value }, "G05");
+  const routes = {
+    articles: "F04",
+    albums: "F07",
+    rituals: "R05",
+    memos: "R10",
+    benefactors: "R10",
+    people: "R01",
+    gifts: "R03",
+    merits: "R11",
+    videos: "F10",
+  };
+  return openPage(
+    routes[key],
+    {
+      genealogyId: genealogyId.value,
+      ...(key === "benefactors" ? { memoType: "benefactor" } : {}),
+    },
+    "G05",
+  );
+};
 const toApplications = () =>
   openPage("G10", { genealogyId: genealogyId.value }, "G05");
 const toSettings = () =>
@@ -573,8 +629,7 @@ onBackPress((event) => handleBackPress(event, requestBack));
 .overview-summary text {
   display: block;
 }
-.overview-action__chevron,
-.overview-family image {
+.overview-action__chevron {
   width: 26rpx;
   height: 26rpx;
   opacity: 0.68;
@@ -593,27 +648,67 @@ onBackPress((event) => handleBackPress(event, requestBack));
   grid-template-columns: minmax(0, 1fr);
   gap: 0;
 }
-.overview-family {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) 26rpx;
-  align-items: center;
-  gap: 20rpx;
+.overview-family-content {
   margin: 14rpx 42rpx 0;
-  padding: 20rpx 0;
+  padding: 24rpx 0 0;
   border-top: 1rpx solid rgba(152, 119, 72, 0.28);
+}
+
+.overview-family-content__heading text {
+  display: block;
+}
+
+.overview-family-content__heading text:first-child {
+  color: $ink;
+  font-family: "STKaiti", "KaiTi", serif;
+  font-size: clamp(18px, 31rpx, 22px);
+  font-weight: 700;
+}
+
+.overview-family-content__heading text:last-child {
+  margin-top: 5rpx;
   color: $ink-muted;
   font-size: clamp(13px, 20rpx, 16px);
   line-height: 1.5;
 }
-.overview-family text {
-  display: block;
+
+.overview-family-group {
+  margin-top: 22rpx;
 }
-.overview-family text:first-child {
-  margin-bottom: 3rpx;
+
+.overview-family-group__title {
+  display: block;
+  color: #7f4f16;
+  font-size: clamp(14px, 22rpx, 17px);
+  font-weight: 700;
+}
+
+.overview-family-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 12rpx;
+  margin-top: 12rpx;
+}
+
+.overview-family-link {
+  display: flex;
+  min-height: 76rpx;
+  align-items: center;
+  justify-content: center;
+  margin: 0;
+  padding: 8rpx 10rpx;
+  border: 1rpx solid rgba(181, 137, 63, 0.34);
+  border-radius: 8rpx;
+  background: rgba(247, 237, 218, 0.76);
   color: $ink;
   font-family: "STKaiti", "KaiTi", serif;
-  font-size: clamp(16px, 27rpx, 20px);
+  font-size: clamp(14px, 22rpx, 17px);
   font-weight: 700;
+  line-height: 1.35;
+}
+
+.overview-family-link::after {
+  border: 0;
 }
 .overview-note {
   display: flex;