فهرست منبع

fix(frontend): DAN 报告页补充自定义返回按钮

report-result / comparison 均为 navigationStyle:custom(原生返回被隐藏),页面此前未实现返回入口。补充 hero-nav / cmp-nav 自定义返回导航,含状态栏高度避让与 navigateBack 兜底(无上一页时 reLaunch 首页)。后端与报告数据无改动。
Agnes Agent 1 هفته پیش
والد
کامیت
7ea5a7d20c
2فایلهای تغییر یافته به همراه60 افزوده شده و 1 حذف شده
  1. 25 0
      cfc-frontend/pages/dan-assessment/comparison.vue
  2. 35 1
      cfc-frontend/pages/dan-assessment/report-result.vue

+ 25 - 0
cfc-frontend/pages/dan-assessment/comparison.vue

@@ -1,5 +1,11 @@
 <template>
 <template>
   <view class="page" :style="{ '--font-scale': fontScale }">
   <view class="page" :style="{ '--font-scale': fontScale }">
+    <view class="cmp-nav" :style="'padding-top:' + (statusBarHeight > 0 ? statusBarHeight : 20) + 'px'">
+      <view class="cmp-nav-back" hover-class="cmp-nav-back-hover" @click="goBack">
+        <text class="cmp-nav-back-icon">←</text>
+      </view>
+      <text class="cmp-nav-title">DAN 报告对比</text>
+    </view>
     <view class="filter-bar">
     <view class="filter-bar">
       <view class="filter-item">{{ currentMemberName }} ▾</view>
       <view class="filter-item">{{ currentMemberName }} ▾</view>
       <picker :range="reportIds" @change="onReportIdChange">
       <picker :range="reportIds" @change="onReportIdChange">
@@ -63,6 +69,7 @@ export default {
   components: {},
   components: {},
   data() {
   data() {
     return {
     return {
+      statusBarHeight: 0,
       memberId: null,
       memberId: null,
       reportIds: [],
       reportIds: [],
       currentReportId: null,
       currentReportId: null,
@@ -83,6 +90,10 @@ export default {
   },
   },
   onLoad(options) {
   onLoad(options) {
     var self = this
     var self = this
+    try {
+      var info = uni.getWindowInfo && uni.getWindowInfo()
+      if (info && info.statusBarHeight) self.statusBarHeight = info.statusBarHeight
+    } catch (e) {}
     // 从 query 获取 memberId,或默认取当前登录成员
     // 从 query 获取 memberId,或默认取当前登录成员
     if (options.memberId) {
     if (options.memberId) {
       self.memberId = parseInt(options.memberId)
       self.memberId = parseInt(options.memberId)
@@ -90,6 +101,14 @@ export default {
     self.loadMembers()
     self.loadMembers()
   },
   },
   methods: {
   methods: {
+    goBack() {
+      var pages = getCurrentPages()
+      if (pages && pages.length > 1) {
+        uni.navigateBack()
+      } else {
+        uni.reLaunch({ url: '/pages/index-home/index' })
+      }
+    },
     loadMembers() {
     loadMembers() {
       var self = this
       var self = this
       getFamilyMemberList({ visibleOnly: true }).then(function(res) {
       getFamilyMemberList({ visibleOnly: true }).then(function(res) {
@@ -163,6 +182,12 @@ export default {
   padding: 24rpx;
   padding: 24rpx;
   box-sizing: border-box;
   box-sizing: border-box;
 }
 }
+.cmp-nav { display: flex; align-items: center; padding-bottom: 16rpx; }
+.cmp-nav-back { width: 64rpx; height: 64rpx; border-radius: 50%; background: rgba(0,0,0,0.06); display: flex; align-items: center; justify-content: center; margin-right: 16rpx; }
+.cmp-nav-back-hover { background: rgba(0,0,0,0.12); }
+.cmp-nav-back-icon { color: $uni-text-color; font-size: 44rpx; line-height: 1; font-weight: 700; }
+.cmp-nav-title { color: $uni-text-color; font-size: calc(32rpx * var(--font-scale, 1)); font-weight: 600; }
+
 .filter-bar {
 .filter-bar {
   display: flex;
   display: flex;
   flex-direction: row;
   flex-direction: row;

+ 35 - 1
cfc-frontend/pages/dan-assessment/report-result.vue

@@ -5,6 +5,13 @@
       <view class="hero-bg-circle hero-bg-circle-1"></view>
       <view class="hero-bg-circle hero-bg-circle-1"></view>
       <view class="hero-bg-circle hero-bg-circle-2"></view>
       <view class="hero-bg-circle hero-bg-circle-2"></view>
 
 
+      <view class="hero-nav" :style="'padding-top:' + (statusBarHeight > 0 ? statusBarHeight : 20) + 'px'">
+        <view class="hero-nav-back" hover-class="hero-nav-back-hover" @click="goBack">
+          <text class="hero-nav-back-icon">←</text>
+        </view>
+        <text class="hero-nav-title">{{ dimensionLabel }}</text>
+      </view>
+
       <view class="hero-top">
       <view class="hero-top">
         <text class="hero-name">{{ childName }}</text>
         <text class="hero-name">{{ childName }}</text>
         <view class="hero-dim-row">
         <view class="hero-dim-row">
@@ -251,6 +258,7 @@ export default {
   data() {
   data() {
     return {
     return {
       reportId: null,
       reportId: null,
+      statusBarHeight: 0,
       loading: true,
       loading: true,
       childName: '',
       childName: '',
       dateText: '',
       dateText: '',
@@ -513,10 +521,22 @@ export default {
     }
     }
   },
   },
   onLoad(options) {
   onLoad(options) {
+    try {
+      var info = uni.getWindowInfo && uni.getWindowInfo()
+      if (info && info.statusBarHeight) this.statusBarHeight = info.statusBarHeight
+    } catch (e) {}
     this.reportId = options.reportId ? parseInt(options.reportId) : null
     this.reportId = options.reportId ? parseInt(options.reportId) : null
     if (this.reportId) this.loadData()
     if (this.reportId) this.loadData()
   },
   },
   methods: {
   methods: {
+    goBack() {
+      var pages = getCurrentPages()
+      if (pages && pages.length > 1) {
+        uni.navigateBack()
+      } else {
+        uni.reLaunch({ url: '/pages/index-home/index' })
+      }
+    },
     getBlockKey(bi) {
     getBlockKey(bi) {
       return 'g' + bi
       return 'g' + bi
     },
     },
@@ -662,11 +682,25 @@ $c-rpt-mask-ink:     #000;    // 遮罩渐变异色(mask-image)
 .hero {
 .hero {
   position: relative;
   position: relative;
   background: linear-gradient(160deg, $dim-wisdom-deep 0%, $facade-violet-deep 55%, $facade-violet 100%);
   background: linear-gradient(160deg, $dim-wisdom-deep 0%, $facade-violet-deep 55%, $facade-violet 100%);
-  padding: 48rpx 36rpx 44rpx;
+  padding: 0 36rpx 44rpx;
   overflow: hidden;
   overflow: hidden;
   border-bottom-left-radius: 24rpx;
   border-bottom-left-radius: 24rpx;
   border-bottom-right-radius: 24rpx;
   border-bottom-right-radius: 24rpx;
 }
 }
+.hero-nav {
+  position: relative; z-index: 2;
+  display: flex; align-items: center;
+  padding-bottom: 20rpx;
+}
+.hero-nav-back {
+  width: 64rpx; height: 64rpx; border-radius: 50%;
+  background: rgba(255,255,255,0.22);
+  display: flex; align-items: center; justify-content: center;
+  margin-right: 16rpx;
+}
+.hero-nav-back-hover { background: rgba(255,255,255,0.38); }
+.hero-nav-back-icon { color: #fff; font-size: 44rpx; line-height: 1; font-weight: 700; }
+.hero-nav-title { color: rgba(255,255,255,0.95); font-size: calc(30rpx * var(--font-scale, 1)); font-weight: 600; }
 .hero-bg-circle { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.06); }
 .hero-bg-circle { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.06); }
 .hero-bg-circle-1 { width: 380rpx; height: 380rpx; right: -120rpx; top: -140rpx; }
 .hero-bg-circle-1 { width: 380rpx; height: 380rpx; right: -120rpx; top: -140rpx; }
 .hero-bg-circle-2 { width: 220rpx; height: 220rpx; left: -80rpx; bottom: -60rpx; }
 .hero-bg-circle-2 { width: 220rpx; height: 220rpx; left: -80rpx; bottom: -60rpx; }