完成全项目响应式审核与换机交接

components/AppDialog.vue

@@ -93,18 +93,23 @@ const cancel = () => {
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
-  padding: 40rpx;
+  padding: calc(40rpx + env(safe-area-inset-top)) 40rpx calc(40rpx + env(safe-area-inset-bottom));
   background: rgba(35, 18, 10, 0.62);
 }
 .app-dialog {
+  display: flex;
   width: 650rpx;
   max-width: 100%;
+  max-height: calc(var(--app-viewport-height, 100vh) - 80rpx - env(safe-area-inset-top) - env(safe-area-inset-bottom));
+  flex-direction: column;
+  overflow: hidden;
   @include adaptive.adaptive-auth-dialog;
 }
 .app-dialog__content {
   z-index: 1;
   display: flex;
-  max-height: calc(var(--app-viewport-height, 100vh) - 160rpx);
+  min-height: 0;
+  flex: 1;
   flex-direction: column;
   align-items: center;
   box-sizing: border-box;

components/AppTabbar.vue

@@ -1,10 +1,14 @@
 <!-- 公共组件：根页面底部导航；仅维护家谱、家族、我的三项已确认入口及其透明图标。 -->
 <template>
-  <view class="app-tabbar">
+  <view class="app-tabbar" role="tablist" aria-label="主要导航">
     <view
       v-for="item in items"
       :key="item.key"
       class="tab-item"
+      role="tab"
+      :aria-selected="active === item.key"
+      :aria-label="`${item.label}${active === item.key ? '，当前页面' : ''}`"
+      hover-class="tab-item--pressed"
       @click="switchTab(item)"
     >
       <image
@@ -77,6 +81,9 @@ const switchTab = (item) => {
   padding: 4rpx 0;
   box-sizing: border-box;
 }
+.tab-item--pressed {
+  opacity: 0.72;
+}
 
 .tab-icon {
   width: 64rpx;

components/GenealogyCard.vue

@@ -3,6 +3,9 @@
   <view
     class="genealogy-card"
     :class="{ 'genealogy-card--current': selected }"
+    role="button"
+    :aria-label="accessibleLabel"
+    hover-class="genealogy-card--pressed"
     @click="$emit('select', genealogy)"
   >
     <image
@@ -61,12 +64,19 @@
 </template>
 
 <script setup>
-defineProps({
+import { computed } from "vue";
+
+const props = defineProps({
   genealogy: { type: Object, required: true },
   role: { type: String, required: true },
   selected: { type: Boolean, default: false },
 });
 defineEmits(["select"]);
+
+const accessibleLabel = computed(
+  () =>
+    `${props.genealogy.name}，${props.role}${props.selected ? '，当前家谱' : ''}，${props.genealogy.location}，${props.genealogy.memberCount} 位成员`,
+);
 </script>
 
 <style scoped lang="scss">
@@ -86,6 +96,9 @@ defineEmits(["select"]);
 .genealogy-card--current {
   background: transparent;
 }
+.genealogy-card--pressed {
+  opacity: 0.72;
+}
 
 .row-frame {
   grid-area: 1 / 1 / 2 / -1;

components/PageHeader.vue

@@ -117,6 +117,7 @@ const goBack = () => {
   box-sizing: border-box;
   background: $brand-red;
   color: #fff9ed;
+  transform: translateZ(0);
 }
 
 .page-header--root {