Merge branch 'development' of gogs.softpar.inf.br:Softpar/sfp_front_vue_diarista_prestador into development

src/api/providerWithdrawal.js

@@ -5,12 +5,17 @@ export const getBalance = async () => {
   return data.payload
 }
 
+export const getWithdrawalFees = async () => {
+  const { data } = await api.get('/provider/withdrawals/fees')
+  return data.payload
+}
+
 export const getWithdrawals = async () => {
   const { data } = await api.get('/provider/withdrawals')
   return data.payload
 }
 
-export const requestWithdrawal = async () => {
-  const { data } = await api.post('/provider/withdrawals')
+export const requestWithdrawal = async (payload = {}) => {
+  const { data } = await api.post('/provider/withdrawals', payload)
   return data.payload
 }

src/components/payments/WithdrawConfirmDialog.vue

@@ -10,11 +10,28 @@
         <div class="text-text text-center font16 fontbold q-mb-xs">
           {{ $t('provider.payments.withdraw_confirm_title') }}
         </div>
-        <div class="withdraw-amount font28 fontbold text-secondary text-center">
-          {{ formatCurrency(amount) }}
+        <div class="withdraw-amount text-secondary text-center">
+          {{ formatCurrency(netAmount) }}
         </div>
-        <div class="text-grey-6 text-center font12 q-mt-xs">
-          {{ $t('provider.payments.withdraw_confirm_message', { amount: formatCurrency(amount) }) }}
+        <div class="withdraw-summary q-mt-md full-width">
+          <div class="row items-center justify-between q-mb-xs">
+            <span class="text-caption text-grey-6">{{ $t('provider.payments.withdraw_gross_amount_label') }}</span>
+            <span class="text-caption text-weight-bold text-text">{{ formatCurrency(grossAmount) }}</span>
+          </div>
+          <div class="row items-center justify-between q-mb-xs">
+            <span class="text-caption text-grey-6">{{ $t('provider.payments.withdraw_fee_label') }}</span>
+            <span class="text-caption text-weight-bold text-negative">
+              {{ formatCurrency(-gatewayFeeAmount) }}
+            </span>
+          </div>
+          <q-separator class="q-my-sm" />
+          <div class="row items-center justify-between">
+            <span class="text-caption text-grey-7 text-weight-bold">{{ $t('provider.payments.withdraw_net_amount_label') }}</span>
+            <span class="text-body2 text-weight-bold">{{ formatCurrency(netAmount) }}</span>
+          </div>
+        </div>
+        <div class="text-caption text-grey-6 text-center q-mt-sm">
+          {{ $t('provider.payments.withdraw_confirm_message') }}
         </div>
       </q-card-section>
 
@@ -48,7 +65,15 @@ import { useDialogPluginComponent } from 'quasar';
 import { formatCurrency } from 'src/helpers/utils';
 
 defineProps({
-  amount: {
+  grossAmount: {
+    type: Number,
+    required: true,
+  },
+  gatewayFeeAmount: {
+    type: Number,
+    required: true,
+  },
+  netAmount: {
     type: Number,
     required: true,
   },
@@ -68,4 +93,10 @@ const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginC
 .withdraw-amount {
   line-height: 1.2;
 }
+
+.withdraw-summary {
+  border: 1px solid rgba(0, 0, 0, 0.08);
+  border-radius: 12px;
+  padding: 10px 12px;
+}
 </style>

src/i18n/locales/en.json

@@ -236,48 +236,6 @@
         }
       }
     },
-    "payments": {
-      "anticipation_available": "Available for anticipation:",
-      "anticipation_fee_label": "Anticipation fee ({percent}%):",
-      "anticipation_total_label": "You will receive",
-      "anticipation_note": "The amount will be credited to your registered bank account.",
-      "anticipation_btn_close": "Close",
-      "anticipation_btn_anticipate": "Anticipate",
-      "anticipation_remind_label": "Remember:",
-      "anticipation_reminder": "The anticipation is processed within 2 business days.",
-      "anticipation_confirm_title": "Confirm anticipation?",
-      "anticipation_confirm_cancel": "Cancel",
-      "anticipation_confirm_ok": "Confirm",
-      "withdraw_confirm_title": "Confirm withdrawal?",
-      "withdraw_confirm_message": "You are about to withdraw {amount}.",
-      "movements_title": "Movements",
-      "mov_servico": "Service",
-      "mov_saque": "Withdrawal",
-      "title": "Payments",
-      "total_earnings_title": "Total earnings",
-      "total_earnings_count": "{count} services completed",
-      "total_earnings_days": "Last {days} days",
-      "available_balance_label": "Available balance",
-      "btn_withdraw": "Withdraw",
-      "available_balance_prefix": "Available for withdrawal via",
-      "available_balance_highlight": "PIX or bank account",
-      "pending_balance_label": "Balance to be released",
-      "pending_balance_desc": "Awaiting payment confirmation",
-      "services_title": "Completed services",
-      "btn_view_movements": "View movements",
-      "services_date_service": "Service:",
-      "services_date_payment": "Payment:",
-      "default_client_name": "Client",
-      "pay_status_pending": "Pending",
-      "pay_status_paid": "Paid",
-      "pay_status_authorized": "Authorized",
-      "pay_status_processing": "Processing",
-      "pay_status_failed": "Failed",
-      "pay_status_cancelled": "Cancelled",
-      "period_week": "Week",
-      "period_month": "Month",
-      "period_year": "Year"
-    },
     "dashboard": {
       "summary": {
         "welcome": "Hello,",
@@ -344,23 +302,6 @@
         "message": "If your request is accepted by the client, you will receive a confirmation and it will appear in your upcoming services.",
         "close": "Close"
       },
-      "agenda": {
-        "title": "Agenda",
-        "upcoming_title": "Upcoming services",
-        "completed_title": "Completed services",
-        "type_custom": "Opportunity",
-        "type_default": "Scheduled",
-        "btn_view_details": "View details",
-        "btn_rate": "Rate",
-        "empty_upcoming": "No scheduled services",
-        "empty_completed": "No completed services",
-        "status_pending": "Pending",
-        "status_accepted": "Accepted",
-        "status_paid": "Paid",
-        "status_started": "In progress",
-        "status_finished": "Completed",
-        "status_cancelled": "Cancelled"
-      },
       "favorites": {
         "title": "Your favorites",
         "view_schedule": "View schedule"
@@ -422,7 +363,72 @@
         "until_8h": "Up to 8h",
         "place_home": "Residential",
         "schedule": "Schedule"
+      },
+      "agenda": {
+        "title": "Agenda",
+        "upcoming_title": "Upcoming services",
+        "completed_title": "Completed services",
+        "type_default": "Appointment",
+        "type_custom": "Custom",
+        "status_pending": "Pending",
+        "status_accepted": "Confirmed",
+        "status_paid": "Confirmed",
+        "status_started": "In progress",
+        "status_finished": "Completed",
+        "status_cancelled": "Cancelled",
+        "btn_view_details": "view details",
+        "btn_rate": "rate",
+        "btn_reschedule": "reschedule",
+        "empty_upcoming": "No scheduled services",
+        "empty_completed": "No completed services"
       }
+    },
+    "payments": {
+      "title": "Payments",
+      "total_earnings_title": "View total earnings",
+      "total_earnings_count": "{count} services completed",
+      "total_earnings_days": "Referring to the last {days} days",
+      "period_week": "week",
+      "period_month": "month",
+      "period_year": "year",
+      "available_balance_label": "Available balance",
+      "available_balance_prefix": "Values are available for withdrawal within",
+      "available_balance_highlight": "5 days after service completion.",
+      "btn_withdraw": "withdraw",
+      "pending_balance_label": "Balance to be released",
+      "pending_balance_desc": "Amount from services awaiting release.",
+      "pending_balance_empty": "No pending payments.",
+      "services_title": "Services",
+      "btn_view_movements": "view movements",
+      "services_date_service": "Service date:",
+      "services_date_payment": "Payment date:",
+      "pay_status_pending": "Pending",
+      "pay_status_paid": "Paid",
+      "pay_status_anticipated": "Anticipated payment",
+      "pay_status_cancelled": "Cancelled service",
+      "btn_anticipate": "anticipate",
+      "movements_title": "Movements",
+      "mov_tarifa": "Platform fee",
+      "mov_saque": "Withdrawal",
+      "mov_servico": "Service",
+      "mov_service_code": "Service code: {id}",
+      "anticipation_available": "Total available:",
+      "anticipation_fee_label": "Anticipation fee ({percent}%)*:",
+      "anticipation_total_label": "Total to be paid using anticipation:",
+      "anticipation_note": "*The anticipation fee is charged by the payment system. The Diária app has no participation in this operation.",
+      "anticipation_remind_label": "Remember:",
+      "anticipation_reminder": "You can wait for the expected payment date for this service and avoid the fee charged by anticipation.",
+      "anticipation_btn_close": "close",
+      "anticipation_btn_anticipate": "anticipate",
+      "anticipation_confirm_title": "Are you sure you want to anticipate this payment?",
+      "anticipation_confirm_cancel": "cancel",
+      "anticipation_confirm_ok": "confirm",
+      "default_client_name": "Client",
+      "withdraw_confirm_title": "Confirm withdrawal",
+      "withdraw_confirm_message": "Do you want to confirm the withdrawal to your account?",
+      "withdraw_gross_amount_label": "Available balance",
+      "withdraw_fee_label": "Transfer fee",
+      "withdraw_net_amount_label": "Amount you will receive"
     }
   },
   "business": {

src/i18n/locales/es.json

@@ -236,48 +236,6 @@
         }
       }
     },
-    "payments": {
-      "anticipation_available": "Disponible para anticipación:",
-      "anticipation_fee_label": "Tarifa de anticipación ({percent}%):",
-      "anticipation_total_label": "Recibirás",
-      "anticipation_note": "El monto se acreditará en su cuenta bancaria registrada.",
-      "anticipation_btn_close": "Cerrar",
-      "anticipation_btn_anticipate": "Anticipar",
-      "anticipation_remind_label": "Recuerde:",
-      "anticipation_reminder": "La anticipación se procesa en hasta 2 días hábiles.",
-      "anticipation_confirm_title": "¿Confirmar anticipación?",
-      "anticipation_confirm_cancel": "Cancelar",
-      "anticipation_confirm_ok": "Confirmar",
-      "withdraw_confirm_title": "¿Confirmar retiro?",
-      "withdraw_confirm_message": "Está a punto de retirar {amount}.",
-      "movements_title": "Movimientos",
-      "mov_servico": "Servicio",
-      "mov_saque": "Retiro",
-      "title": "Pagos",
-      "total_earnings_title": "Total ganado",
-      "total_earnings_count": "{count} servicios realizados",
-      "total_earnings_days": "Últimos {days} días",
-      "available_balance_label": "Saldo disponible",
-      "btn_withdraw": "Retirar",
-      "available_balance_prefix": "Disponible para retiro vía",
-      "available_balance_highlight": "PIX o cuenta bancaria",
-      "pending_balance_label": "Saldo por liberar",
-      "pending_balance_desc": "En espera de confirmación de pago",
-      "services_title": "Servicios realizados",
-      "btn_view_movements": "Ver movimientos",
-      "services_date_service": "Servicio:",
-      "services_date_payment": "Pago:",
-      "default_client_name": "Cliente",
-      "pay_status_pending": "Pendiente",
-      "pay_status_paid": "Pagado",
-      "pay_status_authorized": "Autorizado",
-      "pay_status_processing": "Procesando",
-      "pay_status_failed": "Fallido",
-      "pay_status_cancelled": "Cancelado",
-      "period_week": "Semana",
-      "period_month": "Mes",
-      "period_year": "Año"
-    },
     "dashboard": {
       "summary": {
         "welcome": "Hola,",
@@ -344,23 +302,6 @@
         "message": "Si su solicitud es aceptada por el cliente, recibirá una confirmación y aparecerá en sus próximos servicios.",
         "close": "Cerrar"
       },
-      "agenda": {
-        "title": "Agenda",
-        "upcoming_title": "Próximos servicios",
-        "completed_title": "Servicios realizados",
-        "type_custom": "Oportunidad",
-        "type_default": "Agendado",
-        "btn_view_details": "Ver detalles",
-        "btn_rate": "Evaluar",
-        "empty_upcoming": "Ningún servicio agendado",
-        "empty_completed": "Ningún servicio realizado",
-        "status_pending": "Pendiente",
-        "status_accepted": "Aceptado",
-        "status_paid": "Pagado",
-        "status_started": "En progreso",
-        "status_finished": "Completado",
-        "status_cancelled": "Cancelado"
-      },
       "favorites": {
         "title": "Tus favoritos",
         "view_schedule": "Ver agenda"
@@ -422,7 +363,72 @@
         "until_8h": "Hasta 8h",
         "place_home": "Residencial",
         "schedule": "Agendar"
+      },
+      "agenda": {
+        "title": "Agenda",
+        "upcoming_title": "Próximos servicios",
+        "completed_title": "Servicios completados",
+        "type_default": "Agendamiento",
+        "type_custom": "A medida",
+        "status_pending": "Pendiente",
+        "status_accepted": "Confirmado",
+        "status_paid": "Confirmado",
+        "status_started": "En progreso",
+        "status_finished": "Completado",
+        "status_cancelled": "Cancelado",
+        "btn_view_details": "ver detalles",
+        "btn_rate": "evaluar",
+        "btn_reschedule": "reprogramar",
+        "empty_upcoming": "Sin servicios programados",
+        "empty_completed": "Sin servicios completados"
       }
+    },
+    "payments": {
+      "title": "Pagos",
+      "total_earnings_title": "Ver ganancias totales",
+      "total_earnings_count": "{count} servicios realizados",
+      "total_earnings_days": "Referente a los últimos {days} días",
+      "period_week": "semana",
+      "period_month": "mes",
+      "period_year": "año",
+      "available_balance_label": "Saldo disponible",
+      "available_balance_prefix": "Los valores están disponibles para retiro en hasta",
+      "available_balance_highlight": "5 días después de la conclusión del servicio.",
+      "btn_withdraw": "retirar",
+      "pending_balance_label": "Saldo a liberar",
+      "pending_balance_desc": "Monto de servicios esperando liberación.",
+      "pending_balance_empty": "Ningún pago pendiente.",
+      "services_title": "Servicios",
+      "btn_view_movements": "ver movimientos",
+      "services_date_service": "Fecha del servicio:",
+      "services_date_payment": "Fecha de pago:",
+      "pay_status_pending": "Pendiente",
+      "pay_status_paid": "Pagado",
+      "pay_status_anticipated": "Pago anticipado",
+      "pay_status_cancelled": "Servicio cancelado",
+      "btn_anticipate": "anticipar",
+      "movements_title": "Movimientos",
+      "mov_tarifa": "Tarifa de plataforma",
+      "mov_saque": "Retiro",
+      "mov_servico": "Servicio",
+      "mov_service_code": "Cód. del servicio: {id}",
+      "anticipation_available": "Total disponible:",
+      "anticipation_fee_label": "Tasa de anticipación ({percent}%)*:",
+      "anticipation_total_label": "Total a pagar usando la anticipación:",
+      "anticipation_note": "*La tasa de anticipación es cobrada por el sistema de pago. La aplicación Diária no participa en esta operación.",
+      "anticipation_remind_label": "Recuerda:",
+      "anticipation_reminder": "Puede esperar la fecha de pago prevista para este servicio y evitar la tarifa cobrada por la anticipación.",
+      "anticipation_btn_close": "cerrar",
+      "anticipation_btn_anticipate": "anticipar",
+      "anticipation_confirm_title": "¿Está seguro de que desea anticipar este pago?",
+      "anticipation_confirm_cancel": "cancelar",
+      "anticipation_confirm_ok": "confirmar",
+      "default_client_name": "Cliente",
+      "withdraw_confirm_title": "Confirmar retiro",
+      "withdraw_confirm_message": "¿Desea confirmar el retiro a su cuenta?",
+      "withdraw_gross_amount_label": "Saldo disponible",
+      "withdraw_fee_label": "Tarifa de transferencia",
+      "withdraw_net_amount_label": "Monto que recibirá"
     }
   },
   "business": {

src/i18n/locales/pt.json

@@ -236,48 +236,6 @@
         }
       }
     },
-    "payments": {
-      "anticipation_available": "Disponível para antecipação:",
-      "anticipation_fee_label": "Taxa de antecipação ({percent}%):",
-      "anticipation_total_label": "Você vai receber",
-      "anticipation_note": "O valor será creditado em sua conta bancária cadastrada.",
-      "anticipation_btn_close": "Fechar",
-      "anticipation_btn_anticipate": "Antecipar",
-      "anticipation_remind_label": "Lembre-se:",
-      "anticipation_reminder": "A antecipação é processada em até 2 dias úteis.",
-      "anticipation_confirm_title": "Confirmar antecipação?",
-      "anticipation_confirm_cancel": "Cancelar",
-      "anticipation_confirm_ok": "Confirmar",
-      "withdraw_confirm_title": "Confirmar saque?",
-      "withdraw_confirm_message": "Você está prestes a sacar {amount}.",
-      "movements_title": "Movimentações",
-      "mov_servico": "Serviço",
-      "mov_saque": "Saque",
-      "title": "Pagamentos",
-      "total_earnings_title": "Total ganho",
-      "total_earnings_count": "{count} serviços realizados",
-      "total_earnings_days": "Últimos {days} dias",
-      "available_balance_label": "Saldo disponível",
-      "btn_withdraw": "Sacar",
-      "available_balance_prefix": "Disponível para saque via",
-      "available_balance_highlight": "PIX ou conta bancária",
-      "pending_balance_label": "Saldo a liberar",
-      "pending_balance_desc": "Aguardando confirmação de pagamento",
-      "services_title": "Serviços realizados",
-      "btn_view_movements": "Ver movimentações",
-      "services_date_service": "Serviço:",
-      "services_date_payment": "Pagamento:",
-      "default_client_name": "Cliente",
-      "pay_status_pending": "Pendente",
-      "pay_status_paid": "Pago",
-      "pay_status_authorized": "Autorizado",
-      "pay_status_processing": "Processando",
-      "pay_status_failed": "Falhou",
-      "pay_status_cancelled": "Cancelado",
-      "period_week": "Semana",
-      "period_month": "Mês",
-      "period_year": "Ano"
-    },
     "dashboard": {
       "summary": {
         "welcome": "Olá,",
@@ -344,23 +302,6 @@
         "message": "Se seu pedido for aceito pelo cliente, você receberá um aviso confirmando o agendamento e aparecerá nos seus próximos serviços.",
         "close": "Fechar"
       },
-      "agenda": {
-        "title": "Agenda",
-        "upcoming_title": "Próximos serviços",
-        "completed_title": "Serviços realizados",
-        "type_custom": "Sob Medida",
-        "type_default": "Agendamento",
-        "btn_view_details": "Ver detalhes",
-        "btn_rate": "Avaliar",
-        "empty_upcoming": "Nenhum serviço agendado",
-        "empty_completed": "Nenhum serviço realizado",
-        "status_pending": "Pendente",
-        "status_accepted": "Aceito",
-        "status_paid": "Pago",
-        "status_started": "Em andamento",
-        "status_finished": "Concluído",
-        "status_cancelled": "Cancelado"
-      },
       "favorites": {
         "title": "Seus favoritos",
         "view_schedule": "Ver agenda"
@@ -422,7 +363,75 @@
         "until_8h": "Até 8h",
         "place_home": "Residencial",
         "schedule": "Agendar"
+      },
+      "agenda": {
+        "title": "Agenda",
+        "upcoming_title": "Próximos serviços",
+        "completed_title": "Serviços concluídos",
+        "type_default": "Agendamento",
+        "type_custom": "Sob Medida",
+        "status_pending": "Pendente",
+        "status_accepted": "Confirmado",
+        "status_paid": "Confirmado",
+        "status_started": "Em andamento",
+        "status_finished": "Concluído",
+        "status_cancelled": "Cancelado",
+        "btn_view_details": "ver detalhes",
+        "btn_rate": "avaliar",
+        "btn_reschedule": "reagendar",
+        "empty_upcoming": "Nenhum serviço agendado",
+        "empty_completed": "Nenhum serviço concluído"
       }
+    },
+    "payments": {
+      "title": "Pagamentos",
+      "total_earnings_title": "Ver ganhos totais",
+      "total_earnings_count": "{count} serviços realizados",
+      "total_earnings_days": "Valores referentes aos últimos {days} dias",
+      "period_week": "semana",
+      "period_month": "mês",
+      "period_year": "ano",
+      "available_balance_label": "Saldo disponível",
+      "available_balance_prefix": "Os valores ficam disponíveis para saque em até",
+      "available_balance_highlight": "5 dias após a conclusão do serviço.",
+      "btn_withdraw": "sacar",
+      "pending_balance_label": "Saldo a liberar",
+      "pending_balance_desc": "Valor de serviços aguardando liberação.",
+      "pending_balance_empty": "Nenhum pagamento pendente.",
+      "services_title": "Serviços",
+      "btn_view_movements": "ver movimentações",
+      "services_date_service": "Data do serviço:",
+      "services_date_payment": "Data do pagamento:",
+      "pay_status_pending": "Pendente",
+      "pay_status_paid": "Pago",
+      "pay_status_authorized": "Autorizado",
+      "pay_status_processing": "Processando",
+      "pay_status_failed": "Falhou",
+      "pay_status_anticipated": "Pago antecipado",
+      "pay_status_cancelled": "Serviço cancelado",
+      "btn_anticipate": "antecipar",
+      "movements_title": "Movimentações",
+      "mov_tarifa": "Tarifa da plataforma",
+      "mov_saque": "Saque",
+      "mov_servico": "Serviço",
+      "mov_service_code": "Cód. do serviço: {id}",
+      "anticipation_available": "Total disponível:",
+      "anticipation_fee_label": "Taxa de antecipação ({percent}%)*:",
+      "anticipation_total_label": "Total a ser pago utilizando a antecipação:",
+      "anticipation_note": "*A taxa de antecipação é cobrada pelo sistema de pagamento. O aplicativo Diária não tem participação nessa operação.",
+      "anticipation_remind_label": "Lembre-se:",
+      "anticipation_reminder": "Você pode aguardar a data prevista do pagamento deste serviço e evitar a taxa cobrada pela antecipação.",
+      "anticipation_btn_close": "fechar",
+      "anticipation_btn_anticipate": "antecipar",
+      "anticipation_confirm_title": "Tem certeza que deseja antecipar esse pagamento?",
+      "anticipation_confirm_cancel": "cancelar",
+      "anticipation_confirm_ok": "confirmar",
+      "default_client_name": "Cliente",
+      "withdraw_confirm_title": "Confirmar saque",
+      "withdraw_confirm_message": "Deseja confirmar o saque para sua conta?",
+      "withdraw_gross_amount_label": "Saldo disponível",
+      "withdraw_fee_label": "Taxa de transferência",
+      "withdraw_net_amount_label": "Valor que você receberá"
     }
   },
   "business": {

src/pages/LoginPage.vue

@@ -130,13 +130,20 @@ const stepFiveForm = ref({
 });
 
 const stepSixForm = ref({
+  account_type: 'checking',
+  bank: '',
+  branch_number: '',
+  branch_check_digit: '',
+  account_number: '',
+  account_check_digit: '',
+  pix_key: '',
   working_days: {},
 });
 
 const actionLabel = computed(() => {
   if (steps.value === 1) return t('provider.login.steps.step_1.action');
   if (steps.value === 2) return t('provider.login.steps.step_2.action');
-  if (steps.value === 6) return t('provider.login.steps.step_6.action');
+  if (steps.value === 7) return t('provider.login.steps.step_6.action');
   return t('provider.login.steps.step_3.action');
 });
 
@@ -188,7 +195,7 @@ const validateCurrentStep = async () => {
     }
   }
 
-  if (steps.value === 6 && !hasWorkingDaySelected()) {
+  if (steps.value === 7 && !hasWorkingDaySelected()) {
     $q.notify({
       type: 'negative',
       message: t('provider.login.steps.step_6.select_at_least_one'),
@@ -326,6 +333,12 @@ const onSubmit = async () => {
         break;
       }
       case 6: {
+        if (await validateCurrentStep()) {
+          steps.value = 7;
+        }
+        break;
+      }
+      case 7: {
         if (await validateCurrentStep()) {
           await registerUserAndProvider();
         }

src/pages/payments/PaymentsPage.vue

@@ -72,7 +72,7 @@
               class="btn-withdraw font13 fontbold"
               :label="$t('provider.payments.btn_withdraw')"
               :loading="withdrawLoading"
-              :disable="saldoDisponivel <= 0 || withdrawLoading"
+              :disable="!canWithdraw"
               @click="onSacar"
             />
           </div>
@@ -165,12 +165,12 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue';
+import { computed, ref, onMounted } from 'vue';
 import { useQuasar } from 'quasar';
 import { useI18n } from 'vue-i18n';
 import { formatCurrency } from 'src/helpers/utils';
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
-import { getBalance, requestWithdrawal } from 'src/api/providerWithdrawal';
+import { getBalance, getWithdrawalFees, requestWithdrawal } from 'src/api/providerWithdrawal';
 import { getPaymentSplits } from 'src/api/paymentSplit';
 import MovimentacoesDialog from 'src/components/payments/MovimentacoesDialog.vue';
 import WithdrawConfirmDialog from 'src/components/payments/WithdrawConfirmDialog.vue';
@@ -205,6 +205,7 @@ const earningsByPeriod = ref({
 
 const saldoDisponivel = ref(0);
 const saldoALiberar = ref(0);
+const paymentTransferFeeAmount = ref(3.67);
 const services = ref([]);
 
 const parseAmount = (value) => {
@@ -212,6 +213,18 @@ const parseAmount = (value) => {
   return Number.isFinite(amount) ? amount : 0;
 };
 
+const roundMoney = (value) => Math.round((parseAmount(value) + Number.EPSILON) * 100) / 100;
+
+const withdrawalNetAmount = computed(() => (
+  Math.max(0, roundMoney(saldoDisponivel.value - paymentTransferFeeAmount.value))
+));
+
+const canWithdraw = computed(() => (
+  saldoDisponivel.value > 0
+  && withdrawalNetAmount.value > 0
+  && !withdrawLoading.value
+));
+
 const splitAmount = (split) => (
   parseAmount(split.provider_amount ?? split.net_amount ?? split.gross_amount)
 );
@@ -263,9 +276,10 @@ const sumSplits = (splits, predicate) => (
 const loadData = async () => {
   servicesLoading.value = true;
   try {
-    const [balance, splits] = await Promise.all([
+    const [balance, splits, fees] = await Promise.all([
       getBalance(),
       getPaymentSplits(),
+      loadWithdrawalFees(),
     ]);
     const paymentSplits = splits || [];
     const availableFromSplits = sumSplits(paymentSplits, isSplitAvailable);
@@ -276,6 +290,12 @@ const loadData = async () => {
 
     saldoDisponivel.value = parseAmount(balance?.available) || availableFromSplits;
     saldoALiberar.value = parseAmount(balance?.pending) || pendingFromSplits;
+    paymentTransferFeeAmount.value = parseAmount(
+      fees?.payment_transfer_fee_amount
+      ?? fees?.gateway_fee_amount
+      ?? fees?.fee_amount
+      ?? fees?.amount
+    ) || paymentTransferFeeAmount.value;
 
     services.value = paymentSplits.map((s) => ({
       id: s.id,
@@ -297,14 +317,34 @@ const loadData = async () => {
   }
 };
 
+const loadWithdrawalFees = async () => {
+  try {
+    return await getWithdrawalFees();
+  } catch {
+    return { payment_transfer_fee_amount: paymentTransferFeeAmount.value };
+  }
+};
+
 const onSacar = () => {
+  const grossAmount = roundMoney(saldoDisponivel.value);
+  const gatewayFeeAmount = roundMoney(paymentTransferFeeAmount.value);
+  const netAmount = roundMoney(withdrawalNetAmount.value);
+
   $q.dialog({
     component: WithdrawConfirmDialog,
-    componentProps: { amount: saldoDisponivel.value },
+    componentProps: {
+      grossAmount,
+      gatewayFeeAmount,
+      netAmount,
+    },
   }).onOk(async () => {
     withdrawLoading.value = true;
     try {
-      await requestWithdrawal();
+      await requestWithdrawal({
+        gross_amount: grossAmount,
+        gateway_fee_amount: gatewayFeeAmount,
+        net_amount: netAmount,
+      });
       saldoDisponivel.value = 0;
       // notification handled by axios interceptor
     } catch (error) {