upgraded cancelation process

components.d.ts

@@ -9,7 +9,8 @@ declare module 'vue' {
   export interface GlobalComponents {
     CancelationModal: typeof import('./src/components/CancelationModal.vue')['default']
     Column: typeof import('primevue/column')['default']
-    ConfirmationModal: typeof import('./src/components/confirmationModal.vue')['default']
+    ColumnGroup: typeof import('primevue/columngroup')['default']
+    ConfirmationModal: typeof import('./src/components/ConfirmationModal.vue')['default']
     ConfirmedForm: typeof import('./src/components/ConfirmedForm.vue')['default']
     DataTable: typeof import('primevue/datatable')['default']
     IconCommunity: typeof import('./src/components/icons/IconCommunity.vue')['default']
@@ -24,6 +25,7 @@ declare module 'vue' {
     OrdersSelector: typeof import('./src/components/OrdersSelector.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    Row: typeof import('primevue/row')['default']
     SummaryComponent: typeof import('./src/components/SummaryComponent.vue')['default']
   }
 }

package.json

@@ -17,7 +17,7 @@
     "@primevue/themes": "^4.0.4",
     "@vuepic/vue-datepicker": "^8.7.0",
     "axios": "^1.7.2",
-    "bulma": "^1.0.1",
+    "bulma": "^1.0.3",
     "cors": "^2.8.5",
     "pinia": "^2.1.7",
     "primevue": "^4.0.4",
@@ -41,10 +41,10 @@
     "eslint-plugin-vue": "^9.23.0",
     "npm-run-all2": "^6.1.2",
     "prettier": "^3.2.5",
-    "sass": "^1.77.2",
+    "sass": "^1.83.1",
     "typescript": "~5.4.0",
     "unplugin-vue-components": "^0.27.3",
-    "vite": "^5.2.8",
-    "vue-tsc": "^2.0.11"
+    "vite": "^5.4.11",
+    "vue-tsc": "2.0.11"
   }
 }

src/assets/style.scss

@@ -1,5 +1,5 @@
 @import 'node_modules/bulma/bulma.scss';
-@import '/home/patryk/WebstormProjects/Zamowienia-UI/node_modules/bulma/sass/utilities/mixins';
+@import 'node_modules/bulma/sass/utilities/mixins';
 
 
 .element {

src/components/CancelationModal.vue

@@ -5,6 +5,7 @@ import { axiosInstance } from '@/main'
 import { useSiteControlStore } from '@/stores/siteControl.store'
 import { useContractorsStore } from '@/stores/contractors.store'
 import { useCategoriesStore } from '@/stores/categories.store'
+import { ref } from 'vue'
 
 const ordersStore = useOrdersStore();
 const siteControlStore = useSiteControlStore();
@@ -13,11 +14,17 @@ const categoriesStore = useCategoriesStore();
 
 const { uuid } = storeToRefs(ordersStore);
 const { showCancellationModal, isLoading } = storeToRefs(siteControlStore);
+const cancellationReason = ref<string>("");
 
 async function cancelOrder() {
   showCancellationModal.value = false;
-  axiosInstance.delete('/zamowienie/' + uuid.value);
-  siteControlStore.newOrder(true);
+  // console.log(cancellationReason.value);
+  axiosInstance.delete('/zamowienie/' + uuid.value, {
+    data: {
+      MZN_AnulowanePowod: cancellationReason.value
+    }
+  });
+  siteControlStore.newOrder("/orders");
 }
 </script>
 
@@ -31,11 +38,16 @@ async function cancelOrder() {
           <button class="delete" aria-label="close" @click="$emit('close')"></button>
         </header>
         <section class="modal-card-body">
-          Czy napewno chcesz anulować zamówienie? Czynności tej nie można odwrócić.
+          <div>Czy napewno chcesz anulować zamówienie? Czynności tej nie można odwrócić.</div>
+          <p class="control is-expanded" style="margin-top: 20px">
+            <input class="input is-small" type="text" v-model="cancellationReason"  placeholder="Powód anulowania" >
+          </p>
         </section>
         <footer class="modal-card-foot">
+
           <div class="buttons">
-            <button class="button is-success" @click="cancelOrder">Tak</button>
+<!--            <button class="button is-success" @click="cancelOrder" v-bind:disabled="cancellationReason == undefined || cancellationReason == ''">Tak</button>-->
+            <button class="button is-success" :disabled="cancellationReason.length<3" @click="cancelOrder">Tak</button>
             <button class="button" @click="$emit('close')">Nie</button>
           </div>
         </footer>

src/components/ConfirmationModal.vue

@@ -7,6 +7,7 @@ import { useContractorsStore } from '@/stores/contractors.store'
 import { useCategoriesStore } from '@/stores/categories.store'
 import { useRoute } from 'vue-router'
 import { useRoutesStore } from '@/stores/routes.store'
+import {  ref } from 'vue'
 
 const ordersStore = useOrdersStore();
 const siteControlStore = useSiteControlStore();
@@ -19,15 +20,19 @@ const { categories } = storeToRefs(categoriesStore);
 const { uuid } = storeToRefs(ordersStore);
 const { showConfirmationModal, isLoading} = storeToRefs(siteControlStore);
 const { route, routes } = storeToRefs(routeStore);
+const isOrderConfirmed = ref(true)
 
 async function confirmOrder() {
+  isOrderConfirmed.value = false;
   await axiosInstance.put('/zamowienie/' + uuid.value);
   showConfirmationModal.value = false;
   if (uuid.value != undefined && route.value != undefined) {
     isLoading.value = true;
     await ordersStore.loadOrder(uuid.value, true, contractor, contractors, categories, route, routes);
+    ordersStore.orderToClone = false
     isLoading.value = false;
   }
+  isOrderConfirmed.value = true;
 }
 </script>
 
@@ -45,7 +50,7 @@ async function confirmOrder() {
         </section>
         <footer class="modal-card-foot">
           <div class="buttons">
-            <button class="button is-success" @click="confirmOrder">Tak</button>
+            <button class="button is-success" @click="confirmOrder"  :disabled="!isOrderConfirmed">Tak</button>
             <button class="button" @click="$emit('close')">Nie</button>
           </div>
         </footer>

src/components/ConfirmedForm.vue

@@ -4,13 +4,14 @@ import { useOrdersStore } from '@/stores/orders.store'
 import { storeToRefs } from 'pinia'
 import { useCategoriesStore } from '@/stores/categories.store'
 import { useContractorsStore } from '@/stores/contractors.store'
-import { axiosInstance } from '@/main'
 import { useRoutesStore } from '@/stores/routes.store'
+import { useSiteControlStore } from '@/stores/siteControl.store'
 
 const ordersStore = useOrdersStore();
 const categoriesStore = useCategoriesStore();
 const contractorsStore = useContractorsStore();
 const routeStore = useRoutesStore();
+const siteControlStore = useSiteControlStore();
 
 const { order, uuid} = storeToRefs(ordersStore);
 
@@ -20,25 +21,29 @@ const { contractor } = storeToRefs(contractorsStore);
 
 const { route } = storeToRefs(routeStore);
 
+const { showCancellationModal } = storeToRefs(siteControlStore);
+
 function cancelOrder(event: Event) {
   event.preventDefault();
-  axiosInstance.delete('/zamowienie/' + uuid.value);
+  // axiosInstance.delete('/zamowienie/' + uuid.value);
+  showCancellationModal.value = true;
 }
 </script>
 
 <template>
-  <form class="box is-shadowless">
-    <div class="mb-3">
-      <div class="box">
-        <h1 class="title mb-3 is-6"><b>ZAMÓWIENIE</b></h1>
-        <h1 class="subtitle is-6 mb-3" v-if="uuid != null" ><b>{{ uuid }}</b></h1>
+  <form class="box  is-shadowless">
+    <div class="mb-3  ">
+      <div class="box" :class="{'cancelled' : order.MZN_Anulowane == 1}">
+        <div class="mb-3">
+          <h1 class="title is-5" v-if="order != undefined"><b>ZAMÓWIENIE NR {{ order.MZN_MZNID }}</b><b
+            v-if="order.MZN_Anulowane == 1">, ZAMÓWIENIE ANULOWANE</b></h1>
+        </div>
         <div class="field mb-3" v-if="contractor != undefined">
           <label class="label is-small">Klient</label>
           <div class="field is-small mb-3">
-            <input class="input is-small is-static"
-                   type="text"
-                   :value="contractor.Knt_Nazwa1 + contractor.Knt_Nazwa2 + contractor.Knt_Nazwa3"
-                   readonly/>
+            <p class="mb-3 is-size-7">
+              {{ contractor.Knt_Nazwa1 + contractor.Knt_Nazwa2 + contractor.Knt_Nazwa3 }}
+            </p>
           </div>
         </div>
         <div class="field mb-3" v-if="order != undefined">
@@ -57,7 +62,7 @@ function cancelOrder(event: Event) {
         <div class="field mb-3" v-if="order != undefined">
           <label class="label is-small">Data zamówienia</label>
           <div class="field is-small">
-            <VueDatePicker
+           <VueDatePicker
               v-model="order.MZN_DataZam"
               :enable-time-picker="false"
               :clearable="true"
@@ -70,17 +75,22 @@ function cancelOrder(event: Event) {
         <div class="field mb-3" v-if="route != undefined">
           <label class="label is-small">Trasa</label>
           <div class="field is-small mb-3">
-            <input class="input is-small is-static"
-                   type="text"
-                   :value="route.MZT_Nazwa1"
-                   readonly/>
+            <p class="mb-3 is-size-7">
+              {{route.MZT_Nazwa1}}
+            </p>
           </div>
         </div>
-        <button class="button is-danger" @click="cancelOrder">Anuluj zamówienie</button>
+        <div class="field mb-3" v-if="order != undefined && order.MZN_Uwagi != undefined">
+          <label class="label is-small">Uwagi do zamówienia</label>
+          <p  class="mb-3 is-size-7">
+            {{ order.MZN_Uwagi }}
+          </p>
+        </div>
+        <button v-if="order.MZN_Anulowane==0" class="button is-danger" @click="cancelOrder">Anuluj zamówienie</button>
       </div>
     </div>
     <div v-for="category in categories" :key="category.Kod">
-      <div class="box mb-3" v-if="category.isVisible">
+      <div class="box mb-3 " :class="{'cancelled' : order.MZN_Anulowane == 1}" v-if="category.isVisible">
         <h1 class="title mb-3 is-6"><b>{{ category.Kod }}</b></h1>
         <div class="field" v-for="(product) in category.Towary" :key="product.Twr_Nazwa">
           <div v-if="Number(product.Quantity) > 0" class="mb-3">
@@ -88,53 +98,38 @@ function cancelOrder(event: Event) {
             <div class="columns is-mobile">
               <div class="column">
                 <div class="field">
-                  <p class="control is-expanded">
-                    <input class="input is-small is-static" type="text" placeholder="Ilość" :value="product.Quantity + ' ' + product.ChosenOption" readonly>
+                  <p class="control is-expanded is-size-7">
+                    {{ product.Quantity + ' ' + product.ChosenOption }}
                   </p>
                 </div>
               </div>
               <div class="column" v-if="product.ChosenOption == product.Twr_JM">
                 <div class="field">
-                  <input
-                    class="input is-small is-static"
-                    type="text"
-                    placeholder="Kwota"
-                    :value="product.Twr_Cena + ' PLN'"
-                    readonly
-                  />
+                  <p class="mb-3 is-size-7">
+                    {{ product.Twr_Cena }} PLN
+                  </p>
                 </div>
               </div>
               <div class="column" v-else-if="product.ChosenOption == product.Twr_JMZ">
                 <div class="field">
-                  <input
-                    class="input is-small is-static"
-                    type="text"
-                    placeholder="Kwota"
-                    :value="product.Twr_CenaZ + ' PLN'"
-                    readonly
-                  />
+                  <p class="mb-3 is-size-7">
+                    {{ product.Twr_CenaZ }} PLN
+                  </p>
                 </div>
               </div>
               <div class="column" v-if="product.ChosenOption == product.Twr_JM">
                 <div class="field">
-                  <input
-                    class="input is-small is-static"
-                    type="text"
-                    placeholder="Kwota"
-                    :value="(Number(product.Twr_Cena) * Number(product.Quantity)).toFixed(2) + ' PLN'"
-                    readonly
-                  />
+                  <p class="mb-3 is-size-7">
+                    {{ (Number(product.Twr_Cena) * Number(product.Quantity)).toFixed(2) }} PLN
+                  </p>
                 </div>
               </div>
               <div class="column" v-else-if="product.ChosenOption == product.Twr_JMZ">
                 <div class="field">
-                  <input
-                    class="input is-small is-static"
-                    type="text"
-                    placeholder="Kwota"
-                    :value="(Number(product.Twr_CenaZ) * Number(product.Quantity)).toFixed(2) + ' PLN'"
-                    readonly
-                  />
+                  <p class="mb-3 is-size-7">
+                    {{ (Number(product.Twr_CenaZ) * Number(product.Quantity)).toFixed(2) }} PLN
+                  </p>
+
                 </div>
               </div>
             </div>
@@ -144,4 +139,9 @@ function cancelOrder(event: Event) {
       </div>
     </div>
   </form>
-</template>
+</template>
+<style>
+.cancelled {
+  --bulma-box-background-color: var(--bulma-danger-soft)
+}
+</style>

src/components/MainForm.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import VueDatePicker from '@vuepic/vue-datepicker';
-import { axiosInstance, type Contractor, type OrderProduct, type Route } from '@/main'
+import VueDatePicker from '@vuepic/vue-datepicker'
+import { axiosInstance, type Contractor, type Order, type OrderProduct, type Route } from '@/main'
 import { useCategoriesStore } from '@/stores/categories.store'
 import { useContractorsStore } from '@/stores/contractors.store'
 import { useOrdersStore } from '@/stores/orders.store'
 import { storeToRefs } from 'pinia'
 import { useSiteControlStore } from '@/stores/siteControl.store'
-import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 import { useRoutesStore } from '@/stores/routes.store'
 
 const categoriesStore = useCategoriesStore();
@@ -16,7 +16,7 @@ const siteControlStore = useSiteControlStore();
 const routesStore = useRoutesStore();
 
 const { contractor, contractors } = storeToRefs(contractorsStore);
-const { deliveryDate, uuid, additionalNotes } = storeToRefs(ordersStore);
+const { deliveryDate, uuid, order, additionalNotes } = storeToRefs(ordersStore);
 const { categories } = storeToRefs(categoriesStore);
 const { showConfirmationModal, showCancellationModal, isDarkTheme } = storeToRefs(siteControlStore);
 const { route, routes } = storeToRefs(routesStore);
@@ -30,6 +30,8 @@ const routeSearch = ref<string>();
 const filteredRoutes = ref<Array<Route>>();
 const showRoutesDropdown = ref<boolean>(false);
 const routeInput = ref(null);
+const invoices = ref();
+const documentType = ref<number>()
 
 const showErrorNotification = ref<boolean>(false);
 const showSuccessNotification = ref<boolean>(false);
@@ -52,19 +54,32 @@ watch(route, (route) => {
   }
 }, { immediate: true });
 
+const totalAmountUnpaid = computed(() => {
+  let total = 0;
+  let totalPaid = 0;
+  for(let invoice of invoices.value) {
+    total += Number(invoice.BZd_KwotaSys);
+    totalPaid += Number(invoice.BZd_KwotaRozSys);
+  }
+  return (total - totalPaid).toFixed(2);
+});
+
 function createJSON(event: Event) {
   event.preventDefault();
   console.log(deliveryDate.value);
   if(typeof deliveryDate.value != typeof Date) {
     deliveryDate.value = new Date(deliveryDate.value as unknown as string);
   }
+
   const json = {
     MZN_UUID: uuid.value,
     MZN_DataZam: new Date(Date.now()).toISOString(),
     MZN_DataDos: deliveryDate.value != undefined ? deliveryDate.value.toISOString().split('T')[0] : null,
     MZN_PodID: contractor.value?.Knt_KntId,
     MZN_MZTID: route.value?.MZT_MZTID,
-    MZamElem: new Array<OrderProduct>
+    MZN_Uwagi: additionalNotes.value,
+    MZN_TypDokumentu: documentType.value,
+    MZamElem: new Array<OrderProduct>,
   };
 
   if(categories.value == undefined) {
@@ -121,6 +136,9 @@ function createJSON(event: Event) {
   console.log(JSON.stringify(json));
   axiosInstance.post('/zamowienie', JSON.stringify(json)).then( response => {
     uuid.value = response.data.MZN_UUID;
+    order.value = {} as Order;
+    order.value.MZN_MZNID = response.data.MZN_MZNID;
+    order.value.MZN_Bufor = 1;
     showSuccessNotification.value = true;
     successNotificationMessage.value = "Zamówienie zostało zapisane do bazy danych."
   });
@@ -166,6 +184,7 @@ function selectContractorFromDropdown(selectedContractor : Contractor) {
   console.log(selectedContractor);
   contractor.value = selectedContractor;
   showContractorsDropdown.value = false;
+  fetchInvoices();
 }
 
 function filterRoutes() {
@@ -205,8 +224,23 @@ function handleClickOutsideDropdown(event : Event) {
   }
 }
 
+async function fetchInvoices() {
+  const response = await axiosInstance.get('/zaleglosci/' + contractor.value?.Knt_KntId);
+  invoices.value = response.data;
+
+}
+
 onMounted(function (){
   document.addEventListener('click', handleClickOutsideDropdown);
+  console.log(order)
+  if(contractor.value != undefined) {
+    fetchInvoices();
+  }
+  if(order.value != undefined) {
+    documentType.value = order.value.MZN_TypDokumentu === 306 ? 306 : 301
+  }else documentType.value = 301
+   console.log(documentType.value)
+
 });
 
 onBeforeUnmount( function () {
@@ -219,8 +253,10 @@ onBeforeUnmount( function () {
     <div>
       <div class="box mb-5">
         <div class="mb-3">
-          <h1 class="title is-5"><b>ZAMÓWIENIE</b></h1>
-          <h1 class="subtitle is-5" v-if="uuid != undefined" ><b>{{ uuid }}</b></h1>
+          <h1 class="title is-5" v-if="order == undefined"><b>NOWE ZAMÓWIENIE</b></h1>
+          <h1 class="title is-5" v-else-if="!ordersStore.orderToClone"><b>ZAMÓWIENIE NR {{order.MZN_MZNID}}</b></h1>
+          <h1 class="title is-5" v-else-if="ordersStore.orderToClone"><b>DUPLIKACJA ZAMÓWIENIA NR {{order.MZN_MZNID}}</b></h1>
+
         </div>
         <div class="field mb-3">
           <label class="label is-small">Klient</label>
@@ -249,6 +285,32 @@ onBeforeUnmount( function () {
             </div>
           </div>
         </div>
+        <div class="field mb-3">
+          <DataTable :value="invoices" scrollable v-if="invoices != undefined && invoices.length > 0">
+            <Column field="BZd_NumerPelny" header="Numer faktury" frozen/>
+            <Column field="BZd_DataDok" header="Data"/>
+            <Column field="BZd_Termin" header="Termin zapłaty"/>
+            <Column field="BZd_KwotaSys" header="Kwota faktury"/>
+            <Column field="BZd_KwotaRozSys" header="Kwota rozliczona"/>
+            <ColumnGroup type="footer">
+              <Row>
+                <Column footer="Kwota zadłużenia" :colspan="4" footerStyle="text-align:right" />
+                <Column :footer="totalAmountUnpaid" />
+              </Row>
+            </ColumnGroup>
+          </DataTable>
+          <span v-else>Brak nierozliczonych faktur</span>
+        </div>
+        <div class="field mb-3">
+          <div>
+            <label class="label is-small">Dokument WZ</label>
+            <input
+              v-model="documentType"
+              type="checkbox"
+              :true-value="306"
+              :false-value="301">
+          </div>
+        </div>
         <div class="field mb-3">
           <label class="label is-small">Data dostawy</label>
           <div class="field is-small">
@@ -279,7 +341,7 @@ onBeforeUnmount( function () {
               <div class="dropdown-menu is-clipped has-background-info-on-scheme-invert" id="dropdown-menu" role="menu" style="max-width: calc(100vw - 3rem); box-shadow: 0px 0px 6px -1px rgba(165, 165, 165, 0.8); border-radius: 10px 10px 10px 10px; overflow-x:auto">
                 <div class="dropdown-content" style="max-height: 50vh; overflow-x: auto">
                   <a v-if="filteredRoutes != undefined && filteredRoutes.length == 0" class="dropdown-item is-clipped">Brak wyników</a>
-                  <a class="dropdown-item is-clipped" @click = "selectRouteFromDropdown(dropdownRoute)"
+                  <a class="dropdown-item is-clipped" @click = "selectRouteFromDropdown(null)"
                      v-bind:class = "{'has-background-info' : route == null}">Brak</a>
                   <a v-for="dropdownRoute in filteredRoutes" v-bind:key="dropdownRoute.MZT_MZTID"
                      class="dropdown-item is-clipped" @click = "selectRouteFromDropdown(dropdownRoute)"
@@ -361,6 +423,7 @@ onBeforeUnmount( function () {
                     </select>
                   </span>
                 </p>
+<!--TODO intesting part                 -->
                 <p class="control is-expanded">
                   <input class="input is-small" type="text" placeholder="Ilość" v-model="product.Quantity" v-bind:class="{ 'is-danger has-background-danger-soft': product.Quantity != undefined && isNaN(Number(product.Quantity)),'is-success has-background-success-soft': product.Quantity != undefined && product.Quantity as unknown as string != '' && !isNaN(Number(product.Quantity))}">
                 </p>

src/components/NavBar.vue

@@ -54,10 +54,10 @@ function routeLogin() {
 <template>
   <nav class="navbar has-shadow is-fixed-top" role="navigation" aria-label="main navigation">
     <div class="navbar-brand">
-      <a class="navbar-item is-overflow-hidden" style="max-width: calc(100vw - 50px); white-space: nowrap; overflow: hidden">
+      <div class="navbar-item is-overflow-hidden" style="max-width: calc(100vw - 50px); white-space: nowrap; overflow: hidden">
         <h3 class="title is-4">Mleczarnia</h3>
         <h4 v-if="username != undefined" class="subtitle is-4">&nbsp;{{'- ' + username}}</h4>
-      </a>
+      </div>
       <button @click="makeBurger" class="button navbar-burger is-pulled-right" data-target="navMenu" v-bind:class="{ 'is-active': activator }">
         <span aria-hidden="true"></span>
         <span aria-hidden="true"></span>
@@ -80,7 +80,7 @@ function routeLogin() {
       <div class="navbar-end">
         <div class="navbar-item">
           <div class="buttons">
-            <button class="button is-info" @click="siteControlStore.newOrder">
+            <button class="button is-info" @click="() => siteControlStore.newOrder('/')">
               Nowe Zamówienie
             </button>
             <button class="button is-info" @click="routeLogin" >

src/components/OrdersSelector.vue

@@ -4,7 +4,7 @@ import { computed, ref, watch } from 'vue'
 import { useOrdersStore } from '@/stores/orders.store'
 import { storeToRefs } from 'pinia'
 import { useSiteControlStore } from '@/stores/siteControl.store'
-import type { Order } from '@/main'
+import { addDays, type Order } from '@/main'
 
 const ordersStore = useOrdersStore();
 const siteControlStore = useSiteControlStore();
@@ -16,8 +16,8 @@ const areOrdersLoading = ref<boolean>(false);
 const { isDarkTheme, isLoading } = storeToRefs(siteControlStore);
 
 const date = new Date(Date.now());
-const startDate = new Date(date.getFullYear(), date.getMonth(), (date.getDate() - 2));
-const endDate = new Date(date.getFullYear()+1, date.getMonth(), date.getDay());
+const startDate = new Date(date.getFullYear(), date.getMonth(), (date.getDate()));
+const endDate = new Date(date.getFullYear(), date.getMonth()+1, date.getDate());
 searchOrderDate.value?.push(startDate, endDate);
 
 watch(isInBufor, (val) => {
@@ -58,12 +58,16 @@ const datesWithOrders = computed( ()=>{
   return datesWithOrders;
 })
 
-function viewOrder(order : Order) {
+function viewOrder(order : Order, clone: boolean) {
   order.loading = true;
-  siteControlStore.viewOrder(order.MZN_UUID);
+  siteControlStore.viewOrder(order.MZN_UUID, clone);
+}
+function documnetType(order : Order):string {
+  if(order.MZN_TypDokumentu == 306) return ". Dokument WZ"
+  else return ""
 }
 
-async function fetchOrders(event : Event) {
+async function fetchOrders(event : Event | null) {
   event?.preventDefault();
   areOrdersLoading.value = true;
   console.log(searchOrderDate.value);
@@ -72,9 +76,11 @@ async function fetchOrders(event : Event) {
     orders.value = await ordersStore.fetchOrdersByBuffer(buffer.value);
   }
   if(searchOrderDate.value != undefined) {
-    orders.value = await ordersStore.fetchOrdersByDateStartAndEnd(searchOrderDate.value[0], searchOrderDate.value[1], buffer.value);
+    orders.value = await ordersStore.fetchOrdersByDateStartAndEnd(addDays(searchOrderDate.value[0], 1), addDays(searchOrderDate.value[1], 1), buffer.value);
   }
   areOrdersLoading.value = false;
+  console.log("orders");
+  console.log(orders.value);
 }
 
 fetchOrders(null);
@@ -94,6 +100,7 @@ fetchOrders(null);
                            :highlight="dates"
                            input-class-name="input is-small calendar-background"
                            menu-class-name="calendar-background"
+                           format="dd/MM/yyyy"
                             range/>
           </div>
         </div>
@@ -125,6 +132,7 @@ fetchOrders(null);
                      :class="{'confirmed' : order.MZN_Bufor == 0 && order.MZN_Anulowane != 1,
                       'cancelled' : order.MZN_Anulowane == 1,
                       'is-skeleton' : areOrdersLoading}">
+                  <label class="label" :class="{'is-invisible': areOrdersLoading}">Zamówienie nr {{order.MZN_MZNID}}{{documnetType(order)}}  </label>
                   <label class="label is-small" :class="{'is-invisible': areOrdersLoading}">Klient</label>
                   <div class="field is-small mb-3" :class="{'is-invisible': areOrdersLoading}">
                     <input class="input is-small is-static"
@@ -158,14 +166,24 @@ fetchOrders(null);
                       </div>
                     </div>
                   </div>
-                  <label class="label is-small mb-5" :class="{'is-invisible': areOrdersLoading}">Produkty</label>
+                  <div v-if=" order.MZN_Uwagi != null && order.MZN_Uwagi != ''">
+                    <label class="label is-small" :class="{'is-invisible': areOrdersLoading} ">Uwagi</label>
+                    <div class="field is-small mb-3" :class="{'is-invisible': areOrdersLoading}">
+                    <span v-if=" order.MZN_Uwagi != null && order.MZN_Uwagi != ''">
+                      {{ order.MZN_Uwagi }}
+                    </span>
+                    </div>
+                  </div>
+                  <label class="label is-small mb-4" :class="{'is-invisible': areOrdersLoading}">Produkty</label>
                   <div class="field columns is-multiline is-mobile">
                     <template v-for="product in order.MZamElem" :key="product.MZE_TwrKod">
                       <div class="column is-6 py-0">{{ product.MZE_TwrKod }}</div>
                       <div class="column is-6 py-0">{{Number(product.MZE_TwrIlosc).toFixed(2) + " " + product.MZE_TwrJm}}</div>
                     </template>
                   </div>
-                  <button class="button is-info is-small is-expanded" :class="{'is-invisible': areOrdersLoading, 'is-loading': order.loading}" @click="viewOrder(order)">Podgląd</button>
+                  <button class="button is-info is-small is-expanded mr-2" :class="{'is-invisible': areOrdersLoading, 'is-loading': order.loading}" @click="viewOrder(order, false)">Podgląd</button>
+                  <button class="button is-info is-small is-expanded mr-2" :class="{'is-invisible': areOrdersLoading}" @click="viewOrder(order, true)">Duplikuj</button>
+
                 </div>
               </div>
             </template>

src/components/SummaryComponent.vue

@@ -1,65 +1,152 @@
 <script setup lang="ts">
-  import { useOrdersStore } from '@/stores/orders.store'
-  import { storeToRefs } from 'pinia'
-  import VueDatePicker from '@vuepic/vue-datepicker'
-  import { useSiteControlStore } from '@/stores/siteControl.store'
-  import { onBeforeUnmount, onMounted, ref } from 'vue'
-  import { useCategoriesStore } from '@/stores/categories.store'
-  import type { Product } from '@/main'
+import { useOrdersStore } from '@/stores/orders.store'
+import { storeToRefs } from 'pinia'
+import VueDatePicker from '@vuepic/vue-datepicker'
+import { useSiteControlStore } from '@/stores/siteControl.store'
+import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { useCategoriesStore } from '@/stores/categories.store'
+import type { Order, OrderProduct, Product } from '@/main'
+import { useRoutesStore } from '@/stores/routes.store'
+import { bool } from 'yup'
 
-  const ordersStore = useOrdersStore();
-  const categoriesStore = useCategoriesStore();
+const ordersStore = useOrdersStore()
+const categoriesStore = useCategoriesStore()
+const routeStore = useRoutesStore()
 
-  const { orders, dates } = storeToRefs(ordersStore);
-  const searchDate = ref<Date>(new Date(Date.now()));
-  const confirmedOrders = ref<boolean>();
-  const isSummed = ref<boolean>(true);
-  const isLoading = ref<boolean>(true);
-  const summedProducts = ref<Array<Product>>([]);
-  const products = ref<Array<Object>>();
+const { orders, dates } = storeToRefs(ordersStore)
+const { routes } = storeToRefs(routeStore)
+const searchDate = ref<Date>(new Date(Date.now()))
+const confirmedOrders = ref<boolean>()
+const isSummed = ref<boolean>(true)
+const nipGrouped = ref(false)
+const isLoading = ref<boolean>(true)
+const summedProducts = ref<Array<Product>>([])
+const products = ref<Array<Object>>()
+const ordersByRoute = ref<Map<string, Array<Order>>>(new Map<string, Array<Order>>())
+const orderByRouteAndNipRef = ref<Map<string, Map<number, {
+  orders: Order[];
+  products: OrderProduct[]
+}>>>(new Map<string, Map<number, { orders: Order[]; products: OrderProduct[] }>>)
+const activeButton = ref(null)
 
-  async function fetchOrders() {
-    isLoading.value=true;
-    console.log((confirmedOrders.value) ? true : null);
-    orders.value = await ordersStore.fetchOrdersByDateStartAndEnd(searchDate.value != undefined ? searchDate.value : new Date(Date.now()),
-      searchDate.value != undefined ? searchDate.value : new Date(Date.now()),
-      (confirmedOrders.value) ? true : null);
-    const productsMap = await categoriesStore.sumProductsFromOrders(orders.value);
-    for(const product of productsMap.values()) {
-      if(product.SummedQuantity > 0) {
-        summedProducts.value.push(product);
-      }
-    }
-    await prepareProductsFromOrders();
-    isLoading.value=false;
+const watchSearchDate = watch(searchDate, async (oldSearchDate, newSeatchDate) => {
+  if (oldSearchDate != newSeatchDate) {
+    await fetchOrders()
   }
+})
 
-  async function prepareProductsFromOrders() {
-    products.value = [];
-    if(orders.value == undefined) {
-      return;
+const watchConfirmedOrders = watch(confirmedOrders, async (oldConfirmedOrders, newConfirmedOrders) => {
+  if (oldConfirmedOrders != newConfirmedOrders) {
+    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()),
+    searchDate.value != undefined ? searchDate.value : new Date(Date.now()),
+    (confirmedOrders.value) ? false : null)
+  const productsMap = await categoriesStore.sumProductsFromOrders(orders.value)
+  summedProducts.value = []
+  for (const product of productsMap.values()) {
+    if (product.SummedQuantity > 0) {
+      summedProducts.value.push(product)
     }
+  }
+  await prepareProductsFromOrders()
 
-    for(const order of orders.value) {
-      for (const product of order.MZamElem) {
-        const newProduct = {
-          'kod': product.MZE_TwrKod,
-          'nazwa': product.MZE_TwrNazwa,
-          'ilosc': Number(product.MZE_TwrIlosc).toFixed(2),
-          'jm': product.MZE_TwrJm,
-          'cena': Number(product.MZE_TwrCena).toFixed(2),
-          'suma': Number(Number(product.MZE_TwrCena) * Number(product.MZE_TwrIlosc)).toFixed(2),
-          'order': {
-            'uuid': order.MZN_UUID,
-            'nazwaklienta': order.MZN_PodNazwa1 + order.MZN_PodNazwa2 + order.MZN_PodNazwa3
-          }
+  isLoading.value = false
+}
+
+function addRoutes() {
+  for (const route of routes.value) {
+    ordersByRoute.value.set(route.MZT_Nazwa1, [])
+    }
+  ordersByRoute.value.set('brak', [])
+}
+function updateProducts(order: UnwrapRefSimple<Order> | UnwrapRefSimple<UnwrapRefSimple<Order>>) {
+  for (const product of order.MZamElem) {
+    const newProduct = {
+      'kod': product.MZE_TwrKod,
+      'nazwa': product.MZE_TwrNazwa,
+      'ilosc': Number(product.MZE_TwrIlosc).toFixed(2),
+      'jm': product.MZE_TwrJm,
+      'cena': Number(product.MZE_TwrCena).toFixed(2),
+      'suma': Number(Number(product.MZE_TwrCena) * Number(product.MZE_TwrIlosc)).toFixed(2)
+    }
+    order.products.push(newProduct)
+  }
+}
+function prepareProductsFromOrders() {
+  products.value = []
+  if (orders.value == undefined || routes.value == undefined) {
+    return
+  }
+  addRoutes()
+  for (const order of orders.value) {
+    order.products = []
+    updateProducts(order)
+      const routeName = routes.value.find( route => {
+        return route.MZT_MZTID == order.MZN_MZTID
+      })?.MZT_Nazwa1;
+
+      ordersByRoute.value.get(routeName != undefined ? routeName : "brak")?.push(order);
+  }
+  console.log(orders.value)
+  console.log(ordersByRoute.value)
+  groupByNip()
+}
+
+function groupByNip() {
+  const orderByRouteAndNip = new Map<string, Map<number, { orders: Order[]; products: OrderProduct[] }>>()
+
+  for (const [route, orders] of ordersByRoute.value) {
+    const ordersByNip = new Map<number, { orders: Order[]; products: OrderProduct[] }>()
+
+    for (const order of orders) {
+      if (!ordersByNip.has(order.MZN_PodNipE)) {
+        ordersByNip.set(order.MZN_PodNipE, { orders: [], products: [] })
+      }
+      const entry = ordersByNip.get(order.MZN_PodNipE)
+      entry.orders.push(order)
+
+      for (const element of order.MZamElem) {
+        const existingProduct = entry.products.find(p => p.MZE_TwrId === element.MZE_TwrId)
+        if (existingProduct) {
+          existingProduct.MZE_TwrCena =String(Number(existingProduct.MZE_TwrCena).toFixed(2))
+          existingProduct.MZE_TwrIlosc = String(
+            Number(Number(existingProduct.MZE_TwrIlosc) + Number(element.MZE_TwrIlosc)).toFixed(2)
+          )
+          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)
         }
-        products.value.push(newProduct);
       }
     }
+    orderByRouteAndNip.set(route, ordersByNip)
   }
+  orderByRouteAndNipRef.value = orderByRouteAndNip
+  console.log(orderByRouteAndNip)
 
-  onMounted(async () => {
+}
+
+onMounted(async () => {
     orders.value = await ordersStore.fetchOrdersByDay(searchDate.value, null);
     const productsMap = await categoriesStore.sumProductsFromOrders(orders.value);
     summedProducts.value = [];
@@ -72,12 +159,39 @@
     await prepareProductsFromOrders();
     console.log(products.value);
     isLoading.value=false;
-  });
 
-  onBeforeUnmount( async function (){
+  console.log(ordersByRoute.value)
+});
+
+
+onBeforeUnmount(async function() {
     const siteControlStore = useSiteControlStore();
-    await siteControlStore.newOrder(false);
+    await siteControlStore.newOrder(null);
+})
+
+function documnetType(order : Order):string {
+  if(order.MZN_TypDokumentu == 306) return ". Dokument WZ"
+  else return ""
+}
+ function ifOneWZExists(orders: Array<UnwrapRefSimple<Order>> ):string {
+   for (const order of orders) {
+     console.log(order.MZN_TypDokumentu);
+     if (order.MZN_TypDokumentu === 306) return ". Dokument WZ"; // ❗ PRZERYWA funkcję natychmiast
+   }
+   return ""
+ }
+
+function hasNonEmptyUwagi(item: any): boolean {
+  let found = false;
+  item.orders.forEach(order => {
+    if(order.MZN_Uwagi) {
+      found = true;
+    }
   })
+
+  return found;
+}
+
 </script>
 
 <template>
@@ -100,12 +214,33 @@
             Tylko potwierdzone zamówienia?
           </label>
         </div>
-
-        <button class="button mt-3" @click="fetchOrders">Potwierdź</button>
       </div>
       <div class="box mt-3">
-        <button class="button is-fullwidth mb-3" @click="isSummed=false">Rozdzielone zamówienia</button>
-        <button class="button is-fullwidth mb-3" @click="isSummed=true">Zsumowane zamówienia</button>
+
+        <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 === 'separate' }"
+          @click="setActive('separate')"
+        >
+          Rozdzielone zamówienia
+        </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" v-print="'#printMe'">Drukuj</button>
       </div>
     </div>
@@ -115,18 +250,81 @@
           <div v-if="isLoading == true" class="is-flex is-justify-content-center is-flex-direction-row" style="height: 100%; align-content:space-evenly">
             <div class="title is-1 has-text-centered element is-loading" style="min-height: 150px; align-self: center;"></div>
           </div>
-          <DataTable :value="products" class="mb-3" style="padding:0" scrollable id="printMe" rowGroupMode="subheader" groupRowsBy="order.uuid" v-else-if="orders != undefined && orders.length != 0 && !isSummed">
-            <Column field="order.uuid" header="UUID"/>
-            <Column field="kod" header="Indeks" frozen></Column>
-            <Column field="nazwa" header="Nazwa"/>
-            <Column field="ilosc" header="Ilość"/>
-            <Column field="jm" header="JM"/>
-            <Column field="cena" header="Cena"/>
-            <Column field="suma" header="Suma"/>
-            <template #groupheader="slotProps">
-              <span>{{ slotProps.data.order.nazwaklienta }}</span>
-            </template>
-          </DataTable>
+          <div v-else-if="orders != undefined && orders.length != 0 && !isSummed" id="printMe">
+            <div v-for="route in routes" :key="route.MZT_MZTID">
+              <div v-if="route.MZT_Nazwa1 != undefined && ordersByRoute != undefined && ordersByRoute.has(route.MZT_Nazwa1)">
+                <div v-if="
+                //@ts-ignore
+                ordersByRoute.has(route.MZT_Nazwa1) && ordersByRoute?.get(route.MZT_Nazwa1) != undefined && ordersByRoute?.get(route.MZT_Nazwa1).length > 0"
+                     style="page-break-after: always;">
+                  <h1 class="is-size-2 is-fullwidth has-text-centered">{{
+                    //@ts-ignore
+                      route.MZT_Nazwa1 + ' ' + ordersByRoute?.get(route.MZT_Nazwa1)[0].MZN_DataDos
+                    }}</h1>
+
+                  <div v-if="!nipGrouped" v-for="order of ordersByRoute.get(route.MZT_Nazwa1)" :key="order.MZN_MZNID"
+                       class="pb-4" style="display: block; page-break-inside: avoid;">
+                    <p class="is-size-6 px-2">NIP {{order.MZN_PodNipE}}</p>
+                    <p class="is-size-6 px-2">{{order.MZN_PodNazwa1 + order.MZN_PodNazwa2 + order.MZN_PodNazwa3}}</p>
+                    <p class="is-size-5 px-2">ZAMÓWIENIE NR {{order.MZN_MZNID}}{{documnetType(order)}}</p>
+                    <DataTable :value="order.products" class="mb-3" style="padding:0" scrollable>
+                      <Column field="kod" header="Indeks" frozen></Column>
+                      <Column field="nazwa" header="Nazwa"/>
+                      <Column field="ilosc" header="Ilość"/>
+                      <Column field="jm" header="JM"/>
+                      <Column field="cena" header="Cena"/>
+                      <Column field="suma" header="Suma"/>
+                    </DataTable>
+                    <div v-if="order.MZN_Uwagi != undefined">
+                      <p class="is-size-6 px-2">Uwagi</p>
+                      <p class="is-size-6 px-2">{{order.MZN_Uwagi}}</p>
+                    </div>
+                  </div>
+                  <div v-else-if="nipGrouped"
+                       v-for="[nip, item] in Array.from(orderByRouteAndNipRef.get(route.MZT_Nazwa1) || new Map())"
+                       :key="nip" class="pb-4" style="display: block; page-break-inside: avoid;">
+
+                    <p class="is-size-5 px-2">NIP: {{ nip }}</p>
+
+                    <p class="is-size-6 px-2">
+                      {{ 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 > 1 ">
+                      ZAMÓWIENIA 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>
+                      <span>{{ifOneWZExists(orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders)}}</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><span>{{ifOneWZExists(orderByRouteAndNipRef.get(route.MZT_Nazwa1).get(nip).orders)}}</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>
+                      <Column field="MZE_TwrNazwa" header="Nazwa" />
+                      <Column field="MZE_TwrIlosc" header="Ilość" />
+                      <Column field="MZE_TwrJm" header="JM" />
+                      <Column field="MZE_TwrCena" header="Cena" />
+                      <Column field="suma" header="Suma" />
+                    </DataTable>
+                    <div >
+                      <p v-if="hasNonEmptyUwagi(item)"  class="is-size-6 px-2">Uwagi</p>
+                      <p v-for="order in item.orders" class="is-size-6 px-2">{{ order.MZN_Uwagi }}</p>
+                    </div>
+                  </div>
+                  </div>
+                </div>
+              </div>
+          </div>
           <DataTable :value="summedProducts" class="mb-3" style="padding:0" scrollable id="printMe" v-else-if="orders != undefined && orders.length != 0 && isSummed">
             <Column field="Twr_Kod" header="Indeks" frozen></Column>
             <Column field="Twr_Nazwa" header="Nazwa"/>
@@ -143,7 +341,7 @@
               </template>
             </Column>
           </DataTable>
-          <div v-else class="is-flex is-justify-content-center is-flex-direction-row">
+          <div v-else class="is-flex is-justify-content-center is-flex-direction-row" style="height: 100%">
             <p class="title is-1 has-text-centered" style="height: min-content; align-self: center;">Brak zamówień</p>
           </div>
         </div>
@@ -152,7 +350,7 @@
   </div>
 </template>
 
-<style>
+<style scoped>
   @media screen and (min-width: 500px) {
     .box {
       --bulma-box-padding: 1.5rem;
@@ -163,7 +361,10 @@
       --bulma-box-padding: 0.75rem;
     }
   }
-
+  .is-active {
+    background-color: #66d1ff;
+    color: white;
+  }
   .blackBorder {
     --bulma-table-cell-border-color : black;
   }

src/main.ts

@@ -49,10 +49,14 @@ watch (
   },
   {deep: true}
 )
+const currentUrl = window.location.href
 
+export const baseURL = currentUrl.includes("localhost")
+  ? "https://zamowienia-test.mleczarnia-kuzma.pl/api"
+  : currentUrl.substring(0, currentUrl.lastIndexOf("/") ) + "/api" ;
 
 export const axiosInstance = axios.create({
-  baseURL: 'https://zamowienia.mleczarnia-kuzma.pl/api',
+  baseURL: baseURL,
   withCredentials: true
 });
 
@@ -150,7 +154,34 @@ export interface Order {
   MZN_UUID: string,
   MZN_Uwagi: string,
   MZN_MZTID: number,
-  MZamElem: Array<OrderProduct>
+  MZamElem: Array<OrderProduct>,
+  products: any
+}
+
+export interface Order {
+  loading: boolean
+  MZN_Bufor: number,
+  MZN_Anulowane: number,
+  MZN_DataDos: string,
+  MZN_DataZam: string,
+  MZN_MZNID: number,
+  MZN_OpeID: number,
+  MZN_PodID: number,
+  MZN_PodKodPocztowy: string,
+  MZN_PodMiasto: string,
+  MZN_PodNazwa1: string,
+  MZN_PodNazwa2: string,
+  MZN_PodNazwa3: string,
+  MZN_PodNipE: string,
+  MZN_PodNrDomu: string,
+  MZN_PodUlica: string,
+  MZN_PodWojewodztwo: string,
+  MZN_TypDokumentu: number,
+  MZN_UUID: string,
+  MZN_Uwagi: string,
+  MZN_MZTID: number,
+  MZamElem: Array<OrderProduct>,
+  products: any
 }
 
 export interface OrderProduct {
@@ -163,6 +194,7 @@ export interface OrderProduct {
   MZE_TwrNazwa: string,
   MZE_TwrKod: string,
   MZE_TwrStawka: string | undefined,
+  suma?: number
 }
 
 export interface Route {
@@ -170,3 +202,9 @@ export interface Route {
   MZT_Nazwa1: string
 }
 
+export function addDays(date : Date, days : number) {
+  const result = new Date(date);
+  result.setDate(result.getDate() + days);
+  return result;
+}
+

src/router/router.ts

@@ -8,8 +8,8 @@ export const router = createRouter({
   routes: [
     { path: '/', component: MainView },
     { path: '/login', component: LoginView },
-    { path: '/summary', component: SummaryView,  },
-    { path: '/orders', component: OrdersView}
+    { path: '/summary', component: SummaryView},
+    { path: '/orders', component: OrdersView},
   ]
 });
 

src/stores/categories.store.ts

@@ -49,7 +49,8 @@ export const useCategoriesStore = defineStore('categories', () => {
             mapProduct.SummedPrice += (Number(product.MZE_TwrCena) * Number(product.MZE_TwrIlosc));
           }
           else if (product.MZE_TwrJm == mapProduct?.Twr_JMZ) {
-            mapProduct.SummedQuantity += (Number(product.MZE_TwrIlosc) * Number(mapProduct.Twr_JMPrzelicznikM))/Number(mapProduct.Twr_JMPrzelicznikL);
+            mapProduct.SummedQuantity += (Number(product.MZE_TwrIlosc) * Number(mapProduct.Twr_JMPrzelicznikL)/Number(mapProduct.Twr_JMPrzelicznikM));
+
             mapProduct.SummedPrice += (Number(product.MZE_TwrCena) * Number(product.MZE_TwrIlosc));
           }
         }

src/stores/orders.store.ts

@@ -11,6 +11,7 @@ export const useOrdersStore = defineStore('orders', () => {
   const deliveryDate = ref<Date>();
   const orderDate = ref<Date>();
   const additionalNotes = ref<string>();
+  const orderToClone = ref<boolean>();
 
   async function fetchOrders() {
     const response = await axiosInstance.get('/zamowienia', {withCredentials: true});
@@ -31,7 +32,8 @@ export const useOrdersStore = defineStore('orders', () => {
   }
 
   async function fetchOrdersByDateStartAndEnd(dateStart : Date, dateEnd : Date, inBuffer : boolean | null) {
-    let urlString = '/zamowienia?od=' + dateStart.toISOString().split('T')[0] + '&do=' + dateEnd.toISOString().split('T')[0]
+    let urlString = '/zamowienia?od=' + dateStart.toISOString().split('T')[0] + '&do=' + dateEnd.toISOString().split('T')[0];
+    console.log(urlString);
     if(inBuffer != null) {
       urlString += '&bufor=' + Number(inBuffer).toString();
     }
@@ -55,60 +57,66 @@ export const useOrdersStore = defineStore('orders', () => {
 
   async function getOrderDates() {
     const tempDates = new Array<Date>();
-    tempDates.push(...await fetchDates(0));
-    tempDates.push(...await fetchDates(1));
-    tempDates.push(...await fetchDates(2));
+    for (let i = 0; i <= 11; i++) {
+      tempDates.push(...await fetchDates(i));
+    }
     dates.value = tempDates;
     console.log(dates.value);
   }
 
   async function fetchDates(offset : number) {
     const date = new Date(Date.now());
-    const urlString = "/kalendarz/" + date.getFullYear() + '-' + Number(date.getMonth() + offset);
+    date.setMonth(offset );
+    const urlString = "/kalendarz/" + Number(date.getFullYear()) + "-" + Number(date.getMonth()+1);
     const response = await axiosInstance.get(urlString, {withCredentials: true});
     const datesTemp :Array<Date> = response.data;
     return datesTemp;
   }
 
+
+  function updateStores(contractor: Ref<Contractor | undefined>, contractors: Ref<Array<Contractor>>, tempOrder, route: Ref<Route | undefined>, routes: Ref<Array<Route> | undefined>, uuidString: string) {
+    contractor.value = <Contractor>contractors.value?.find((contractor) => contractor.Knt_KntId == tempOrder.MZN_PodID)
+    route.value = <Route>routes.value?.find((route) => route.MZT_MZTID == tempOrder.MZN_MZTID)
+    deliveryDate.value = new Date(tempOrder.MZN_DataDos)
+    orderDate.value = new Date(tempOrder.MZN_DataZam)
+    if(!orderToClone.value) {
+      uuid.value = uuidString
+    }else {
+      uuid.value = undefined
+    }
+    order.value = tempOrder
+    additionalNotes.value = tempOrder.MZN_Uwagi
+  }
+
+  function setOrderQuantities(tempOrder, categories: Ref<Array<Category>>) {
+    for (const orderProduct of tempOrder.MZamElem) {
+      for (const category of categories.value) {
+        const product = category.Towary.find(product => (product.Twr_TwrId == orderProduct.MZE_TwrId))
+        if (product != undefined && orderProduct.MZE_TwrCena != null) {
+          console.log(product)
+          if (orderProduct.MZE_TwrJm == product.Twr_JM) {
+            product.Twr_Cena = orderProduct.MZE_TwrCena.slice(0, -2)
+          } else if (orderProduct.Twr_Cena == product.Twr_JMZ) {
+            product.Twr_CenaZ = orderProduct.MZE_TwrCena.slice(0, -2)
+          }
+          product.Quantity = orderProduct.MZE_TwrIlosc.slice(0, -2)
+          product.ChosenOption = orderProduct.MZE_TwrJm
+          category.isVisible = true
+          break
+        }
+      }
+    }
+  }
+
   async function loadOrder(uuidString: string, confirmed: boolean, contractor: Ref<Contractor|undefined>, contractors: Ref<Array<Contractor>>, categories: Ref<Array<Category>>, route: Ref<Route|undefined>, routes: Ref<Array<Route>|undefined>) {
     const response = await axiosInstance.get('/zamowienie/' + uuidString);
     const tempOrder = response.data;
     console.log(tempOrder);
-
-    if(confirmed) {
-      tempOrder.MZN_Bufor = 0;
-    }
-
-    contractor.value = <Contractor>contractors.value?.find((contractor) => contractor.Knt_KntId == tempOrder.MZN_PodID);
-    route.value = <Route>routes.value?.find((route) => route.MZT_MZTID == tempOrder.MZN_MZTID);
-    deliveryDate.value = new Date(tempOrder.MZN_DataDos);
-    orderDate.value = new Date(tempOrder.MZN_DataZam);
-    uuid.value = uuidString;
-    order.value = tempOrder;
-    additionalNotes.value = tempOrder.MZN_Uwagi;
-
-    if(categories.value == undefined) {
-      return;
-    }
-
-    for(const orderProduct of tempOrder.MZamElem){
-      for(const category of categories.value) {
-        const product = category.Towary.find(product => (product.Twr_TwrId == orderProduct.MZE_TwrId));
-        if(product != undefined && orderProduct.MZE_TwrCena != null) {
-          console.log(product);
-          if(orderProduct.MZE_TwrJm == product.Twr_JM) {
-            product.Twr_Cena = orderProduct.MZE_TwrCena.slice(0, -2);
-          } else if(orderProduct.Twr_Cena == product.Twr_JMZ) {
-            product.Twr_CenaZ = orderProduct.MZE_TwrCena.slice(0, -2);
-          }
-          product.Quantity = orderProduct.MZE_TwrIlosc.slice(0, -2);
-          product.ChosenOption = orderProduct.MZE_TwrJm;
-          category.isVisible = true;
-          break;
-        }
-      }
-    }
+    if(confirmed)tempOrder.MZN_Bufor = 0;
+    updateStores(contractor, contractors, tempOrder, route, routes, uuidString)
+    if(categories.value == undefined) return;
+    setOrderQuantities(tempOrder, categories)
   }
 
-  return {orders, order, uuid, deliveryDate, orderDate, dates, additionalNotes, fetchOrders, loadOrder, fetchOrdersByDay, fetchOrdersByBuffer, fetchOrdersByDateStartAndEnd, fetchDates, getOrderDates}
+  return {orders,orderToClone, order, uuid, deliveryDate, orderDate, dates, additionalNotes, fetchOrders, loadOrder, fetchOrdersByDay, fetchOrdersByBuffer, fetchOrdersByDateStartAndEnd, fetchDates, getOrderDates}
 })

src/stores/siteControl.store.ts

@@ -14,6 +14,11 @@ export const useSiteControlStore = defineStore('siteControl', () => {
   const isDarkTheme = ref<boolean>(false);
   const isLoading = ref<boolean>(true);
 
+  const orderStore = useOrdersStore();
+  const contractorsStore = useContractorsStore();
+  const categoriesStore = useCategoriesStore();
+  const routeStore = useRoutesStore();
+
 
   async function switchToForm() {
     await router.push("/");
@@ -21,21 +26,9 @@ export const useSiteControlStore = defineStore('siteControl', () => {
 
   async function switchToOrders() {
     await router.push("/orders");
-    // const orderStore = useOrdersStore();
-    // const { orders } = storeToRefs(orderStore);
-    // isLoading.value = true;
-    // const date = new Date(Date.now());
-    // const startDate = new Date(date.getFullYear(), date.getMonth(), (date.getDate() - 2));
-    // const endDate = new Date(date.getFullYear()+1, date.getMonth(), date.getDay());
-    // orders.value = await orderStore.fetchOrdersByDateStartAndEnd(startDate, endDate, null);
-    // console.log(orders.value);
-    // isLoading.value = false;
-  }
+     }
 
   async function switchToTable() {
-    // const ordersStore = useOrdersStore();
-    // const { orders } = storeToRefs(ordersStore);
-    // orders.value = await ordersStore.fetchOrdersByDay(new Date(Date.now()), null);
     await router.push("/summary");
   }
 
@@ -43,28 +36,22 @@ export const useSiteControlStore = defineStore('siteControl', () => {
     isDarkTheme.value = !!window?.matchMedia?.('(prefers-color-scheme:dark)')?.matches;
   }
 
-  async function viewOrder(uuid : string) {
-    const orderStore = useOrdersStore();
-    const contractorsStore = useContractorsStore();
-    const categoriesStore = useCategoriesStore();
-    const routeStore = useRoutesStore();
+  async function viewOrder(uuid : string, clone:boolean ) {
     shownComponent.value = "mainForm";
     isLoading.value = true;
     await categoriesStore.fetchCategories();
     const { contractor, contractors } = storeToRefs(contractorsStore);
     const { categories } = storeToRefs(categoriesStore);
     const { route, routes } = storeToRefs( routeStore );
+    orderStore.orderToClone = clone;
     await orderStore.loadOrder(uuid, false, contractor, contractors, categories, route, routes);
     isLoading.value=false;
     await router.push("/");
+    window.scrollTo(0,0);
   }
 
-  async function newOrder(redirect : boolean) {
-    const ordersStore = useOrdersStore();
-    const contractorsStore = useContractorsStore();
-    const categoriesStore = useCategoriesStore();
-    const routeStore = useRoutesStore();
-    const { order, uuid, deliveryDate, orderDate } = storeToRefs(ordersStore);
+  async function newOrder(redirect : string) {
+    const { order, uuid, deliveryDate, orderDate, additionalNotes } = storeToRefs(orderStore);
     const { contractor } = storeToRefs(contractorsStore);
     const { route } = storeToRefs(routeStore);
     contractor.value = undefined;
@@ -73,11 +60,13 @@ export const useSiteControlStore = defineStore('siteControl', () => {
     deliveryDate.value = undefined;
     orderDate.value = undefined;
     route.value = undefined;
+    additionalNotes.value = undefined;
     await categoriesStore.fetchCategories();
-    if (redirect) {
-      await router.push("/");
+    if (redirect)
+    {
+      await router.push(redirect);
+      window.scrollTo(0,0);
     }
   }
-
-  return {isLoading, showConfirmationModal, showCancellationModal, isDarkTheme, shownComponent, switchToForm, switchToOrders, switchToTable, checkTheme, viewOrder, newOrder};
+  return {isLoading, showConfirmationModal, showCancellationModal, isDarkTheme, shownComponent, switchToForm, switchToOrders, switchToTable, checkTheme, viewOrder ,newOrder};
 })

src/views/LoginView.vue

@@ -29,14 +29,14 @@ async function onSubmit(values : any, { setErrors } : any) {
     const siteControlStore = useSiteControlStore();
     const { username } = storeToRefs(userStore);
     username.value = body.data.displayName;
-    await siteControlStore.newOrder(true);
+    await siteControlStore.newOrder("/");
   }
 
 }
 </script>
 
 <template>
-  <div class="container is-flex is-justify-content-space-evenly is-align-items-center" style="min-height: 100vh;">
+  <div class="container is-flex is-justify-content-space-evenly is-align-items-center" style="min-height: calc(100vh - 3.5rem)">
     <div class="box" style="width: 75%">
       <h1 class="title is-3 mb-3">Login</h1>
       <Form @submit="onSubmit" :validation-schema="schema" v-slot="{ errors, isSubmitting }">

src/views/MainView.vue

@@ -5,10 +5,9 @@
   </div>
   <div v-else>
     <MainForm
-        v-if="order == undefined || order.MZN_Bufor==1"
+        v-if="order == undefined || order.MZN_Bufor==1 || ordersStore.orderToClone"
       />
       <ConfirmedForm v-else-if="order.MZN_Bufor==0"/>
-
   </div>
   <ConfirmationModal v-show="showConfirmationModal" @close="showConfirmationModal = false"></ConfirmationModal>
   <CancelationModal v-show="showCancellationModal" @close="showCancellationModal = false"></CancelationModal>