psp_panel/src/app/shared/components/posPayment/gold-form.component.html

<div class="form-group">
  <form [formGroup]="form">
    <app-price-input [control]="form.controls.unit_price" name="unit_price" label="مبلغ واحد" />
    <app-input [control]="form.controls.quantity" name="quantity" label="مقدار" type="number" suffix="گرم" />
    <app-enum-select [control]="form.controls.payload.controls.karat" type="goldKarat" name="karat" />

    <app-amount-percentage-input
      [percentageControl]="form.controls.payload.controls.wages_percentage"
      [amountControl]="form.controls.payload.controls.wages"
      [baseAmount]="unitWithQuantity()"
      [minAmount]="0"
      [maxAmount]="unitWithQuantity()"
      name="wages"
      label="اجرت" />

    <app-amount-percentage-input
      [percentageControl]="form.controls.payload.controls.commission_percentage"
      [amountControl]="form.controls.payload.controls.commission"
      [baseAmount]="unitWithQuantity()"
      [minAmount]="0"
      [maxAmount]="unitWithQuantity()"
      name="commission"
      label="حق‌العمل" />
    <app-amount-percentage-input
      [percentageControl]="form.controls.payload.controls.profit_percentage"
      [amountControl]="form.controls.payload.controls.profit"
      [baseAmount]="totalAmountBeforeProfit()"
      [minAmount]="0"
      [maxAmount]="totalAmountBeforeProfit()"
      name="profit"
      label="سود" />
  </form>

  <app-amount-percentage-input
    [percentageControl]="form.controls.discount_percentage"
    [amountControl]="form.controls.discount_amount"
    [baseAmount]="baseAmountForDiscountCalculation()"
    [minAmount]="0"
    [maxAmount]="baseAmountForDiscountCalculation()"
    name="discount_amount"
    label="تخفیف">
    <ng-template #labelSuffix>
      <p-selectButton
        [options]="discountTypeItems"
        [(ngModel)]="form.controls.payload.controls.discount_type.value"
        [allowEmpty]="false"
        optionLabel="name"
        optionValue="id"
        (onChange)="changeDiscountCalculation($event)" />
    </ng-template>
  </app-amount-percentage-input>

  <hr />
  <div class="flex w-full flex-col justify-center gap-4">
    <shared-calculated-amount-card
      [totalAmount]="totalAmount()"
      [baseTotalAmount]="baseTotalAmount()"
      [discountAmount]="form.controls.discount_amount.value || 0"
      [taxAmount]="taxAmount()" />
    <button pButton class="w-full sm:w-auto" (click)="submit()">{{ preparedCTAText() }}</button>
  </div>
</div>