Mostrare Bottone Telegram per tutti

Visualizzazione Cellulare sul Profilo

src/components/CLabel/CLabel.ts

@@ -0,0 +1,37 @@
+import { defineComponent, ref, toRef, watch } from 'vue'
+import { tools } from '@src/store/Modules/tools'
+
+import {  useQuasar } from 'quasar'
+import { useI18n } from '@/boot/i18n'
+import { toolsext } from '@store/Modules/toolsext'
+
+export default defineComponent({
+  name: 'CLabel',
+  props: {
+    value: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    label: {
+      type: String,
+      required: true,
+      default: '',
+    },
+  },
+  components: {},
+  setup(props, { emit }) {
+    const $q = useQuasar()
+    const { t } = useI18n();
+
+    function copytoclip() {
+      tools.copyStringToClipboard($q, props.value, true)
+    }
+
+    return {
+      tools,
+      toolsext,
+      copytoclip,
+    }
+  },
+})

src/components/CLabel/CLabel.vue

@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <q-field
+      :label="label"
+      stack-label
+      outlined
+      color="blue-6"
+      >
+
+      <template v-slot:prepend>
+        <q-btn round dense flat icon="far fa-copy" @click="copytoclip"/>
+      </template>
+      <template v-slot:control>
+        <div class="self-center full-width no-outline" tabindex="0">
+          {{ value }}
+        </div>
+      </template>
+    </q-field>
+  </div>
+</template>
+
+<script lang="ts" src="./CLabel.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './CLabel.scss';
+</style>

src/components/CLabel/index.ts

@@ -0,0 +1 @@
+export {default as CLabel} from './CLabel.vue'