From 52ff231ebd7ccfd90eecb276518cd2cee14f7506 Mon Sep 17 00:00:00 2001
From: Emre Kanatli <kanatliemre@gmail.com>
Date: Wed, 17 Feb 2021 02:41:24 -0500
Subject: [PATCH] Add disable prop to qr input and qr reader

---
 src/qr_input.vue  | 12 ++++++++----
 src/qr_reader.vue | 16 ++++++++++++++--
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/qr_input.vue b/src/qr_input.vue
index 50bffe4..f2b4074 100644
--- a/src/qr_input.vue
+++ b/src/qr_input.vue
@@ -1,10 +1,10 @@
 <template>
     <div class="qr_input">
-        <QRReader class="readerIn" @change="change"><button>
+        <QRReader class="readerIn" @change="change" :disabled="disabled"><button>
             <fa :icon="fa_camera"></fa>
         </button></QRReader>
         <input type="text" class="pk_in" :placeholder="placeholder"
-               v-model="pk" @input="oninput">
+               v-model="pk" @input="oninput" :disabled="disabled">
     </div>
 </template>
 <script>
@@ -25,7 +25,11 @@
         },
         props: {
             placeholder: String,
-            value: String
+            value: String,
+            disabled: {
+                type: Boolean,
+                default: false
+            }
         },
         watch: {
             value(val){
@@ -91,4 +95,4 @@
         margin: 0;
         padding: 0px 12px;
     }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/qr_reader.vue b/src/qr_reader.vue
index a837d78..2ef47ac 100644
--- a/src/qr_reader.vue
+++ b/src/qr_reader.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="qr_reader">
-        <div class="buts">
+        <div class="buts" :disabled="disabled">
             <div class="clickStart" @click="start"></div>
             <slot class="qr_slot"></slot>
         </div>
@@ -33,8 +33,15 @@
                 fa_times: faTimes,
             }
         },
+        props:{
+            disabled: {
+                type: Boolean,
+                default: false
+            }
+        },
         methods: {
             start(){
+                if(this.disabled) return;
                 let camera = this.camera;
                 if(!camera){
                     alert("No Cameras Found");
@@ -131,6 +138,11 @@
     .buts:hover{
         opacity: 1;
     }
+    .buts[disabled]{
+        opacity: 0.8;
+        cursor: default;
+    }
+
     .clickStart{
         cursor: pointer;
         position: absolute;
@@ -204,4 +216,4 @@
             margin: 0 auto;
         }
     }
-</style>
\ No newline at end of file
+</style>