From a073e8863214f9c51b8338ad1a90bd9738bb3223 Mon Sep 17 00:00:00 2001
From: szewczyw <wojtekszewczyk2000@gmail.com>
Date: Thu, 27 Feb 2025 14:47:19 +0100
Subject: [PATCH] aesthetic changes

---
 src/components/SummaryComponent.vue | 59 +++++++++++++++++++++++++----
 1 file changed, 52 insertions(+), 7 deletions(-)

diff --git a/src/components/SummaryComponent.vue b/src/components/SummaryComponent.vue
index 8e70f5b..92601d7 100644
--- a/src/components/SummaryComponent.vue
+++ b/src/components/SummaryComponent.vue
@@ -26,7 +26,7 @@ const orderByRouteAndNipRef = ref<Map<string, Map<number, {
   orders: Order[];
   products: OrderProduct[]
 }>>>(new Map<string, Map<number, { orders: Order[]; products: OrderProduct[] }>>)
-
+const activeButton = ref(null)
 const watchSearchDate = watch(searchDate, async (oldSearchDate, newSeatchDate) => {
   if (oldSearchDate != newSeatchDate) {
     await fetchOrders()
@@ -38,7 +38,20 @@ const watchConfirmedOrders = watch(confirmedOrders, async (oldConfirmedOrders, n
     await fetchOrders()
   }
 })
+const setActive = (button) => {
+  activeButton.value = button;
 
+  if (button === 'separate') {
+    isSummed.value = false;
+    nipGrouped.value = false;
+  } else if (button === 'grouped') {
+    isSummed.value = false;
+    nipGrouped.value = true;
+  } else if (button === 'summed') {
+    isSummed.value = true;
+    nipGrouped.value = false;
+  }
+};
 async function fetchOrders() {
   isLoading.value = true
   orders.value = await ordersStore.fetchOrdersByDateStartAndEnd(searchDate.value != undefined ? searchDate.value : new Date(Date.now()),
@@ -118,6 +131,8 @@ function groupByNip() {
           existingProduct.suma = Number(Number(existingProduct.MZE_TwrIlosc) * Number(existingProduct.MZE_TwrCena)).toFixed(2)
 
         } else {
+          element.MZE_TwrCena = String(Number(element.MZE_TwrCena).toFixed(2))
+          element.MZE_TwrIlosc = String(Number(element.MZE_TwrIlosc).toFixed(2))
           element.suma = Number(Number(element.MZE_TwrIlosc )*Number(element.MZE_TwrCena)).toFixed(2)
           entry.products.push(element)
         }
@@ -176,12 +191,29 @@ onBeforeUnmount(async function() {
         </div>
       </div>
       <div class="box mt-3">
-        <button class="button is-fullwidth mb-3" @click="isSummed=false; nipGrouped=false">Rozdzielone zamówienia
+        <button
+          class="button is-fullwidth mb-3"
+          :class="{ 'is-active': activeButton === 'separate' }"
+          @click="setActive('separate')"
+        >
+          Rozdzielone zamówienia
         </button>
-        <button class="button is-fullwidth mb-3" @click="isSummed=false; nipGrouped=true">Zamówienia pogrupowane po
-          NIP
+
+        <button
+          class="button is-fullwidth mb-3"
+          :class="{ 'is-active': activeButton === 'grouped' }"
+          @click="setActive('grouped')"
+        >
+          Zamówienia pogrupowane po NIP
+        </button>
+
+        <button
+          class="button is-fullwidth mb-3"
+          :class="{ 'is-active': activeButton === 'summed' }"
+          @click="setActive('summed')"
+        >
+          Zsumowane zamówienia
         </button>
-        <button class="button is-fullwidth mb-3" @click="isSummed=true; nipGrouped=false">Zsumowane zamówienia</button>
         <button class="button is-fullwidth" v-print="'#printMe'">Drukuj</button>
       </div>
     </div>
@@ -231,7 +263,7 @@ onBeforeUnmount(async function() {
                       {{ item.orders[0].MZN_PodNazwa1 + item.orders[0].MZN_PodNazwa2 + item.orders[0].MZN_PodNazwa3
                       }}</p>
                     <p class="is-size-5 px-2"
-                       v-if="orderByRouteAndNipRef.get(route.MZT_Nazwa1)?.get(nip)?.orders?.length">
+                       v-if="orderByRouteAndNipRef.get(route.MZT_Nazwa1)?.get(nip)?.orders?.length > 1 ">
                       ZAMÓWIENIA NR
                       <span
                         v-for="(orderByNip, index) in orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders">{{ orderByNip.MZN_MZNID
@@ -240,6 +272,16 @@ onBeforeUnmount(async function() {
                           v-if="index !== orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders.length - 1">, </span>
                       </span>
                     </p>
+                    <p class="is-size-5 px-2"
+                       v-else>
+                      ZAMÓWIENIE NR
+                      <span
+                        v-for="(orderByNip, index) in orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders">{{ orderByNip.MZN_MZNID
+                        }}
+                        <span
+                          v-if="index !== orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders.length - 1">, </span>
+                      </span>
+                    </p>
                     <DataTable :value="orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).products"
                                class="mb-3" style="padding:0" scrollable>
                       <Column field="MZE_TwrKod" header="Indeks" frozen></Column>
@@ -294,7 +336,10 @@ onBeforeUnmount(async function() {
       --bulma-box-padding: 0.75rem;
     }
   }
-
+  .is-active {
+    background-color: #66d1ff;
+    color: white;
+  }
   .blackBorder {
     --bulma-table-cell-border-color : black;
   }