add new transaction for pension

soker90 · Jan 25, 2024 · 11366eb · 11366eb
1 parent 5ce6349
commit 11366eb
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 24 deletions.
diff --git a/packages/client/src/pages/Pensions/components/TransactionModal.tsx b/packages/client/src/pages/Pensions/components/TransactionModal.tsx
@@ -1,21 +1,21 @@
+import { useEffect } from 'react'
 import { useForm } from 'react-hook-form'
 import { useSWRConfig } from 'swr'
 
 import { ModalGrid, DateForm, InputForm } from 'components'
 import { type PensionTransaction } from 'types'
 import { PENSIONS } from 'constants/api-paths'
+import { addPensionApi, editPensionApi } from 'services/apiService'
 
 interface Props {
     show: boolean;
     onClose: () => void;
     transaction?: PensionTransaction;
-    editTransaction?: (id: string, pension: PensionTransaction) => void;
-    addTransaction?: (pension: PensionTransaction) => void;
 }
 
-const TransactionModal = ({ show, onClose, transaction, editTransaction, addTransaction }: Props) => {
+const TransactionModal = ({ show, onClose, transaction }: Props) => {
   const { mutate } = useSWRConfig()
-  const { register, handleSubmit, formState: { errors }, control } = useForm({
+  const { register, handleSubmit, formState: { errors, isSubmitSuccessful }, control, setError, reset } = useForm({
     defaultValues: {
       date: transaction?.date || null,
       value: transaction?.value || '',
@@ -26,18 +26,27 @@ const TransactionModal = ({ show, onClose, transaction, editTransaction, addTran
     }
   })
 
+  useEffect(() => {
+    reset()
+  }, [isSubmitSuccessful])
+
   const onSubmit = handleSubmit(async (params) => {
-    const formattedParams = {
-      date: params.date ? new Date(params.date).getTime() : null,
-      value: transaction?.value,
-      companyAmount: transaction?.companyAmount,
-      companyUnits: transaction?.companyUnits,
-      employeeAmount: transaction?.employeeAmount,
-      employeeUnits: transaction?.employeeUnits
+    if (!params.date) {
+      setError('date', { type: 'required' })
+      return
     }
-    // transaction?._id ? await editTransaction(transaction._id, formattedParams as any) : await addTransaction(formattedParams as PensionTransaction)
-    const error = false
-    if (error) {
+    const formattedParams = {
+      date: new Date(params.date).getTime(),
+      value: params.value,
+      companyAmount: params.companyAmount,
+      companyUnits: params.companyUnits,
+      employeeAmount: params.employeeAmount,
+      employeeUnits: params.employeeUnits
+    } as PensionTransaction
+
+    const { error } = transaction?._id ? await editPensionApi(transaction._id, formattedParams) : await addPensionApi(formattedParams)
+
+    if (!error) {
       await mutate(PENSIONS)
       onClose()
     }
@@ -51,16 +60,28 @@ const TransactionModal = ({ show, onClose, transaction, editTransaction, addTran
                       control={control}
             />
             <InputForm id='value' label='Importe Empresa' placeholder='0'
-                       error={!!errors.companyAmount} {...register('companyAmount', { required: true, valueAsNumber: true })}
+                       error={!!errors.companyAmount} {...register('companyAmount', {
+                         required: true,
+                         valueAsNumber: true
+                       })}
                        errorText='Introduce un número válido'/>
             <InputForm id='value' label='Unidades Empresa' placeholder='0'
-                       error={!!errors.companyUnits} {...register('companyUnits', { required: true, valueAsNumber: true })}
+                       error={!!errors.companyUnits} {...register('companyUnits', {
+                         required: true,
+                         valueAsNumber: true
+                       })}
                        errorText='Introduce un número válido'/>
             <InputForm id='value' label='Importe Empleado' placeholder='0'
-                       error={!!errors.employeeAmount} {...register('employeeAmount', { required: true, valueAsNumber: true })}
+                       error={!!errors.employeeAmount} {...register('employeeAmount', {
+                         required: true,
+                         valueAsNumber: true
+                       })}
                        errorText='Introduce un número válido'/>
             <InputForm id='value' label='Unidades Empleado' placeholder='0'
-                       error={!!errors.employeeUnits} {...register('employeeUnits', { required: true, valueAsNumber: true })}
+                       error={!!errors.employeeUnits} {...register('employeeUnits', {
+                         required: true,
+                         valueAsNumber: true
+                       })}
                        errorText='Introduce un número válido'/>
             <InputForm id='value' label='Valor Unidad' placeholder='0'
                        error={!!errors.value} {...register('value', { required: true, valueAsNumber: true })}

diff --git a/packages/client/src/pages/Pensions/index.tsx b/packages/client/src/pages/Pensions/index.tsx
@@ -37,8 +37,6 @@ const Pension = () => {
                 transaction={selectedTransaction}
                 show={Boolean(selectedTransaction)}
                 onClose={() => setSelectedTransaction(undefined)}
-                // editPension={editPension as any}
-                // addPension={addPension}
             />
         </>
   )

diff --git a/packages/client/src/services/apiService.ts b/packages/client/src/services/apiService.ts
@@ -1,6 +1,6 @@
 import axios from 'axios'
 import { ACCOUNTS, BUDGETS, CATEGORIES, PENSIONS, TRANSACTIONS } from 'constants/api-paths'
-import { Category, Transaction, TransactionType, Account, Pension } from 'types'
+import { Category, Transaction, TransactionType, Account, Pension, PensionTransaction } from 'types'
 
 export const editAccount = (id: string, params: {
     name?: string,
@@ -85,16 +85,16 @@ export const deleteTransaction = (id: string): Promise<{ data?: any, error?: str
   return axios.delete(`${TRANSACTIONS}/${id}`).then((data: any) => ({ data: data as Transaction })).catch((error) => ({ error: error.message }))
 }
 
-export const addPensionApi = (params: { amount: number, category: string, account: string }): Promise<{
+export const addPensionApi = (params: PensionTransaction): Promise<{
     data?: any,
     error?: string
 }> => {
   return axios.post(PENSIONS, params).then((data: any) => ({ data: data as Pension })).catch((error) => ({ error: error.message }))
 }
 
-export const editPensionApi = (id: string, params: { amount: number, category: string, account: string }): Promise<{
+export const editPensionApi = (id: string, params: PensionTransaction): Promise<{
     data?: any,
     error?: string
 }> => {
-  return axios.put(PENSIONS, params).then((data: any) => ({ data: data as Pension })).catch((error) => ({ error: error.message }))
+  return axios.put(`${PENSIONS}/${id}`, params).then((data: any) => ({ data: data as Pension })).catch((error) => ({ error: error.message }))
 }