fix: correct Traccar Client setup instructions

- Remove unreliable QR code scanning, add direct app store links
- Fix server URL to use HTTP (not HTTPS) for port 5055
- OsmAnd protocol doesn't use SSL
- Emphasize that official Traccar Client app is required

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-02-02 23:23:00 +01:00
parent 0da2e7e8a6
commit 6a10785ec8
2 changed files with 27 additions and 18 deletions

View File

@@ -776,23 +776,32 @@ export function GpsTracking() {
</div>
)}
{/* QR Code for Traccar Client app */}
<div className="bg-white p-4 rounded-lg border border-border">
{/* Manual Configuration - Traccar Client doesn't reliably scan QR codes */}
<div className="bg-blue-50 dark:bg-blue-950/30 p-4 rounded-lg border border-blue-200 dark:border-blue-800">
<div className="flex items-center gap-2 mb-3">
<QrCode className="h-5 w-5 text-primary" />
<span className="text-sm font-medium text-foreground">Scan with Traccar Client</span>
<Smartphone className="h-5 w-5 text-blue-600" />
<span className="text-sm font-medium text-blue-800 dark:text-blue-200">Download Traccar Client</span>
</div>
<div className="flex justify-center">
{/* Traccar Client expects: serverUrl?id=xxx&interval=xxx&accuracy=high */}
<QRCodeSVG
value={`https://${enrollmentResult.serverUrl.replace(/:\d+$/, '')}?id=${enrollmentResult.deviceIdentifier}&interval=${settings?.updateIntervalSeconds || 60}&accuracy=high`}
size={180}
level="M"
includeMargin={true}
/>
<div className="flex gap-2 justify-center mb-3">
<a
href="https://apps.apple.com/app/traccar-client/id843156974"
target="_blank"
rel="noopener noreferrer"
className="px-3 py-1 bg-blue-600 text-white text-sm rounded hover:bg-blue-700"
>
iOS App Store
</a>
<a
href="https://play.google.com/store/apps/details?id=org.traccar.client"
target="_blank"
rel="noopener noreferrer"
className="px-3 py-1 bg-green-600 text-white text-sm rounded hover:bg-green-700"
>
Google Play
</a>
</div>
<p className="text-xs text-center text-muted-foreground mt-2">
Open Traccar Client Settings Scan QR Code
<p className="text-xs text-center text-blue-700 dark:text-blue-300">
Must use official Traccar Client app (not other GPS apps)
</p>
</div>