move create into CreateView.vue

src/views/CreateView.vue

@@ -22,19 +22,20 @@
           v-if="activeSteps.includes('messages')"
           :isActive="messageDeliveryMethod !== 'telegram'"
         >
-          <CreateMessagesSection :placement="placement" v-model="messages" />
+          <CreatePredefinedMessagesSection :placement="placement" v-model="messages" />
         </CreateSection>
 
         <!-- Секция итогового резюме -->
         <CreateSection :isActive="activeSteps.includes('summary')">
           <CreateSummarySection
-            :placement="placement"
-            :actions="selectedActions"
-            :messageDeliveryMethod="messageDeliveryMethod"
-            :predefinedMessage="selectedActions.includes('sendMessage') ? messages : undefined"
+            v-model:name="name"
+            buttonLabel="Создать QR‑код"
+            @nextStep="createQrCode"
           />
         </CreateSection>
 
+        <p v-if="error" class="text-red-500 mt-4">Ошибка создания QR‑кода: {{ error }}</p>
+
         <div class="h-[30dvh] md:h-[10dvh] overflow-hidden"></div>
       </div>
     </section>
@@ -43,13 +44,37 @@
 
 <script setup lang="ts">
 import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { createQrCodeDocument } from '@/api/qrCode'
 import type { QRCodeDocument } from '@/types/DBDocumentTypes'
 
 // Состояния шагов
-const placement = ref<string | null>(null)
-const selectedActions = ref<string[]>([])
-const messageDeliveryMethod = ref<'' | QRCodeDocument['messageDeliveryMethod']>('')
-const messages = ref<string[]>([])
+const placement = ref<null | QRCodeDocument['placement']>(null)
+const selectedActions = ref<QRCodeDocument['actions']>([])
+const messageDeliveryMethod = ref<null | QRCodeDocument['messageDeliveryMethod']>(null)
+const messages = ref<Exclude<QRCodeDocument['predefinedMessages'], undefined>>([])
+const name = ref<QRCodeDocument['name']>('')
+const error = ref<string | null>(null)
+
+const router = useRouter()
+
+// Логика создания QR-кода
+async function createQrCode() {
+  try {
+    const qrCodeDocument = await createQrCodeDocument({
+      name: name.value,
+      placement: placement.value!,
+      actions: selectedActions.value,
+      messageDeliveryMethod: messageDeliveryMethod.value!,
+      predefinedMessages: messages.value.length > 0 ? messages.value : undefined,
+    })
+
+    error.value = null
+    await router.push({ name: 'ManageQRCodeReady', params: { qr_code_uri: qrCodeDocument.uri } })
+  } catch (err) {
+    error.value = (err as Error).message || 'Неизвестная ошибка'
+  }
+}
 
 // Функция для определения доступных шагов
 const activeSteps = computed(() => {

src/views/ManageQRCodeReadyView.vue

@@ -1,37 +1,51 @@
 <template>
-  <div class="max-w-lg mx-auto py-6 px-4 md:px-6">
-    <section class="content text-center">
-      <h2 class="text-xl font-semibold mb-4">Ваш QR‑код готов</h2>
-      <p class="text-gray-600 mb-4">Сохраните его и ознакомьтесь с инструкциями по размещению.</p>
+  <div class="flex flex-col min-h-screen">
+    <main class="flex-grow flex items-center justify-center py-6 px-4 md:px-6">
+      <section class="max-w-lg w-full flex flex-col gap-1">
+        <h2 class="text-xl font-semibold mb-4">Ваш QR‑код готов</h2>
+        <p class="text-gray-600 mb-4">Сохраните его и ознакомьтесь с инструкциями по размещению.</p>
 
-      <!-- Рендер QR‑кода -->
-      <div v-if="!loading && svgUrl" class="border p-4 bg-white rounded-lg mb-6">
-        <img :src="svgUrl" alt="QR‑код" />
-      </div>
+        <!-- Рендер QR‑кода -->
+        <div v-if="!loading && svgUrl" class="border p-4 bg-white rounded-lg mb-6">
+          <img :src="svgUrl" alt="QR‑код" />
+        </div>
 
-      <!-- Сообщение об ошибке -->
-      <p v-if="error" class="text-red-500 mt-4">{{ error }}</p>
-      <p v-if="loading" class="text-gray-500 mt-4">Загрузка...</p>
+        <!-- Сообщение об ошибке -->
+        <p v-if="error" class="text-red-500 mt-4">{{ error }}</p>
+        <p v-if="loading" class="text-gray-500 mt-4">Загрузка...</p>
 
-      <!-- Кнопки для скачивания -->
-      <div v-if="!loading && !error" class="flex flex-row gap-4 justify-center">
-        <Button
-          v-if="svgUrl"
-          label="Скачать SVG"
-          icon="pi pi-download"
-          class="p-button-sm"
-          :href="svgUrl"
-          :download="`${sanitizedFileName}.svg`"
-          as="a"
-        />
-        <Button
-          label="Скачать PNG"
-          icon="pi pi-download"
-          class="p-button-sm p-button-outlined"
-          @click="downloadPng"
-        />
-      </div>
-    </section>
+        <!-- Кнопки для скачивания -->
+        <div v-if="!loading && !error" class="flex flex-row gap-4 justify-center">
+          <Button
+            v-if="svgUrl"
+            label="Скачать SVG"
+            icon="pi pi-download"
+            class="p-button-sm"
+            :href="svgUrl"
+            :download="`${sanitizedFileName}.svg`"
+            as="a"
+          />
+          <Button
+            label="Скачать PNG"
+            icon="pi pi-download"
+            class="p-button-sm p-button-outlined"
+            @click="downloadPng"
+          />
+        </div>
+      </section>
+    </main>
+
+    <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">
+      <p>
+        Нужен еще один?
+        <a href="/create" class="underline">Создайте QR‑код</a>.
+      </p>
+      <p class="mt-1">
+        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline"
+          >поддержке</a
+        >.
+      </p>
+    </footer>
   </div>
 </template>