Proyectos de Subversion LeadersLinked - SPA

import React from 'react'

import { useForm } from 'react-hook-form'

import Form from '@components/common/form'

import Input from '@components/UI/inputs/Input'

import Button from '@components/UI/buttons/Buttons'

import Ckeditor from '@components/common/ckeditor/Ckeditor'

import LoadingWrapper from '@components/common/loading-wrapper'

import DatetimePicker from '@components/common/inputs/datetime-picker'

function ProgressForm({

  onSubmit = () => {},

  defaultValues = {

    quantitative_value: 0,

    qualitative_description: ''

  },

  values = {}

}) {

  const {

    control,

    formState: { errors, isSubmitting },

    handleSubmit

  } = useForm({

    defaultValues,

    values

  })

  /* const getCurrentDate = () => {

    const date = new Date()

    const year = date.getFullYear()

    const month = String(date.getMonth() + 1).padStart(2, '0') // Enero es 0

    const day = String(date.getDate()).padStart(2, '0')

    const hours = String(date.getHours()).padStart(2, '0')

    const minutes = String(date.getMinutes()).padStart(2, '0')

    const seconds = String(date.getSeconds()).padStart(2, '0')

    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`

  } */

  return (

    <Form onSubmit={handleSubmit(onSubmit)}>

      <LoadingWrapper loading={isSubmitting} displayChildren>

        <DatetimePicker

          label='Fecha'

          name='date'

          control={control}

          rules={{

            required: { value: true, message: 'La fecha es requerida' },

            validate: {

              beGreaterThanToday: (value) =>

                new Date(value) > new Date() ||

                'La fecha debe ser mayor a la fecha actual'

            }

          }}

          displayTime

          dateFormat='YYYY-MM-DDTHH:mm:ss'

        />

        <Input

          control={control}

          label='Valor cuantitativo:'

          name='quantitative_value'

          type='number'

          rules={{ required: 'El valor es requerido' }}

          error={errors.quantitative_value?.message}

        />

        <Ckeditor

          control={control}

          name='qualitative_description'

          error={errors.qualitative_description?.message}

          rules={{ required: 'La descripción es requerida' }}

          label='Descripción cualitativa:'

        />

        <Button color='primary' type='submit'>

          Enviar

        </Button>

      </LoadingWrapper>

    </Form>

  )

}

export default ProgressForm