mirror of
https://github.com/Luzifer/ots.git
synced 2024-09-28 19:55:36 +00:00
8c0807d486
Signed-off-by: Knut Ahlers <knut@ahlers.me>
74 lines
1.2 KiB
Vue
74 lines
1.2 KiB
Vue
<template>
|
|
<button
|
|
v-if="!$root.customize.disableQRSupport"
|
|
id="secret-url-qrcode"
|
|
ref="qrButton"
|
|
class="btn btn-secondary"
|
|
:disabled="!qrDataURL"
|
|
>
|
|
<i class="fas fa-qrcode" />
|
|
</button>
|
|
</template>
|
|
<script>
|
|
import { Popover } from 'bootstrap'
|
|
import qrcode from 'qrcode'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
qrDataURL: null,
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
generateQR() {
|
|
if (this.$root.customize.disableQRSupport) {
|
|
return
|
|
}
|
|
|
|
qrcode.toDataURL(this.qrContent, { width: 200 })
|
|
.then(url => {
|
|
this.qrDataURL = url
|
|
})
|
|
},
|
|
},
|
|
|
|
mounted() {
|
|
this.generateQR()
|
|
},
|
|
|
|
name: 'AppQRButton',
|
|
|
|
props: {
|
|
qrContent: {
|
|
required: true,
|
|
type: String,
|
|
},
|
|
},
|
|
|
|
watch: {
|
|
qrContent() {
|
|
this.generateQR()
|
|
},
|
|
|
|
qrDataURL(to) {
|
|
if (this.popover) {
|
|
this.popover.dispose()
|
|
}
|
|
|
|
this.popover = new Popover(this.$refs.qrButton, {
|
|
content: () => {
|
|
const img = document.createElement('img')
|
|
img.src = to
|
|
return img
|
|
},
|
|
|
|
html: true,
|
|
placement: 'left',
|
|
trigger: 'focus',
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|