<template>
  <section>
    <h2 class="text-xl font-semibold mb-4">Введите название для вашего QR-кода</h2>
    <p class="text-gray-600 mb-4">Название поможет вам организовать ваши QR-коды.</p>

    <form @submit.prevent="saveQRCode">
      <label for="name" class="block text-gray-700 font-semibold mb-2">Название</label>
      <InputText id="name" v-model="nameModel" class="w-full" placeholder="Введите название" />
      <p v-if="!nameModel" class="text-red-500 text-sm mt-1">Название обязательно.</p>

      <Button
        type="submit"
        label="Создать QR-код"
        class="p-button-md mt-4 mb-4"
        :disabled="!nameModel"
      />
    </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 { qrCodeDb } from '@/dbs'
import { type QRCodeDocument } from '@/types/DBDocumentTypes'

const { placement, actions, deliveryMethod, user_uuid, predefinedMessage } = defineProps<{
  placement: QRCodeDocument['placement']
  actions: QRCodeDocument['actions']
  deliveryMethod: QRCodeDocument['deliveryMethod']
  user_uuid: QRCodeDocument['user_uuid']
  predefinedMessage: QRCodeDocument['predefinedMessage'] | undefined
}>()

const uriModel = defineModel<QRCodeDocument['uri']>('uri', { required: true })
const nameModel = defineModel<QRCodeDocument['name']>('name', { required: true })
const emit = defineEmits(['nextStep'])

const error = ref<string | null>(null)

async function saveQRCode() {
  try {
    // Генерация уникального uri
    const EPOHE = 1731661630981
    const uri = Math.abs(Date.now() - EPOHE).toString(36)

    const qrCodeDoc: QRCodeDocument = {
      _id: `qr_code:${uri}`,
      type: 'qr_code',
      uri,
      url: `https://hereconnect.condev.ru/read/${uri}`,
      name: nameModel.value,
      deliveryMethod,
      created_at: new Date().toISOString(),
      placement,
      actions,
      user_uuid,
      predefinedMessage,
    }

    await qrCodeDb.put(qrCodeDoc)

    uriModel.value = uri
    error.value = null
    emit('nextStep')
  } catch (err) {
    error.value = (err as Error).message || 'Неизвестная ошибка'
  }
}
</script>
