feat(web): gastos adicionales de los documentos de ventas y compras como tabla de varias filas (antes solo el flete)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

apps/web/src/app/features/documents/document-form.page.html

@@ -198,25 +198,21 @@
         <sbo-input readonly ariaLabel="Número del documento" [value]="str(doc()?.['DocNum'])" />
       </sbo-field>
     }
-    @case ('freight') {
-      <sbo-field [label]="f.label">
-        <sbo-select
-          width="150px"
-          ariaLabel="Gasto adicional del flete"
-          placeholder=""
-          [options]="expenseOptions()"
-          [readonly]="readOnly() || !freightEditable() || locked(f)"
-          [value]="str(header()['FreightExpense']) || defaultExpense() || null"
-          (valueChange)="setHeader('FreightExpense', $event ?? '')"
+    @case ('expenses') {
+      <div class="exp">
+        <h3>{{ f.label }}</h3>
+        <sbo-rows-table
+          [columns]="expenseColumns"
+          [rows]="expenses()"
+          (rowsChange)="setExpenses($event)"
+          [readonly]="readOnly() || locked(f)"
+          [removable]="!readOnly() && !locked(f)"
+          emptyText="Sin gastos adicionales."
         />
-        <sbo-number
-          ariaLabel="Importe del flete"
-          [decimals]="2"
-          [readonly]="readOnly() || !freightEditable() || locked(f)"
-          [value]="+str(header()['FreightAmount'])"
-          (valueChange)="setHeader('FreightAmount', $event ?? 0)"
-        />
-      </sbo-field>
+        @if (!readOnly() && !locked(f)) {
+          <p class="addrow"><button type="button" class="btn" (click)="addExpense()">+ Añadir gasto</button></p>
+        }
+      </div>
     }
     @case ('computed') {
       <sbo-text-field [label]="f.label" readonly [value]="computedValue(f.source)" />