flameresttable 1.0.118 → 1.0.122

package/src/Table/TablePopup.vue

@@ -0,0 +1,324 @@
+<template>
+  <v-dialog v-model="isDialogVisible" max-width="777px">
+    <v-card>
+      <slot name="header" />
+
+      <v-card-text>
+        
+        <div v-for="column in ColumnNames" v-show="Table.columns[column].Popup.isShow" :key="'c' + column"
+          style="margin-bottom: 10px;">
+
+          <v-text-field v-if="Table.columns[column].Popup.popupType === 'string'"
+            v-model="Table.columns[column].Popup.model"
+            :disabled="!Table.columns[column].Popup.isEnabled"
+            :label="Table.columns[column].Popup.title || Table.columns[column].title || Table.columns[column].name"
+            :placeholder="Table.columns[column].Popup.placeholder" :hint="Table.columns[column].Popup.desc"
+            persistent-hint density="compact" variant="outlined" hide-details="auto" />
+
+          <div v-if="Table.columns[column].Popup.popupType === 'date'">
+            <div class="text-sm text-gray-500 mb-1">{{ Table.columns[column].Popup.title || Table.columns[column].title
+              || Table.columns[column].name }}</div>
+            <Datepicker v-model="Table.columns[column].Popup.model" :auto-apply="true" />
+            <div class="text-xs text-slate-400 mt-1">{{ Table.columns[column].Popup.desc }}</div>
+          </div>
+
+          <v-select v-if="Table.columns[column].Popup.popupType === 'selector'"
+            v-model="Table.columns[column].Popup.model"
+            :items="Table.columns[column].Popup.Selector.values" item-title="title" item-value="id"
+            :label="Table.columns[column].Popup.title || Table.columns[column].title || Table.columns[column].name"
+            :hint="Table.columns[column].Popup.desc" persistent-hint density="compact" hide-details="auto">
+            <template #item="{ props, item }">
+              <v-list-item v-bind="props">
+                <template #prepend v-if="item.raw.prepend">
+                  <span :class="item.raw.prependClasses">{{ item.raw.prepend }}</span>
+                </template>
+                <template #append v-if="item.raw.append">
+                  <span :class="item.raw.appendClasses">{{ item.raw.append }}</span>
+                </template>
+              </v-list-item>
+            </template>
+            <template #selection="{ item }">
+              <div class="d-flex align-center w-100">
+                <span v-if="item.raw.prepend" :class="item.raw.prependClasses" class="mr-1">{{ item.raw.prepend
+                }}</span>
+                <span class="font-normal">{{ item.raw.title }}</span>
+                <v-spacer></v-spacer>
+                <span v-if="item.raw.append" :class="item.raw.appendClasses">{{ item.raw.append }}</span>
+              </div>
+            </template>
+          </v-select>
+
+          
+          <div v-if="Table.columns[column].Popup.popupType === 'image'">
+            <div class="text-sm text-gray-500 mb-1">{{ Table.columns[column].Popup.title || Table.columns[column].title
+              || Table.columns[column].name }}</div>
+            <div class="border border-slate-100 flex self-stretch">
+              <div class="flex-1">
+                <img class="max-w-[200px]" :src="fileGetData(Table.columns[column].Popup.model, true)">
+              </div>
+
+              
+              <label :for="'cfile_' + column">
+
+                <svg class="my-auto cursor-pointer" width="24" height="24" viewbox="0 0 24 24" fill="none"
+                  xmlns="http://www.w3.org/2000/svg">
+                  <path fill-rule="evenodd" clip-rule="evenodd"
+                    d="M11.4697 2.46967C11.7626 2.17678 12.2374 2.17678 12.5303 2.46967L17.0303 6.96967C17.3232 7.26256 17.3232 7.73744 17.0303 8.03033C16.7374 8.32322 16.2626 8.32322 15.9697 8.03033L12.75 4.81066L12.75 16.5C12.75 16.9142 12.4142 17.25 12 17.25C11.5858 17.25 11.25 16.9142 11.25 16.5L11.25 4.81066L8.03033 8.03033C7.73744 8.32322 7.26256 8.32322 6.96967 8.03033C6.67678 7.73744 6.67678 7.26256 6.96967 6.96967L11.4697 2.46967ZM3 15.75C3.41421 15.75 3.75 16.0858 3.75 16.5V18.75C3.75 19.5784 4.42157 20.25 5.25 20.25H18.75C19.5784 20.25 20.25 19.5784 20.25 18.75V16.5C20.25 16.0858 20.5858 15.75 21 15.75C21.4142 15.75 21.75 16.0858 21.75 16.5V18.75C21.75 20.4069 20.4069 21.75 18.75 21.75H5.25C3.59315 21.75 2.25 20.4069 2.25 18.75V16.5C2.25 16.0858 2.58579 15.75 3 15.75Z"
+                    fill="#0F172A" />
+                </svg>
+
+                <input class="hidden" :id="'cfile_' + column" :name="'cfile_' + column" type="file" @change="fileUpdated(column, $event)">
+
+              </label>
+            </div>
+            <div class="text-xs text-slate-400 mt-1">{{ Table.columns[column].Popup.desc }}</div>
+          </div>
+
+
+          
+          <div v-if="Table.columns[column].Popup.popupType === 'file'">
+            <div class="text-sm text-gray-500 mb-1">{{ Table.columns[column].Popup.title || Table.columns[column].title
+              || Table.columns[column].name }}</div>
+            <div class="border border-slate-100 flex self-stretch">
+
+              <div class="flex-1">
+                {{ getFileName(Table.columns[column].Popup.model) }}
+              </div>
+
+              
+              <label :for="'cfile_' + column">
+
+                <svg class="my-auto cursor-pointer" width="24" height="24" viewbox="0 0 24 24" fill="none"
+                  xmlns="http://www.w3.org/2000/svg">
+                  <path fill-rule="evenodd" clip-rule="evenodd"
+                    d="M11.4697 2.46967C11.7626 2.17678 12.2374 2.17678 12.5303 2.46967L17.0303 6.96967C17.3232 7.26256 17.3232 7.73744 17.0303 8.03033C16.7374 8.32322 16.2626 8.32322 15.9697 8.03033L12.75 4.81066L12.75 16.5C12.75 16.9142 12.4142 17.25 12 17.25C11.5858 17.25 11.25 16.9142 11.25 16.5L11.25 4.81066L8.03033 8.03033C7.73744 8.32322 7.26256 8.32322 6.96967 8.03033C6.67678 7.73744 6.67678 7.26256 6.96967 6.96967L11.4697 2.46967ZM3 15.75C3.41421 15.75 3.75 16.0858 3.75 16.5V18.75C3.75 19.5784 4.42157 20.25 5.25 20.25H18.75C19.5784 20.25 20.25 19.5784 20.25 18.75V16.5C20.25 16.0858 20.5858 15.75 21 15.75C21.4142 15.75 21.75 16.0858 21.75 16.5V18.75C21.75 20.4069 20.4069 21.75 18.75 21.75H5.25C3.59315 21.75 2.25 20.4069 2.25 18.75V16.5C2.25 16.0858 2.58579 15.75 3 15.75Z"
+                    fill="#0F172A" />
+                </svg>
+
+                <input class="hidden" :id="'cfile_' + column" :name="'cfile_' + column" type="file" @change="fileUpdated(column, $event)">
+
+              </label>
+            </div>
+            <div class="text-xs text-slate-400 mt-1">{{ Table.columns[column].Popup.desc }}</div>
+          </div>
+
+          <div v-if="Table.columns[column].Popup.popupType === 'text'">
+            <div class="text-sm text-gray-500 mb-1">{{ Table.columns[column].Popup.title || Table.columns[column].title
+              || Table.columns[column].name }}</div>
+            <EditorPopup :value="Table.columns[column].Popup.model" @save="PopupTextSaved" :column="column"
+              :title="Table.columns[column].Popup.title ?? column">
+            </EditorPopup>
+            <div class="text-xs text-slate-400 mt-1">{{ Table.columns[column].Popup.desc }}</div>
+          </div>
+
+
+          
+          <div class="mx-2 my-1 text-red-600" v-if="(typeof popupErrors[column] !== 'undefined')">{{ popupErrors[column]
+          }}</div>
+
+        </div>
+      </v-card-text>
+
+      <div class="text-red-600 mx-2 my-1" v-if="(typeof popupErrors['globalErrorStack'] !== 'undefined')">{{
+        popupErrors['globalErrorStack'] }}</div>
+
+      
+      <v-card-actions>
+        <v-btn color="grey" variant="text" @click="close">
+          Отмена
+        </v-btn>
+        <v-spacer></v-spacer>
+        <v-btn color="blue-darken-1" variant="text" @click="SaveTable">
+          {{ Table.mode === 'add' ? 'Добавить' : 'Сохранить' }}
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+<script lang="ts">
+import { onMounted, reactive, ref, watch, nextTick } from 'vue'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST, { Rows } from "flamerest"
+
+// Иконки
+import { Column, IColumn } from './Columns';
+import { defineComponent } from 'vue';
+
+import TableOpts from './TableOpts';
+import FlameTable from './FlameTable';
+
+type Class<T> = new (...args: any[]) => T;
+
+import Datepicker from '@vuepic/vue-datepicker';
+import '@vuepic/vue-datepicker/dist/main.css';
+import { isNumber } from 'lodash';
+import EditorPopup from '../components/editor/EditorPopup.vue';
+
+export interface TablePopupInstance {
+  showAdd: () => void;
+  showEdit: (row: any) => void;
+}
+
+export default defineComponent({
+  components: { Datepicker, EditorPopup },
+  props: {
+    table: {
+      required: true,
+      type: FlameTable
+    },
+  },
+
+  setup(props, { expose }) {
+
+    const Table = props.table as FlameTable<any>;
+    const isDialogVisible = ref(false);
+    const ColumnNames = Object.keys(Table.columns);
+
+    // Ошибки сохранения
+    let popupErrors: { [key: string]: string } = reactive({});
+
+    /**
+     * Добавление новой записи
+     */
+    const showAdd = () => {
+      Table.mode = 'add';
+
+      // Установим все поля в пустые значения
+      ColumnNames.forEach(key => {
+        const col = Table.columns[key];
+        if (col.Popup.popupType === 'selector' && col.Popup.Selector.allowNull) {
+          col.Popup.model = null;
+        } else {
+          col.Popup.model = "";
+        }
+        col.Popup.fileModel = null;
+      })
+
+      isDialogVisible.value = true;
+    }
+
+    /**
+     * Редактирование записи
+     */
+    const showEdit = async (row: any) => {
+      Table.mode = 'edit';
+
+      await Table.opts.Popup.load(row, Table as any);
+
+
+      // Установим все поля в фактические значения из таблицы
+      ColumnNames.forEach(key => {
+        if (row.hasOwnProperty(key)) {
+          if (Table.columns[key].Popup.popupType === 'file' || Table.columns[key].Popup.popupType === 'image')
+            Table.columns[key].Popup.fileModel = row[key];
+
+          Table.columns[key].Popup.model = row[key];
+        } else {
+          console.warn(`[FlameTable Debug] Column "${key}" configured in frontend but not found in the received row data. Skipping assignment for this field.`);
+        }
+      })
+
+      Table.OpenedRow = row;
+
+      isDialogVisible.value = true;
+    }
+
+    const close = () => {
+      Table.OpenedRow = null;
+      isDialogVisible.value = false;
+    }
+
+    const SaveTable = async () => {
+
+      try {
+        if (Table.mode === 'add') {
+          await Table.add()
+        }
+        else {
+          await Table.save()
+        }
+        popupErrors = {};
+      }
+      catch (ex: any) {
+
+        for (const keyx in popupErrors)
+          delete popupErrors[keyx];
+
+        if (typeof ex.stack !== 'undefined' && typeof ex.message !== 'undefined') {
+          popupErrors.globalErrorStack = ex.message;
+        }
+        else
+          Object.assign(popupErrors, ex);
+
+        return;
+      }
+
+      close();
+
+    }
+
+    const fileUpdated = async (column: any, ev: any) => {
+      // если файлы не выбраны
+      if (ev.target.files.length === 0) return;
+
+      Table.columns[column].Popup.model = ev;
+      const prepared = (await REST.prepare({ myParam: ev })).myParam;
+      Table.columns[column].Popup.model = prepared
+      Table.columns[column].Popup.fileModel = ev
+    }
+
+    const PopupTextSaved = (txt: string, column: string) => {
+      Table.columns[column].Popup.model = txt;
+    }
+
+    expose({
+      showAdd,
+      showEdit
+    })
+
+
+    return {
+      Table,
+      isDialogVisible,
+      ColumnNames,
+      SaveTable,
+      fileUpdated,
+      popupErrors,
+      PopupTextSaved,
+      close
+    }
+
+  },
+
+  methods: {
+    fileGetData(thisArr: any, getSource: boolean = true) {
+      if (thisArr instanceof Array && thisArr.length > 0) {
+        // Получить строку с исходником
+        if (getSource) {
+          if (typeof thisArr[0].data === 'string') return thisArr[0].data;
+          if (typeof thisArr[0].file === 'string') return REST.SERVER + "/" + thisArr[0].file;
+          return "";
+        }
+        // Получить данные целиком
+        return thisArr[0]
+      }
+      return null
+    },
+
+    getFileName(fileModel: any) {
+      const res = this.fileGetData(fileModel, false)
+      if (res?.name) {
+        if (typeof res.name === 'string' && res.name !== '') {
+          return res.name;
+        }
+        else {
+          if (res.file) {
+            const splitted = res.file.split('.');
+            return 'File.' + splitted[splitted.length - 1];
+          }
+        }
+      }
+    },
+  },
+
+})
+
+</script> 

package/src/Table/TableSelectorItem.ts

@@ -1,9 +1,29 @@
 export default interface ITableSelectorItem {
 
-   id: string | number,
+   id: string | number | null,
    title?: string,
    label?: string,
    color?: string,
-   position?: number
+   position?: number,
+   
+   /**
+    * Строка, которая будет добавлена перед элементом
+    */
+   prepend?: string,
+
+   /**
+    * Строка, которая будет добавлена после элемента
+    */
+   append?: string,
+
+   /**
+    * CSS-классы для блока с препендом
+    */
+   prependClasses?: string,
+
+   /**
+    * CSS-классы для блока с аппендом
+    */
+   appendClasses?: string,
 
 }

package/src/Table/TableTasksPanel.vue

@@ -92,7 +92,7 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref, defineProps, defineEmits, nextTick } from '@vue/runtime-core'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
+import { onMounted, reactive, ref, nextTick } from 'vue'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
 
 // Иконки
 import { } from '@icons/24/solid'

package/src/components/default/Modal.vue

@@ -1,37 +1,41 @@
-<template lang="pug">
-
-// УНИВЕРСАЛЬНОЕ МОДАЛЬНОЕ ОКНО
-  Позволяет вызывать себя через show() и close()
-
-CustomModal.overall(v-model="isShow" :close="close" style="z-index: 999;")
-
-  // Этот слот для замены самого окна
-  slot
-
-    .bg-white.rounded-xl
-
-      // Этот слот позволяет заменить всё сразу внутри окна
-      slot(name="inner")
-
-        // Заголовок
-        .flex.items-center.px-5.border-b.border-b-gray-300(v-if="title !== ''")
-          h1.text-3xl.py-5 {{ title }}
-          XCircleIcon.ml-24.w-6.opacity-25.cursor-pointer(@click="close")
-
-        // Тело
-        .my-3.px-5
-          slot(name="body")
-            .text-left {{ body === '' ? 'Укажите сообщение или используйте слот body' : '' }}
-
-        // Кнопки
-        slot(name="buttons")
-          .border-t.border-t-gray-300.mb-4.pt-3.pr-5.flex.items-end.flex-col
-            button.cursor-pointer.ml-5.rounded-full.bg-blue-700.px-4.py-1.text-white(@click="close") {{ closeButton === '' ? 'Закрыть' : closeButton }}
-      
+<template>
+  <!-- УНИВЕРСАЛЬНОЕ МОДАЛЬНОЕ ОКНО -->
+  <!-- Позволяет вызывать себя через show() и close() -->
+  <CustomModal class="overall" v-model="isShow" :close="close" style="z-index: 999;">
+    <!-- Этот слот для замены самого окна -->
+    <slot>
+      <div class="bg-white rounded-xl">
+        <!-- Этот слот позволяет заменить всё сразу внутри окна -->
+        <slot name="inner">
+          <!-- Заголовок -->
+          <div class="flex items-center px-5 border-b border-b-gray-300" v-if="title !== ''">
+            <h1 class="text-3xl py-5">{{ title }}</h1>
+            <XCircleIcon class="ml-24 w-6 opacity-25 cursor-pointer" @click="close"></XCircleIcon>
+          </div>
+
+          <!-- Тело -->
+          <div class="my-3 px-5">
+            <slot name="body">
+              <div class="text-left">{{ body === '' ? 'Укажите сообщение или используйте слот body' : '' }}</div>
+            </slot>
+          </div>
+
+          <!-- Кнопки -->
+          <slot name="buttons">
+            <div class="border-t border-t-gray-300 mb-4 pt-3 pr-5 flex items-end flex-col">
+              <button class="cursor-pointer ml-5 rounded-full bg-blue-700 px-4 py-1 text-white" @click="close">
+                {{ closeButton === '' ? 'Закрыть' : closeButton }}
+              </button>
+            </div>
+          </slot>
+        </slot>
+      </div>
+    </slot>
+  </CustomModal>
 </template>
 
 <script lang="ts">
-import { ref, defineComponent } from '@vue/runtime-core'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest";
+import { ref, defineComponent } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest";
 
 // Иконки
 import { XCircleIcon } from '@icons/24/solid'
@@ -83,5 +87,6 @@ export default defineComponent({
 </script>
 
 <style scoped lang="scss">
-.overall {}
+.overall {
+}
 </style>

package/src/components/editor/EditorPopup.vue

@@ -31,7 +31,7 @@
 </template>
 
 <script lang="ts">
-import { onMounted, reactive, ref, defineProps, defineEmits, nextTick, defineComponent } from '@vue/runtime-core'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest";
+import { onMounted, reactive, ref, nextTick, defineComponent } from 'vue'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest";
 import { vuetifyProTipTap } from './TextEditor'
 // Иконки
 import { } from '@icons/24/solid'

package/src/components/editor/LinkDialog.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { Editor } from '@tiptap/vue-3'
-import { computed, ref, watch, withDefaults, defineProps } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { locale } from 'vuetify-pro-tiptap'
 
 interface LinkAttrs {

package/src/components/editor/SelectImage.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, unref, watch, withDefaults, defineProps, defineEmits } from 'vue'
+import { computed, unref, watch } from 'vue'
 
 interface SelectImageProps {
   modelValue?: Record<string, string>

package/src/main.ts

@@ -4,19 +4,18 @@ import './index.css'
 import { createPinia } from 'pinia'
 import router from "./router";
 
-import 'vue-universal-modal/dist/index.css'
-import VueUniversalModal from 'vue-universal-modal'
 import REST from 'flamerest';
 import vSelect from 'vue-select'
-import * as components from 'vuetify/components'
-import * as directives from 'vuetify/directives'
 
-import { vuetifyProTipTap } from './components/editor/TextEditor'
 
 import { createVuetify } from 'vuetify';
+import * as components from 'vuetify/components'
+import * as directives from 'vuetify/directives'
 import 'vuetify/styles';
 import { aliases, mdi } from 'vuetify/iconsets/mdi';
 
+import { vuetifyProTipTap } from './components/editor/TextEditor'
+
 
 REST.SERVER = 'http://testrest';
 
@@ -41,5 +40,4 @@ createApp(App)
    .use(router)
    .use(vuetify)
    .use(vuetifyProTipTap)
-   .use(VueUniversalModal, { teleportTarget: '#my-modals', modalComponent: 'CustomModal' })
    .mount('#app')

package/src/pages/Home.vue

@@ -1,14 +1,13 @@
-<template lang="pug">
-.flex.justify-center.h-screen.items-center.flex-col
-  .px-8.py-6.mt-4.text-left.bg-white.shadow-lg(class="desktop:w-feed-lg")
-    | Welcome!
-
+<template>
+  <div class="flex justify-center h-screen items-center flex-col">
+    <div class="px-8 py-6 mt-4 text-left bg-white shadow-lg desktop:w-feed-lg">Welcome!</div>
+  </div>
 </template>
 
 <script setup lang="ts">
 
 // Основные импорты
-import { onMounted, reactive, defineProps } from '@vue/runtime-core'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
+import { onMounted, reactive } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
 
 // Иконки
 import { XCircleIcon } from '@icons/24/solid'

package/src/pages/SubRow.vue

@@ -1,30 +1,34 @@
-<template lang="pug">
-.fb.my-5.text-left(class="mobile:flex-wrap mobile:justify-between mobile:w-full")
-  .bg-green(class="w-[300px] h-[300px]")
-  .ml-5(class="mobile:w-full")
-    .fb.my-1(class="mobile:flex-wrap mobile:w-full mobile:justify-between")
-      div.inline-block.text-3xl NAME
-      span.text-sm.inline-block.bg-blue-200.mx-5.py-1.px-2 TYPE
-
-      div.text-sm.bg-slate-100.text-slate-500.px-2.py-1.inline-block
-        span Flex right block
-        span.ml-1 block 2
-
-    div.my-1
-      span.text-xl Text: xxxxx
-
-    div.my-1
-      .text-sm.inline-block.bg-yellow-100.mr-2.py-1.px-2 TEST
-    div.my-1.text-sm  Text: xxxxx
-    div.my-1.text-sm  Text: xxxxx
-    div.my-1.text-sm  Text: xxxxx
-    div.my-1.text-sm  Text: xxxxx
-    
-
+<template>
+  <div class="fb my-5 text-left mobile:flex-wrap mobile:justify-between mobile:w-full">
+    <div class="bg-green w-[300px] h-[300px]"></div>
+    <div class="ml-5 mobile:w-full">
+      <div class="fb my-1 mobile:flex-wrap mobile:w-full mobile:justify-between">
+        <div class="inline-block text-3xl">NAME</div>
+        <span class="text-sm inline-block bg-blue-200 mx-5 py-1 px-2">TYPE</span>
+
+        <div class="text-sm bg-slate-100 text-slate-500 px-2 py-1 inline-block">
+          <span>Flex right block</span>
+          <span class="ml-1">block 2</span>
+        </div>
+      </div>
+
+      <div class="my-1">
+        <span class="text-xl">Text: xxxxx</span>
+      </div>
+
+      <div class="my-1">
+        <div class="text-sm inline-block bg-yellow-100 mr-2 py-1 px-2">TEST</div>
+      </div>
+      <div class="my-1 text-sm">Text: xxxxx</div>
+      <div class="my-1 text-sm">Text: xxxxx</div>
+      <div class="my-1 text-sm">Text: xxxxx</div>
+      <div class="my-1 text-sm">Text: xxxxx</div>
+    </div>
+  </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref, defineProps, defineEmits, nextTick } from '@vue/runtime-core'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
+import { onMounted, reactive, ref, nextTick } from 'vue'; import type { Ref } from 'vue'; import { storeFile } from "@/store"; import { useRoute, useRouter } from 'vue-router'; import REST from "flamerest"
 
 // Иконки
 import { } from '@icons/24/solid'