端末のQRをスキャンするボタンを追加
This commit is contained in:
parent
f72e3f61e9
commit
a3b869e806
|
@ -12593,6 +12593,14 @@ export interface Locale extends ILocale {
|
||||||
* コードリーダーを停止
|
* コードリーダーを停止
|
||||||
*/
|
*/
|
||||||
"stopQr": string;
|
"stopQr": string;
|
||||||
|
/**
|
||||||
|
* QRコードが見つかりません
|
||||||
|
*/
|
||||||
|
"noQrCodeFound": string;
|
||||||
|
/**
|
||||||
|
* 端末の画像をスキャン
|
||||||
|
*/
|
||||||
|
"scanFile": string;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
declare const locales: {
|
declare const locales: {
|
||||||
|
|
|
@ -3372,3 +3372,5 @@ _qr:
|
||||||
turnOffFlash: "ライトをオフにする"
|
turnOffFlash: "ライトをオフにする"
|
||||||
startQr: "コードリーダーを再開"
|
startQr: "コードリーダーを再開"
|
||||||
stopQr: "コードリーダーを停止"
|
stopQr: "コードリーダーを停止"
|
||||||
|
noQrCodeFound: "QRコードが見つかりません"
|
||||||
|
scanFile: "端末の画像をスキャン"
|
||||||
|
|
|
@ -18,7 +18,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div :class="$style.view">
|
<div :class="$style.view">
|
||||||
<video ref="videoEl" :class="$style.video" autoplay muted playsinline></video>
|
<video ref="videoEl" :class="$style.video" autoplay muted playsinline></video>
|
||||||
<div ref="overlayEl" :class="$style.overlay"></div>
|
<div ref="overlayEl" :class="$style.overlay"></div>
|
||||||
<div v-if="scannerInstance" :class="$style.controls">
|
<div :class="$style.controls">
|
||||||
|
<MkButton v-tooltip="i18n.ts._qr.scanFile" iconOnly @click="upload"><i class="ti ti-photo-plus"></i></MkButton>
|
||||||
|
|
||||||
<MkButton v-if="qrStarted" v-tooltip="i18n.ts._qr.stopQr" iconOnly @click="stopQr"><i class="ti ti-player-play"></i></MkButton>
|
<MkButton v-if="qrStarted" v-tooltip="i18n.ts._qr.stopQr" iconOnly @click="stopQr"><i class="ti ti-player-play"></i></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts._qr.startQr" iconOnly danger @click="startQr"><i class="ti ti-player-pause"></i></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts._qr.startQr" iconOnly danger @click="startQr"><i class="ti ti-player-pause"></i></MkButton>
|
||||||
|
|
||||||
|
@ -173,7 +175,7 @@ async function processResult(result: QrScanner.ScanResult) {
|
||||||
updateLists();
|
updateLists();
|
||||||
})
|
})
|
||||||
.catch(err => {
|
.catch(err => {
|
||||||
console.error(err);
|
return err;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -181,6 +183,32 @@ const qrStarted = ref(true);
|
||||||
const flashCanToggle = ref(false);
|
const flashCanToggle = ref(false);
|
||||||
const flash = ref(false);
|
const flash = ref(false);
|
||||||
|
|
||||||
|
async function upload() {
|
||||||
|
os.chooseFileFromPc({ multiple: true }).then(files => {
|
||||||
|
if (files.length === 0) return;
|
||||||
|
for (const file of files) {
|
||||||
|
QrScanner.scanImage(file, { returnDetailedScanResult: true })
|
||||||
|
.then(result => {
|
||||||
|
processResult(result);
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
if (err.toString().includes('No QR code found')) {
|
||||||
|
os.alert({
|
||||||
|
type: 'info',
|
||||||
|
text: i18n.ts._qr.noQrCodeFound,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
os.alert({
|
||||||
|
type: 'error',
|
||||||
|
text: err.toString(),
|
||||||
|
});
|
||||||
|
console.error(err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
async function chooseCamera() {
|
async function chooseCamera() {
|
||||||
if (!scannerInstance.value) return;
|
if (!scannerInstance.value) return;
|
||||||
const cameras = await QrScanner.listCameras(true);
|
const cameras = await QrScanner.listCameras(true);
|
||||||
|
|
Loading…
Reference in New Issue