add copy button fixes amidaware#843

subzdev · Dec 24, 2021 · 1ef21f5 · 1ef21f5
1 parent e4cd9c0
commit 1ef21f5
Showing 1 changed file with 19 additions and 2 deletions.
diff --git a/web/src/components/ui/CustomField.vue b/web/src/components/ui/CustomField.vue
@@ -13,8 +13,13 @@
     :rules="[...validationRules]"
     reactive-rules
     autogrow
-  />
-
+  >
+    <template v-slot:append>
+      <q-icon size="sm" name="content_copy" @click="copyValueToClipboard(modelValue)">
+        <q-tooltip>Copy to clipboard</q-tooltip>
+      </q-icon>
+    </template>
+  </q-input>
   <q-toggle
     v-else-if="field.type === 'checkbox'"
     ref="input"
@@ -85,6 +90,9 @@
 
 <script>
 import { truncateText } from "@/utils/format";
+import { copyToClipboard } from "quasar";
+import { notifySuccess, notifyError } from "@/utils/notify";
+
 export default {
   name: "CustomField",
   props: ["field", "modelValue"],
@@ -107,6 +115,15 @@ export default {
         ? "q-mb-xl q-mt-xl"
         : "";
     },
+    copyValueToClipboard(modelValue) {
+      copyToClipboard(modelValue)
+        .then(() => {
+          notifySuccess("Copied to clipboard!");
+        })
+        .catch(() => {
+          notifyError("Unable to copy to clipboard!");
+        });
+    }
   },
   computed: {
     validationRules() {