refactor(frontend): split large reimbursement and audit modules

web/src/composables/useBackendHealth.js

@@ -6,6 +6,12 @@ const backendHealthy = ref(true)
 const backendChecking = ref(false)
 const backendError = ref('')
 let lastCheckedAt = 0
+const DEFAULT_HEALTH_TIMEOUT_MS = 2500
+const REQUEST_TIMEOUT_CODE = 'REQUEST_TIMEOUT'
+
+function isRequestTimeout(error) {
+  return error?.code === REQUEST_TIMEOUT_CODE
+}
 
 export async function checkBackendHealth(options = {}) {
   const force = Boolean(options.force)
@@ -18,7 +24,9 @@ export async function checkBackendHealth(options = {}) {
   backendChecking.value = true
 
   try {
-    const payload = await fetchBackendHealth()
+    const payload = await fetchBackendHealth({
+      timeoutMs: Number(options.timeoutMs || DEFAULT_HEALTH_TIMEOUT_MS)
+    })
     const ok = payload?.status === 'ok'
 
     backendHealthy.value = ok
@@ -28,6 +36,12 @@ export async function checkBackendHealth(options = {}) {
     lastCheckedAt = now
     return ok
   } catch (error) {
+    if (isRequestTimeout(error) && options.allowStaleOnTimeout) {
+      backendError.value = error?.message || '后端正在处理耗时任务，已先展示页面。'
+      lastCheckedAt = now
+      return backendHealthy.value !== false
+    }
+
     backendHealthy.value = false
     backendError.value = error?.message || '无法连接后端服务。'
     lastCheckedAt = now

web/src/composables/useLoginView.js

@@ -1,4 +1,4 @@
-import { ref } from 'vue'
+import { h, ref } from 'vue'
 
 export function useLoginView() {
   const username = ref('')
@@ -29,14 +29,19 @@ export function useLoginView() {
   ]
 
   const LogoMark = {
-    template: `
-      <span class="logo-mark" aria-hidden="true">
-        <svg viewBox="0 0 36 36">
-          <path d="M19.8 4.5c5.7 1.1 9.9 5.7 10.5 11.6-2.8-.9-5.5-.7-7.9.6-2.8 1.5-4.5 4.3-5.2 8.2-4.4-2.8-6.5-6.5-6.3-11.1.2-4.2 3.5-7.8 8.9-9.3Z" />
-          <path d="M9 7.6c-3 3.5-4 7.3-2.9 11.2 1.2 4.2 4.6 7 10.1 8.5-2 1.8-4.6 2.6-7.6 2.3C5.1 26.7 3.5 23.1 3.7 19 4 14.4 5.7 10.6 9 7.6Z" />
-        </svg>
-      </span>
-    `
+    name: 'LoginLogoMark',
+    render() {
+      return h('span', { class: 'logo-mark', 'aria-hidden': 'true' }, [
+        h('svg', { viewBox: '0 0 36 36' }, [
+          h('path', {
+            d: 'M19.8 4.5c5.7 1.1 9.9 5.7 10.5 11.6-2.8-.9-5.5-.7-7.9.6-2.8 1.5-4.5 4.3-5.2 8.2-4.4-2.8-6.5-6.5-6.3-11.1.2-4.2 3.5-7.8 8.9-9.3Z'
+          }),
+          h('path', {
+            d: 'M9 7.6c-3 3.5-4 7.3-2.9 11.2 1.2 4.2 4.6 7 10.1 8.5-2 1.8-4.6 2.6-7.6 2.3C5.1 26.7 3.5 23.1 3.7 19 4 14.4 5.7 10.6 9 7.6Z'
+          })
+        ])
+      ])
+    }
   }
 
   return {