完成50%

pages/records/r05-ritual-list.vue

@@ -1,47 +1,48 @@
-<!-- 页面编号：R-05；用途：礼仪活动列表、状态与创建入口。 -->
+<!-- 页面编号：R-05；用途：当前家谱的礼仪活动列表与本地创建预览入口。 -->
 <template>
   <view class="ritual-page" :class="stateClasses">
     <ModulePageBackground module="records" />
     <view class="page-header">
-      <PageHeader title="礼仪活动" action="新建" @action="createRitual" />
+      <PageHeader
+        title="礼仪活动"
+        :action="hasValidContext ? '填写预览' : ''"
+        @action="createCeremonyPreview"
+      />
     </view>
-    <view v-if="ritualState === 'loading'" class="page-loading">
+    <view v-if="ceremonyState === 'loading'" class="page-loading">
       <AppLoading
         text="正在整理礼仪活动"
-        description="请稍候，正在读取时间与地点。"
+        description="请稍候，正在核对当前家谱的活动记录。"
       />
     </view>
     <view v-else class="page-content">
-      <template v-if="ritualState === 'ready' && rituals.length">
+      <template v-if="ceremonyState === 'ready' && ceremonies.length">
         <view
-          v-for="ritual in rituals"
-          :key="ritual.id"
+          v-for="ceremony in ceremonies"
+          :key="ceremony.ceremonyId"
           class="record-card"
-          @click="openRitual(ritual)"
+          role="button"
+          :aria-label="`查看${ceremony.ceremonyTitle}`"
+          @click="openCeremony(ceremony)"
         >
-          <text>{{ ritual.status }}</text>
-          <text>{{ ritual.name }}</text>
-          <text>{{ ritual.date }} · {{ ritual.place }}</text>
-          <text>查看活动详情</text>
+          <text>{{ ceremony.ceremonyType }}</text>
+          <text>{{ ceremony.ceremonyTitle }}</text>
+          <text>
+            {{ ceremony.ceremonyTime }} ·
+            {{ ceremony.location || "地点待定" }}
+          </text>
+          <text>查看活动与受邀信息</text>
         </view>
-        <AppButton block label="新建礼仪" @click="createRitual" />
+        <AppButton block label="填写礼仪预览" @click="createCeremonyPreview" />
       </template>
       <view v-else class="state-card">
-        <text>
-          {{ ritualState === "error" ? "礼仪活动暂不可用" : "还没有礼仪活动" }}
-        </text>
-        <text>
-          {{
-            ritualState === "error"
-              ? "请稍后重新查看，已有活动不会受到影响。"
-              : "从一次祭祖、家宴或团拜开始安排。"
-          }}
-        </text>
+        <text>{{ stateCopy.title }}</text>
+        <text>{{ stateCopy.copy }}</text>
         <AppButton
-          :type="ritualState === 'error' ? 'secondary' : 'primary'"
+          :type="ceremonyState === 'empty' ? 'primary' : 'secondary'"
           block
-          :label="ritualState === 'error' ? '重新查看' : '新建礼仪'"
-          @click="ritualState === 'error' ? restoreRituals() : createRitual()"
+          :label="stateCopy.action"
+          @click="handleStateAction"
         />
       </view>
     </view>
@@ -54,53 +55,86 @@ import AppButton from "@/components/AppButton.vue";
 import AppLoading from "@/components/AppLoading.vue";
 import ModulePageBackground from "@/components/ModulePageBackground.vue";
 import PageHeader from "@/components/PageHeader.vue";
-const base = [
-  {
-    id: "501",
-    name: "清明祭祖",
-    status: "报名中",
-    date: "2025 年 4 月 4 日",
-    place: "汤氏宗祠",
-  },
-  {
-    id: "502",
-    name: "中秋家宴",
-    status: "筹备中",
-    date: "2025 年 9 月 17 日",
-    place: "祖居院落",
-  },
-  {
-    id: "503",
-    name: "新春团拜",
-    status: "已结束",
-    date: "2025 年 1 月 29 日",
-    place: "家族礼堂",
-  },
-];
-const rituals = ref([...base]);
-const ritualState = ref("loading");
+import {
+  getGenealogyFixtureAccess,
+  listCeremonyFixtures,
+} from "@/data/mock.js";
+import { goBack, openPage } from "@/utils/navigation.js";
+
+const genealogyId = ref("");
+const ceremonies = ref([]);
+const ceremonyState = ref("loading");
+const hasValidContext = computed(() =>
+  ["ready", "empty"].includes(ceremonyState.value),
+);
 const stateClasses = computed(() => ({
-  "ritual-state--loading": ritualState.value === "loading",
-  "ritual-state--empty": ritualState.value === "empty",
-  "ritual-state--error": ritualState.value === "error",
+  "ceremony-state--loading": ceremonyState.value === "loading",
+  "ceremony-state--empty": ceremonyState.value === "empty",
+  "ceremony-state--error": ceremonyState.value === "error",
+  "ceremony-state--invalid": ceremonyState.value === "invalid",
 }));
-onLoad((q) => {
-  const n = Math.max(1, Math.min(Number(q.count) || base.length, 50));
-  rituals.value = Array.from({ length: n }, (_, i) => ({
-    ...base[i % 3],
-    id: String(501 + i),
-    name: n > 3 ? `${base[i % 3].name}（${i + 1}）` : base[i].name,
-  }));
-  ritualState.value = ["loading", "empty", "error"].includes(q.state)
-    ? q.state
-    : "ready";
+const stateCopy = computed(() => ({
+  error: {
+    title: "礼仪活动暂不可用",
+    copy: "请稍后重新查看，已有活动不会受到影响。",
+    action: "重新查看",
+  },
+  invalid: {
+    title: "礼仪活动入口无效",
+    copy: "没有找到可访问的成员家谱，页面不会展示其他家谱活动。",
+    action: "返回上一页",
+  },
+  empty: {
+    title: "还没有礼仪活动",
+    copy: "可以先填写一份本地预览；正式创建仍需等待线上写接口启用。",
+    action: "填写礼仪预览",
+  },
+})[ceremonyState.value] || {
+  title: "礼仪活动暂不可用",
+  copy: "请返回上一页重新进入。",
+  action: "返回上一页",
 });
-const openRitual = (r) =>
-  uni.navigateTo({ url: `/pages/records/r06-ritual-detail?ritualId=${r.id}` });
-const createRitual = () =>
-  uni.navigateTo({ url: "/pages/records/r07-ritual-editor?mode=create" });
-const restoreRituals = () => {
-  ritualState.value = "ready";
+
+onLoad((query) => {
+  genealogyId.value = String(query.genealogyId || "");
+  const access = getGenealogyFixtureAccess(genealogyId.value);
+  if (!["owner", "member"].includes(access.accessRole)) {
+    ceremonies.value = [];
+    ceremonyState.value = "invalid";
+    return;
+  }
+  ceremonies.value = listCeremonyFixtures(genealogyId.value);
+  ceremonyState.value = ["loading", "empty", "error"].includes(query.state)
+    ? query.state
+    : ceremonies.value.length
+      ? "ready"
+      : "empty";
+});
+const openCeremony = (ceremony) =>
+  openPage(
+    "R06",
+    {
+      genealogyId: genealogyId.value,
+      ceremonyId: String(ceremony.ceremonyId),
+    },
+    "R05",
+  );
+const createCeremonyPreview = () =>
+  hasValidContext.value
+    ? openPage(
+        "R07",
+        { genealogyId: genealogyId.value, mode: "create" },
+        "R05",
+      )
+    : Promise.resolve(false);
+const restoreCeremonies = () => {
+  ceremonies.value = listCeremonyFixtures(genealogyId.value);
+  ceremonyState.value = ceremonies.value.length ? "ready" : "empty";
+};
+const handleStateAction = () => {
+  if (ceremonyState.value === "invalid") return goBack();
+  if (ceremonyState.value === "error") return restoreCeremonies();
+  return createCeremonyPreview();
 };
 </script>
 <style scoped lang="scss">