perf(monitor): defer QR generator

This commit is contained in:
lingniu
2026-07-16 05:41:05 +08:00
parent 9c6cd09413
commit 3f7619c7cd
5 changed files with 70 additions and 5 deletions

View File

@@ -165,6 +165,7 @@ button, a { -webkit-tap-highlight-color: transparent; }
.v2-monitor-qr-backdrop { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; background: rgba(15,23,42,.42); padding: 18px; backdrop-filter: blur(4px); }
.v2-monitor-qr-backdrop > section { position: relative; display: flex; width: min(360px, 100%); align-items: center; flex-direction: column; border-radius: 16px; background: #fff; padding: 26px; box-shadow: 0 24px 70px rgba(15,23,42,.26); text-align: center; }
.v2-monitor-qr-backdrop > section > button:first-child { position: absolute; top: 12px; right: 12px; border: 0; background: transparent; color: #6b7a8f; cursor: pointer; }.v2-monitor-qr-backdrop > section > svg { color: var(--v2-blue); font-size: 26px; }.v2-monitor-qr-backdrop h3 { margin: 9px 0 4px; font-size: 17px; }.v2-monitor-qr-backdrop p { margin: 0 0 13px; color: #718096; font-size: 11px; }.v2-monitor-qr-backdrop img { width: 220px; height: 220px; }.v2-monitor-qr-backdrop code { width: 100%; overflow: hidden; margin-top: 10px; border-radius: 6px; background: #f5f7fa; padding: 8px; color: #5f6e82; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.v2-monitor-qr-backdrop > section > button:last-child { width: 100%; height: 38px; margin-top: 10px; border: 0; border-radius: 7px; background: var(--v2-blue); color: #fff; font-weight: 700; cursor: pointer; }
.v2-monitor-qr-error { display: flex; width: 220px; height: 220px; align-items: center; justify-content: center; flex-direction: column; gap: 12px; border: 1px dashed #f0b7b7; border-radius: 10px; background: #fff7f7; padding: 18px; color: #a53a3a; font-size: 11px; line-height: 1.6; }.v2-monitor-qr-error button { height: 30px; border: 1px solid #e7a7a7; border-radius: 6px; background: #fff; padding: 0 12px; color: #a53a3a; cursor: pointer; font-size: 10px; font-weight: 700; }
.v2-fleet-map { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: #e8f0f6; }
.v2-fleet-map-canvas { position: absolute; inset: 0; }