fix copy to clipboard from dialogs

package.json

@@ -33,6 +33,7 @@
         "tiptap-extensions": "^1.29.1",
         "vue": "^2.6.11",
         "vue-apexcharts": "^1.5.3",
+        "vue-clipboard2": "^0.3.1",
         "vue-echarts": "^5.0.0-beta.0",
         "vue-emoji-picker": "^1.0.1",
         "vue-gtag": "^1.8.0",

resources/js/components/common/CommonCopyLabel.vue

@@ -1,12 +1,12 @@
 <template>
 	<v-tooltip bottom>
 		<template v-slot:activator="{ on }">
-			<span class="clickable" v-on="on" @click.stop.prevent="copy">
+			<span class="clickable" v-on="on" @click="copy">
 				<v-icon v-if="icon" small>
 					{{ icon }}
 				</v-icon>
 
-				<span ref="copy-label" class="copy-label">
+				<span ref="copyLabel" class="copy-label">
 					{{ text }}
 				</span>
 			</span>
@@ -47,19 +47,11 @@ export default {
 	methods: {
 		copy() {
 			this.createTextareaAndCopy();
-
 			this.showSnackbar();
-
 			this.showTooltip();
 		},
-
 		createTextareaAndCopy() {
-			const el = document.createElement('textarea');
-			el.value = this.text;
-			document.body.appendChild(el);
-			el.select();
-			document.execCommand('copy');
-			document.body.removeChild(el);
+			this.$copyText(this.text,this.$refs.copyLabel);
 		},
 		showSnackbar() {
 			this.$store.commit('snackbar/SHOW_MESSAGE', {

resources/js/main.js

@@ -8,6 +8,7 @@ import store from './store';
 import vuetify from './plugins/vuetify';
 import i18n from './plugins/vue-i18n';
 import './plugins/vue-head';
+import './plugins/clipboard';
 
 // STYLES
 import '../sass/theme.scss';

resources/js/plugins/clipboard.js

@@ -0,0 +1,4 @@
+import Vue from 'vue'
+import VueClipboard from 'vue-clipboard2'
+VueClipboard.config.autoSetContainer = true; // add this line
+Vue.use(VueClipboard);