From cd3dbb2ab121ebb3195f1009313497079c8bab77 Mon Sep 17 00:00:00 2001
From: rain <rain>
Date: Tue, 21 Jul 2026 12:13:07 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=8C=E6=AD=A5=E5=B0=81=E5=AD=98A06?=
 =?UTF-8?q?=E8=87=AA=E9=80=82=E5=BA=94=E9=AA=A8=E6=9E=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/auth/a06-auth-status.vue     | 146 ++++++++++-------------------
 tests/a06-auth-status-contract.ps1 |  28 ++++--
 2 files changed, 74 insertions(+), 100 deletions(-)

diff --git a/pages/auth/a06-auth-status.vue b/pages/auth/a06-auth-status.vue
index 0c80b68..990adf3 100644
--- a/pages/auth/a06-auth-status.vue
+++ b/pages/auth/a06-auth-status.vue
@@ -1,18 +1,6 @@
 <!-- 页面编号：A-06；用途：只承接账号冻结、停用与风险限制等阻断登录状态。 -->
 <template>
-  <view class="auth-page status-page">
-    <view class="page-canvas">
-      <image
-        class="page-backdrop"
-        src="/static/assets/modules/auth/opaque/a01-red-hall-ink-backdrop-v1.png"
-        mode="scaleToFill"
-      />
-      <image
-        class="brand-seal"
-        src="/static/assets/foundation/transparent/brand-seal.png"
-        mode="aspectFit"
-      />
-
+  <AuthPageShell class="auth-page status-page">
       <view class="status-content">
         <view class="page-heading">
           <view class="back-button" hover-class="tap-fade" @click="goBack">
@@ -85,42 +73,48 @@
           >返回登录</view
         >
       </view>
-    </view>
 
-    <view v-if="recoveryVisible" class="recovery-layer" @click="closeRecovery">
-      <view class="recovery-dialog" @click.stop>
-        <image
-          class="recovery-dialog__skin"
-          src="/static/assets/modules/auth/transparent/a01-scroll-dialog-v3.png"
-          mode="aspectFit"
-        />
-        <view class="recovery-dialog__content">
-          <text class="recovery-title">{{ currentState.recoveryTitle }}</text>
-          <text class="recovery-copy">{{ currentState.recoveryDetail }}</text>
-          <text class="recovery-note"
-            >账号恢复服务将在功能阶段接入，当前仅审核页面样式与状态位置。</text
-          >
-          <view
-            class="recovery-action"
-            hover-class="button-hover"
-            @click="closeRecovery"
-          >
-            <image
-              class="recovery-action__skin"
-              src="/static/assets/foundation/transparent/a01-scroll-primary-v3.png"
-              mode="aspectFit"
-            />
-            <text class="recovery-action__copy">我知道了</text>
+    <template #overlay>
+      <view
+        v-if="recoveryVisible"
+        class="recovery-layer"
+        @click="closeRecovery"
+      >
+        <view class="recovery-dialog" @click.stop>
+          <image
+            class="recovery-dialog__skin"
+            src="/static/assets/modules/auth/transparent/a01-scroll-dialog-v3.png"
+            mode="aspectFit"
+          />
+          <view class="recovery-dialog__content">
+            <text class="recovery-title">{{ currentState.recoveryTitle }}</text>
+            <text class="recovery-copy">{{ currentState.recoveryDetail }}</text>
+            <text class="recovery-note"
+              >账号恢复服务将在功能阶段接入，当前仅审核页面样式与状态位置。</text
+            >
+            <view
+              class="recovery-action"
+              hover-class="button-hover"
+              @click="closeRecovery"
+            >
+              <image
+                class="recovery-action__skin"
+                src="/static/assets/foundation/transparent/a01-scroll-primary-v3.png"
+                mode="aspectFit"
+              />
+              <text class="recovery-action__copy">我知道了</text>
+            </view>
           </view>
         </view>
       </view>
-    </view>
-  </view>
+    </template>
+  </AuthPageShell>
 </template>
 
 <script setup>
 import { computed, ref } from "vue";
 import { onLoad, onShow } from "@dcloudio/uni-app";
+import AuthPageShell from "@/components/AuthPageShell.vue";
 
 const status = ref("risk");
 const recoveryVisible = ref(false);
@@ -203,47 +197,20 @@ const goBack = () => uni.navigateBack();
 </script>
 
 <style scoped lang="scss">
-.auth-page {
-  width: 100%;
-  height: 100dvh;
-  min-height: 100%;
-  overflow-y: auto;
-  background: #f7f0e4;
-  color: #493323;
-}
-
-.page-canvas {
-  display: grid;
-  box-sizing: border-box;
-  width: 100%;
-  min-height: calc(1665rpx + env(safe-area-inset-bottom));
-  padding-bottom: env(safe-area-inset-bottom);
-}
-.page-backdrop {
-  grid-area: 1 / 1;
-  align-self: start;
-  width: 100%;
-  height: 1665rpx;
-  pointer-events: none;
-}
-.brand-seal {
-  z-index: 1;
-  grid-area: 1 / 1;
-  align-self: start;
-  justify-self: center;
-  width: 184rpx;
-  height: 221rpx;
-  margin-top: 64rpx;
-  pointer-events: none;
-}
 .status-content {
-  z-index: 2;
-  grid-area: 1 / 1;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
   box-sizing: border-box;
-  padding: 430rpx 64rpx 46rpx;
+  width: 100%;
+  max-width: 480px;
+  min-width: 0;
+  margin: 0 auto;
+  padding: clamp(10px, 2.2vh, 20px) clamp(24px, 8.5vw, 44px);
 }
 .page-heading {
   display: grid;
+  grid-template-columns: minmax(0, 1fr);
   grid-template-rows: auto auto auto;
   justify-items: center;
   min-height: 154rpx;
@@ -256,8 +223,8 @@ const goBack = () => uni.navigateBack();
   justify-self: start;
   align-items: center;
   justify-content: center;
-  width: 88rpx;
-  height: 88rpx;
+  width: var(--app-touch-min);
+  height: var(--app-touch-min);
   margin-top: 10rpx;
 }
 .back-button__icon {
@@ -266,13 +233,15 @@ const goBack = () => uni.navigateBack();
   transform: scaleX(-1);
 }
 .page-title {
+  grid-column: 1;
   grid-row: 1;
   color: #9f170f;
-  font-size: 66rpx;
+  font-size: 58rpx;
   font-weight: 700;
   letter-spacing: 7rpx;
 }
 .page-subtitle {
+  grid-column: 1;
   grid-row: 2;
   margin-top: 12rpx;
   color: #806c58;
@@ -280,6 +249,7 @@ const goBack = () => uni.navigateBack();
   letter-spacing: 1rpx;
 }
 .status-divider {
+  grid-column: 1;
   grid-row: 3;
   width: 300rpx;
   height: 50rpx;
@@ -348,7 +318,7 @@ const goBack = () => uni.navigateBack();
 .status-primary {
   display: grid;
   place-items: center;
-  min-height: 104rpx;
+  min-height: var(--app-touch-min);
   margin-top: 28rpx;
 }
 .status-primary__skin,
@@ -368,7 +338,7 @@ const goBack = () => uni.navigateBack();
   display: flex;
   align-items: center;
   justify-content: center;
-  min-height: 82rpx;
+  min-height: var(--app-touch-min);
   color: #a7160c;
   font-size: 24rpx;
 }
@@ -388,7 +358,7 @@ const goBack = () => uni.navigateBack();
   display: grid;
   width: 620rpx;
   min-height: 520rpx;
-  max-height: calc(100vh - 80rpx);
+  max-height: calc(var(--app-viewport-height) - 40px);
 }
 .recovery-dialog__skin {
   grid-area: 1 / 1;
@@ -444,16 +414,4 @@ const goBack = () => uni.navigateBack();
   opacity: 0.72;
 }
 
-@media screen and (max-width: 340px) {
-  .status-content {
-    padding-right: 48rpx;
-    padding-left: 48rpx;
-  }
-  .page-title {
-    font-size: 60rpx;
-  }
-  .status-detail__label {
-    flex-basis: 108rpx;
-  }
-}
 </style>
diff --git a/tests/a06-auth-status-contract.ps1 b/tests/a06-auth-status-contract.ps1
index f723f80..742ba08 100644
--- a/tests/a06-auth-status-contract.ps1
+++ b/tests/a06-auth-status-contract.ps1
@@ -39,17 +39,16 @@ foreach ($required in @(
   'const openRecovery = () =>',
   'const closeRecovery = () =>',
   'const goBack = () =>',
-  'a01-red-hall-ink-backdrop-v1.png',
-  'brand-seal.png',
+  '<AuthPageShell',
+  'import AuthPageShell from "@/components/AuthPageShell.vue";',
   'a01-vnext-divider-v1.png',
   'a01-scroll-primary-v3.png',
   'a01-scroll-dialog-v3.png',
   'chevron-right.png',
   'auth-login-outline.png',
   'class="recovery-layer"',
-  'width: 184rpx;',
-  'height: 221rpx;',
-  'mode="aspectFit"'
+  'mode="aspectFit"',
+  'max-height: calc(var(--app-viewport-height) - 40px);'
 )) {
   Assert-Contains -Content $page -Expected $required -Message "Missing A-06 auth-status contract: $required"
 }
@@ -60,7 +59,9 @@ foreach ($removedState in @('normal:', 'failed:', 'restricted:', "'register-pend
 foreach ($nativeUi in @('uni.showToast', 'uni.showModal', 'uni.showLoading', 'uni.showActionSheet')) {
   Assert-NotContains -Content $page -Unexpected $nativeUi -Message "A-06 must not use native UniApp feedback: $nativeUi"
 }
-Assert-NotContains -Content $page -Unexpected 'auth-design-scenery-v1.png' -Message 'A-06 must use the selected red-hall ink backdrop'
+foreach ($forbidden in @('class="page-canvas"', 'class="page-backdrop"', 'mode="scaleToFill"', '1665rpx', 'a01-red-hall-ink-backdrop-v1.png')) {
+  Assert-NotContains -Content $page -Unexpected $forbidden -Message "A06 retains rejected page coordinates: $forbidden"
+}
 foreach ($obsoleteVisual in @(
   'a01-primary-button.png',
   'a02-login-panel.png',
@@ -82,4 +83,19 @@ foreach ($forbidden in @(
   if ($page -match $forbidden) { throw "A-06 retains forbidden CSS visual construction: $forbidden" }
 }
 
+$contentRule = [regex]::Match($page, '(?ms)^\.status-content\s*\{(?<Body>.*?)^\}')
+if (-not $contentRule.Success) { throw 'A06 status content rule is missing.' }
+foreach ($required in @('display: flex;', 'flex: 1;', 'flex-direction: column;', 'max-width: 480px;', 'margin: 0 auto;')) {
+  Assert-Contains -Content $contentRule.Groups['Body'].Value -Expected $required -Message "A06 status content must use document flow: $required"
+}
+
+$headingRule = [regex]::Match($page, '(?ms)^\.page-heading\s*\{(?<Body>.*?)^\}')
+if (-not $headingRule.Success) { throw 'A06 page heading rule is missing.' }
+Assert-Contains -Content $headingRule.Groups['Body'].Value -Expected 'grid-template-columns: minmax(0, 1fr);' -Message 'A06 heading must center against the full content width.'
+foreach ($selector in @('page-title', 'page-subtitle', 'status-divider')) {
+  $rule = [regex]::Match($page, "(?ms)^\.$selector\s*\{(?<Body>.*?)^\}")
+  if (-not $rule.Success) { throw "A06 heading child rule is missing: $selector" }
+  Assert-Contains -Content $rule.Groups['Body'].Value -Expected 'grid-column: 1;' -Message "A06 heading child must remain in the full-width grid column: $selector"
+}
+
 Write-Output 'A06-AUTH-STATUS-CONTRACT PASS'