Bladeren bron

ajustes nos blocos de servicos do dia

Gustavo Zanatta 2 dagen geleden
bovenliggende
commit
e8ccea13c9
4 gewijzigde bestanden met toevoegingen van 101 en 31 verwijderingen
  1. 83 22
      src/components/dashboard/DashboardTodayServices.vue
  2. 6 3
      src/i18n/locales/en.json
  3. 6 3
      src/i18n/locales/es.json
  4. 6 3
      src/i18n/locales/pt.json

+ 83 - 22
src/components/dashboard/DashboardTodayServices.vue

@@ -3,6 +3,16 @@
     v-if="visibleItems.length > 0"
     class="q-mx-md q-mb-md"
   >
+    <div class="row items-center no-wrap q-mb-sm">
+      <span class="font16 fontbold gradient-diarista">
+        {{ $t('provider.dashboard.today_services.title') }}
+      </span>
+
+      <div class="attention-badge q-ml-sm">
+        {{ $t('provider.dashboard.today_services.attention_badge') }}
+      </div>
+    </div>
+
     <div class="scroll-wrapper">
       <div
         class="scroll-track"
@@ -47,6 +57,14 @@
                       {{ ' ' + $t('provider.dashboard.today_services.finished_suffix') }}
                     </template>
 
+                    <template v-else-if="cardState(item) === 'not_started'">
+                      {{ $t('provider.dashboard.today_services.not_started_label') }}
+
+                      <span class="fontbold">
+                        {{ ' ' + (getFirstName(item.client_name) || '—') }}
+                      </span>
+                    </template>
+
                     <template v-else>
                       {{ $t('provider.dashboard.today_services.start_label') }}
 
@@ -122,6 +140,21 @@
                 </div>
               </div>
 
+              <div
+                v-else-if="cardState(item) === 'not_started'"
+                class="col-12 text-center q-mb-xs"
+              >
+                <div class="column items-center">
+                  <div class="clock-badge">
+                    <q-icon
+                      color="white"
+                      name="mdi-clock-outline"
+                      size="15px"
+                    />
+                  </div>
+                </div>
+              </div>
+
               <div v-else class="">
                 <div
                   v-if="item.provider_reviewed"
@@ -168,25 +201,7 @@
             />
           </div>
 
-          <template v-if="cardState(item) === 'in_progress'">
-            <div class="row items-center no-wrap">
-              <q-icon
-                class="q-mr-xs flex-shrink-0 gradient-diarista"
-                name="mdi-clock-outline"
-                size="13px"
-              />
-  
-              <span class="text-grey-6 text-right text-no-wrap font9 fontmedium">
-                {{ $t('provider.dashboard.today_services.end_time_label') }}
-  
-                <span class="gradient-diarista">
-                  {{ calculateTimeUntilEnd(item.end_time) }}
-                </span>
-              </span>
-            </div>
-          </template>
-
-          <template v-else-if="cardState(item) === 'awaiting_code'">
+          <template v-if="cardState(item) === 'not_started'">
             <div class="address-row">
               <q-icon
                 class="flex-shrink-0"
@@ -194,10 +209,10 @@
                 name="mdi-map-marker-outline"
                 size="13px"
               />
-  
+
               <span class="text-grey-6 address-text text-right font9 fontmedium">
                 {{ [item.address?.address, item.address?.number, item.address?.district].filter(Boolean).join(', ') || '—' }}
-  
+
               </span>
               <q-icon
                 class="flex-shrink-0 q-ml-sm"
@@ -209,7 +224,7 @@
             </div>
           </template>
 
-          <div class="row items-center no-wrap">
+          <div class="row items-center no-wrap justify-between">
             <q-btn
               class="flex-shrink-0"
               color="primary"
@@ -218,6 +233,23 @@
               :label="$t('provider.dashboard.today_services.help')"
               @click.stop="openHelp"
             />
+
+            <span
+              v-if="cardState(item) === 'awaiting_code' || cardState(item) === 'in_progress'"
+              class="row items-center no-wrap text-grey-6 text-right text-no-wrap font9 fontmedium"
+            >
+              <q-icon
+                class="q-mr-xs flex-shrink-0 gradient-diarista"
+                name="mdi-clock-outline"
+                size="13px"
+              />
+
+              {{ $t('provider.dashboard.today_services.end_time_label') }}
+
+              <span class="gradient-diarista q-ml-xs">
+                {{ calculateTimeUntilEnd(item.end_time) }}
+              </span>
+            </span>
           </div>
           </q-card-section>
         </q-card>
@@ -362,6 +394,14 @@ const calculateTimeUntilEnd = (endTimeStr) => {
 }
 
 const cardState = (item) => {
+  const [sh, sm] = (item.start_time || '00:00').slice(0, 5).split(':').map(Number)
+
+  const startTime = new Date()
+
+  startTime.setHours(sh, sm, 0, 0)
+
+  if (now.value < startTime.getTime()) return 'not_started'
+
   const verified = item.code_verified || !!localVerified[item.id]
 
   if (!verified) return 'awaiting_code'
@@ -394,6 +434,7 @@ const copyAddress = (address) => {
 const progressByState = (item) => {
   const state = cardState(item)
 
+  if (state === 'not_started') return 0
   if (state === 'awaiting_code') return 50
   if (state === 'finished') return 100
 
@@ -421,6 +462,26 @@ const openHelp = () => {
 </script>
 
 <style scoped lang="scss">
+.attention-badge {
+  background: #22c55e;
+  color: white;
+  font-size: 11px;
+  font-weight: 700;
+  border-radius: 999px;
+  padding: 1px 8px;
+  white-space: nowrap;
+}
+
+.clock-badge {
+  width: 26px;
+  height: 26px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #8B5CF6, #EC4899);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 .scroll-wrapper { overflow: hidden; }
 .scroll-track {
   display: flex;

+ 6 - 3
src/i18n/locales/en.json

@@ -285,15 +285,18 @@
         "my_price_label_2": "my daily rate:"
       },
       "today_services": {
+        "title": "Today",
+        "attention_badge": "attention, daily service!",
         "finished_label": "Service with",
         "finished_suffix": "completed!",
-        "start_label": "In Progress",
+        "start_label": "Service start with",
+        "not_started_label": "Starting soon for",
         "code_hint": "Enter the client's code",
-        "in_progress": "In progress",
+        "in_progress": "Service in progress!",
         "reviewed_badge": "Reviewed",
         "rate_btn": "Rate",
         "help": "help",
-        "end_time_label": "Ends at:",
+        "end_time_label": "Ends in:",
         "code_error": "Invalid code. Please try again."
       },
       "solicitations": {

+ 6 - 3
src/i18n/locales/es.json

@@ -285,15 +285,18 @@
         "my_price_label_2": "mi jornada:"
       },
       "today_services": {
+        "title": "Hoy",
+        "attention_badge": "¡atención, diaria!",
         "finished_label": "Servicio con",
         "finished_suffix": "¡completado!",
-        "start_label": "En curso",
+        "start_label": "Inicio del servicio con",
+        "not_started_label": "Comienza pronto para",
         "code_hint": "Ingrese el código del cliente",
-        "in_progress": "En progreso",
+        "in_progress": "¡Servicio en curso!",
         "reviewed_badge": "Evaluado",
         "rate_btn": "Evaluar",
         "help": "ayuda",
-        "end_time_label": "Termina a las:",
+        "end_time_label": "Termina en:",
         "code_error": "Código inválido. Inténtelo de nuevo."
       },
       "solicitations": {

+ 6 - 3
src/i18n/locales/pt.json

@@ -285,15 +285,18 @@
         "my_price_label_2": "minha diária:"
       },
       "today_services": {
+        "title": "Hoje",
+        "attention_badge": "atenção, diária!",
         "finished_label": "Serviço com",
         "finished_suffix": "concluído!",
-        "start_label": "Em andamento",
+        "start_label": "Início do serviço com",
+        "not_started_label": "Início em breve para",
         "code_hint": "Informe o código do cliente",
-        "in_progress": "Em andamento",
+        "in_progress": "Serviço em andamento!",
         "reviewed_badge": "Avaliado",
         "rate_btn": "Avaliar",
         "help": "ajuda",
-        "end_time_label": "Término:",
+        "end_time_label": "Termina em:",
         "code_error": "Código inválido. Tente novamente."
       },
       "solicitations": {