move create into CreateView.vue

components.d.ts

@@ -13,9 +13,10 @@ declare module 'vue' {
     CreateActionsSection: typeof import('./src/components/create/CreateActionsSection.vue')['default']
     CreateDeliverySection: typeof import('./src/components/create/CreateMessageDeliveryMethodSection.vue')['default']
     CreateMessageDeliveryMethodSection: typeof import('./src/components/create/CreateMessageDeliveryMethodSection.vue')['default']
-    CreateMessagesSection: typeof import('./src/components/create/CreateMessagesSection.vue')['default']
+    CreateMessagesSection: typeof import('./src/components/create/CreatePredefinedMessagesSection.vue')['default']
     CreateNameSection: typeof import('./src/components/create/CreateNameSection.vue')['default']
     CreatePlacementSection: typeof import('./src/components/create/CreatePlacementSection.vue')['default']
+    CreatePredefinedMessagesSection: typeof import('./src/components/create/CreatePredefinedMessagesSection.vue')['default']
     CreateReadySection: typeof import('./src/components/create/CreateReadySection.vue')['default']
     CreateSection: typeof import('./src/components/create/CreateSection.vue')['default']
     CreateSummarySection: typeof import('./src/components/create/CreateSummarySection.vue')['default']

src/api/qrCode.ts

@@ -10,7 +10,7 @@ export const createQrCodeDocument = async (
     | 'placement'
     | 'actions'
     //| 'user_uuid'
-    | 'predefinedMessage'
+    | 'predefinedMessages'
     | 'messageDeliveryMethod'
   >,
 ) => {

src/components/create/CreatePredefinedMessagesSection.vue

@@ -59,7 +59,7 @@ const defaultMessages = {
 }
 
 // Локальное хранилище сообщений
-const messages = defineModel<Exclude<QRCodeDocument['predefinedMessage'], undefined>>({
+const messages = defineModel<Exclude<QRCodeDocument['predefinedMessages'], undefined>>({
   required: true,
 })
 
@@ -67,11 +67,13 @@ const messages = defineModel<Exclude<QRCodeDocument['predefinedMessage'], undefi
 watch(
   () => props.placement,
   (newPlacement, previousPlacement) => {
-    let prevDefaultMessages: QRCodeDocument['predefinedMessage'] = []
+    let prevDefaultMessages: QRCodeDocument['predefinedMessages'] = []
     if (previousPlacement && previousPlacement in defaultMessages) {
       prevDefaultMessages = defaultMessages[previousPlacement]
     }
-    const isMessagesDefault = JSON.stringify(messages.value) === JSON.stringify(prevDefaultMessages)
+    const isMessagesDefault =
+      messages.value.length === 0 ||
+      JSON.stringify(messages.value) === JSON.stringify(prevDefaultMessages)
     if (isMessagesDefault) {
       messages.value = [...(defaultMessages[newPlacement] || [])]
     }

src/components/create/CreateSummarySection.vue

@@ -3,57 +3,19 @@
     <h2 class="text-xl font-semibold mb-4">Введите название для вашего QR‑кода</h2>
     <p class="text-gray-600 mb-4">Название поможет вам организовать ваши QR‑коды.</p>
 
-    <form @submit.prevent="saveQRCode">
+    <form @submit.prevent="emit('nextStep')">
       <label for="name" class="block text-gray-700 font-semibold mb-2">Название</label>
       <InputText id="name" v-model="name" class="w-full" placeholder="Введите название" />
       <p v-if="!name" class="text-red-500 text-sm mt-1">Название обязательно.</p>
 
-      <Button
+      <Button type="submit" :label="buttonLabel" class="p-button-md mt-4 mb-4" :disabled="!name" />
-        type="submit"
-        label="Создать QR‑код"
-        class="p-button-md mt-4 mb-4"
-        :disabled="!name"
-      />
     </form>
-    <p v-if="error" class="text-red-500 mt-4">Ошибка создания QR‑кода: {{ error }}</p>
   </section>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { useRouter } from 'vue-router'
 import { type QRCodeDocument } from '@/types/DBDocumentTypes'
-import { createQrCodeDocument } from '@/api/qrCode'
+defineProps<{ buttonLabel: string }>()
-
+const name = defineModel<QRCodeDocument['name']>('name')
-const router = useRouter()
+const emit = defineEmits(['nextStep'])
-
-const { placement, actions, messageDeliveryMethod, predefinedMessage } = defineProps<{
-  placement: QRCodeDocument['placement']
-  actions: QRCodeDocument['actions']
-  messageDeliveryMethod: QRCodeDocument['messageDeliveryMethod']
-  // user_uuid: QRCodeDocument['user_uuid']
-  predefinedMessage: QRCodeDocument['predefinedMessage'] | undefined
-}>()
-
-const name = ref<QRCodeDocument['name']>('name')
-const error = ref<string | null>(null)
-
-async function saveQRCode() {
-  try {
-    const qrCodeDocument = await createQrCodeDocument({
-      name: name.value,
-      placement,
-      actions,
-      // user_uuid,
-      messageDeliveryMethod,
-      predefinedMessage,
-    })
-
-    error.value = null
-    // Перенаправление на страницу /manage/:qr/ready
-    await router.push({ name: 'ManageQRCodeReady', params: { qr_code_uri: qrCodeDocument.uri } })
-  } catch (err) {
-    error.value = (err as Error).message || 'Неизвестная ошибка'
-  }
-}
 </script>

src/types/DBDocumentTypes/QRCodeDocument.ts

@@ -29,5 +29,5 @@ export interface QRCodeDocument extends BaseDocument {
   actions: string[]
 
   /** Предустановленное сообщение для гостей */
-  predefinedMessage?: string[]
+  predefinedMessages?: string[]
 }

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"
+            v-model:name="name"
-            :actions="selectedActions"
+            buttonLabel="Создать QR‑код"
-            :messageDeliveryMethod="messageDeliveryMethod"
+            @nextStep="createQrCode"
-            :predefinedMessage="selectedActions.includes('sendMessage') ? messages : undefined"
           />
         </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 placement = ref<null | QRCodeDocument['placement']>(null)
-const selectedActions = ref<string[]>([])
+const selectedActions = ref<QRCodeDocument['actions']>([])
-const messageDeliveryMethod = ref<'' | QRCodeDocument['messageDeliveryMethod']>('')
+const messageDeliveryMethod = ref<null | QRCodeDocument['messageDeliveryMethod']>(null)
-const messages = ref<string[]>([])
+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,6 +1,7 @@
 <template>
-  <div class="max-w-lg mx-auto py-6 px-4 md:px-6">
+  <div class="flex flex-col min-h-screen">
-    <section class="content text-center">
+    <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>
 
@@ -32,6 +33,19 @@
           />
         </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>