import { ref, onUnmounted } from 'vue' import QrScanner from 'qr-scanner' export function useQRScanner() { const isScanning = ref(false) const hasPermission = ref(null) const error = ref(null) const scanResult = ref(null) let qrScanner: QrScanner | null = null const startScanning = async (videoEl: HTMLVideoElement, onResult: (result: string) => void) => { try { error.value = null // Check if camera is available const hasCamera = await QrScanner.hasCamera() if (!hasCamera) { throw new Error('No camera found') } // Request camera permission await navigator.mediaDevices.getUserMedia({ video: true }) hasPermission.value = true // Create QR scanner instance qrScanner = new QrScanner( videoEl, (result) => { scanResult.value = result.data onResult(result.data) }, { highlightScanRegion: true, highlightCodeOutline: true, maxScansPerSecond: 5, } ) await qrScanner.start() isScanning.value = true } catch (err) { console.error('Failed to start QR scanner:', err) hasPermission.value = false if (err instanceof Error) { if (err.name === 'NotAllowedError') { error.value = 'Camera permission denied. Please allow camera access and try again.' } else if (err.name === 'NotFoundError') { error.value = 'No camera found on this device.' } else if (err.name === 'NotSupportedError') { error.value = 'Camera not supported on this device.' } else { error.value = err.message } } else { error.value = 'Failed to access camera' } } } const stopScanning = () => { if (qrScanner) { qrScanner.stop() qrScanner.destroy() qrScanner = null } isScanning.value = false scanResult.value = null } const toggleFlash = async () => { if (qrScanner) { try { await qrScanner.toggleFlash() } catch (err) { console.error('Failed to toggle flash:', err) } } } const hasFlash = async (): Promise => { if (qrScanner) { try { return await qrScanner.hasFlash() } catch (err) { return false } } return false } // Cleanup on unmount onUnmounted(() => { stopScanning() }) return { isScanning, hasPermission, error, scanResult, startScanning, stopScanning, toggleFlash, hasFlash } }