feat: Use yaMetrika number in settings

frontend/admin/src/App.vue

@@ -11,7 +11,7 @@
       </li>
 
       <li :class="{active: route.name === 'metrics'}">
-        <RouterLink :to="{name: 'metrics'}">Метрики</RouterLink>
+        <RouterLink :to="{name: 'metrics'}">Метрика</RouterLink>
       </li>
 
       <li :class="{active: route.name === 'store'}">

frontend/admin/src/views/MetricsView.vue

@@ -6,24 +6,47 @@
     Задействовать Яндекс.Метрику для Telegram магазина.
   </ItemBool>
 
-  <ItemTextarea
-    label="Код счётчика Яндекс Метрики"
+  <ItemInput
+    label="Номер счётчика Яндекс.Метрика"
     v-model="settings.items.metrics.yandex_metrika_counter"
     placeholder="Вставьте код счётчика Яндекс.Метрики"
   >
-    <p>Код счётчика нужно предварительно настроить, чтобы он работал корректно с Telegram Mini App.
-      <a href="https://telecart-labs.github.io/docs/analitycs/start/" target="_blank">
-        Инструкция как настроить i.fa.fa-external-link
-      </a>.</p>
-    <p>Для проверки интеграции через кнопку "Проверить" в интерфейсе Яндекс Метрики,
-      необходимо сначала включить "Режим разработчика" на вкладке "Общие".</p>
-  </ItemTextarea>
+    <ButtonGroup>
+      <Button
+        as="a"
+        :href="ymCheckUrl"
+        target="_blank"
+        variant="text"
+        :disabled="settings.items.app.app_debug === false"
+        v-tooltip.top="'Чтобы проверить интеграцию, включите режим разработчика на вкладке Общие и сохраните настройки.'"
+      >
+        Проверить интеграцию
+      </Button>
+
+      <Button
+        as="a"
+        href="https://telecart-labs.github.io/docs/analitycs/start/"
+        target="_blank"
+        variant="text"
+      >
+        Как получить номер счётчика <i class="fa fa-external-link"></i>
+      </Button>
+    </ButtonGroup>
+
+  </ItemInput>
 </template>
 
 <script setup>
 import {useSettingsStore} from "@/stores/settings.js";
-import ItemTextarea from "@/components/Settings/ItemTextarea.vue";
 import ItemBool from "@/components/Settings/ItemBool.vue";
+import ItemInput from "@/components/Settings/ItemInput.vue";
+import {Button, ButtonGroup} from 'primevue';
+import {computed} from "vue";
 
 const settings = useSettingsStore();
+
+const ymCheckUrl = computed(() => {
+  const url = settings.items.telegram.mini_app_url.replace(/\#\/$/, '');
+  return `${url}?_ym_status-check=104849385&_ym_lang=ru`;
+});
 </script>