Explorar o código

refactor: deixa fluxo de compra passando pelo sessao de carrinho

Gustavo Mantovani hai 1 día
pai
achega
46d73e5478

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

@@ -728,7 +728,7 @@
     "unknown_client": "Client",
     "select_service": "Select service",
     "no_slots_available": "No time slots available for this day.",
-    "book": "schedule",
+    "book": "add to cart",
     "no_price": "to be agreed",
     "time_selection": {
       "subtitle": "Select the desired start and end time for the service.",

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

@@ -724,7 +724,7 @@
     "unknown_client": "Cliente",
     "select_service": "Seleccionar servicio",
     "no_slots_available": "No hay horarios disponibles para este día.",
-    "book": "agendar",
+    "book": "agregar al carrito",
     "no_price": "a convenir",
     "time_selection": {
       "subtitle": "Seleccione el horario deseado para inicio y fin del servicio.",

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

@@ -736,7 +736,7 @@
     "unknown_client": "Cliente",
     "select_service": "Selecionar serviço",
     "no_slots_available": "Não há horários disponíveis para este dia.",
-    "book": "agendar",
+    "book": "carrinho",
     "no_price": "a combinar",
     "time_selection": {
       "subtitle": "Selecione o horário desejado para início e término do serviço.",

+ 26 - 1
src/layouts/MainLayout.vue

@@ -41,7 +41,17 @@
           :class="{ 'provider-bottom-nav-item--active': isNavItemActive(item) }"
           class="provider-bottom-nav-item"
         >
-          <q-icon :name="item.icon" class="provider-bottom-nav-icon" />
+          <span class="provider-bottom-nav-icon-wrap">
+            <q-icon :name="item.icon" class="provider-bottom-nav-icon" />
+            <q-badge
+              v-if="item.name === 'ScheduleCartPage' && cartCount"
+              color="secondary"
+              floating
+              rounded
+            >
+              {{ cartCount }}
+            </q-badge>
+          </span>
 
           <span class="provider-bottom-nav-label font12">
             {{ item.label }}
@@ -57,6 +67,7 @@ import { computed, useTemplateRef, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
+import { useScheduleCartStore } from "src/stores/scheduleCart";
 
 defineOptions({
   name: "MainLayout",
@@ -79,6 +90,10 @@ const navItems = computed(() => [
   { name:  "ProfilePage",      label: t('nav.profile'), icon: "mdi-account-circle-outline" },
 ]);
 
+const cart = useScheduleCartStore();
+
+const cartCount = computed(() => cart.items.length);
+
 const isNavItemActive = (item) => route.name === item.name;
 
 const scrollAreaHeight = computed(() => {
@@ -182,6 +197,16 @@ watch(
   color: #ff00ea;
 }
 
+.provider-bottom-nav-icon-wrap {
+  position: relative;
+  display: inline-flex;
+}
+
+.provider-bottom-nav-icon-wrap :deep(.q-badge--floating) {
+  top: -8px;
+  right: -14px;
+}
+
 .provider-bottom-nav-icon {
   font-size: 24px;
   line-height: 1;

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

@@ -65,22 +65,8 @@
               unelevated
               :disable="type.price == null"
               :label="$t('scheduling_page.book')"
-              @click="onDialogOK({ action: 'book', serviceType: type, date: selectedDate, provider })"
-            />
-
-            <q-btn
-              color="primary"
-              icon="mdi-cart-plus"
-              outline
-              round
-              size="md"
-              :disable="type.price == null"
               @click="onDialogOK({ action: 'cart', serviceType: type, date: selectedDate, provider })"
-            >
-              <q-tooltip>
-                {{ $t('schedule_cart.add_to_cart') }}
-              </q-tooltip>
-            </q-btn>
+            />
           </div>
         </div>
       </q-card-section>