Przeglądaj źródła

feat: :sparkles: feat (regua de valores) adicionada visualizacao dos valores proporcionais

na tela de criar oportunidade foi adicionada a visualizacao da 'regua' proporcional para os periodos de 2, 4 e 6 horas.

fase:dev | origin:escopo
Gustavo Zanatta 1 dzień temu
rodzic
commit
9c6a4d9964

+ 4 - 1
src/i18n/locales/en.json

@@ -7,7 +7,7 @@
       "close": "Close",
       "edit": "Edit",
       "add": "Add",
-      "select": "request",
+      "select": "select",
       "search": "Search",
       "delete": "Delete",
       "view": "View",
@@ -413,6 +413,8 @@
     "description_placeholder": "Hello, I would like a dedicated professional who will...",
     "price_range_title": "Price range for 8 hours",
     "price_range_helper": "Select the full price range to receive housekeeper proposals.",
+    "price_preview_label": "{hours}h for",
+    "price_preview_value": "R$ {min} - {max}",
     "date_and_time": "Date and time",
     "success_message": "Custom request saved successfully!",
     "residential": "Residential",
@@ -762,6 +764,7 @@
       "pause_note_4h": "Includes a break of up to 10 minutes.",
       "slot_required": "Select a time slot to continue."
     },
+    "price_up_to": "up to {value}",
     "service_types": {
       "integral": {
         "label": "Full day",

+ 4 - 1
src/i18n/locales/es.json

@@ -7,7 +7,7 @@
       "close": "Cerrar",
       "edit": "Editar",
       "add": "Añadir",
-      "select": "pedido",
+      "select": "seleccionar",
       "search": "Buscar",
       "delete": "Eliminar",
       "view": "Ver",
@@ -413,6 +413,8 @@
     "description_placeholder": "Hola, deseo un profesional dedicado que hará...",
     "price_range_title": "Rango de precio por 8 horas",
     "price_range_helper": "Selecciona el rango completo de precio para recibir propuestas de profesionales.",
+    "price_preview_label": "{hours}h por",
+    "price_preview_value": "R$ {min} - {max}",
     "date_and_time": "Fecha y hora",
     "success_message": "¡Solicitud personalizada guardada con éxito!",
     "residential": "Residencial",
@@ -759,6 +761,7 @@
       "pause_note_4h": "Incluye pausa de hasta 10 minutos.",
       "slot_required": "Seleccione un horario para continuar."
     },
+    "price_up_to": "hasta {value}",
     "service_types": {
       "integral": {
         "label": "Integral",

+ 4 - 1
src/i18n/locales/pt.json

@@ -7,7 +7,7 @@
       "close": "Fechar",
       "edit": "Editar",
       "add": "Adicionar",
-      "select": "solicitar",
+      "select": "selecionar",
       "search": "Buscar",
       "delete": "Excluir",
       "view": "Visualizar",
@@ -413,6 +413,8 @@
     "description_placeholder": "Olá, desejo profissional dedicado que irá fazer...",
     "price_range_title": "Faixa de preço por 8 horas",
     "price_range_helper": "Selecione a faixa de preço integral para receber propostas de diaristas.",
+    "price_preview_label": "{hours}h por",
+    "price_preview_value": "R$ {min} - {max}",
     "date_and_time": "Data e hora",
     "success_message": "Pedido sob medida salvo com sucesso!",
     "residential": "Residencial",
@@ -770,6 +772,7 @@
       "pause_note_4h": "Incluso pausa de até 10 minutos.",
       "slot_required": "Selecione um horário para continuar."
     },
+    "price_up_to": "até {value}",
     "service_types": {
       "integral": {
         "label": "Integral",

+ 62 - 1
src/pages/schedules/SobMedidaPage.vue

@@ -149,6 +149,25 @@
         <div class="range-helper">
           {{ $t('sob_medida.price_range_helper') }}
         </div>
+
+        <div class="price-preview-grid">
+          <div
+            v-for="preview in pricePreviews"
+            :key="preview.periodType"
+            class="price-preview-col"
+          >
+            <div class="price-preview-label font12 fontbold">
+              {{ $t('sob_medida.price_preview_label', { hours: preview.periodType }) }}
+            </div>
+
+            <div class="price-preview-box font12">
+              {{ $t('sob_medida.price_preview_value', {
+                min: formatPriceAmount(preview.min),
+                max: formatPriceAmount(preview.max)
+              }) }}
+            </div>
+          </div>
+        </div>
       </q-card>
 
       <div class="font16 fontbold section-title gradient-diarista">
@@ -183,7 +202,7 @@ import { getPublicServiceTypes } from 'src/api/serviceTypes'
 import { getPublicSpecialties } from 'src/api/specialties'
 import {useI18n} from 'vue-i18n'
 import { userStore } from 'src/stores/user'
-import { calculateDailyPrices } from 'src/helpers/utils'
+import { calculateDailyPrices, chooseprice } from 'src/helpers/utils'
 
 const $q = useQuasar()
 const router = useRouter()
@@ -220,6 +239,22 @@ const providerPrices = computed(() =>
   calculateDailyPrices(priceRange.value.max * quantity.value)
 )
 
+const PREVIEW_PERIOD_TYPES = Object.freeze(['6', '4', '2'])
+
+const pricePreviews = computed(() =>
+  PREVIEW_PERIOD_TYPES.map((periodType) => ({
+    periodType,
+    min: chooseprice(periodType, priceRange.value.min),
+    max: chooseprice(periodType, priceRange.value.max)
+  }))
+)
+
+const formatPriceAmount = (value) =>
+  Number(value ?? 0).toLocaleString('pt-BR', {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  })
+
 const minPosition = computed(() =>
   ((priceRange.value.min - PRICE_LIMITS.min) /
     (PRICE_LIMITS.max - PRICE_LIMITS.min)) * 100
@@ -511,6 +546,32 @@ onMounted(async () => {
   color: #6b6b6b;
 }
 
+.price-preview-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+  margin-top: 18px;
+}
+
+.price-preview-col {
+  min-width: 0;
+  text-align: center;
+}
+
+.price-preview-label {
+  margin-bottom: 6px;
+  color: #4a4a4a;
+}
+
+.price-preview-box {
+  padding: 8px 4px;
+  border: 1px solid #e2dcf0;
+  border-radius: 12px;
+  background: #fff;
+  line-height: 1.35;
+  color: #7a5cff;
+}
+
 .price-pin,
 .price-range :deep(.q-slider__thumb) {
   transition:

+ 1 - 1
src/pages/search/components/ServiceSelectionSheet.vue

@@ -58,7 +58,7 @@
               v-if="type.price"
                class="service-price"
             >
-              {{ formatCurrency(type.price) }}
+              {{ $t('scheduling_page.price_up_to', { value: formatCurrency(type.price) }) }}
             </div>
 
           <div class="row no-wrap q-gutter-x-xs">