add validation

This commit is contained in:
aarizona 2024-05-30 13:33:08 +03:00
parent 2dbd6742f7
commit 15c54bd3e6
2 changed files with 26 additions and 14 deletions

View File

@ -1,8 +1,7 @@
<script setup lang="ts">
import { object, string, type InferType } from 'yup'
import { apiBase } from '~/helpers';
import type { ApiTypeList, ApiTypeExternal } from '~/helpers';
import type { FormSubmitEvent } from '#ui/types'
import type { ApiTypeList, ApiTypeExternal, ApiElementSave } from '~/helpers';
import type { FormError, FormSubmitEvent } from '#ui/types'
const props = defineProps(['elements', 'partner'])
const route = useRoute()
@ -36,18 +35,25 @@ const external_data = reactive<ExternalDataType>({
element: [],
})
const elements = ref(props.elements)
const schema = object({
element: string().required('Required'),
element_id: string().required('Required')
})
type Schema = InferType<typeof schema>
const validate = (state: any): FormError[] => {
const errors = []
const txt = 'Это поле обязательно'
if (!state.partner) errors.push({ path: 'partner', message: txt })
if (!external_data || !external_data.partner || !external_data.partner.find(el => el.Ref_Key == state.partner)) {
errors.push({ path: 'partner', message: txt })
}
if (!state.element_id) errors.push({ path: 'element_id', message: txt })
return errors
}
async function onSubmit(event: FormSubmitEvent<Schema>) {
async function onSubmit(event: FormSubmitEvent<any>) {
const prepader_data = event.data
if (!external_data || !external_data.partner) {
return false
}
prepader_data.partner_name = external_data.partner.find(el => el.Ref_Key == state.partner)?.Description
if(!prepader_data.partner_name) prepader_data.partner_name = prepader_data.partner
const data = await $fetch(`${apiBase}/element/`, { method: 'POST', body: JSON.stringify(prepader_data) })
const data = await $fetch<ApiElementSave>(`${apiBase}/element/`, { method: 'POST', body: JSON.stringify(prepader_data) })
const inv_id = route.params.inv_id || data.inventory?.id
if (!route.params.inv_id) {
navigateTo(`/organization/p_${data.partner.id}/i_${data.inventory.id}`)
@ -118,8 +124,8 @@ onMounted(async () => {
<template>
<div class="grid grid-cols-10 gap-4">
<div class="col-span-3">
<UForm :state="state" class="flex flex-col gap-4" @submit="onSubmit">
<UFormGroup label="Выбрать организацию" name="organization">
<UForm :state="state" :validate="validate" class="flex flex-col gap-4" @submit="onSubmit">
<UFormGroup label="Выбрать организацию" name="partner">
<USelectMenu v-model="state.partner" :options="external_data.partner" value-attribute="Ref_Key"
option-attribute="Description" :searchable="searchInExternal"
searchable-placeholder="Выберите организацию из списка контрагентов" :loading="loading"
@ -138,7 +144,8 @@ onMounted(async () => {
:placeholder="`Элементы (${external_data.element.length})`" />
</UFormGroup>
<UFormGroup v-if="state.element"
:label="`Данные об элементе «${external_data.element?.find(el => el['Ref_Key'] === state.element)?.Description}»`">
:label="`Данные об элементе «${external_data.element?.find(el => el['Ref_Key'] === state.element)?.Description}»`"
name="element_id">
<UInput placeholder="ID" v-model="state.element_id" />
</UFormGroup>

View File

@ -14,6 +14,11 @@ export type ApiTypeBase =
export type ApiPartner = { id: number, external_id: number, name: string, total_inventory: number }
export type ApiInventory = { id: number, partner: number, name: string }
export type ApiElement = { id: number, external_id: string, element_id: number, photo: string, additional_text: string, inventory: number }
export type ApiElementSave = {
partner: ApiPartner,
inventory: ApiInventory,
element: ApiElement
}
export type ApiTypeExternal = {
'НаименованиеПолное': string;
Description: string;