github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

qr scanner POC - more debugging, trying out again another scanner library

pull/4898/head
Daniel Spaude 2 years ago
parent
20db55d6e6
commit
7c6afba9de
No known key found for this signature in database
GPG Key ID: 654A3D1FA4F35FFE
3 changed files with 153 additions and 7 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 24
      packages/nc-gui/components/smartsheet/qr-scanner-button/QrScannerButton.vue
  2. 132
      packages/nc-gui/package-lock.json
  3. 4
      packages/nc-gui/package.json

24
packages/nc-gui/components/smartsheet/qr-scanner-button/QrScannerButton.vue
Unescape View File

@ -2,6 +2,7 @@
import type { SelectProps } from 'ant-design-vue'
import { UITypes } from 'nocodb-sdk'
import { ref } from 'vue'
import { StreamBarcodeReader } from 'vue-barcode-reader'
import { NOCO } from '#imports'
import QrCodeScan from '~icons/mdi/qrcode-scan'
@ -40,6 +41,7 @@ const entry = ref<Entry | null>(null)
const selectedCodeColumnIdToScanFor = ref('')
const onDecode = async (qrCodeValue: string) => {
// alert(qrCodeValue)
try {
showQrCodeScanner.value = false
@ -47,15 +49,12 @@ const onDecode = async (qrCodeValue: string) => {
const foundRowForQrCode = await $api.dbViewRow.findOne(NOCO, project.value!.id!, meta.value!.id!, view.value!.title!, {
where: whereClause,
})
const rowIdOfFoundRow = meta.value?.id && foundRowForQrCode[meta.value.id]
const primaryKeyValueForFoundRow = extractPkFromRow(foundRowForQrCode, meta!.value!.columns!)
console.log('foundRowForQrCode', foundRowForQrCode)
const rowIdOfFoundRow = meta.value?.id && foundRowForQrCode[meta.value.id]
console.log('rowIdOfFoundRow', rowIdOfFoundRow)
const primaryKeyValueForFoundRow = extractPkFromRow(foundRowForQrCode, meta!.value!.columns!)
console.log('primaryKeyValueForFoundRow', primaryKeyValueForFoundRow)
router.push({
@ -68,6 +67,13 @@ const onDecode = async (qrCodeValue: string) => {
console.error(error)
}
}
const scannerIsReady = ref(false)
const onLoaded = async () => {
// alert('FOO')
scannerIsReady.value = true
}
</script>
<template>
@ -87,6 +93,8 @@ const onDecode = async (qrCodeValue: string) => {
centered
:footer="null"
wrap-class-name="nc-modal-generate-token"
destroy-on-close
:after-close="(scannerIsReady = false)"
>
<div class="relative flex flex-col h-full">
<a-form-item :label="$t('labels.qrCodeColumn')">
@ -99,7 +107,11 @@ const onDecode = async (qrCodeValue: string) => {
/>
</a-form-item>
<qrcode-stream v-if="showQrCodeScanner" @decode="onDecode" style="width: 100%; height: 100%"></qrcode-stream>
<!-- <qrcode-stream v-if="showQrCodeScanner" @decode="onDecode" style="width: 100%; height: 100%"></qrcode-stream> -->
<div>
<StreamBarcodeReader v-show="scannerIsReady" @decode="onDecode" @loaded="onLoaded"></StreamBarcodeReader>
<div v-if="!scannerIsReady">Loading the scanner...</div>
</div>
</div>
</a-modal>

132
packages/nc-gui/package-lock.json generated
Unescape View File

@ -35,6 +35,7 @@
"tinycolor2": "^1.4.2",
"unique-names-generator": "^4.7.1",
"validator": "^13.7.0",
"vue-barcode-reader": "^1.0.3",
"vue-dompurify-html": "^3.0.0",
"vue-github-button": "^3.0.3",
"vue-i18n": "^9.2.2",
@ -69,6 +70,7 @@
"@types/sortablejs": "^1.13.0",
"@types/tinycolor2": "^1.4.3",
"@types/validator": "^13.7.10",
"@types/vue-barcode-reader": "^0.0.0",
"@vitest/ui": "^0.18.0",
"@vue/compiler-sfc": "^3.2.37",
"@vue/test-utils": "^2.0.2",
@ -3113,6 +3115,51 @@
"integrity": "sha512-t1yxFAR2n0+VO6hd/FJ9F2uezAZVWHLmpmlJzm1eX03+H7+HsuTAp7L8QJs+2pQCfWkP1+EXsGK9Z9v7o/qPVQ==",
"dev": true
},
"node_modules/@types/vue-barcode-reader": {
"version": "0.0.0",
"resolved": "https://registry.npmjs.org/@types/vue-barcode-reader/-/vue-barcode-reader-0.0.0.tgz",
"integrity": "sha512-yngQhd35qGjCxMXWIqsAtF7qmxe0qUYRVd9qW5I/CcRPWDdBpqVkHnQSh6ro5BIBl3NQ3ppky7kMKS4pr+XwCQ==",
"dev": true,
"dependencies": {
"vue": "^2.0.0"
}
},
"node_modules/@types/vue-barcode-reader/node_modules/@vue/compiler-sfc": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz",
"integrity": "sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==",
"dev": true,
"dependencies": {
"@babel/parser": "^7.18.4",
"postcss": "^8.4.14",
"source-map": "^0.6.1"
}
},
"node_modules/@types/vue-barcode-reader/node_modules/csstype": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
"integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
"dev": true
},
"node_modules/@types/vue-barcode-reader/node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true,
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/@types/vue-barcode-reader/node_modules/vue": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz",
"integrity": "sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==",
"dev": true,
"dependencies": {
"@vue/compiler-sfc": "2.7.14",
"csstype": "^3.1.0"
}
},
"node_modules/@types/web-bluetooth": {
"version": "0.0.15",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz",
@ -16907,6 +16954,28 @@
"@vue/shared": "3.2.45"
}
},
"node_modules/vue-barcode-reader": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/vue-barcode-reader/-/vue-barcode-reader-1.0.3.tgz",
"integrity": "sha512-z4mv7+ai/8vECppBTb00tHnyFMMx6W1rAaQe+v214ihoaWK9iGrn8ZZsmgSxf3lwnrtGaibLdkonTtMrGsO+dA==",
"dependencies": {
"@zxing/library": "^0.19.1"
}
},
"node_modules/vue-barcode-reader/node_modules/@zxing/library": {
"version": "0.19.1",
"resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.19.1.tgz",
"integrity": "sha512-rKwvl3Uuqs8yf364iU9l3HDDaIx8yPv+CH6DbtQaQr67VdKLG22G1ukEp9fOdDefE6tpLtRAdMnTrgtpiaKAZw==",
"dependencies": {
"ts-custom-error": "^3.0.0"
},
"engines": {
"node": ">= 10.4.0"
},
"optionalDependencies": {
"@zxing/text-encoding": "~0.9.0"
}
},
"node_modules/vue-bundle-renderer": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/vue-bundle-renderer/-/vue-bundle-renderer-0.4.4.tgz",
@ -19952,6 +20021,50 @@
"integrity": "sha512-t1yxFAR2n0+VO6hd/FJ9F2uezAZVWHLmpmlJzm1eX03+H7+HsuTAp7L8QJs+2pQCfWkP1+EXsGK9Z9v7o/qPVQ==",
"dev": true
},
"@types/vue-barcode-reader": {
"version": "0.0.0",
"resolved": "https://registry.npmjs.org/@types/vue-barcode-reader/-/vue-barcode-reader-0.0.0.tgz",
"integrity": "sha512-yngQhd35qGjCxMXWIqsAtF7qmxe0qUYRVd9qW5I/CcRPWDdBpqVkHnQSh6ro5BIBl3NQ3ppky7kMKS4pr+XwCQ==",
"dev": true,
"requires": {
"vue": "^2.0.0"
},
"dependencies": {
"@vue/compiler-sfc": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz",
"integrity": "sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==",
"dev": true,
"requires": {
"@babel/parser": "^7.18.4",
"postcss": "^8.4.14",
"source-map": "^0.6.1"
}
},
"csstype": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
"integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
"dev": true
},
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true
},
"vue": {
"version": "2.7.14",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz",
"integrity": "sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==",
"dev": true,
"requires": {
"@vue/compiler-sfc": "2.7.14",
"csstype": "^3.1.0"
}
}
}
},
"@types/web-bluetooth": {
"version": "0.0.15",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz",
@ -29887,6 +30000,25 @@
"@vue/shared": "3.2.45"
}
},
"vue-barcode-reader": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/vue-barcode-reader/-/vue-barcode-reader-1.0.3.tgz",
"integrity": "sha512-z4mv7+ai/8vECppBTb00tHnyFMMx6W1rAaQe+v214ihoaWK9iGrn8ZZsmgSxf3lwnrtGaibLdkonTtMrGsO+dA==",
"requires": {
"@zxing/library": "^0.19.1"
},
"dependencies": {
"@zxing/library": {
"version": "0.19.1",
"resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.19.1.tgz",
"integrity": "sha512-rKwvl3Uuqs8yf364iU9l3HDDaIx8yPv+CH6DbtQaQr67VdKLG22G1ukEp9fOdDefE6tpLtRAdMnTrgtpiaKAZw==",
"requires": {
"@zxing/text-encoding": "~0.9.0",
"ts-custom-error": "^3.0.0"
}
}
}
},
"vue-bundle-renderer": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/vue-bundle-renderer/-/vue-bundle-renderer-0.4.4.tgz",

4
packages/nc-gui/package.json
Unescape View File

@ -32,6 +32,7 @@
},
"dependencies": {
"@ckpack/vue-color": "^1.2.0",
"@types/file-saver": "^2.0.5",
"@vue-flow/additional-components": "^1.2.0",
"@vue-flow/core": "^1.3.0",
"@vuelidate/core": "^2.0.0-alpha.44",
@ -41,7 +42,6 @@
"ant-design-vue": "^3.2.11",
"d3-scale": "^4.0.2",
"dagre": "^0.8.5",
"@types/file-saver": "^2.0.5",
"dayjs": "^1.11.3",
"file-saver": "^2.0.5",
"httpsnippet": "^2.0.0",
@ -58,6 +58,7 @@
"tinycolor2": "^1.4.2",
"unique-names-generator": "^4.7.1",
"validator": "^13.7.0",
"vue-barcode-reader": "^1.0.3",
"vue-dompurify-html": "^3.0.0",
"vue-github-button": "^3.0.3",
"vue-i18n": "^9.2.2",
@ -92,6 +93,7 @@
"@types/sortablejs": "^1.13.0",
"@types/tinycolor2": "^1.4.3",
"@types/validator": "^13.7.10",
"@types/vue-barcode-reader": "^0.0.0",
"@vitest/ui": "^0.18.0",
"@vue/compiler-sfc": "^3.2.37",
"@vue/test-utils": "^2.0.2",

Write Preview
Loading…
Cancel
Save