extract constants/*

src/components/create/CreateMessageDeliveryMethodSection.vue

@@ -26,27 +26,14 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { type QRCodeDocument } from '@/types/DBDocumentTypes'
+import { deliveryOptions } from '@/constants/deliveryOptions'
 
 const emit = defineEmits(['nextStep'])
 const model = defineModel<QRCodeDocument['messageDeliveryMethod']>()
 
-type DeliveryOption = {
-  label: string
-  method: QRCodeDocument['messageDeliveryMethod']
-}
-
 // Локальное состояние для уведомления
 const telegramNotice = ref(false)
 
-// Массив вариантов доставки
-const deliveryOptions: DeliveryOption[] = [
-  {
-    label: 'В браузере (push-уведомления)',
-    method: 'webPushSubscription',
-  },
-  { label: 'Telegram', method: 'telegram' },
-]
-
 // Обработчик выбора
 function handleSelection(method: QRCodeDocument['messageDeliveryMethod']) {
   if (method === 'telegram') {

src/components/create/CreatePlacementSection.vue

@@ -3,13 +3,13 @@
     <h2 class="text-xl font-semibold mb-4">Где вы хотите разместить QR‑код?</h2>
     <p class="text-gray-600 mb-4">Этот выбор поможет настроить QR‑код с подходящими действиями.</p>
     <div class="flex flex-col gap-3 mb-4">
-      <div v-for="(label, type) in qrCodePlacements" :key="type" class="flex items-center gap-2">
+      <div v-for="{ label, type } in qrCodePlacements" :key="type" class="flex items-center gap-2">
         <RadioButton
           v-model="selectedPlacement"
           :inputId="type"
           name="placement"
           :value="type"
-          @change="next"
+          @change="$emit('nextStep')"
         />
         <label :for="type">{{ label }}</label>
       </div>
@@ -18,20 +18,8 @@
 </template>
 
 <script setup lang="ts">
-const qrCodePlacements = {
+import { qrCodePlacements } from '@/constants/qrCodePlacements'
-  car: 'Автомобиль',
-  pet: 'Питомец',
-  door: 'Входная дверь дома или квартиры',
-  store: 'Магазин',
-  restaurant_table: 'Стол в кафе или ресторане',
-  other: 'Другое',
-}
-
 const selectedPlacement = defineModel<string>()
 
-const emit = defineEmits(['nextStep'])
+defineEmits(['nextStep'])
-
-function next() {
-  emit('nextStep')
-}
 </script>

src/components/create/CreatePredefinedMessagesSection.vue

@@ -30,34 +30,14 @@
 </template>
 
 <script setup lang="ts">
-import { watch, nextTick, useTemplateRef } from 'vue'
+import { nextTick, useTemplateRef, watch } from 'vue'
 import { type QRCodeDocument } from '@/types/DBDocumentTypes'
+import { defaultMessages } from '@/constants/defaultMessages'
 
 // Пропсы
 const props = defineProps<{ placement: QRCodeDocument['placement'] }>()
 const messagesRef = useTemplateRef<HTMLDivElement[]>('messagesRef')
 
-// Предустановленные сообщения по типу размещения
-const defaultMessages = {
-  car: [
-    'Ваш автомобиль мешает',
-    'Выключите свет',
-    'Спустило колесо',
-    'Подойдите к вашей машине',
-    'Эвакуатор',
-  ],
-  pet: ['Нашёлся ваш питомец'],
-  door: ['Я рядом с дверью'],
-  store: ['Подойдите к кассе', 'Вопрос по товару', 'Помощь с покупкой'],
-  restaurant_table: [
-    'Позовите официанта',
-    'Принести меню',
-    'Принести счёт',
-    'Пожаловаться на обслуживание',
-  ],
-  other: [],
-}
-
 // Локальное хранилище сообщений
 const messages = defineModel<Exclude<QRCodeDocument['predefinedMessages'], undefined>>({
   required: true,
@@ -67,7 +47,7 @@ const messages = defineModel<Exclude<QRCodeDocument['predefinedMessages'], undef
 watch(
   () => props.placement,
   (newPlacement, previousPlacement) => {
-    let prevDefaultMessages: QRCodeDocument['predefinedMessages'] = []
+    let prevDefaultMessages: (typeof defaultMessages)[QRCodeDocument['placement']] = []
     if (previousPlacement && previousPlacement in defaultMessages) {
       prevDefaultMessages = defaultMessages[previousPlacement]
     }

src/constants/defaultMessages.ts

@@ -0,0 +1,20 @@
+// Предустановленные сообщения по типу размещения
+export const defaultMessages = {
+  car: [
+    'Ваш автомобиль мешает',
+    'Выключите свет',
+    'Спустило колесо',
+    'Подойдите к вашей машине',
+    'Эвакуатор',
+  ],
+  pet: ['Нашёлся ваш питомец'],
+  door: ['Я рядом с дверью'],
+  store: ['Подойдите к кассе', 'Вопрос по товару', 'Помощь с покупкой'],
+  restaurant_table: [
+    'Позовите официанта',
+    'Принести меню',
+    'Принести счёт',
+    'Пожаловаться на обслуживание',
+  ],
+  other: [],
+} as const

src/constants/deliveryOptions.ts

@@ -0,0 +1,8 @@
+// Массив вариантов доставки
+export const deliveryOptions = [
+  {
+    label: 'В браузере (push-уведомления)',
+    method: 'webPushSubscription',
+  },
+  { label: 'Telegram', method: 'telegram' },
+] as const

src/constants/qrCodePlacements.ts

@@ -0,0 +1,8 @@
+export const qrCodePlacements = [
+  { type: 'car', label: 'Автомобиль' },
+  { type: 'pet', label: 'Питомец' },
+  { type: 'door', label: 'Входная дверь дома или квартиры' },
+  { type: 'store', label: 'Магазин' },
+  { type: 'restaurant_table', label: 'Стол в кафе или ресторане' },
+  { type: 'other', label: 'Другое' },
+] as const