diff --git a/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts b/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts index a2ecdce3..39e9a879 100644 --- a/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts +++ b/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts @@ -12,12 +12,12 @@ type PurchaseRequestFormSchemaType = { value: number; label: string; } | null; - area_id: number; + area_id: number | undefined; location?: { value: number; label: string; } | null; - location_id: number; + location_id: number | undefined; notes: string | null; items: { warehouse?: { @@ -91,17 +91,15 @@ export const PurchaseRequestFormSchema: Yup.ObjectSchema { + const supplier = val as OptionType | null; + const supplierId = Number(supplier?.value); + + formik.setFieldTouched('supplier', true); + formik.setFieldValue('supplier', supplier); + formik.setFieldTouched('supplier_id', true); + formik.setFieldValue('supplier_id', supplierId); + + if (supplierId > 0 && isResponseSuccess(supplierRawData)) { + const supplierData = supplierRawData.data.find( + (s: Supplier) => s.id === supplierId + ); + if (supplierData?.due_date) { + formik.setFieldTouched('credit_term', true); + formik.setFieldValue('credit_term', supplierData.due_date.toString()); + } else { + formik.setFieldTouched('credit_term', false); + formik.setFieldValue('credit_term', ''); + } + } else { + formik.setFieldTouched('credit_term', false); + formik.setFieldValue('credit_term', ''); + } + + if (formik.values.items) { + formik.values.items.forEach((_, idx) => { + formik.setFieldValue(`items.${idx}.product`, null); + formik.setFieldValue(`items.${idx}.product_id`, 0); + formik.setFieldValue(`items.${idx}.qty`, 0); + }); + } + }, + [, supplierRawData] + ); + + const handleAreaChange = useCallback( + (val: OptionType | OptionType[] | null) => { + const area = val as OptionType | null; + formik.setFieldTouched('area_id', true); + formik.setFieldValue('area_id', (area as OptionType)?.value || 0); + formik.setFieldTouched('area', true); + formik.setFieldValue('area', area); + }, + [] + ); + + const handleLocationChange = useCallback( + (val: OptionType | OptionType[] | null) => { + const location = val as OptionType | null; + formik.setFieldTouched('location_id', true); + formik.setFieldValue('location_id', (location as OptionType)?.value || 0); + formik.setFieldTouched('location', true); + formik.setFieldValue('location', location); + }, + [] + ); + + const handleWarehouseChange = useCallback( + (idx: number, val: OptionType | OptionType[] | null) => { + const warehouse = val as OptionType | null; + const warehouseId = (warehouse as OptionType)?.value || 0; + + formik.setFieldTouched(`items.${idx}.warehouse`, true); + formik.setFieldValue(`items.${idx}.warehouse`, warehouse); + formik.setFieldTouched(`items.${idx}.warehouse_id`, true); + formik.setFieldValue(`items.${idx}.warehouse_id`, warehouseId); + }, + [] + ); + // ===== PURCHASE ITEM OPERATIONS ===== const handlePurchaseItemChange = ( idx: number, @@ -381,51 +454,7 @@ const PurchaseRequestForm = ({ label='Vendor' placeholder='Pilih Vendor...' value={formik.values.supplier} - onChange={(val) => { - const supplier = val as OptionType | null; - const supplierId = supplier?.value - ? typeof supplier.value === 'string' - ? parseInt(supplier.value) - : supplier.value - : 0; - - formik.setFieldTouched('supplier_id', true); - formik.setFieldValue('supplier_id', supplierId); - formik.setFieldTouched('supplier', true); - formik.setFieldValue('supplier', supplier); - - if (supplierId > 0 && isResponseSuccess(supplierRawData)) { - const supplierData = supplierRawData.data.find( - (s: Supplier) => s.id === supplierId - ); - if (supplierData?.due_date) { - formik.setFieldTouched('credit_term', true); - formik.setFieldValue( - 'credit_term', - supplierData.due_date.toString() - ); - } - - if (formik.values.items) { - formik.values.items.forEach((_, idx) => { - formik.setFieldValue(`items.${idx}.product`, null); - formik.setFieldValue(`items.${idx}.product_id`, 0); - formik.setFieldValue(`items.${idx}.qty`, 0); - }); - } - } else { - formik.setFieldTouched('credit_term', false); - formik.setFieldValue('credit_term', ''); - - if (formik.values.items) { - formik.values.items.forEach((_, idx) => { - formik.setFieldValue(`items.${idx}.product`, null); - formik.setFieldValue(`items.${idx}.product_id`, 0); - formik.setFieldValue(`items.${idx}.qty`, 0); - }); - } - } - }} + onChange={handleSupplierChange} options={supplierOptions} onInputChange={setSupplierSelectInputValue} isLoading={isLoadingSuppliers} @@ -462,81 +491,27 @@ const PurchaseRequestForm = ({ /> { - const area = val as OptionType | null; - formik.setFieldTouched('area_id', true); - formik.setFieldValue( - 'area_id', - (area as OptionType)?.value || 0 - ); - formik.setFieldTouched('area', true); - formik.setFieldValue('area', area); - - formik.setFieldTouched('location', false); - formik.setFieldValue('location', undefined); - formik.setFieldTouched('location_id', false); - formik.setFieldValue('location_id', 0); - setLocationSelectInputValue(''); - - if (formik.values.items) { - formik.values.items.forEach((_, idx) => { - formik.setFieldValue(`items.${idx}.product`, null); - formik.setFieldValue(`items.${idx}.product_id`, 0); - }); - } - }} + onChange={handleAreaChange} options={areaOptions} onInputChange={setAreaSelectInputValue} isLoading={isLoadingAreas} - isError={ - formik.touched.area_id && Boolean(formik.errors.area_id) - } - errorMessage={formik.errors.area_id as string} isDisabled={type === 'detail'} isClearable /> { - const location = val as OptionType | null; - formik.setFieldTouched('location_id', true); - formik.setFieldValue( - 'location_id', - (location as OptionType)?.value || 0 - ); - formik.setFieldTouched('location', true); - formik.setFieldValue('location', location); - - if (formik.values.items) { - formik.values.items.forEach((_, idx) => { - formik.setFieldValue(`items.${idx}.product`, null); - formik.setFieldValue(`items.${idx}.product_id`, 0); - }); - } - }} + placeholder='Pilih Lokasi...' + value={formik.values.location} + onChange={handleLocationChange} options={locationOptions} onInputChange={setLocationSelectInputValue} isLoading={isLoadingLocations} - isError={ - formik.touched.location_id && - Boolean(formik.errors.location_id) - } - errorMessage={formik.errors.location_id as string} - isDisabled={type === 'detail' || !formik.values.area_id} - isClearable={type !== 'detail' && !!formik.values.area_id} - key={`location-${formik.values.area_id}`} + isDisabled={type === 'detail'} + isClearable={type !== 'detail'} />
@@ -643,40 +618,9 @@ const PurchaseRequestForm = ({ )} { - const warehouse = val as OptionType | null; - const warehouseId = - (warehouse as OptionType)?.value || 0; - - formik.setFieldTouched( - `items.${idx}.warehouse`, - true - ); - formik.setFieldValue( - `items.${idx}.warehouse`, - warehouse - ); - formik.setFieldTouched( - `items.${idx}.warehouse_id`, - true - ); - formik.setFieldValue( - `items.${idx}.warehouse_id`, - warehouseId - ); - - formik.setFieldValue(`items.${idx}.product`, null); - formik.setFieldValue(`items.${idx}.product_id`, 0); - }} + onChange={(val) => handleWarehouseChange(idx, val)} options={warehouseOptions} onInputChange={setWarehouseSelectInputValue} isLoading={isLoadingWarehouses} @@ -687,17 +631,8 @@ const PurchaseRequestForm = ({ isRepeaterInputError(idx, 'warehouse_id') .errorMessage } - isDisabled={ - type === 'detail' || - !formik.values.area_id || - !formik.values.location_id - } - isClearable={ - type !== 'detail' && - !!formik.values.area_id && - !!formik.values.location_id - } - key={`warehouse-${formik.values.area_id}-${formik.values.location_id}`} + isDisabled={type === 'detail'} + isClearable={type !== 'detail'} />