Kaynağa Gözat

fix: :bug: fix( alteração no fluxo de cadastro) Foi realizado o ajuste no sistema para aparecer apenas o nome

Foi realizando um ajuste no sistema onde nas partes que fazem a listagem ira aparecer apenas os nomes sem os sobrenomes, tambem foi realizado o ajuste onde ouver apeanas uma alteração na exibição do texto

Origin: bug-interno
kayo henrique 1 hafta önce
ebeveyn
işleme
f33b54e70e

+ 5 - 5
src/components/dashboard/DashboardNextSchedules.vue

@@ -14,11 +14,11 @@
             <div class="row no-wrap items-center q-gutter-x-sm">
               <q-avatar size="48px">
                 <img v-if="item.customer_photo" :src="item.customer_photo" style="object-fit:cover" />
-                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ (item.customer_name ?? item.client_name)?.slice(0,2).toUpperCase() ?? '??' }}</span>
+                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ getFirstName(item.customer_name ?? item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
               </q-avatar>
               <div class="column flex-1">
                 <div class="row items-center q-gutter-x-xs">
-                  <span class="text-name ellipsis font12 fontmedium">{{ item.customer_name ?? item.client_name }}</span>
+                  <span class="text-name ellipsis font12 fontmedium">{{ getFirstName(item.customer_name ?? item.client_name) || '—' }}</span>
                   <div v-if="item.customer_rating" class="row items-center">
                     <q-icon name="mdi-star" color="warning" size="14px" />
                     <span class="text-text font11">{{ item.customer_rating }}</span>
@@ -81,10 +81,10 @@
 
 <script setup>
 import { useI18n } from 'vue-i18n';
-import { formatCurrency } from 'src/helpers/utils';
+import { formatCurrency, formatAddress, getFirstName } from 'src/helpers/utils';
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
-import { useQuasar } from 'quasar';
-import { formatAddress } from 'src/helpers/utils';
+import { useQuasar } from 'quasar'; 
+
 defineProps({ data: { type: Array, default: () => [] } });
 const emit = defineEmits(['view-details']);
 

+ 3 - 3
src/components/dashboard/DashboardOpportunities.vue

@@ -17,11 +17,11 @@
             <div class="row no-wrap items-center q-gutter-x-sm">
               <q-avatar size="48px">
                 <img v-if="item.customer_photo" :src="item.customer_photo" style="object-fit:cover" />
-                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ (item.client_name ?? item.client?.user?.name)?.slice(0,2).toUpperCase() ?? '??' }}</span>
+                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ getFirstName(item.client_name ?? item.client?.user?.name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
               </q-avatar>
               <div class="column flex-1">
                 <div class="row items-center q-gutter-x-xs">
-                  <span class="ellipsis font12 fontmedium text-text">{{ item.client?.user?.name }}</span>
+                  <span class="ellipsis font12 fontmedium text-text">{{ getFirstName(item.client_name ?? item.client?.user?.name) || '—' }}</span>
                   <div class="row items-center">
                     <div class="q-my-auto">
                       <q-icon name="mdi-star" color="warning" size="12px"/>                  
@@ -72,7 +72,7 @@
 </template>
 
 <script setup>
-import { formatCurrency } from 'src/helpers/utils';
+import { formatCurrency, getFirstName } from 'src/helpers/utils';
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
 import { useQuasar } from 'quasar';
 import { useRouter } from 'vue-router';

+ 3 - 3
src/components/dashboard/DashboardSolicitations.vue

@@ -17,11 +17,11 @@
             <div class="row no-wrap items-center q-gutter-x-sm text-text">
               <q-avatar size="48px">
                 <img v-if="item.customer_photo" :src="item.customer_photo" style="object-fit:cover" />
-                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ item.client_name?.slice(0,2).toUpperCase() ?? '??' }}</span>
+                <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ getFirstName(item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
               </q-avatar>
               <div class="column flex-1">
                 <div class="row items-center q-gutter-x-xs">
-                  <span class="ellipsis font9 fontmedium">{{ item.client_name }}</span>
+                  <span class="ellipsis font9 fontmedium">{{ getFirstName(item.client_name) || '—' }}</span>
                   <div class="row items-center">
                     <q-icon name="mdi-star" color="warning" size="12px" />
                     <span class="text-text font9">{{ item.average_rating }}</span>
@@ -95,7 +95,7 @@
 </template>
 
 <script setup>
-import { formatCurrency } from 'src/helpers/utils';
+import { formatCurrency, getFirstName } from 'src/helpers/utils';
 import { useI18n } from 'vue-i18n';
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
 

+ 3 - 3
src/components/dashboard/DashboardSummaryInfos.vue

@@ -5,11 +5,11 @@
         <div class="row items-center no-wrap q-gutter-x-sm col">
           <q-avatar size="54px" :style="!data?.profile_photo ? avatarStyle : undefined" class="">
             <img v-if="data?.profile_photo" :src="data.profile_photo" style="object-fit:cover;width:100%;height:100%;border-radius:50%" />
-            <span v-else>{{ data?.name?.slice(0, 2).toUpperCase() ?? '??' }}</span>
+            <span v-else> {{ getFirstName(data?.name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
           </q-avatar>
           <div class="column q-gutter-y-xs min-width-0">
             <span class="summary-greeting font14 fontmedium">{{ $t('provider.dashboard.summary.welcome') }}</span>
-            <span class="summary-name text-primary font16 fontbold">{{ data?.name ?? $t('provider.dashboard.summary.welcome') }}</span>
+            <span class="summary-name text-primary font16 fontbold">{{ getFirstName(data?.name) || $t('provider.dashboard.summary.welcome') }}</span>
           </div>
         </div>
         <div class="column items-end q-gutter-y-xs col-auto">
@@ -32,7 +32,7 @@
 </template>
 
 <script setup>
-import { formatAddress } from 'src/helpers/utils';
+import { formatAddress, getFirstName } from 'src/helpers/utils';
 defineProps({ data: { type: Object, default: () => null } });
 
 const avatarStyle = {

+ 4 - 4
src/components/dashboard/DashboardTodayServices.vue

@@ -19,7 +19,7 @@
                     class="full-width full-height flex flex-center"
                     style="border-radius:50%;"
                   >
-                    {{ item.client_name?.slice(0, 2).toUpperCase() ?? '??' }}
+                    {{ getFirstName(item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}
                   </span>
                 </q-avatar>
 
@@ -27,12 +27,12 @@
                   <span class="text-text font12">
                     <template v-if="cardState(item) === 'finished'">
                       {{ $t('provider.dashboard.today_services.finished_label') }}
-                      <span class="fontbold"> {{ ' ' + item.client_name ?? '—' }}</span>
+                      <span class="fontbold"> {{ ' ' + (getFirstName(item.client_name) || '—') }}</span>
                       {{ ' ' + $t('provider.dashboard.today_services.finished_suffix') }}
                     </template>
                     <template v-else>
                       {{ $t('provider.dashboard.today_services.start_label') }}
-                      <span class="fontbold"> {{ ' ' + item.client_name ?? '—' }}</span>
+                      <span class="fontbold"> {{ ' ' + (getFirstName(item.client_name) || '—') }}</span>
                     </template>
                   </span>
                   <div class="row items-center q-mt-xs no-wrap">
@@ -152,7 +152,7 @@ import { useQuasar } from 'quasar'
 import { useI18n } from 'vue-i18n'
 import ProfileHelpDialog from 'src/components/profile/ProfileHelpDialog.vue'
 import { verifyScheduleCode } from 'src/api/schedule'
-import { formatAddress } from 'src/helpers/utils';
+import { formatAddress, getFirstName } from 'src/helpers/utils';
 
 const props = defineProps({ data: { type: Array, default: () => [] } })
 const emit = defineEmits(['rate', 'refresh'])

+ 3 - 3
src/components/dashboard/NextSchedulesDetailsDialog.vue

@@ -9,10 +9,10 @@
       <q-card-section class="column items-center q-pt-xs q-pb-sm">
         <q-avatar size="72px" class="q-mb-sm">
           <img v-if="schedule.customer_photo" :src="schedule.customer_photo" style="object-fit:cover" />
-          <span v-else class="full-width full-height flex flex-center" :style="avatarColors[schedule.id % avatarColors.length]" style="font-size:20px;border-radius:50%">{{ (schedule.customer_name ?? schedule.client_name)?.slice(0,2).toUpperCase() ?? '??' }}</span>
+          <span v-else class="full-width full-height flex flex-center" :style="avatarColors[schedule.id % avatarColors.length]" style="font-size:20px;border-radius:50%">{{ getFirstName(schedule.customer_name ?? schedule.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
         </q-avatar>
         <div class="text-text font16 fontbold">
-          {{ schedule.customer_name ?? schedule.client_name }}
+          {{ getFirstName(schedule.customer_name ?? schedule.client_name) || '—' }}
         </div>
         <div class="text-price font16 fontbold q-mt-xs">{{ formatCurrency(schedule.total_amount) }}</div>
         <div class="text-grey-6 font12 q-mt-xxs">{{ periodLabel }}</div>
@@ -121,7 +121,7 @@
 import { computed } from 'vue'
 import { useDialogPluginComponent, useQuasar } from 'quasar'
 import { useI18n } from 'vue-i18n'
-import { formatCurrency, formatAddress } from 'src/helpers/utils'
+import { formatCurrency, formatAddress, getFirstName } from 'src/helpers/utils'
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js'
 import ScheduleCancelDialog from './ScheduleCancelDialog.vue'
 import ProfileHelpDialog from 'src/components/profile/ProfileHelpDialog.vue'

+ 3 - 2
src/components/dashboard/ScheduleRatingDialog.vue

@@ -18,7 +18,7 @@
         </q-avatar>
         <div class="text-text text-center font16 fontbold q-px-lg" style="line-height:1.3">
           {{ $t('provider.dashboard.schedule_rating.title') }}
-          <span class="text-primary"> {{ schedule.client_name + '?' }}</span>
+          <span class="text-primary">{{ (getFirstName(schedule.client_name) || '—') + '?' }}</span>
         </div>
       </div>
 
@@ -132,6 +132,7 @@
 import { ref, computed, onMounted } from 'vue'
 import { useDialogPluginComponent, useQuasar } from 'quasar'
 import { useI18n } from 'vue-i18n'
+import { getFirstName } from 'src/helpers/utils'
 import { createReview, getImprovementTypes } from 'src/api/review'
 import { userStore } from 'src/stores/user'
 import ProfileHelpDialog from 'src/components/profile/ProfileHelpDialog.vue'
@@ -175,7 +176,7 @@ const avatarStyle = computed(() => {
 })
 
 const initials = computed(() =>
-  props.schedule.client_name?.slice(0, 2).toUpperCase() ?? '??'
+  getFirstName(props.schedule.client_name)?.slice(0, 2).toUpperCase() ?? '??'
 )
 
 const onStarsChange = () => {

+ 10 - 1
src/helpers/utils.js

@@ -257,7 +257,15 @@ const chooseprice = (periodType, daily_price_8h) => {
     default:
       return 0
   }
-}
+};
+
+const getFirstName = (fullName) => {
+  if (!fullName) return '';
+
+  return String(fullName)
+    .trim()
+    .split(/\s+/)[0];
+};
 
 export {
   formatDateDMYtoYMD,
@@ -275,4 +283,5 @@ export {
   formatAddress,
   calculateDailyPrices,
   chooseprice,
+  getFirstName,
 };

+ 2 - 2
src/i18n/locales/en.json

@@ -251,10 +251,10 @@
         "my_schedules": "My schedules"
       },
       "price_suggest": {
-        "region_label": "Suggested daily rate in the region",
+        "region_label": "Average daily rate in your area",
         "region_label_1": "Suggested daily rate",
         "region_label_2": "in the region",
-        "my_price_label": "My daily rate"
+        "my_price_label": "My daily rate (8-hour rate)"
       },
       "today_services": {
         "finished_label": "Service with",

+ 2 - 2
src/i18n/locales/es.json

@@ -251,10 +251,10 @@
         "my_schedules": "Mis citas"
       },
       "price_suggest": {
-        "region_label": "Precio de jornada sugerido en la región",
+        "region_label": "Precio promedio de las tarifas diarias en tu zona",
         "region_label_1": "Precio de jornada sugerido",
         "region_label_2": "en la región",
-        "my_price_label": "Precio de mi jornada"
+        "my_price_label": "Mi tarifa diaria (jornada de 8 horas)"
       },
       "today_services": {
         "finished_label": "Servicio con",

+ 2 - 2
src/i18n/locales/pt.json

@@ -251,10 +251,10 @@
         "my_schedules": "Minhas diárias"
       },
       "price_suggest": {
-        "region_label": "Preço de diária sugerido na região",
+        "region_label": "Preço médio de diárias na sua região",
         "region_label_1": "Preço de diária sugerido",
         "region_label_2": "na região",
-        "my_price_label": "Preço da minha diária"
+        "my_price_label": "Minha diária (valor de 8h)"
       },
       "today_services": {
         "finished_label": "Serviço com",

+ 5 - 5
src/pages/calendar/CalendarPage.vue

@@ -27,11 +27,11 @@
               <div class="row no-wrap items-start q-gutter-x-sm">
                 <q-avatar size="44px">
                   <img v-if="item.customer_photo" :src="item.customer_photo" style="object-fit:cover" />
-                  <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ item.client_name?.slice(0,2).toUpperCase() ?? '??' }}</span>
+                  <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ getFirstName(item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
                 </q-avatar>
 
                 <div class="col column text-text">
-                  <span class="font12 fontmedium ellipsis">{{ item.client_name }}</span>
+                  <span class="font12 fontmedium ellipsis">{{ getFirstName(item.client_name) }}</span>
                   <div class="row items-center no-wrap">
                     <span class="font9 fontbold">{{ formatWeekday(item.date) }}</span>
                     <span class="font9 fontmedium">{{ ', ' + formatDayMonth(item.date) }}</span>
@@ -96,11 +96,11 @@
               <div class="row no-wrap items-start q-gutter-x-sm">
                 <q-avatar size="44px">
                   <img v-if="item.customer_photo" :src="item.customer_photo" style="object-fit:cover" />
-                  <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ item.client_name?.slice(0,2).toUpperCase() ?? '??' }}</span>
+                  <span v-else class="full-width full-height flex flex-center" :style="avatarColors[item.id % avatarColors.length]" style="border-radius:50%">{{ getFirstName(item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</span>
                 </q-avatar>
 
                 <div class="col column text-text">
-                  <span class="font12 fontmedium ellipsis">{{ item.client_name }}</span>
+                  <span class="font12 fontmedium ellipsis"> {{ getFirstName(item.client_name) || '—' }}</span>
                   <div class="row items-center no-wrap">
                     <span class="font9 fontbold">{{ formatWeekday(item.date) }}</span>
                     <span class="font9 fontmedium">{{ ', ' + formatDayMonth(item.date) }}</span>
@@ -172,7 +172,7 @@ import { ref, onMounted } from 'vue';
 import { useQuasar } from 'quasar';
 import { useI18n } from 'vue-i18n';
 import { getProviderCalendar } from 'src/api/providerCalendar';
-import { formatCurrency } from 'src/helpers/utils';
+import { formatCurrency, getFirstName } from 'src/helpers/utils';
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js';
 import NextSchedulesDetailsDialog from 'src/components/dashboard/NextSchedulesDetailsDialog.vue';
 import ScheduleRatingDialog from 'src/components/dashboard/ScheduleRatingDialog.vue';

+ 3 - 3
src/pages/opportunities/OpportunitiesPage.vue

@@ -27,11 +27,11 @@
         <div class="row">
           <div>
             <img v-if="item.customer_photo" :src="item.customer_photo" alt="Avatar" class="client-avatar" />
-            <div v-else class="client-avatar client-avatar--initials font14 fontbold" :style="avatarColors[item.id % avatarColors.length]">{{ (item.client_name ?? item.client?.user?.name)?.slice(0,2).toUpperCase() ?? '??' }}</div>
+            <div v-else class="client-avatar client-avatar--initials font14 fontbold" :style="avatarColors[item.id % avatarColors.length]">{{ getFirstName(item.client_name)?.slice(0, 2).toUpperCase() ?? '??' }}</div>
           </div>
           <div class="center-content q-pl-md">
             <div class="client-name-row">
-              <span class="text-text font12 fontmedium">{{ item.client?.user.name }}</span>
+              <span class="text-text font12 fontmedium">{{ getFirstName(item.client_name) || '—' }}</span>
 
               <span class="rating font9 fontregular">
                 <q-icon name="star" size="11px" />
@@ -82,7 +82,7 @@
 import { ref, onMounted } from 'vue'
 import { useQuasar } from 'quasar'
 import { useI18n } from 'vue-i18n'
-import { chooseprice, filterCurrency } from 'src/helpers/utils'
+import { chooseprice, filterCurrency, getFirstName } from 'src/helpers/utils'
 import { getProviderOpportunities } from 'src/api/opportunities'
 import { userStore } from 'src/stores/user'
 import { labelsPeriodTypes } from 'src/helpers/arraysOptions/labelsPeriodTypes.js'