refactor: :recycle: formatting currency

formatting currency

src/pages/dashboard/DashboardPage.vue

@@ -104,7 +104,7 @@
                                 {{ schedule.period_type }} {{ $t('schedules.hours') }}
                               </q-item-label>
                               <q-item-label caption class="text-positive text-weight-bold">
-                                {{ formatCurrency(schedule.total_amount) }}
+                                {{ formatToBRLCurrency(schedule.total_amount) }}
                               </q-item-label>
                             </q-item-section>
 
@@ -194,7 +194,7 @@
                                 {{ schedule.period_type }} {{ $t('schedules.hours') }}
                               </q-item-label>
                               <q-item-label caption class="text-positive text-weight-bold">
-                                {{ formatCurrency(schedule.total_amount) }}
+                                {{ formatToBRLCurrency(schedule.total_amount) }}
                               </q-item-label>
                             </q-item-section>
 
@@ -302,7 +302,7 @@
                                 {{ schedule.period_type }} {{ $t('schedules.hours') }}
                               </q-item-label>
                               <q-item-label caption class="text-positive text-weight-bold">
-                                {{ formatCurrency(schedule.total_amount) }}
+                                {{ formatToBRLCurrency(schedule.total_amount) }}
                               </q-item-label>
                             </q-item-section>
 
@@ -399,7 +399,7 @@
                                 {{ schedule.period_type }} {{ $t('schedules.hours') }}
                               </q-item-label>
                               <q-item-label caption class="text-positive text-weight-bold">
-                                {{ formatCurrency(schedule.total_amount) }}
+                                {{ formatToBRLCurrency(schedule.total_amount) }}
                               </q-item-label>
                             </q-item-section>
 
@@ -471,6 +471,7 @@ import { getSchedulesGroupedByClient, getSchedulesGroupedByClientCustom, updateS
 import { getProvidersProposalsAndOpportunities } from 'src/api/customSchedule'
 import ProviderSelect from 'src/components/provider/ProviderSelect.vue'
 import DefaultTable from 'src/components/defaults/DefaultTable.vue'
+import { formatToBRLCurrency } from 'src/helpers/utils'
 
 const $q = useQuasar()
 const { t } = useI18n()
@@ -573,11 +574,6 @@ const proposalColumns = computed(() => [
   }
 ])
 
-const formatCurrency = (value) => {
-  if (!value) return 'R$ 0,00'
-  return `R$ ${Number(value).toFixed(2).replace('.', ',')}`
-}
-
 const getStatusColor = (status) => {
   const colors = {
     pending: 'warning',

src/pages/opportunity/CustomSchedulesPage.vue

@@ -27,8 +27,8 @@
 
     <template #body-cell-price_range="template_props">
       <q-td :props="template_props">
-        {{ formatCurrency(template_props.row.min_price) }}
-        {{ formatCurrency(template_props.row.max_price) }}
+        {{ formatToBRLCurrency(template_props.row.min_price) }}
+        {{ formatToBRLCurrency(template_props.row.max_price) }}
       </q-td>
     </template>
 
@@ -47,6 +47,7 @@ import { useQuasar } from 'quasar'
 import { getCustomSchedules, deleteCustomSchedule } from 'src/api/customSchedule'
 import DefaultTable from 'src/components/defaults/DefaultTable.vue'
 import AddEditCustomScheduleDialog from './components/AddEditCustomScheduleDialog.vue'
+import { formatToBRLCurrency } from 'src/helpers/utils'
 
 const { t } = useI18n()
 const $q = useQuasar()
@@ -58,7 +59,7 @@ const columns = computed(() => [
     name: 'id',
     label: 'ID',
     align: 'left',
-    field: 'id',
+    field: row => row.schedule?.id,
     sortable: true
   },
   {
@@ -86,21 +87,21 @@ const columns = computed(() => [
     name: 'period',
     label: t('opportunities.period'),
     align: 'center',
-    field: row => row.schedule?.period_type,
+    field: row => row.schedule?.period_type + ' h',
     sortable: true
   },
   {
     name: 'price_range',
     label: t('opportunities.price_range'),
     align: 'right',
-    field: row => `${row.min_price} - ${row.max_price}`,
+    field: row => `${formatToBRLCurrency(row.min_price)} - ${formatToBRLCurrency(row.max_price)}`,
     sortable: false
   },
   {
     name: 'status',
     label: t('common.terms.status'),
     align: 'center',
-    field: row => row.schedule?.status,
+    field: row => t(`schedules.statuses.${row.schedule?.status}`),
     sortable: true
   },
   {
@@ -124,13 +125,6 @@ const getStatusColor = (status) => {
   return colors[status] || 'grey'
 }
 
-const formatCurrency = (value) => {
-  return new Intl.NumberFormat('pt-BR', {
-    style: 'currency',
-    currency: 'BRL'
-  }).format(value)
-}
-
 const onAddItem = () => {
   $q.dialog({
     component: AddEditCustomScheduleDialog,

src/pages/opportunity/components/ViewCustomScheduleDialog.vue

@@ -63,14 +63,14 @@
           <div class="col-12">
             <div class="text-caption text-grey-7">{{ $t('opportunities.price_range') }}</div>
             <div class="text-body1">
-              {{ formatCurrency(schedule.custom_schedule?.min_price) }} {{ $t('schedules.to') }} {{ formatCurrency(schedule.custom_schedule?.max_price) }}
+              {{ formatToBRLCurrency(schedule.custom_schedule?.min_price) }} {{ $t('schedules.to') }} {{ formatToBRLCurrency(schedule.custom_schedule?.max_price) }}
             </div>
           </div>
 
           <div class="col-12 col-md-6">
             <div class="text-caption text-grey-7">{{ $t('schedules.total_amount') }}</div>
             <div class="text-h6 text-positive">
-              {{ formatCurrency(schedule.total_amount) }}
+              {{ formatToBRLCurrency(schedule.total_amount) }}
             </div>
           </div>
 
@@ -217,7 +217,7 @@
           @click="handleMarkAsPaid"
         />
         <q-btn
-          v-if="schedule?.status === 'paid' && viewMode == 'provider'"
+          v-if="(schedule?.status === 'paid' || schedule?.status === 'started' ) && viewMode == 'provider'"
           unelevated
           :label="$t('schedules.fill_code')"
           color="secondary"
@@ -235,6 +235,7 @@ import { useI18n } from 'vue-i18n'
 import DefaultDialogHeader from 'src/components/defaults/DefaultDialogHeader.vue'
 import { getOpportunityProposals, proposeOpportunity, acceptProposal, refuseProposal, verifyScheduleCode, refuseOpportunity } from 'src/api/customSchedule'
 import { updateScheduleStatus } from 'src/api/schedule'
+import { formatToBRLCurrency } from 'src/helpers/utils'
 
 const props = defineProps({
   schedule: {
@@ -379,11 +380,6 @@ const formatAddress = (address) => {
   return `${address.address}${address.complement ? ', ' + address.complement : ''}, ${address.city?.name ?? address.city} - ${address.state?.name ?? address.state}, CEP: ${address.zip_code}`
 }
 
-const formatCurrency = (value) => {
-  if (!value) return 'R$ 0,00'
-  return `R$ ${Number(value).toFixed(2).replace('.', ',')}`
-}
-
 const getStatusColor = (status) => {
   const colors = {
     pending: 'warning',

src/pages/schedule/components/SchedulesPanel.vue

@@ -33,7 +33,7 @@
 
     <template #body-cell-total_amount="template_props">
       <q-td :props="template_props">
-        {{ formatCurrency(template_props.row.total_amount) }}
+        {{ formatToBRLCurrency(template_props.row.total_amount) }}
       </q-td>
     </template>
   </DefaultTable>
@@ -47,6 +47,7 @@ import { getSchedules, deleteSchedule } from 'src/api/schedule'
 import DefaultTable from 'src/components/defaults/DefaultTable.vue'
 import AddEditScheduleDialog from './AddEditScheduleDialog.vue'
 import { format, parseISO } from 'date-fns'
+import { formatToBRLCurrency } from 'src/helpers/utils'
 
 const { t } = useI18n()
 const $q = useQuasar()
@@ -54,6 +55,13 @@ const tableRef = ref(null)
 const loading = ref(false)
 
 const columns = computed(() => [
+  {
+    name: "id",
+    label: "ID",
+    align: "left",
+    field: "id",
+    sortable: true
+  },
   {
     name: 'client_name',
     label: t('schedules.client'),
@@ -94,6 +102,7 @@ const columns = computed(() => [
     name: 'total_amount',
     label: t('schedules.total_amount'),
     align: 'right',
+    format: (val) => val ? formatToBRLCurrency(val) : '',
     field: 'total_amount',
     sortable: true
   },
@@ -118,13 +127,6 @@ const getStatusColor = (status) => {
   return colors[status] || 'grey'
 }
 
-const formatCurrency = (value) => {
-  return new Intl.NumberFormat('pt-BR', {
-    style: 'currency',
-    currency: 'BRL'
-  }).format(value)
-}
-
 const onAddItem = () => {
   $q.dialog({
     component: AddEditScheduleDialog,

src/pages/schedule/components/ViewScheduleDialog.vue

@@ -43,7 +43,7 @@
           <div class="col-12 col-md-6">
             <div class="text-caption text-grey-7">{{ $t('schedules.total_amount') }}</div>
             <div class="text-body1 text-weight-bold text-positive">
-              {{ formatCurrency(schedule?.total_amount) }}
+              {{ formatToBRLCurrency(schedule?.total_amount) }}
             </div>
           </div>
 
@@ -129,6 +129,7 @@ import { useDialogPluginComponent, useQuasar } from 'quasar'
 import { verifyScheduleCode } from 'src/api/customSchedule'
 import { useI18n } from 'vue-i18n'
 import DefaultDialogHeader from 'src/components/defaults/DefaultDialogHeader.vue'
+import { formatToBRLCurrency } from 'src/helpers/utils'
 
 const props = defineProps({
   schedule: {
@@ -154,11 +155,6 @@ const $q = useQuasar()
 const { t } = useI18n()
 const { dialogRef, onDialogHide, onDialogCancel, onDialogOK } = useDialogPluginComponent()
 
-const formatCurrency = (value) => {
-  if (!value) return 'R$ 0,00'
-  return `R$ ${Number(value).toFixed(2).replace('.', ',')}`
-}
-
 const formatAddress = (address) => {
   if (!address) return 'N/A'
   const parts = [