Forráskód Böngészése

feat: 过渡页最少800ms最多3s — 集中计时到tab-transition组件

Xiaogang Liao 1 hónapja
szülő
commit
7a85fe0255

+ 23 - 1
cfc-frontend/components/tab-transition.vue

@@ -33,6 +33,7 @@ export default {
   },
   data() {
     return {
+      mountedAt: 0
     }
   },
   computed: {
@@ -48,7 +49,28 @@ export default {
       return 'linear-gradient(160deg, #FFF7ED 0%, rgba(' + r + ',' + g + ',' + b + ',0.4) 100%)'
     }
   },
-  // mounted 已清空:显隐完全由父组件 v-if 控制
+  mounted() {
+    this.mountedAt = Date.now()
+    var self = this
+    // 最多 3 秒强制关闭
+    setTimeout(function() {
+      self.$emit('close')
+    }, 3000)
+  },
+  methods: {
+    // 父组件数据加载完成后调用,过渡页至少停留 800ms
+    markReady: function() {
+      var elapsed = Date.now() - this.mountedAt
+      if (elapsed >= 800) {
+        this.$emit('close')
+      } else {
+        var self = this
+        setTimeout(function() {
+          self.$emit('close')
+        }, 800 - elapsed)
+      }
+    }
+  }
 }
 </script>
 

+ 2 - 6
cfc-frontend/pages/action/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="container">
     <!-- Tabbar 切换过渡页 -->
-    <tab-transition v-if="showTabTransition" dimCode="action" waitingFor="action" />
+    <tab-transition v-if="showTabTransition" dimCode="action" waitingFor="action" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- 品牌头部 -->
     <PageBanner theme="action"
@@ -556,13 +556,9 @@ export default {
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
-          self.showTabTransition = false
+          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
         }
       })
-      setTimeout(function() {
-        if (unwatch) unwatch()
-        self.showTabTransition = false
-      }, 800)
     }
   }
 }

+ 2 - 6
cfc-frontend/pages/body/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="body-container">
     <!-- Tabbar 切换过渡页 -->
-    <tab-transition v-if="showTabTransition" dimCode="body" />
+    <tab-transition v-if="showTabTransition" dimCode="body" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- 品牌头部 -->
     <PageBanner theme="body"
@@ -500,13 +500,9 @@ export default {
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
-          self.showTabTransition = false
+          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
         }
       })
-      setTimeout(function() {
-        if (unwatch) unwatch()
-        self.showTabTransition = false
-      }, 5000)
     }
   }
 }

+ 2 - 7
cfc-frontend/pages/index-home/index.vue

@@ -45,7 +45,7 @@
   </view>
 
   <!-- Tabbar 切换过渡页 -->
-  <tab-transition v-if="showTabTransition" dimCode="action" />
+  <tab-transition v-if="showTabTransition" dimCode="action" ref="tabTransition" @close="showTabTransition = false" />
 
   <!-- 登录态 — 直接内嵌,保持底签可见 -->
   <view v-if="currentRole" class="logged-in-container">
@@ -782,14 +782,9 @@ export default {
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
-          self.showTabTransition = false
+          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
         }
       })
-      // 5s 超时兜底
-      setTimeout(function() {
-        if (unwatch) unwatch()
-        self.showTabTransition = false
-      }, 5000)
     },
 
     _doInit(options) {

+ 2 - 6
cfc-frontend/pages/mind/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="container">
     <!-- Tabbar 切换过渡页 -->
-    <tab-transition v-if="showTabTransition" dimCode="mind" />
+    <tab-transition v-if="showTabTransition" dimCode="mind" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- 品牌头部 -->
     <PageBanner theme="mind-wisdom"
@@ -983,13 +983,9 @@ export default {
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
-          self.showTabTransition = false
+          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
         }
       })
-      setTimeout(function() {
-        if (unwatch) unwatch()
-        self.showTabTransition = false
-      }, 5000)
     },
 
     // ===== DAN 报告 =====

+ 2 - 5
cfc-frontend/pages/profile/profile.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="container">
     <!-- Tabbar 切换过渡页 -->
-    <tab-transition v-if="showTabTransition" dimCode="wealth" />
+    <tab-transition v-if="showTabTransition" dimCode="wealth" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- ===== 未登录状态 ===== -->
     <view v-if="!isLoggedIn" class="login-prompt">
@@ -147,11 +147,8 @@ HealthTimeline
     _watchPageReady() {
       var self = this
       this.$nextTick(function() {
-        self.showTabTransition = false
+        if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
       })
-      setTimeout(function() {
-        self.showTabTransition = false
-      }, 2000)
     },
     loadHealthScoreData() {
       var childId = uni.getStorageSync('currentChildId') || null

+ 2 - 5
cfc-frontend/pages/wealth/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="container">
     <!-- TabTransition overlay -->
-    <tab-transition v-if="showTabTransition" dimCode="wealth" />
+    <tab-transition v-if="showTabTransition" dimCode="wealth" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- 未登录 -->
     <view v-if="!isLoggedIn" class="login-prompt">
@@ -303,11 +303,8 @@ export default {
     _watchPageReady() {
       var self = this
       this.$nextTick(function() {
-        self.showTabTransition = false
+        if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
       })
-      setTimeout(function() {
-        self.showTabTransition = false
-      }, 2000)
     },
     async loadChildren() {
       try {

+ 2 - 6
cfc-frontend/pages/wisdom/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="wisdom-container">
     <!-- Tabbar 切换过渡页 -->
-    <tab-transition v-if="showTabTransition" dimCode="wisdom" />
+    <tab-transition v-if="showTabTransition" dimCode="wisdom" ref="tabTransition" @close="showTabTransition = false" />
 
     <!-- 1. 品牌头部 -->
     <PageBanner theme="wisdom"
@@ -465,13 +465,9 @@ export default {
       }, function(val) {
         if (val) {
           if (unwatch) unwatch()
-          self.showTabTransition = false
+          if (self.$refs.tabTransition) self.$refs.tabTransition.markReady()
         }
       })
-      setTimeout(function() {
-        if (unwatch) unwatch()
-        self.showTabTransition = false
-      }, 5000)
     },
 
     // ===== DAN 报告 =====