.

modules/customer-invoices/src/web/proformas/update/ui/editors/proforma-update-editor-form.tsx

@@ -39,26 +39,24 @@ export const ProformaUpdateEditorForm = ({
   const { t } = useTranslation();
 
   return (
-    <form onSubmit={onSubmit}>
+    <form className="space-y-6" onSubmit={onSubmit}>
-      <div className="space-y-6">
+      <ProformaUpdateHeaderEditor disabled={isSubmitting} />
-        <ProformaUpdateHeaderEditor disabled={isSubmitting} />
 
-        <ProformaUpdateRecipientEditor
+      <ProformaUpdateRecipientEditor
-          disabled={isSubmitting}
+        disabled={isSubmitting}
-          onChangeCustomerClick={onChangeCustomerClick}
+        onChangeCustomerClick={onChangeCustomerClick}
-          onCreateCustomerClick={onCreateCustomerClick}
+        onCreateCustomerClick={onCreateCustomerClick}
-          selectedCustomer={selectedCustomer}
+        selectedCustomer={selectedCustomer}
-        />
+      />
 
-        <div className="flex flex-col-reverse gap-3 border-t pt-4 sm:flex-row sm:justify-end">
+      <div className="flex flex-col-reverse gap-3 border-t pt-4 sm:flex-row sm:justify-end">
-          <Button disabled={isSubmitting} onClick={onReset} type="button" variant="outline">
+        <Button disabled={isSubmitting} onClick={onReset} type="button" variant="outline">
-            {t("common.reset", "Restablecer")}
+          {t("common.reset", "Restablecer")}
-          </Button>
+        </Button>
 
-          <Button disabled={isSubmitting} type="submit">
+        <Button disabled={isSubmitting} type="submit">
-            {isSubmitting ? t("common.saving", "Guardando...") : t("common.save", "Guardar")}
+          {isSubmitting ? t("common.saving", "Guardando...") : t("common.save", "Guardar")}
-          </Button>
+        </Button>
-        </div>
       </div>
     </form>
   );

modules/customer-invoices/src/web/proformas/update/ui/editors/proforma-update-header-editor.tsx

@@ -22,40 +22,50 @@ export const ProformaUpdateHeaderEditor = ({
       <ProformaHeaderFormGrid>
         <SelectField
           className="md:col-span-2"
+          disabled={disabled}
           label={t("form_fields.proformas.series.label")}
           name="series"
           placeholder={t("form_fields.proformas.series.placeholder")}
+          readOnly={readOnly}
         />
 
         <DatePickerField
           className="md:col-span-3"
+          disabled={disabled}
           label={t("form_fields.proformas.invoice_date.label")}
-          name="invoice_date"
+          name="invoiceDate"
           placeholder={t("form_fields.proformas.invoice_date.placeholder")}
+          readOnly={readOnly}
           required
         />
 
         <DatePickerField
           className="md:col-span-3"
+          disabled={disabled}
           label={t("form_fields.proformas.operation_date.label")}
-          name="operation_date"
+          name="operationDate"
           placeholder={t("form_fields.proformas.operation_date.placeholder")}
+          readOnly={readOnly}
         />
 
         <TextField
           className="md:col-span-4"
+          disabled={disabled}
           label={t("form_fields.proformas.reference.label")}
           maxLength={256}
           name="reference"
           placeholder={t("form_fields.proformas.reference.placeholder")}
+          readOnly={readOnly}
         />
 
         <TextField
           className="md:col-span-12"
+          disabled={disabled}
           label={t("form_fields.proformas.description.label")}
           maxLength={256}
           name="description"
           placeholder={t("form_fields.proformas.description.placeholder")}
+          readOnly={readOnly}
         />
       </ProformaHeaderFormGrid>
     </ProformaSectionCard>