diff --git a/src/components/pages/marketing/DeliveryOrderFormModal.tsx b/src/components/pages/marketing/DeliveryOrderFormModal.tsx
index 24aec35f..f1d5e3cc 100644
--- a/src/components/pages/marketing/DeliveryOrderFormModal.tsx
+++ b/src/components/pages/marketing/DeliveryOrderFormModal.tsx
@@ -408,7 +408,77 @@ const DeliveryOrderFormModal = ({
     },
     [prevButtonHandler]
   );
-  const handleUpdateDO = useCallback(
+
+  const isApprovalStep3Approved = useMemo(() => {
+    return (
+      isResponseSuccess(marketing) &&
+      marketing.data.latest_approval?.step_number === 3 &&
+      marketing.data.latest_approval?.action === 'APPROVED'
+    );
+  }, [marketing]);
+
+  const handleUpdateDOWithAPI = useCallback(
+    async (id: number, values: DeliveryOrderProductFormValues) => {
+      if (!marketingId) {
+        toast.error('Marketing ID tidak ditemukan');
+        return;
+      }
+
+      setIsLoading(true);
+
+      const updatedDeliveryValues = deliveryOrderValues.map((product) =>
+        product.id === id ? { ...product, ...values } : product
+      );
+
+      const payload = {
+        marketing_id: Number(marketingId),
+        delivery_products: updatedDeliveryValues
+          .map((product) => {
+            if (Boolean(product.delivery_date)) {
+              return {
+                marketing_product_id: product.marketing_product_id as number,
+                unit_price: parseFloat(product.unit_price as string),
+                total_weight: parseFloat(product.total_weight as string),
+                qty: parseFloat(product.qty as string),
+                avg_weight: parseFloat(product.avg_weight as string),
+                total_price: parseFloat(product.total_price as string),
+                delivery_date: formatDate(
+                  product.delivery_date as string,
+                  'yyyy-MM-DD'
+                ),
+                vehicle_number: product.vehicle_number,
+              };
+            }
+          })
+          .filter((item) => Boolean(item)),
+      } as UpdateDeliveryOrderPayload;
+
+      const updateDeliveryRes = await DeliveryOrderApi.update(
+        Number(marketingId),
+        payload
+      );
+
+      if (isResponseSuccess(updateDeliveryRes)) {
+        toast.success(updateDeliveryRes?.message as string);
+        closeModalHandler();
+      }
+
+      if (isResponseError(updateDeliveryRes)) {
+        setFormErrorMessage(updateDeliveryRes?.message as string);
+      }
+
+      setIsLoading(false);
+    },
+    [
+      marketingId,
+      deliveryOrderValues,
+      formik.values.sales_order,
+      prevButtonHandler,
+      refreshMarketing,
+    ]
+  );
+
+  const handleUpdateDOLocal = useCallback(
     async (id: number, values: DeliveryOrderProductFormValues) => {
       setDeliveryOrderValues((prev) =>
         prev.map((product) =>
@@ -726,7 +796,12 @@ const DeliveryOrderFormModal = ({
                       exisitingValues={deliveryOrderValues}
                       onSubmitForm={handleAddSubmitDO}
                       initialValues={selectedDeliveryProduct ?? undefined}
-                      onUpdateForm={handleUpdateDO}
+                      onUpdateForm={
+                        isApprovalStep3Approved
+                          ? handleUpdateDOWithAPI
+                          : handleUpdateDOLocal
+                      }
+                      isLoading={isLoading}
                     />
                   )}
                 </div>
diff --git a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx
index d7b97d8e..5736368a 100644
--- a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx
+++ b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx
@@ -36,6 +36,7 @@ const DeliveryOrderProductForm = ({
   exisitingValues,
   onSubmitForm,
   onUpdateForm,
+  isLoading,
 }: {
   formState: 'add' | 'edit';
   salesOrders: BaseSalesOrder[];
@@ -46,6 +47,7 @@ const DeliveryOrderProductForm = ({
     id: number,
     value: DeliveryOrderProductFormValues
   ) => Promise<void>;
+  isLoading?: boolean;
 }) => {
   const [formikErrorMessage, setFormErrorMessage] = useState('');
   const [selectedProduct, setSelectedProduct] = useState<OptionType | null>(
@@ -793,8 +795,8 @@ const DeliveryOrderProductForm = ({
         <div className='absolute sm:w-full bottom-0 right-0 p-4'>
           <Button
             type='submit'
-            isLoading={formik.isSubmitting}
-            disabled={formik.isSubmitting}
+            isLoading={formik.isSubmitting || isLoading}
+            disabled={formik.isSubmitting || isLoading}
             className='w-full p-3 rounded-lg text-base-100 text-sm font-semibold'
           >
             Submit