From 8f4a22b80274984982635f25bd29407771835f03 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Thu, 11 Jan 2024 10:30:37 +0100
Subject: [PATCH 1/8] feat(SupplierDashboard.vue): added locations and customer
 Stock and exported mock data to .json

---
 .../src/assets/supplierDashboardMockData.json | 270 ++++++++++++++++++
 frontend/src/views/SupplierDashboard.vue      | 129 ++++-----
 2 files changed, 318 insertions(+), 81 deletions(-)
 create mode 100644 frontend/src/assets/supplierDashboardMockData.json

diff --git a/frontend/src/assets/supplierDashboardMockData.json b/frontend/src/assets/supplierDashboardMockData.json
new file mode 100644
index 00000000..d502f2c8
--- /dev/null
+++ b/frontend/src/assets/supplierDashboardMockData.json
@@ -0,0 +1,270 @@
+[
+    {
+        "name": "Customer 1",
+        "materials": {
+            "centralControlUnit": {
+                "name": "Central Control Unit",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                              "addressOne": {
+                                  "name": "Address 1",
+                                  "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                  "demandAdditional": [],
+                                  "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                  "currentStock": 300
+                              },
+                              "addressTwo": {
+                                  "name": "Address 2",
+                                  "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                  "demandAdditional": [],
+                                  "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                  "currentStock": 350
+                              }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                "demandAdditional": [],
+                                "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                "currentStock": 325
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                "demandAdditional": [],
+                                "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+                                "currentStock": 375
+                            }
+                        }
+                    }
+                }
+            },
+            "steeringWheel": {
+                "name": "Steering Wheel",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "demandAdditional": [],
+                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "currentStock": 200
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "demandAdditional": [],
+                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "currentStock": 275
+                            }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "demandAdditional": [],
+                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "currentStock": 250
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "demandAdditional": [],
+                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+                                "currentStock": 225
+                            }
+                        }
+                    }
+                }
+            },
+            "wheel": {
+                "name": "Wheel",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "demandAdditional": [],
+                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "currentStock": 175
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "demandAdditional": [],
+                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "currentStock": 150
+                            }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "demandAdditional": [],
+                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "currentStock": 100
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "demandAdditional": [],
+                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+                                "currentStock": 125
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    },
+    {
+        "name": "Customer 2",
+        "materials": {
+            "centralControlUnit": {
+                "name": "Central Control Unit",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
+                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
+                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
+                                "currentStock": 125
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
+                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
+                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
+                                "currentStock": 175
+                            }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
+                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
+                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
+                                "currentStock": 100
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
+                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
+                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
+                                "currentStock": 150
+                            }
+                        }
+                    }
+                }
+            },
+            "steeringWheel": {
+                "name": "Steering Wheel",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
+                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
+                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
+                                "currentStock": 200
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
+                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
+                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
+                                "currentStock": 275
+                            }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
+                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
+                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
+                                "currentStock": 250
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
+                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
+                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
+                                "currentStock": 225
+                            }
+                        }
+                    }
+                }
+            },
+            "seats": {
+                "name": "Seats",
+                "bpns": {
+                    "siteOne": {
+                        "name": "Site 1",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
+                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
+                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
+                                "currentStock": 300
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
+                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
+                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
+                                "currentStock": 375
+                            }
+                        }
+                    },
+                    "siteTwo": {
+                        "name": "Site 2",
+                        "bpna": {
+                            "addressOne": {
+                                "name": "Address 1",
+                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
+                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
+                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
+                                "currentStock": 325
+                            },
+                            "addressTwo": {
+                                "name": "Address 2",
+                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
+                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
+                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
+                                "currentStock": 350
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+]
diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index e040fd1c..cd9dcc15 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -39,9 +39,24 @@
                     </div>
                     <select v-model="dropdownMaterial" id="dropdown-material" name="ddm"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a material</option>
-                        <option v-for="item in dropdownCustomer.materials " :value="item" @click="emptyTotalDemandArray()">{{item.name}}</option>
+                        <option v-for="item in dropdownCustomer.materials " :value="item">{{item.name}}</option>
                     </select>
                 </div>
+                <div class="mt-2">
+                    <div>
+                        <label class="text-xl ">Location: </label>
+                    </div>
+                    <select v-model="dropdownBPNS" id="" name="ddbpns"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <option disabled value="" selected hidden>Choose a site</option>
+                        <option v-for="item in dropdownMaterial.bpns" :value="item"> {{item.name}} </option>
+                    </select>
+                    <div class="mt-2">
+                        <select v-model="dropdownBPNA" id="" name="ddbpna"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                            <option disabled value="" selected hidden>Choose an address</option>
+                            <option v-for="item in dropdownBPNS.bpna" :value="item" @click="emptyTotalDemandArray()"> {{item.name}} </option>
+                        </select>
+                    </div>
+                </div>
             </div>
 
             <!-- Second content bubble-->
@@ -69,25 +84,30 @@
                     <tr  id="demandActual">
                         <td class="firstColumn">Demand (Actual)</td>
 
-                        <td v-for="item in dropdownMaterial.demandActual " :value="item">{{item}}</td>
+                        <td v-for="item in dropdownBPNA.demandActual " :value="item">{{item}}</td>
 
                     </tr>
                     <tr id="demandAdditional">
                         <td class="firstColumn secondLastRow">Demand (Additional)</td>
 
-                        <td v-for="item in dropdownMaterial.demandAdditional" :value="item" class="secondLastRow">{{item}}</td>
+                        <td v-for="item in dropdownBPNA.demandAdditional" :value="item" class="secondLastRow">{{item}}</td>
 
                     </tr>
 
                     <tr id="demandTotal">
                         <td class="firstColumn">Demand (Total)</td>
 
-                        <td v-if="(dropdownMaterial.demandActual != null)"
-                            v-for="(item,index) in (addDemands(dropdownMaterial))"
+                        <td v-if="(dropdownBPNA.demandActual != null)"
+                            v-for="(item,index) in (addDemands(dropdownBPNA))"
                             :ref="setTotalDemand(item,index)"
                             :value="item">{{item}}</td>
                     </tr>
-
+                    <tr>
+                        <td class="firstColumn">
+                            Customer Stock:
+                            <span>100</span>
+                        </td>
+                    </tr>
                     <!-- line separator -->
                     <tr>
                         <td class="firstColumn"> </td>
@@ -105,7 +125,7 @@
                     <tr id="production">
                         <td class="firstColumn ">Production</td>
 
-                        <td v-for="(item, index) in dropdownMaterial.production"
+                        <td v-for="(item, index) in dropdownBPNA.production"
                             :style="changeBgColor(index,item)">
                             {{item}}</td>
                     </tr>
@@ -113,10 +133,13 @@
                     <tr>
                         <td class="firstColumn"></td>
                     </tr>
-
+                    <!-- -------------- -->
                     <tr>
-                        <template v-for="material in currentStocks">
-                            <td class="text-center firstColumn" v-if="material.name === dropdownMaterial.name"> <b>Your Stock:</b> &ensp;{{material.value}} </td>
+                        <template v-if="dropdownBPNA.currentStock !== null">
+                            <td class="text-center firstColumn">
+                              Your Stock:
+                              <span> {{dropdownBPNA.currentStock}} </span>
+                            </td>
                         </template>
                         <!-- <td class=" text-center" colspan="">Test Number</td> -->
 
@@ -129,7 +152,7 @@
 </template>
 
 <script>
-
+import supplierDashboardMockData from "@/assets/supplierDashboardMockData.json";
 export default{
   name: "SupplierDashboard",
 
@@ -139,84 +162,27 @@ export default{
         dropdownCustomer: "",
         // Material dropdown
         dropdownMaterial: "",
+        // BPNS dropdown
+        dropdownBPNS: "",
+        // BPNA dropdown
+        dropdownBPNA: "",
         // Dates
         datesData: [],
         // Temp array for total demand
         totalDemand: [],
         // Customer Json
-        customer: {
-            customer1: {
-                name: "Customer 1",
-                materials: {
-                    centralControlUnit: {
-                        name: "Central Control Unit",
-                        demandActual: [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                        demandAdditional: [],
-                        production: [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                    },
-                    steeringWheel: {
-                        name: "Steering Wheel",
-                        demandActual: [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                        demandAdditional: [],
-                        production: [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                    },
-                    wheel: {
-                        name: "Wheel",
-                        demandActual: [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                        demandAdditional: [],
-                        production: [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                    }
-                }
-            },
-            customer2: {
-                name: "Customer 2",
-                materials: {
-                    centralControlUnit: {
-                        name: "Central Control Unit",
-                        demandActual: [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
-                        demandAdditional: [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-                        production: [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-                    },
-                    steeringWheel: {
-                        name: "Steering Wheel",
-                        demandActual: [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
-                        demandAdditional: [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-                        production: [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-                    },
-                    seats: {
-                        name: "Seats",
-                        demandActual:     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
-                        demandAdditional: [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-                        production:       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-                    }
-                }
-            },
-        },
-        currentStocks:{
-            centralControlUnit: {
-                value: 300,
-                name: "Central Control Unit",
-            },
-            steeringWheel: {
-                value: 200,
-                name: "Steering Wheel",
-            },
-            wheel: {
-                value: 100,
-                name: "Wheel",
-            },
-            seats: {
-                value: 400,
-                name: "Seats",
-            },
-        },
+        customer: supplierDashboardMockData,
     };
   },
     mounted() {
-        setTimeout(()=> this.datesData = ["Tue, 01.08.2023", "Wed, 02.08.2023","Thu, 03.08.2023","Fr, 04.08.2023", "Sa, 05.08.2023", "Su, 06.08.2023", "Mo, 07.08.2023",
-        "Tue, 08.08.2023", "Wed, 09.08.202", "Thu, 10.08.2023", "Fr, 11.08.2023", "Sa, 12.08.2023", "Su, 13.08.2023", "Mo, 14.08.2023", "Tue, 15.08.2023", "Wed, 16.08.2023",
-        "Thu, 17.08.2023","Fr, 18.08.2023", "Sa, 19.08.2023", "So, 20.08.2023", "Mo, 21.08.2023", "Tue, 22.08.2023", "Wed, 23.08.2023", "Thu, 24.08.2023", "Fr, 25.08.2023",
-        "Sa, 26.08.2023","So, 27.08.2023", "Mo, 28.08.2023"])
+      let currentDate = new Date();
+      let updatedDate = new Date(currentDate.setDate(currentDate.getDate() + -1))
+
+      for(let i=0;i<28;i++) {
+          updatedDate = new Date(currentDate.setDate(currentDate.getDate() + 1))
+          this.datesData[i] = updatedDate.getDate() + "." + (updatedDate.getMonth() + 1) + "." + updatedDate.getFullYear();
+      }
+
     },
     methods: {
     addDemands: function(materialObject){
@@ -224,6 +190,7 @@ export default{
         var demandAdditional = materialObject.demandAdditional;
         let demandTotal = [];
 
+
         for (let i=0;i <demandActual.length;i++){
             if(demandAdditional[i] != undefined) {
                 demandTotal.push(parseFloat(demandActual[i]) + parseFloat(demandAdditional[i]));

From 764e10cfb5eee35b180aafd3a32935b6b789aaa9 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Fri, 12 Jan 2024 13:58:50 +0100
Subject: [PATCH 2/8] feat(SupplierDashboard.vue): added fetching off product
 and customer information to dropdown fields

---
 frontend/src/views/SupplierDashboard.vue | 81 ++++++++++++++++++------
 1 file changed, 63 insertions(+), 18 deletions(-)

diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index cd9dcc15..0e3fd638 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -6,7 +6,7 @@
  See the NOTICE file(s) distributed with this work for additional
  information regarding copyright ownership.
 
- This program and the accompanying materials are made available under the
+ This program and the accompanying products are made available under the
  terms of the Apache License, Version 2.0 which is available at
  https://www.apache.org/licenses/LICENSE-2.0.
 
@@ -24,22 +24,22 @@
 
             <!-- First content bubble-->
             <div class="grid bg-white rounded-lg border border-gray-200 shadow-md hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700  w-[100%] overflow-auto p-2.5 outerBox">
-                <div>
+                <div class="mt-2">
                     <div>
-                        <label for="dropdown-customer" class="text-xl">Customer: </label>
+                        <label for="dropdown-products" class="text-xl ">Products: </label>
                     </div>
-                    <select v-model="dropdownCustomer" id="dropdown-customer" name="ddc" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
-                        <option disabled value="" selected hidden>Choose a customer</option>
-                        <option v-for="item in customer" :value="item">{{item.name}}</option>
+                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts)" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <option disabled value="" selected hidden>Choose a product</option>
+                        <option v-for="item in fetchedProducts" :value="item" >{{item.ownMaterialNumber + "  (" + item.description + ")"}}</option>
                     </select>
                 </div>
-                <div class="mt-2">
+                <div>
                     <div>
-                        <label for="dropdown-material" class="text-xl ">Material: </label>
+                        <label for="dropdown-customer" class="text-xl">Customer: </label>
                     </div>
-                    <select v-model="dropdownMaterial" id="dropdown-material" name="ddm"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
-                        <option disabled value="" selected hidden>Choose a material</option>
-                        <option v-for="item in dropdownCustomer.materials " :value="item">{{item.name}}</option>
+                    <select v-model="dropdownCustomer" id="dropdown-customer" name="ddc" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <option disabled value="" selected hidden>Choose a customer</option>
+                        <option v-for="item in fetchedCustomers" :value="item">{{item.name}}</option>
                     </select>
                 </div>
                 <div class="mt-2">
@@ -48,12 +48,12 @@
                     </div>
                     <select v-model="dropdownBPNS" id="" name="ddbpns"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a site</option>
-                        <option v-for="item in dropdownMaterial.bpns" :value="item"> {{item.name}} </option>
+                        <option v-for="item in dropdownCustomer.sites" :value="item"> {{item.name}} </option>
                     </select>
                     <div class="mt-2">
                         <select v-model="dropdownBPNA" id="" name="ddbpna"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                             <option disabled value="" selected hidden>Choose an address</option>
-                            <option v-for="item in dropdownBPNS.bpna" :value="item" @click="emptyTotalDemandArray()"> {{item.name}} </option>
+                            <option v-for="item in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray()"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
                         </select>
                     </div>
                 </div>
@@ -158,16 +158,25 @@ export default{
 
   data() {
     return{
+        // get environmental endpoints
+        backendURL: import.meta.env.VITE_BACKEND_BASE_URL,
+        backendApiKey: import.meta.env.VITE_BACKEND_API_KEY,
+        endpointProducts: import.meta.env.VITE_ENDPOINT_PRODUCTS,
+        endpointCustomers: import.meta.env.VITE_ENDPOINT_CUSTOMER,
         // Customer dropdown
         dropdownCustomer: "",
         // Material dropdown
-        dropdownMaterial: "",
+        dropdownProducts: "",
         // BPNS dropdown
         dropdownBPNS: "",
         // BPNA dropdown
         dropdownBPNA: "",
         // Dates
         datesData: [],
+        // fetched Materials
+        fetchedProducts: [],
+        // fetched Customers
+        fetchedCustomers: [],
         // Temp array for total demand
         totalDemand: [],
         // Customer Json
@@ -182,12 +191,12 @@ export default{
           updatedDate = new Date(currentDate.setDate(currentDate.getDate() + 1))
           this.datesData[i] = updatedDate.getDate() + "." + (updatedDate.getMonth() + 1) + "." + updatedDate.getFullYear();
       }
-
+      this.getAllProducts();
     },
     methods: {
-    addDemands: function(materialObject){
-        var demandActual = materialObject.demandActual;
-        var demandAdditional = materialObject.demandAdditional;
+    addDemands: function(productObject){
+        var demandActual = productObject.demandActual;
+        var demandAdditional = productObject.demandAdditional;
         let demandTotal = [];
 
 
@@ -213,6 +222,42 @@ export default{
     emptyTotalDemandArray: function (){
         this.totalDemand.length = 0;
     },
+    testMethode: function (){
+        for(const test of this.fetchedProducts){
+            console.log(test.ownMaterialNumber)
+
+            fetch( "http://localhost:8081/catena/stockView/supplier?ownMaterialNumber=" + test.ownMaterialNumber, {
+                headers: {
+                    "X-API-KEY": "test",
+                },
+            })
+                .then((res) => res.json())
+                .then((data) => (this.fetchedCustomers = data) && console.log(data))
+                .catch((err) => console.log(err));
+
+        }
+    },
+    getAllProducts: function (){
+        fetch( this.backendURL + this.endpointProducts, {
+            headers: {
+                "X-API-KEY": this.backendApiKey,
+            },
+        })
+            .then((res) => res.json())
+            .then((data) => (this.fetchedProducts = data) && console.log(data))
+            .catch((err) => console.log(err));
+    },
+    getAllCustomers: function (productNumber){
+        console.log(productNumber)
+        fetch( this.backendURL + this.endpointCustomers + productNumber.ownMaterialNumber,{
+            headers: {
+                "X-API-KEY": this.backendApiKey,
+            },
+        })
+            .then((res) => res.json())
+            .then((data) => (this.fetchedCustomers = data) && console.log(data))
+            .catch((err) => console.log(err));
+    },
   }
 };
 

From 9e431940d64d1bb8aea472dc362bfa39049bddc2 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Fri, 19 Jan 2024 11:14:34 +0100
Subject: [PATCH 3/8] feat(SupplierDashboard.vue): added fetching data from
 endpoints for Products,Customer and Location

---
 .../src/assets/supplierDashboardMockData.json | 316 +++---------------
 frontend/src/views/SupplierDashboard.vue      | 188 ++++++++---
 2 files changed, 188 insertions(+), 316 deletions(-)

diff --git a/frontend/src/assets/supplierDashboardMockData.json b/frontend/src/assets/supplierDashboardMockData.json
index d502f2c8..5bbd9a55 100644
--- a/frontend/src/assets/supplierDashboardMockData.json
+++ b/frontend/src/assets/supplierDashboardMockData.json
@@ -1,270 +1,58 @@
 [
     {
-        "name": "Customer 1",
-        "materials": {
-            "centralControlUnit": {
-                "name": "Central Control Unit",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                              "addressOne": {
-                                  "name": "Address 1",
-                                  "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                  "demandAdditional": [],
-                                  "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                  "currentStock": 300
-                              },
-                              "addressTwo": {
-                                  "name": "Address 2",
-                                  "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                  "demandAdditional": [],
-                                  "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                  "currentStock": 350
-                              }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                "demandAdditional": [],
-                                "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                "currentStock": 325
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                "demandAdditional": [],
-                                "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-                                "currentStock": 375
-                            }
-                        }
-                    }
-                }
-            },
-            "steeringWheel": {
-                "name": "Steering Wheel",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "demandAdditional": [],
-                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "currentStock": 200
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "demandAdditional": [],
-                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "currentStock": 275
-                            }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "demandAdditional": [],
-                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "currentStock": 250
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "demandAdditional": [],
-                                "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-                                "currentStock": 225
-                            }
-                        }
-                    }
-                }
-            },
-            "wheel": {
-                "name": "Wheel",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "demandAdditional": [],
-                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "currentStock": 175
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "demandAdditional": [],
-                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "currentStock": 150
-                            }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "demandAdditional": [],
-                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "currentStock": 100
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "demandAdditional": [],
-                                "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-                                "currentStock": 125
-                            }
-                        }
-                    }
-                }
-            }
-        }
+    "name": "Address 2",
+    "demandActual": [],
+    "demandAdditional": [],
+    "production": [],
+    "customerStock": null,
+    "yourStock": null
     },
     {
-        "name": "Customer 2",
-        "materials": {
-            "centralControlUnit": {
-                "name": "Central Control Unit",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
-                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-                                "currentStock": 125
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
-                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-                                "currentStock": 175
-                            }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
-                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-                                "currentStock": 100
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
-                                "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-                                "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-                                "currentStock": 150
-                            }
-                        }
-                    }
-                }
-            },
-            "steeringWheel": {
-                "name": "Steering Wheel",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
-                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-                                "currentStock": 200
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
-                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-                                "currentStock": 275
-                            }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
-                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-                                "currentStock": 250
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
-                                "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-                                "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-                                "currentStock": 225
-                            }
-                        }
-                    }
-                }
-            },
-            "seats": {
-                "name": "Seats",
-                "bpns": {
-                    "siteOne": {
-                        "name": "Site 1",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
-                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-                                "currentStock": 300
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
-                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-                                "currentStock": 375
-                            }
-                        }
-                    },
-                    "siteTwo": {
-                        "name": "Site 2",
-                        "bpna": {
-                            "addressOne": {
-                                "name": "Address 1",
-                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
-                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-                                "currentStock": 325
-                            },
-                            "addressTwo": {
-                                "name": "Address 2",
-                                "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
-                                "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-                                "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-                                "currentStock": 350
-                            }
-                        }
-                    }
-                }
-            }
-        }
+    "name": "Address 2",
+    "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
+    "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
+    "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
+    "customerStock": 100,
+    "yourStock": 350
+    },
+    {
+    "name": "Address 2",
+    "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+    "demandAdditional": [],
+    "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
+    "customerStock": 125,
+    "yourStock": 375
+    },
+    {
+    "name": "Address 2",
+    "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+    "demandAdditional": [],
+    "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
+    "customerStock": 75,
+    "yourStock": 225
+    },
+    {
+    "name": "Address 2",
+    "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+    "demandAdditional": [],
+    "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
+    "customerStock": 150,
+    "yourStock": 125
+    },
+    {
+    "name": "Address 2",
+    "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
+    "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
+    "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
+    "customerStock": 100,
+    "yourStock": 150
+    },
+    {
+    "name": "Address 2",
+    "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
+    "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
+    "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
+    "customerStock": 50,
+    "yourStock": 225
     }
 ]
diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index 0e3fd638..d327cbc3 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -28,7 +28,7 @@
                     <div>
                         <label for="dropdown-products" class="text-xl ">Products: </label>
                     </div>
-                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts)" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts);getCustomerStocks(dropdownProducts)" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a product</option>
                         <option v-for="item in fetchedProducts" :value="item" >{{item.ownMaterialNumber + "  (" + item.description + ")"}}</option>
                     </select>
@@ -46,14 +46,14 @@
                     <div>
                         <label class="text-xl ">Location: </label>
                     </div>
-                    <select v-model="dropdownBPNS" id="" name="ddbpns"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownBPNS" id="dropdown-bpns" name="ddbpns"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a site</option>
                         <option v-for="item in dropdownCustomer.sites" :value="item"> {{item.name}} </option>
                     </select>
                     <div class="mt-2">
-                        <select v-model="dropdownBPNA" id="" name="ddbpna"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <select v-model="dropdownBPNA" id="dropdown-bpna" name="ddbpna"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                             <option disabled value="" selected hidden>Choose an address</option>
-                            <option v-for="item in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray()"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
+                            <option v-for="item in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray();mockDataInput(dropdownBPNA.bpna)"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
                         </select>
                     </div>
                 </div>
@@ -73,7 +73,6 @@
                 <!-- Line seperator-
                 <p class="border-b-gray-200 border-b"></p>
                 -->
-
                 <table>
                     <tr>
                         <td class="font-bold text-xl firstRow firstColumn">Customer Information</td>
@@ -84,28 +83,31 @@
                     <tr  id="demandActual">
                         <td class="firstColumn">Demand (Actual)</td>
 
-                        <td v-for="item in dropdownBPNA.demandActual " :value="item">{{item}}</td>
+                        <td v-for="item in mockDemandActual" :value="item">{{item}}</td>
 
                     </tr>
                     <tr id="demandAdditional">
                         <td class="firstColumn secondLastRow">Demand (Additional)</td>
 
-                        <td v-for="item in dropdownBPNA.demandAdditional" :value="item" class="secondLastRow">{{item}}</td>
+                        <td v-for="item in mockDemandAdditional" :value="item" class="secondLastRow">{{item}}</td>
 
                     </tr>
 
                     <tr id="demandTotal">
                         <td class="firstColumn">Demand (Total)</td>
 
-                        <td v-if="(dropdownBPNA.demandActual != null)"
-                            v-for="(item,index) in (addDemands(dropdownBPNA))"
+                        <td v-for="(item,index) in (addDemands())"
                             :ref="setTotalDemand(item,index)"
                             :value="item">{{item}}</td>
                     </tr>
                     <tr>
                         <td class="firstColumn">
                             Customer Stock:
-                            <span>100</span>
+                            <template v-if="dropdownBPNA !== ''">
+                                <span>
+                                    {{filterCustomerStocks(dropdownCustomer.bpnl,dropdownBPNS.bpns,dropdownBPNA.bpna)}}
+                                </span>
+                            </template>
                         </td>
                     </tr>
                     <!-- line separator -->
@@ -125,7 +127,7 @@
                     <tr id="production">
                         <td class="firstColumn ">Production</td>
 
-                        <td v-for="(item, index) in dropdownBPNA.production"
+                        <td v-for="(item, index) in mockProduction"
                             :style="changeBgColor(index,item)">
                             {{item}}</td>
                     </tr>
@@ -135,12 +137,14 @@
                     </tr>
                     <!-- -------------- -->
                     <tr>
-                        <template v-if="dropdownBPNA.currentStock !== null">
-                            <td class="text-center firstColumn">
-                              Your Stock:
-                              <span> {{dropdownBPNA.currentStock}} </span>
-                            </td>
-                        </template>
+                        <td class="text-center firstColumn">
+                          Your Stock:
+                          <template v-if="dropdownBPNA !== ''">
+                              <span>
+                                  {{filterAllProductStocks(dropdownProducts.ownMaterialNumber,dropdownCustomer.bpnl)}}
+                              </span>
+                          </template>
+                        </td>
                         <!-- <td class=" text-center" colspan="">Test Number</td> -->
 
                     </tr>
@@ -153,6 +157,7 @@
 
 <script>
 import supplierDashboardMockData from "@/assets/supplierDashboardMockData.json";
+import UnitOfMeasureUtils from "@/services/UnitOfMeasureUtils";
 export default{
   name: "SupplierDashboard",
 
@@ -163,6 +168,8 @@ export default{
         backendApiKey: import.meta.env.VITE_BACKEND_API_KEY,
         endpointProducts: import.meta.env.VITE_ENDPOINT_PRODUCTS,
         endpointCustomers: import.meta.env.VITE_ENDPOINT_CUSTOMER,
+        endpointAllProductStocks: import.meta.env.VITE_ENDPOINT_PRODUCT_STOCKS,
+        endpointReportedProductStocks: import.meta.env.VITE_ENDPOINT_REPORTED_PRODUCT_STOCKS,
         // Customer dropdown
         dropdownCustomer: "",
         // Material dropdown
@@ -177,10 +184,17 @@ export default{
         fetchedProducts: [],
         // fetched Customers
         fetchedCustomers: [],
-        // Temp array for total demand
-        totalDemand: [],
-        // Customer Json
-        customer: supplierDashboardMockData,
+        // fetched Customer Stocks
+        fetchedCustomerStocks: [],
+        // fetched all Product Stocks
+        fetchedAllProductStocks: [],
+        // Mockdata Json
+        mockData: supplierDashboardMockData,
+        // Mockdata temp Arrays
+        mockDemandActual: [],
+        mockDemandAdditional: [],
+        mockTotalDemand: [],
+        mockProduction: [],
     };
   },
     mounted() {
@@ -192,49 +206,41 @@ export default{
           this.datesData[i] = updatedDate.getDate() + "." + (updatedDate.getMonth() + 1) + "." + updatedDate.getFullYear();
       }
       this.getAllProducts();
+      this.getAllProductStocks();
     },
     methods: {
-    addDemands: function(productObject){
-        var demandActual = productObject.demandActual;
-        var demandAdditional = productObject.demandAdditional;
-        let demandTotal = [];
-
-
-        for (let i=0;i <demandActual.length;i++){
-            if(demandAdditional[i] != undefined) {
-                demandTotal.push(parseFloat(demandActual[i]) + parseFloat(demandAdditional[i]));
+    addDemands: function(){
+        for (let i=0;i <this.mockDemandActual.length;i++){
+            if(this.mockDemandAdditional[i] != undefined) {
+                this.mockTotalDemand[i] = (parseFloat(this.mockDemandActual[i]) + parseFloat(this.mockDemandAdditional[i]));
             } else {
-                demandTotal.push(parseFloat(demandActual[i]));
+                this.mockTotalDemand[i] = (parseFloat(this.mockDemandActual[i]));
             }
         }
-        return demandTotal;
+        return this.mockTotalDemand;
     },
     changeBgColor: function (index, production){
-        if (production < this.totalDemand[index]){
+        if (production < this.mockTotalDemand[index]){
             return {'background-color': 'red'};
         }
     },
     setTotalDemand: function (el, index){
-        if(el && this.totalDemand[index] == null) {
-            this.totalDemand.push(el);
-        }
+    //    if(el && this.mockTotalDemand[index] == null) {
+    //        this.mockTotalDemand.push(el);
+    //    }
     },
     emptyTotalDemandArray: function (){
-        this.totalDemand.length = 0;
+        this.mockTotalDemand.length = 0;
     },
-    testMethode: function (){
-        for(const test of this.fetchedProducts){
-            console.log(test.ownMaterialNumber)
-
-            fetch( "http://localhost:8081/catena/stockView/supplier?ownMaterialNumber=" + test.ownMaterialNumber, {
-                headers: {
-                    "X-API-KEY": "test",
-                },
-            })
-                .then((res) => res.json())
-                .then((data) => (this.fetchedCustomers = data) && console.log(data))
-                .catch((err) => console.log(err));
-
+    mockDataInput: function (BPNA){
+        if( BPNA === "BPNA2222222222XZ"){
+            this.mockDemandActual = this.mockData[1].demandActual;
+            this.mockDemandAdditional = this.mockData[1].demandAdditional;
+            this.mockProduction = this.mockData[1].production;
+        } else {
+            this.mockDemandActual = this.mockData[0].demandActual;
+            this.mockDemandAdditional = this.mockData[0].demandAdditional;
+            this.mockProduction = this.mockData[0].production;
         }
     },
     getAllProducts: function (){
@@ -244,7 +250,7 @@ export default{
             },
         })
             .then((res) => res.json())
-            .then((data) => (this.fetchedProducts = data) && console.log(data))
+            .then((data) => (this.fetchedProducts = data))
             .catch((err) => console.log(err));
     },
     getAllCustomers: function (productNumber){
@@ -255,9 +261,87 @@ export default{
             },
         })
             .then((res) => res.json())
-            .then((data) => (this.fetchedCustomers = data) && console.log(data))
+            .then((data) => (this.fetchedCustomers = data))
+            .catch((err) => console.log(err));
+    },
+    getCustomerStocks: function (productNumber){
+        console.log(productNumber)
+        fetch( this.backendURL + this.endpointReportedProductStocks + productNumber.ownMaterialNumber,{
+            headers: {
+                "X-API-KEY": this.backendApiKey,
+            },
+        })
+            .then((res) => res.json())
+            .then((data) => (this.fetchedCustomerStocks = data))
+            .catch((err) => console.log(err));
+    },
+    filterCustomerStocks: function (bpnl,bpns,bpna){
+        let filteredStocksMap = new Map();
+        let string = "";
+        for(let i=0;i <this.fetchedCustomerStocks.length;i++){
+            // Filter through this.fetchedCustomerStocks where bpnl,bpns and bpna are equal to the chosen dropdowns
+            if (bpnl === this.fetchedCustomerStocks[i].partner.bpnl && bpns === this.fetchedCustomerStocks[i].stockLocationBpns && bpna === this.fetchedCustomerStocks[i].stockLocationBpna) {
+                var uom = this.getUomValueForUomKey(this.fetchedCustomerStocks[i].measurementUnit)
+
+                // Check if Unitofmeasure already exists
+                    // If yes then delete the old (key,value) an add the value to the new (key,value)
+                if (filteredStocksMap.hasOwnProperty(uom)){
+                    var value = filteredStocksMap.get(uom)
+                    filteredStocksMap.delete(uom)
+                    filteredStocksMap.set(uom,this.fetchedCustomerStocks[i].quantity + value)
+
+                    // If no then just add (key,value)
+                } else {
+                    filteredStocksMap.set(uom, this.fetchedCustomerStocks[i].quantity)
+                }
+            }
+        }
+        for(let [key,value] of filteredStocksMap.entries()){
+            string += value + key + ", "
+        }
+
+        return string;
+    },
+    getAllProductStocks: function (){
+        fetch( this.backendURL + this.endpointAllProductStocks, {
+            headers: {
+                "X-API-KEY": this.backendApiKey,
+            },
+        })
+            .then((res) => res.json())
+            .then((data) => (this.fetchedAllProductStocks = data) && console.log(data))
             .catch((err) => console.log(err));
     },
+    filterAllProductStocks: function (material,bpnl){
+        let filteredStocksMap = new Map();
+        let string = "";
+        for(let i=0;i <this.fetchedAllProductStocks.length;i++){
+            // Filter through this.fetchedCustomerStocks where bpnl,bpns and bpna are equal to the chosen dropdowns
+            if (bpnl === this.fetchedAllProductStocks[i].partner.bpnl && material === this.fetchedAllProductStocks[i].material.materialNumberSupplier) {
+                var uom = this.getUomValueForUomKey(this.fetchedAllProductStocks[i].measurementUnit)
+
+                // Check if Unitofmeasure already exists
+                // If yes then delete the old (key,value) an add the value to the new (key,value)
+                if (filteredStocksMap.hasOwnProperty(uom)){
+                    var value = filteredStocksMap.get(uom)
+                    filteredStocksMap.delete(uom)
+                    filteredStocksMap.set(uom,this.fetchedAllProductStocks[i].quantity + value)
+
+                    // If no then just add (key,value)
+                } else {
+                    filteredStocksMap.set(uom, this.fetchedAllProductStocks[i].quantity)
+                }
+            }
+        }
+        for(let [key,value] of filteredStocksMap.entries()){
+            string += value + key + ", "
+        }
+
+        return string;
+    },
+    getUomValueForUomKey(key) {
+        return UnitOfMeasureUtils.findUomValueByKey(key);
+    },
   }
 };
 

From f89efd86eb9e47c8cec59b13372e718e5b007943 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Mon, 22 Jan 2024 15:41:59 +0100
Subject: [PATCH 4/8] feat(SupplierDashboard.vue): added mockdata aggregation
 and fixed bug in filter methods

Signed-off-by: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
---
 .../src/assets/supplierDashboardMockData.json | 38 ++-----
 frontend/src/views/SupplierDashboard.vue      | 99 ++++++++++++++-----
 2 files changed, 78 insertions(+), 59 deletions(-)

diff --git a/frontend/src/assets/supplierDashboardMockData.json b/frontend/src/assets/supplierDashboardMockData.json
index 5bbd9a55..c9826722 100644
--- a/frontend/src/assets/supplierDashboardMockData.json
+++ b/frontend/src/assets/supplierDashboardMockData.json
@@ -1,58 +1,32 @@
 [
     {
-    "name": "Address 2",
-    "demandActual": [],
-    "demandAdditional": [],
-    "production": [],
-    "customerStock": null,
-    "yourStock": null
-    },
-    {
-    "name": "Address 2",
     "demandActual":     [100,200,834,325,989,442,121,609,964,789,331,923,22,315,947,956,732,422,878,425,562,737,370,904,727,706,823,459],
     "demandAdditional": [22,300,0,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150,100,300,400,200,50,350,150],
-    "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357],
-    "customerStock": 100,
-    "yourStock": 350
+    "production":       [122,500,940,237,977,626,915,196,749,382,48,982,95,14,831,23,542,142,10,664,333,731,611,797,366,485,732,357]
     },
     {
-    "name": "Address 2",
     "demandActual": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
     "demandAdditional": [],
-    "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302],
-    "customerStock": 125,
-    "yourStock": 375
+    "production": [398,23,183,53,341,492,282,80,48,199,417,223,242,263,262,185,313,78,209,405,7,134,362,196,247,248,336,302]
     },
     {
-    "name": "Address 2",
     "demandActual": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
     "demandAdditional": [],
-    "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259],
-    "customerStock": 75,
-    "yourStock": 225
+    "production": [342,294,48,32,243,180,113,395,5,477,223,31,193,418,472,338,45,219,149,324,92,28,129,481,235,348,132,259]
     },
     {
-    "name": "Address 2",
     "demandActual": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
     "demandAdditional": [],
-    "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376],
-    "customerStock": 150,
-    "yourStock": 125
+    "production": [311,152,173,496,418,17,79,267,22,426,103,396,469,362,299,112,105,180,141,1,133,9,476,93,118,373,394,376]
     },
     {
-    "name": "Address 2",
     "demandActual": [399,238,16,187,317,496,134,189,264,15,357,203,322,388,1,65,423,441,119,28,417,460,218,129,217,5,63,198],
     "demandAdditional": [100,50,75,0,150,500,0,20,150,0,175,200,0,40,100,50,75,0,150,500,0,20,150,0,175,200,0,40],
-    "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198],
-    "customerStock": 100,
-    "yourStock": 150
+    "production": [499,288,66,187,467,996,134,209,314,15,532,403,322,248,101,115,498,441,269,528,417,460,218,129,392,205,63,198]
     },
     {
-    "name": "Address 2",
     "demandActual": [299,252,313,63,497,35,351,426,419,86,127,374,6,66,120,82,89,286,162,327,454,500,98,10,140,415,368,178],
     "demandAdditional": [100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75,100,0,50,200,150,0,75],
-    "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ],
-    "customerStock": 50,
-    "yourStock": 225
+    "production": [399,252,313,263,647,35,426,526,419,136,327,374,6,141,220,82,139,486,312,327,454,600,98,60,340,565,368,253 ]
     }
 ]
diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index d327cbc3..bca3df2d 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -28,7 +28,7 @@
                     <div>
                         <label for="dropdown-products" class="text-xl ">Products: </label>
                     </div>
-                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts);getCustomerStocks(dropdownProducts)" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts);getCustomerStocks(dropdownProducts);resetDropdownsFromProducts()" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a product</option>
                         <option v-for="item in fetchedProducts" :value="item" >{{item.ownMaterialNumber + "  (" + item.description + ")"}}</option>
                     </select>
@@ -37,7 +37,7 @@
                     <div>
                         <label for="dropdown-customer" class="text-xl">Customer: </label>
                     </div>
-                    <select v-model="dropdownCustomer" id="dropdown-customer" name="ddc" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownCustomer" id="dropdown-customer" name="ddc" @change="resetDropdownsFromCustomer()" :disabled="dropdownProducts === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a customer</option>
                         <option v-for="item in fetchedCustomers" :value="item">{{item.name}}</option>
                     </select>
@@ -46,14 +46,15 @@
                     <div>
                         <label class="text-xl ">Location: </label>
                     </div>
-                    <select v-model="dropdownBPNS" id="dropdown-bpns" name="ddbpns"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownBPNS" id="dropdown-bpns" name="ddbpns" @change="resetDropdownsFromBpns()" :disabled="dropdownCustomer === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a site</option>
                         <option v-for="item in dropdownCustomer.sites" :value="item"> {{item.name}} </option>
                     </select>
                     <div class="mt-2">
-                        <select v-model="dropdownBPNA" id="dropdown-bpna" name="ddbpna"  class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <select v-model="dropdownBPNA" id="dropdown-bpna" name="ddbpna" :disabled="dropdownBPNS === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                             <option disabled value="" selected hidden>Choose an address</option>
-                            <option v-for="item in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray();mockDataInput(dropdownBPNA.bpna)"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
+                            <option value="allAddresses" @click="emptyTotalDemandArray();aggregateAllAddressesData()">All addresses</option>
+                            <option v-for="(item,index) in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray();mockDataInput(index)"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
                         </select>
                     </div>
                 </div>
@@ -158,6 +159,7 @@
 <script>
 import supplierDashboardMockData from "@/assets/supplierDashboardMockData.json";
 import UnitOfMeasureUtils from "@/services/UnitOfMeasureUtils";
+
 export default{
   name: "SupplierDashboard",
 
@@ -219,6 +221,32 @@ export default{
         }
         return this.mockTotalDemand;
     },
+    aggregateAllAddressesData: function(){
+        var optionQuantityDdBpna = document.getElementById("dropdown-bpna").options.length - 2; // Minus 2 because of 'Choose an address' and 'All addresses'
+        this.mockDemandActual = []
+        this.mockDemandAdditional = []
+        this.mockProduction = []
+
+        for(let i=0;i<optionQuantityDdBpna;i++){
+            for(let j=0;j<this.mockData[i].demandActual.length;j++){
+                if (isNaN(this.mockDemandActual[j])){
+                    this.mockDemandActual[j] = this.mockData[i].demandActual[j];
+                    this.mockDemandAdditional[j] = this.mockData[i].demandAdditional[j];
+                    this.mockProduction[j] = this.mockData[i].production[j];
+                } else {
+                    this.mockDemandActual[j] += this.mockData[i].demandActual[j];
+                    if (!isNaN((this.mockData[i].demandAdditional[j]))) {
+                        if(isNaN(this.mockDemandAdditional[j])){
+                            this.mockDemandAdditional[j] = this.mockData[i].demandAdditional[j];
+                        } else {
+                            this.mockDemandAdditional[j] += this.mockData[i].demandAdditional[j];
+                        }
+                    }
+                    this.mockProduction[j] += this.mockData[i].production[j];
+                }
+            }
+        }
+    },
     changeBgColor: function (index, production){
         if (production < this.mockTotalDemand[index]){
             return {'background-color': 'red'};
@@ -232,16 +260,10 @@ export default{
     emptyTotalDemandArray: function (){
         this.mockTotalDemand.length = 0;
     },
-    mockDataInput: function (BPNA){
-        if( BPNA === "BPNA2222222222XZ"){
-            this.mockDemandActual = this.mockData[1].demandActual;
-            this.mockDemandAdditional = this.mockData[1].demandAdditional;
-            this.mockProduction = this.mockData[1].production;
-        } else {
-            this.mockDemandActual = this.mockData[0].demandActual;
-            this.mockDemandAdditional = this.mockData[0].demandAdditional;
-            this.mockProduction = this.mockData[0].production;
-        }
+    mockDataInput: function (index){
+        this.mockDemandActual = this.mockData[index].demandActual;
+        this.mockDemandAdditional = this.mockData[index].demandAdditional;
+        this.mockProduction = this.mockData[index].production;
     },
     getAllProducts: function (){
         fetch( this.backendURL + this.endpointProducts, {
@@ -285,11 +307,9 @@ export default{
 
                 // Check if Unitofmeasure already exists
                     // If yes then delete the old (key,value) an add the value to the new (key,value)
-                if (filteredStocksMap.hasOwnProperty(uom)){
-                    var value = filteredStocksMap.get(uom)
-                    filteredStocksMap.delete(uom)
-                    filteredStocksMap.set(uom,this.fetchedCustomerStocks[i].quantity + value)
-
+                if (filteredStocksMap.has(uom)){
+                    var value = parseFloat(filteredStocksMap.get(uom)) + parseFloat(this.fetchedCustomerStocks[i].quantity)
+                    filteredStocksMap.set(uom,value)
                     // If no then just add (key,value)
                 } else {
                     filteredStocksMap.set(uom, this.fetchedCustomerStocks[i].quantity)
@@ -316,17 +336,15 @@ export default{
         let filteredStocksMap = new Map();
         let string = "";
         for(let i=0;i <this.fetchedAllProductStocks.length;i++){
-            // Filter through this.fetchedCustomerStocks where bpnl,bpns and bpna are equal to the chosen dropdowns
+            // Filter through this.fetchedAllProductStocks where bpnl and material are equal to the chosen dropdowns
             if (bpnl === this.fetchedAllProductStocks[i].partner.bpnl && material === this.fetchedAllProductStocks[i].material.materialNumberSupplier) {
                 var uom = this.getUomValueForUomKey(this.fetchedAllProductStocks[i].measurementUnit)
 
                 // Check if Unitofmeasure already exists
-                // If yes then delete the old (key,value) an add the value to the new (key,value)
-                if (filteredStocksMap.hasOwnProperty(uom)){
-                    var value = filteredStocksMap.get(uom)
-                    filteredStocksMap.delete(uom)
-                    filteredStocksMap.set(uom,this.fetchedAllProductStocks[i].quantity + value)
-
+                    // If yes then delete the old (key,value) an add the value to the new (key,value)
+                if (filteredStocksMap.has(uom)){
+                    var value = parseFloat(filteredStocksMap.get(uom)) + parseFloat(this.fetchedAllProductStocks[i].quantity)
+                    filteredStocksMap.set(uom,value)
                     // If no then just add (key,value)
                 } else {
                     filteredStocksMap.set(uom, this.fetchedAllProductStocks[i].quantity)
@@ -342,6 +360,33 @@ export default{
     getUomValueForUomKey(key) {
         return UnitOfMeasureUtils.findUomValueByKey(key);
     },
+    resetDropdownsFromProducts(){
+        this.dropdownCustomer= "";
+        this.dropdownBPNS= "";
+        this.dropdownBPNA="";
+
+        this.mockDemandActual = [];
+        this.mockDemandAdditional = [];
+        this.mockProduction = [];
+        this.emptyTotalDemandArray();
+    },
+    resetDropdownsFromCustomer(){
+        this.dropdownBPNS= "";
+        this.dropdownBPNA="";
+
+        this.mockDemandActual = [];
+        this.mockDemandAdditional = [];
+        this.mockProduction = [];
+        this.emptyTotalDemandArray()
+    },
+    resetDropdownsFromBpns(){
+        this.dropdownBPNA="";
+
+        this.mockDemandActual = [];
+        this.mockDemandAdditional = [];
+        this.mockProduction = [];
+        this.emptyTotalDemandArray()
+    },
   }
 };
 

From c292155875f0c45ca8170ea2ebed9dd422392b14 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Thu, 25 Jan 2024 17:12:10 +0100
Subject: [PATCH 5/8] feat(SupplierDashboard.vue): fixed aggregation and added
 disabling of "Update Customer Button"

Signed-off-by: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
---
 frontend/src/views/SupplierDashboard.vue | 113 +++++++++++++++--------
 1 file changed, 76 insertions(+), 37 deletions(-)

diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index bca3df2d..b51a0833 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -1,12 +1,12 @@
 <!--
- Copyright (c) 2023 Volkswagen AG
- Copyright (c) 2023 Fraunhofer-Gesellschaft zur Foerderung der angewandten Forschung e.V. (represented by Fraunhofer ISST)
- Copyright (c) 2023 Contributors to the Eclipse Foundation
+ Copyright (c) 2023-2024 Volkswagen AG
+ Copyright (c) 2023-2024 Fraunhofer-Gesellschaft zur Foerderung der angewandten Forschung e.V. (represented by Fraunhofer ISST)
+ Copyright (c) 2023-2024 Contributors to the Eclipse Foundation
 
  See the NOTICE file(s) distributed with this work for additional
  information regarding copyright ownership.
 
- This program and the accompanying products are made available under the
+ This program and the accompanying materials are made available under the
  terms of the Apache License, Version 2.0 which is available at
  https://www.apache.org/licenses/LICENSE-2.0.
 
@@ -28,7 +28,7 @@
                     <div>
                         <label for="dropdown-products" class="text-xl ">Products: </label>
                     </div>
-                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts);getCustomerStocks(dropdownProducts);resetDropdownsFromProducts()" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownProducts" id="dropdown-products" @change="getAllCustomers(dropdownProducts);getCustomerStocks(dropdownProducts);resetDropdownsFromProducts();hoverUpdateCustomerDataButton = false" name="ddp" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a product</option>
                         <option v-for="item in fetchedProducts" :value="item" >{{item.ownMaterialNumber + "  (" + item.description + ")"}}</option>
                     </select>
@@ -37,7 +37,7 @@
                     <div>
                         <label for="dropdown-customer" class="text-xl">Customer: </label>
                     </div>
-                    <select v-model="dropdownCustomer" id="dropdown-customer" name="ddc" @change="resetDropdownsFromCustomer()" :disabled="dropdownProducts === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownCustomer" id="dropdown-customer" @change="resetDropdownsFromCustomer()" :disabled="dropdownProducts === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a customer</option>
                         <option v-for="item in fetchedCustomers" :value="item">{{item.name}}</option>
                     </select>
@@ -46,16 +46,22 @@
                     <div>
                         <label class="text-xl ">Location: </label>
                     </div>
-                    <select v-model="dropdownBPNS" id="dropdown-bpns" name="ddbpns" @change="resetDropdownsFromBpns()" :disabled="dropdownCustomer === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                    <select v-model="dropdownBPNS" id="dropdown-bpns" @change="resetDropdownsFromBpns()" :disabled="dropdownCustomer === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                         <option disabled value="" selected hidden>Choose a site</option>
                         <option v-for="item in dropdownCustomer.sites" :value="item"> {{item.name}} </option>
                     </select>
                     <div class="mt-2">
-                        <select v-model="dropdownBPNA" id="dropdown-bpna" name="ddbpna" :disabled="dropdownBPNS === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
+                        <select v-model="dropdownBPNA" id="dropdown-bpna" :disabled="dropdownBPNS === ''" class="w-60 py-2 px-4 bg-gray-200 text-gray-700 border border-gray-200 rounded focus:bg-white focus:outline-none focus:border-gray-500">
                             <option disabled value="" selected hidden>Choose an address</option>
                             <option value="allAddresses" @click="emptyTotalDemandArray();aggregateAllAddressesData()">All addresses</option>
                             <option v-for="(item,index) in dropdownBPNS.addresses" :value="item" @click="emptyTotalDemandArray();mockDataInput(index)"> {{item.streetAndNumber + ", " + item.zipCodeAndCity}} </option>
                         </select>
+                        <div v-if="hoverUpdateCustomerDataButton && dropdownProducts === ''"
+                             class="float-right font-bold"
+                             id="hintMessage"
+                        >
+                            You need to select a product first !
+                        </div>
                     </div>
                 </div>
             </div>
@@ -67,6 +73,10 @@
                         class="float-right bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
                         id="updateCustomerDataBtn"
                         type="submit"
+                        @click="updateCustomerStocks(dropdownProducts)"
+                        :disabled="dropdownProducts === ''"
+                        @mouseover="hoverUpdateCustomerDataButton = true"
+                        @mouseleave="hoverUpdateCustomerDataButton = false"
                     >
                         Update Customer Data
                     </button>
@@ -97,8 +107,7 @@
                     <tr id="demandTotal">
                         <td class="firstColumn">Demand (Total)</td>
 
-                        <td v-for="(item,index) in (addDemands())"
-                            :ref="setTotalDemand(item,index)"
+                        <td v-for="(item) in (addDemands())"
                             :value="item">{{item}}</td>
                     </tr>
                     <tr>
@@ -106,7 +115,7 @@
                             Customer Stock:
                             <template v-if="dropdownBPNA !== ''">
                                 <span>
-                                    {{filterCustomerStocks(dropdownCustomer.bpnl,dropdownBPNS.bpns,dropdownBPNA.bpna)}}
+                                    {{filterCustomerStocks(dropdownCustomer.bpnl,dropdownBPNS.bpns,dropdownBPNA)}}
                                 </span>
                             </template>
                         </td>
@@ -165,6 +174,7 @@ export default{
 
   data() {
     return{
+        hoverUpdateCustomerDataButton: false,
         // get environmental endpoints
         backendURL: import.meta.env.VITE_BACKEND_BASE_URL,
         backendApiKey: import.meta.env.VITE_BACKEND_API_KEY,
@@ -172,9 +182,11 @@ export default{
         endpointCustomers: import.meta.env.VITE_ENDPOINT_CUSTOMER,
         endpointAllProductStocks: import.meta.env.VITE_ENDPOINT_PRODUCT_STOCKS,
         endpointReportedProductStocks: import.meta.env.VITE_ENDPOINT_REPORTED_PRODUCT_STOCKS,
+        endpointUpdateReportedProductStocks: import.meta.env
+            .VITE_ENDPOINT_UPDATE_REPORTED_PRODUCT_STOCKS,
         // Customer dropdown
         dropdownCustomer: "",
-        // Material dropdown
+        // Product dropdown
         dropdownProducts: "",
         // BPNS dropdown
         dropdownBPNS: "",
@@ -201,7 +213,8 @@ export default{
   },
     mounted() {
       let currentDate = new Date();
-      let updatedDate = new Date(currentDate.setDate(currentDate.getDate() + -1))
+      let updatedDate;
+      currentDate.setDate(currentDate.getDate() - 1)
 
       for(let i=0;i<28;i++) {
           updatedDate = new Date(currentDate.setDate(currentDate.getDate() + 1))
@@ -229,19 +242,33 @@ export default{
 
         for(let i=0;i<optionQuantityDdBpna;i++){
             for(let j=0;j<this.mockData[i].demandActual.length;j++){
+                // Check if mockDemandActual is empty
                 if (isNaN(this.mockDemandActual[j])){
+                    // yes --> give value by setting it from mockData.demandActual
                     this.mockDemandActual[j] = this.mockData[i].demandActual[j];
-                    this.mockDemandAdditional[j] = this.mockData[i].demandAdditional[j];
-                    this.mockProduction[j] = this.mockData[i].production[j];
                 } else {
+                    // no --> just add new value on top of old value (cant add with empty Array because of NaN)
                     this.mockDemandActual[j] += this.mockData[i].demandActual[j];
-                    if (!isNaN((this.mockData[i].demandAdditional[j]))) {
-                        if(isNaN(this.mockDemandAdditional[j])){
-                            this.mockDemandAdditional[j] = this.mockData[i].demandAdditional[j];
-                        } else {
-                            this.mockDemandAdditional[j] += this.mockData[i].demandAdditional[j];
-                        }
+                }
+                // Check if mockDemandAdditional is empty
+                if (isNaN(this.mockDemandAdditional[j])){
+                    // yes --> give value by setting it from mockData.demandAdditional
+                    this.mockDemandAdditional[j] = this.mockData[i].demandAdditional[j];
+                } else {
+                    /*
+                      no --> just add new value on top of old value (cant add with empty Array because of NaN),
+                      but only when mockData.demandAdditional isnt empty itself
+                    */
+                    if(!isNaN(this.mockData[i].demandAdditional[j])){
+                        this.mockDemandAdditional[j] += this.mockData[i].demandAdditional[j];
                     }
+                }
+                // Check if mockProduction is empty
+                if (isNaN(this.mockProduction[j])){
+                    // yes --> give value by setting it from mockData.production
+                    this.mockProduction[j] = this.mockData[i].production[j];
+                } else {
+                    // no --> just add new value on top of old value (cant add with empty Array because of NaN)
                     this.mockProduction[j] += this.mockData[i].production[j];
                 }
             }
@@ -252,11 +279,6 @@ export default{
             return {'background-color': 'red'};
         }
     },
-    setTotalDemand: function (el, index){
-    //    if(el && this.mockTotalDemand[index] == null) {
-    //        this.mockTotalDemand.push(el);
-    //    }
-    },
     emptyTotalDemandArray: function (){
         this.mockTotalDemand.length = 0;
     },
@@ -276,7 +298,6 @@ export default{
             .catch((err) => console.log(err));
     },
     getAllCustomers: function (productNumber){
-        console.log(productNumber)
         fetch( this.backendURL + this.endpointCustomers + productNumber.ownMaterialNumber,{
             headers: {
                 "X-API-KEY": this.backendApiKey,
@@ -287,7 +308,6 @@ export default{
             .catch((err) => console.log(err));
     },
     getCustomerStocks: function (productNumber){
-        console.log(productNumber)
         fetch( this.backendURL + this.endpointReportedProductStocks + productNumber.ownMaterialNumber,{
             headers: {
                 "X-API-KEY": this.backendApiKey,
@@ -300,9 +320,10 @@ export default{
     filterCustomerStocks: function (bpnl,bpns,bpna){
         let filteredStocksMap = new Map();
         let string = "";
+
         for(let i=0;i <this.fetchedCustomerStocks.length;i++){
             // Filter through this.fetchedCustomerStocks where bpnl,bpns and bpna are equal to the chosen dropdowns
-            if (bpnl === this.fetchedCustomerStocks[i].partner.bpnl && bpns === this.fetchedCustomerStocks[i].stockLocationBpns && bpna === this.fetchedCustomerStocks[i].stockLocationBpna) {
+            if (bpnl === this.fetchedCustomerStocks[i].partner.bpnl && bpns === this.fetchedCustomerStocks[i].stockLocationBpns && (bpna.bpna === this.fetchedCustomerStocks[i].stockLocationBpna || bpna === "allAddresses")) {
                 var uom = this.getUomValueForUomKey(this.fetchedCustomerStocks[i].measurementUnit)
 
                 // Check if Unitofmeasure already exists
@@ -317,10 +338,25 @@ export default{
             }
         }
         for(let [key,value] of filteredStocksMap.entries()){
-            string += value + key + ", "
+            string += value + " " + key + ", "
         }
 
-        return string;
+        return string.slice(0,-2);
+    },
+    updateCustomerStocks: function(material){
+        console.log(material)
+        fetch(this.backendURL +
+            this.endpointUpdateReportedProductStocks +
+            material.ownMaterialNumber,
+            {
+                headers: {
+                    "X-API-KEY": this.backendApiKey,
+                },
+            }
+        )
+            .then((res) => res.json())
+            .then((data) => console.log(data))
+            .catch((err) => console.log(err));
     },
     getAllProductStocks: function (){
         fetch( this.backendURL + this.endpointAllProductStocks, {
@@ -352,10 +388,10 @@ export default{
             }
         }
         for(let [key,value] of filteredStocksMap.entries()){
-            string += value + key + ", "
+            string += value + " " + key + ", "
         }
 
-        return string;
+        return string.slice(0,-2);
     },
     getUomValueForUomKey(key) {
         return UnitOfMeasureUtils.findUomValueByKey(key);
@@ -393,15 +429,18 @@ export default{
 </script>
 
 <style scoped>
-#updateCustomerDataBtn {
+#updateCustomerDataBtn, #hintMessage{
     position: sticky;
     margin-top: 10px;
     right: 0;
     top: 0;
-
 }
-#showBtn{
-
+#updateCustomerDataBtn:disabled{
+    opacity: 0.6;
+}
+#updateCustomerDataBtn:disabled:hover{
+    --tw-bg-opacity: 0.6;
+    background-color: rgb(29 78 216 / var(--tw-bg-opacity));
 }
 th, td {
     padding: 10px;

From e31ea31fa6ed486c75299ad35eb215c12f624d5e Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Thu, 25 Jan 2024 17:29:54 +0100
Subject: [PATCH 6/8] feat: edited the banner message in StockView and
 SupplierDashboard

Signed-off-by: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
---
 frontend/src/views/StockView.vue         | 4 ++--
 frontend/src/views/SupplierDashboard.vue | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/views/StockView.vue b/frontend/src/views/StockView.vue
index f02b2b41..83170485 100644
--- a/frontend/src/views/StockView.vue
+++ b/frontend/src/views/StockView.vue
@@ -22,7 +22,8 @@
     <main class="flex flex-col mb-7">
         <header class="banner">
             <div class="banner-text">
-                CONFIDENTIAL - The data you see is confidential and should be treated according to present law
+                IMPORTANT: Please note that the data shown may be <b>competitively sensitive</b> and, according to appliable
+                antitrust laws,<b> must not </b>be shared with competitors. Please consult your legal department, if necessary.
             </div>
         </header>
         <h1 class="w-full text-center bold text-5xl mb-6 pb-6">
@@ -650,6 +651,5 @@ export default {
     text-align: center;
     padding: 10px;
     color: red;
-    font-weight: bold;
 }
 </style>
diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index c04a81ff..5f579563 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -22,7 +22,8 @@
     <main>
         <header class="banner">
             <div class="banner-text">
-                CONFIDENTIAL - The data you see is confidential and should be treated according to present law
+                IMPORTANT: Please note that the data shown may be <b>competitively sensitive</b> and, according to appliable
+                antitrust laws,<b> must not </b>be shared with competitors. Please consult your legal department, if necessary.
             </div>
         </header>
         <div class="text-gray-900 ">
@@ -445,7 +446,6 @@ export default{
     text-align: center;
     padding: 10px;
     color: red;
-    font-weight: bold;
 }
 #updateCustomerDataBtn, #hintMessage{
     position: sticky;

From 570cc7e8557c86789631f200f98c1588f6f9a1eb Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Tue, 30 Jan 2024 10:35:39 +0100
Subject: [PATCH 7/8] feat(StockView.vue): added disabling of "Update Partner
 Stocks" button if no material chosen

Signed-off-by: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
---
 frontend/src/assets/base.css                 |  3 +++
 frontend/src/views/SupplierDashboard.vue     | 14 +++++++-------
 frontend/src/views/stock/PartnerStockSFC.vue | 11 ++++++++---
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/frontend/src/assets/base.css b/frontend/src/assets/base.css
index a67a0e43..221ee740 100644
--- a/frontend/src/assets/base.css
+++ b/frontend/src/assets/base.css
@@ -97,4 +97,7 @@ input:disabled, select:disabled {
   .btn-primary {
     @apply my-2 bg-blue-500 text-white font-bold py-2 px-4 rounded hover:bg-blue-700;
   }
+  .btn-primary:disabled{
+      opacity: 0.6;
+  }
 }
diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index 5f579563..d131dd1d 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -92,9 +92,9 @@
                 -->
                 <table>
                     <tr>
-                        <td class="font-bold text-xl firstRow firstColumn">Customer Information</td>
+                        <th class="text-xl firstRow firstColumn">Customer Information</th>
 
-                        <td v-for="day in datesData" :value="day" class="firstRow">{{day}}</td>
+                        <th v-for="day in datesData" :value="day" class="firstRow">{{day}}</th>
 
                     </tr>
                     <tr  id="demandActual">
@@ -132,11 +132,11 @@
                     </tr>
 
                     <tr>
-                        <td class="font-bold text-xl firstRow firstColumn ">Your Own Information</td>
+                        <th class="text-xl firstRow firstColumn ">Your Own Information</th>
                         <!-- upper border of production items -->
-                        <td class="firstRow" v-for="item in datesData">
+                        <th class="firstRow" v-for="item in datesData">
                             {{}}
-                        </td>
+                        </th>
 
                     </tr>
 
@@ -281,7 +281,7 @@ export default{
         }
     },
     changeBgColor: function (index, production){
-        if (production < this.totalDemand[index]){
+        if (production < this.mockTotalDemand[index]){
             return {'background-color': 'red'};
         }
     },
@@ -467,7 +467,7 @@ th, td {
 div > .outerBox{
     margin: 20px 0px;
 }
-td.firstRow{
+th.firstRow{
     font-weight: bold;
     border-bottom: 1px solid rgb(229 231 235 / var(--tw-border-opacity));;
 }
diff --git a/frontend/src/views/stock/PartnerStockSFC.vue b/frontend/src/views/stock/PartnerStockSFC.vue
index 5f757682..a9b364d3 100644
--- a/frontend/src/views/stock/PartnerStockSFC.vue
+++ b/frontend/src/views/stock/PartnerStockSFC.vue
@@ -31,20 +31,25 @@
                 Your {{ this.partnerRole }}s' stocks for
                 {{ this.selectedMaterialOrProductId }}.
             </h3>
-            <button class="btn-primary" @click="updateMaterialOrProduct()">
+            <button class="btn-primary"
+                    @click="updateMaterialOrProduct()"
+                    :disabled="this.selectedMaterialOrProductId === ''"
+            >
                 Update Partner Stocks
             </button>
         </div>
         <p v-if="this.partnerRole === 'supplier'">
             <i>
                 Info: These are your suppliers' stocks (your potential inputs)
-                at his site that not yet sent to you.
+                at his site that have not yet been sent to you. <br>
+                Please choose a material from above table before clicking the "Update Partner Stocks" button.
             </i>
         </p>
         <p v-else-if="this.partnerRole === 'customer'">
             <i>
                 Info: These are your customers' stocks (your recent outputs) at
-                his site that have not yet been used for production.
+                his site that have not yet been used for production. <br>
+                Please choose a material from above table before clicking the "Update Partner Stocks" button.
             </i>
         </p>
         <div class="overflow-x-auto min-h-60 max-h-80">

From 779e51e88b51590275391a80b09651bf5ff336d6 Mon Sep 17 00:00:00 2001
From: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
Date: Tue, 30 Jan 2024 12:21:15 +0100
Subject: [PATCH 8/8] refactor(SupplierDashboard.vue): removed unnecessary
 console.logs

Signed-off-by: Pascal Marzec <pascal.marzec@isst.fraunhofer.de>
---
 frontend/src/views/SupplierDashboard.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/frontend/src/views/SupplierDashboard.vue b/frontend/src/views/SupplierDashboard.vue
index d131dd1d..1f9ef05e 100644
--- a/frontend/src/views/SupplierDashboard.vue
+++ b/frontend/src/views/SupplierDashboard.vue
@@ -350,7 +350,6 @@ export default{
         return string.slice(0,-2);
     },
     updateCustomerStocks: function(material){
-        console.log(material)
         fetch(this.backendURL +
             this.endpointUpdateReportedProductStocks +
             material.ownMaterialNumber,
@@ -371,7 +370,7 @@ export default{
             },
         })
             .then((res) => res.json())
-            .then((data) => (this.fetchedAllProductStocks = data) && console.log(data))
+            .then((data) => (this.fetchedAllProductStocks = data))
             .catch((err) => console.log(err));
     },
     filterAllProductStocks: function (material,bpnl){