验收20%

2026-07-16 07:42:07 +08:00
parent 0dec90ffdd
commit cb25317412
108 changed files with 6477 additions and 1308 deletions
@@ -4,13 +4,13 @@
    <image class="overview-page__paper" src="/static/assets/foundation/opaque/page-paper.jpg" mode="aspectFill" />
    <image class="overview-page__footer" src="/static/assets/foundation/transparent/footer-mountain-bamboo.png" mode="widthFix" />
    <view class="overview-page__header">
-      <PageHeader title="家谱总览" :action="overviewState === 'ready' ? '管理' : ''" @action="toSettings" />
+      <PageHeader :title="viewMode === 'public' ? '家谱公开预览' : '家谱总览'" :action="overviewState === 'ready' && viewMode === 'member' && accessRole === 'owner' ? '管理' : ''" @action="toSettings" />
    </view>

    <view class="overview-surface">
      <image class="overview-surface__skin" src="/static/assets/modules/genealogy/opaque/g05-overview-surface.png" mode="scaleToFill" />

-      <template v-if="overviewState === 'ready' && genealogy">
+      <template v-if="overviewState === 'ready' && genealogy && viewMode === 'member'">
        <view class="overview-ready">
          <view class="overview-hero">
            <text class="overview-hero__kicker">{{ genealogy.hall || '堂号待补' }} · {{ genealogy.location || '所在地待补' }}</text>
@@ -23,17 +23,17 @@
            </view>
          </view>

-          <view class="overview-actions">
+          <view class="overview-actions" :class="{ 'overview-actions--member': accessRole === 'member' }">
            <view class="overview-action overview-action--tree" @click="toTree">
              <text class="overview-action__title">世系树</text><text>查看家脉关系</text>
            </view>
-            <view class="overview-action overview-action--ancestor" @click="toFirstPerson">
+            <view v-if="accessRole === 'owner'" class="overview-action overview-action--ancestor" @click="toFirstPerson">
              <text class="overview-action__title">录入族人</text><text>从首代开始完善</text>
            </view>
            <view class="overview-action overview-action--poem" @click="toGenerationPoems">
              <text class="overview-action__title">字辈谱</text><text>传承行辈次序</text>
            </view>
-            <view class="overview-action overview-action--review" @click="toApplications">
+            <view v-if="accessRole === 'owner'" class="overview-action overview-action--review" @click="toApplications">
              <text class="overview-action__title">入谱审核</text><text>处理加入申请</text>
            </view>
          </view>
@@ -48,10 +48,34 @@
        </view>
      </template>

+      <view v-else-if="overviewState === 'ready' && genealogy" class="overview-public">
+        <view class="overview-public__hero">
+          <text class="overview-public__eyebrow">公开家谱</text>
+          <text class="overview-public__title">{{ genealogy.name }}</text>
+          <text class="overview-public__source">{{ genealogy.source }}</text>
+        </view>
+        <view class="overview-public__details">
+          <view><text>姓氏</text><text>{{ genealogy.surname }}氏</text></view>
+          <view><text>地区</text><text>{{ genealogy.location }}</text></view>
+          <view><text>堂号</text><text>{{ genealogy.hall }}</text></view>
+          <view><text>当前支系</text><text>{{ genealogy.branchName }}</text></view>
+          <view><text>所属上级谱</text><text>{{ genealogy.parentName }}</text></view>
+        </view>
+        <view class="overview-public__notice">
+          <text>公开说明</text>
+          <text>{{ genealogy.publicDescription }}</text>
+        </view>
+        <view class="overview-public__action" @click="applyToJoin">
+          <image src="/static/assets/foundation/opaque/a01-primary-button.png" mode="scaleToFill" />
+          <text>申请加入这部家谱</text>
+        </view>
+      </view>
+
      <view v-else class="overview-state-panel" :class="{
        'overview-state--loading': overviewState === 'loading',
        'overview-state--empty': overviewState === 'empty',
-        'overview-state--error': overviewState === 'error'
+        'overview-state--error': overviewState === 'error',
+        'overview-state--no-permission': overviewState === 'no-permission'
      }">
        <text class="overview-state-panel__title">{{ stateTitle }}</text>
        <text class="overview-state-panel__copy">{{ stateCopy }}</text>
@@ -68,30 +92,49 @@
 import { computed, ref } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
 import PageHeader from '@/components/PageHeader.vue'
-import { appApi } from '@/utils/api.js'
-import { genealogyContext } from '@/utils/genealogy-context.js'

 const genealogy = ref(null)
 const genealogyId = ref('')
 const overviewState = ref('loading')
 const loadError = ref('')
+const viewMode = ref('member')
+const accessRole = ref('owner')
+const overviewFixture = {
+  id: '2001',
+  surname: '汤',
+  name: '汤氏南阳宗谱',
+  hall: '敦睦堂',
+  location: '河南·南阳',
+  parentName: '汤氏中华总谱',
+  branchName: '南阳主支',
+  source: '由南阳汤氏族人整理并维护',
+  publicDescription: '公开展示家谱身份、地区、堂号与支系信息；成员资料和世系详情仅向已加入成员开放。',
+  motto: '敦亲睦族，敬祖传家。',
+  memberCount: 428,
+  activeCount: 316,
+  visibility: '仅成员可见'
+}

 const stateTitle = computed(() => ({
  loading: '正在展开家谱…',
  empty: '还没有可查看的家谱',
-  error: '家谱暂时无法打开'
+  error: '家谱暂时无法打开',
+  'no-permission': '当前账号无权查看'
 }[overviewState.value] || ''))
 const stateCopy = computed(() => loadError.value || ({
  loading: '请稍候，正在读取家谱概览。',
  empty: '请从“我的家谱”选择一部家谱后再进入。',
-  error: '可能是网络波动、家谱不存在或当前账号无访问权限。'
+  error: '可能是网络波动或家谱不存在。',
+  'no-permission': '这部家谱未向当前账号开放，请返回我的家谱或联系管理员。'
 }[overviewState.value] || ''))

-const loadGenealogy = async (query = {}) => {
+const loadGenealogy = (query = {}) => {
  overviewState.value = 'loading'
  loadError.value = ''
  genealogy.value = null
-  genealogyId.value = query.genealogyId || genealogyId.value || genealogyContext.getCurrentGenealogyId()
+  genealogyId.value = query.genealogyId || genealogyId.value || ''
+  viewMode.value = query.mode === 'public' ? 'public' : 'member'
+  accessRole.value = query.role === 'member' ? 'member' : 'owner'

  if (query.state === 'empty' || !genealogyId.value) {
    overviewState.value = 'empty'
@@ -101,16 +144,14 @@ const loadGenealogy = async (query = {}) => {
    overviewState.value = 'error'
    return
  }
-
-  genealogyContext.setCurrentGenealogyId(genealogyId.value)
-  try {
-    genealogy.value = await appApi.getOverview(genealogyId.value)
-    overviewState.value = genealogy.value ? 'ready' : 'error'
-    if (!genealogy.value) loadError.value = '家谱不存在或当前账号无权访问。'
-  } catch (error) {
-    loadError.value = error.message || '家谱加载失败，请稍后重试。'
-    overviewState.value = 'error'
+  if (query.state === 'no-permission') {
+    overviewState.value = 'no-permission'
+    return
  }
+  if (query.state === 'loading') return
+
+  genealogy.value = { ...overviewFixture, id: genealogyId.value }
+  overviewState.value = 'ready'
 }

 onLoad(loadGenealogy)
@@ -122,10 +163,11 @@ const toFamily = () => uni.reLaunch({ url: '/pages/family/f01-family-feed' })
 const toApplications = () => uni.navigateTo({ url: `/pages/genealogy/g10-application-review?genealogyId=${genealogyId.value}` })
 const toSettings = () => uni.navigateTo({ url: `/pages/genealogy/g11-genealogy-settings?genealogyId=${genealogyId.value}` })
 const toGenerationPoems = () => uni.navigateTo({ url: `/pages/genealogy/g12-generation-poems?genealogyId=${genealogyId.value}` })
+const applyToJoin = () => uni.navigateTo({ url: `/pages/genealogy/g08-join-application?source=search&genealogyId=${genealogyId.value}` })
 </script>

 <style scoped lang="scss">
-.overview-page { position: relative; min-height: 100vh; overflow: hidden; background: $paper; }
+.overview-page { position: relative; min-height: 100vh; overflow-x: hidden; background: $paper; }
 .overview-page__paper { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; opacity: .98; pointer-events: none; }
 .overview-page__footer { position: absolute; right: 0; bottom: 0; left: 0; z-index: 1; width: 100%; opacity: .13; pointer-events: none; }
 .overview-page__header { position: relative; z-index: 3; }
@@ -138,9 +180,9 @@ const toGenerationPoems = () => uni.navigateTo({ url: `/pages/genealogy/g12-gene
 .overview-hero__motto { display: block; margin-top: 6rpx; color: #e9dcc1; font-size: 23rpx; }
 .overview-hero__stats { display: flex; gap: 18rpx; margin-top: 12rpx; color: #dbc990; font-size: 22rpx; }
 .overview-actions { position: absolute; top: 29.2%; right: 7.2%; left: 7.2%; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 3.4% 3%; height: 36.2%; }
+.overview-actions--member { grid-template-rows: 1fr; height: 18%; }
 .overview-action { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 0 22rpx; box-sizing: border-box; color: $ink-muted; font-size: 22rpx; }
 .overview-action__title { margin-bottom: 9rpx; color: $ink; font-family: 'STKaiti', 'KaiTi', serif; font-size: 30rpx; font-weight: 700; }
-.overview-action--tree .overview-action__title { color: $brand-red; }
 .overview-family { position: absolute; top: 70.2%; right: 7.5%; left: 7.5%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16rpx; color: $ink-muted; font-size: 22rpx; }
 .overview-family text:first-child { color: $ink; font-family: 'STKaiti', 'KaiTi', serif; font-size: 28rpx; font-weight: 700; }
 .overview-family text:last-child { color: $brand-red; }
@@ -152,6 +194,20 @@ const toGenerationPoems = () => uni.navigateTo({ url: `/pages/genealogy/g12-gene
 .overview-state-panel__action { position: relative; width: 300rpx; height: 76rpx; margin-top: 30rpx; }
 .overview-state-panel__action image { position: absolute; inset: 0; width: 100%; height: 100%; }
 .overview-state-panel__action text { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; height: 100%; color: #fff9ed; font-size: 25rpx; font-weight: 700; }
+.overview-public { position: absolute; inset: 0; }
+.overview-public__hero { position: absolute; top: 6.5%; right: 8%; left: 8%; color: #fff8ec; }
+.overview-public__eyebrow { display: block; color: #dec483; font-size: 21rpx; letter-spacing: 3rpx; }
+.overview-public__title { display: block; margin-top: 10rpx; font-family: 'STKaiti', 'KaiTi', serif; font-size: 43rpx; font-weight: 700; letter-spacing: 4rpx; }
+.overview-public__source { display: block; margin-top: 7rpx; color: #e9dcc1; font-size: 22rpx; }
+.overview-public__details { position: absolute; top: 30%; right: 9%; left: 9%; display: grid; grid-template-columns: 1fr 1fr; gap: 18rpx 28rpx; }
+.overview-public__details > view { display: flex; flex-direction: column; }
+.overview-public__details text:first-child { color: $brand-red; font-size: 21rpx; }
+.overview-public__details text:last-child { margin-top: 6rpx; color: $ink; font-family: 'STKaiti', 'KaiTi', serif; font-size: 27rpx; }
+.overview-public__notice { position: absolute; top: 58%; right: 9%; left: 9%; display: flex; flex-direction: column; color: $ink-muted; font-size: 22rpx; line-height: 36rpx; }
+.overview-public__notice text:first-child { margin-bottom: 8rpx; color: $brand-red; font-family: 'STKaiti', 'KaiTi', serif; font-size: 27rpx; font-weight: 700; }
+.overview-public__action { position: absolute; right: 9%; bottom: 7%; left: 9%; display: flex; height: 82rpx; align-items: center; justify-content: center; overflow: hidden; }
+.overview-public__action image { position: absolute; inset: 0; width: 100%; height: 100%; }
+.overview-public__action text { position: relative; z-index: 1; color: #fff9ed; font-size: 27rpx; font-weight: 700; letter-spacing: 3rpx; }
@media (min-width: 400px) {
  .overview-hero { top: 7%; }
  .overview-action { padding: 0 28rpx; }