feat(admin): telegram settings improvements (#63)

frontend/admin/src/components/Settings/ItemInput.vue

@@ -1,6 +1,14 @@
 <template>
   <SettingsItem :label="label">
     <template #default>
+      <InputGroup v-if="allowCopy && isSupported">
+        <Button
+          :key="copied ? 'copied' : 'copy'"
+          :icon="copied ? 'fa fa-check' : 'fa fa-copy'"
+          severity="secondary"
+          v-tooltip.top="{ value: copied ? 'Скопировано' : 'Скопировать' }"
+          @click="copyToClipboard"
+        />
         <InputText
           :type="type"
           v-model="model"
@@ -8,6 +16,16 @@
           :placeholder="placeholder"
           :readonly="readonly"
         />
+      </InputGroup>
+
+      <InputText
+        v-else
+        :type="type"
+        v-model="model"
+        class="form-control"
+        :placeholder="placeholder"
+        :readonly="readonly"
+      />
     </template>
     <template #help>
       <slot></slot>
@@ -18,6 +36,9 @@
 <script setup>
 import SettingsItem from "@/components/SettingsItem.vue";
 import InputText from 'primevue/inputtext';
+import InputGroup from 'primevue/inputgroup';
+import Button from 'primevue/button';
+import { useClipboard } from '@vueuse/core';
 
 const props = defineProps({
   label: {
@@ -36,10 +57,16 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  allowCopy: {
+    type: Boolean,
+    default: false,
+  },
 });
 const model = defineModel();
+
+const { copy, copied, isSupported } = useClipboard({ source: model })
+
+function copyToClipboard() {
+  copy();
+}
 </script>
-
-<style scoped>
-
-</style>

frontend/admin/src/components/Settings/ItemTgMiniAppLink.vue

@@ -4,11 +4,11 @@
     type="text"
     :readonly="true"
     :modelValue="model"
+    :allowCopy="true"
   >
-    Токен, полученный при создании бота через @BotFather.
+    Ссылка на сайт с TeleCart витриной, которую нужно указывать в настройках MiniApp в @BotFather.<br>
-    Он используется для взаимодействия модуля с Telegram API.
+    Подробная инструкция по настройке в
-    Подробная инструкция доступна в
+    <a href="https://docs.telecart.pro/telegram/telegram/" target="_blank">
-    <a href="https://nikitakiselev.github.io/telecart-docs/#telegram" target="_blank">
       документации <i class="fa fa-external-link"></i>
     </a>.
   </ItemInput>