Merge branch 'master' into fronkdev

public/js/pages/IpNetwork/IpNetwork.js

@@ -17,7 +17,7 @@ Vue.component('IpNetwork', {
               <i class="fas fa-sync-alt"></i>Go Back
             </button>
 
-            <button type="button" class="btn btn-primary" @click="addModal = true">
+            <button type="button" class="btn btn-primary" @click="openModal(false)">
               <i class="fas fa-sync-alt"></i>Add new Network Space
             </button>
 
@@ -28,6 +28,13 @@ Vue.component('IpNetwork', {
                 <span style="white-space: pre;" v-if="row.description" v-text="row.description"></span>
                 <span v-else>No description</span>
             </template>
+          
+          <template v-slot:actions="{ row }">
+            <div style="display: flex; justify-content: space-around; align-items: center; min-width: 20px">
+              <a style="cursor: pointer;" @click.stop="openModal(row)"><i class="far fa-edit text-primary"
+                                                                         title="Editieren"></i></a>
+            </div>
+          </template>
 
         </tt-table>
 
@@ -47,11 +54,12 @@ Vue.component('IpNetwork', {
                   <div class="form-group">
                     <label for="network_address">Network Address</label>
                     <input type="text" class="form-control" id="network_address"
+                           :disabled="!!addModalData.id"
                            v-model="addModalData.network_address">
                   </div>
                   <div class="form-group">
                     <label for="cidr">CIDR</label>
-                    <input type="text" class="form-control" id="cidr" v-model="addModalData.cidr">
+                    <input type="text" class="form-control" id="cidr" :disabled="!!addModalData.id" v-model="addModalData.cidr">
                   </div>
                   <div class="form-group">
                     <label for="status">Status</label>
@@ -83,6 +91,7 @@ Vue.component('IpNetwork', {
               </div>
               <div class="modal-footer">
                 <button class="btn btn-primary" @click="addSubmit">Save</button>
+                <button class="btn btn-danger" @click="deleteSubmit" v-if="addModalData.id">Delete</button>
                 <button class="btn btn-secondary" @click="addModal = false">Close</button>
               </div>
             </div>
@@ -112,6 +121,7 @@ Vue.component('IpNetwork', {
                             {value: 'reserved', text: 'Reserved', icon: 'fas fa-lock text-warning'}]
                     },
                     {text: 'Children', key: 'children', filter: 'numberRange'},
+                    {text: 'Aktionen', key: 'actions', sortable: false},
                 ],
                 tableHeader: 'IPAM',
                 key: 'IpNetwork'
@@ -140,6 +150,34 @@ Vue.component('IpNetwork', {
 
     },
     methods: {
+        openModal(row = false) {
+            if (row) {
+                const data = JSON.parse(JSON.stringify(row));
+
+
+                this.addModalData = {
+                    id: data.id,
+                    network_address: data.network_address_str.split('/')[0],
+                    cidr: data.cidr,
+                    parent_network_id: this.currentNetworkData ? this.currentNetworkData.id : '',
+                    status: data.status,
+                    name: data.name,
+                    description: data.description,
+                    location: data.location,
+                }
+            } else {
+                this.addModalData = {
+                    network_address: '',
+                    cidr: '',
+                    parent_network_id: this.currentNetworkData ? this.currentNetworkData.id : '',
+                    status: 'active',
+                    name: '',
+                    description: '',
+                    location: '',
+                };
+            }
+            this.addModal = true;
+        },
         async switchCurrentNetwork(networkId = null) {
             if (!networkId) {
                 this.$refs.table.$set(this.$refs.table.filters, 'parent_network_id', undefined);
@@ -159,18 +197,30 @@ Vue.component('IpNetwork', {
             await this.$refs.table.fetchData();
         },
         async addSubmit() {
-            const response = await axios.post(`${this.apiUrl}?do=create`,
+            const response = await axios.post(`${this.apiUrl}?do=${this.addModalData.id ? 'update' : 'create'}`,
                 {
                     ...this.addModalData,
                     parent_network_id: this.currentNetworkData ? this.currentNetworkData.id : null
                 });
             if (response.data.status === 'success') {
                 this.addModal = false;
+                this.addModalData = {};
                 window.notify('success', 'Network space created successfully');
                 await this.$refs.table.fetchData();
             } else {
                 window.notify('error', response.data.message);
             }
         },
+        async deleteSubmit() {
+            const response = await axios.post(`${this.apiUrl}?do=delete`, {id: this.addModalData.id});
+            if (response.data.status === 'success') {
+                this.addModal = false;
+                this.addModalData = {};
+                window.notify('success', 'Network space deleted successfully');
+                await this.$refs.table.fetchData();
+            } else {
+                window.notify('error', response.data.message);
+            }
+        }
     },
 })

public/js/pages/WarehouseArticle/WarehouseArticle.js

@@ -37,7 +37,7 @@ Vue.component('warehouse-distributor-modal', {
 
             this.rows = response.data.rows
         }, addRow() {
-            this.rows.push({distributor: null, price: null, externalArticleNumber: null});
+            this.rows.push({distributorId: undefined, price: null, externalArticleNumber: null});
         }, async saveRow(index) {
             // post to /WarehouseArticleDistributor/save with rows data and articleId
             const row = this.rows[index];
@@ -256,6 +256,12 @@ Vue.component('warehouse-article', {
                                    @editPricesEntries="priceModal = true; priceModalId = $event.id"
                                    @editThresholdEntries="thresholdModal = true; thresholdModalId = $event.id">
 
+                      <template v-slot:cheapestsellprice="{ row }">
+                        <template v-for="price in JSON.parse(row.cheapestSellPrice)">
+                          <span v-if="price">{{price.title}}: {{(price.price)}} €</span><br>
+                        </template>
+                      </template>
+
                       <template v-slot:cheapestPurchasePrice="{ row }">
                         <span>{{(row.cheapestPurchasePrice * row.sellPriceMultiplier).toFixed(2)}} €</span>
                       </template>

public/js/pages/WarehouseArticlePacket/WarehouseArticlePacket.js

@@ -0,0 +1,90 @@
+Vue.component('WarehouseArticlePacket', {
+    //language=Vue
+    template:   `
+                  <tt-card>
+                    <tt-table-crud @openHistory="historyModal = true; historyModalId = $event.id" ref="WarehouseArticlePacketCrud">
+
+                      <template v-slot:subitems="{row}">
+                      <template v-for="item in JSON.parse(row.subItems)">
+                        <span v-if="articles.find(article => article.value === item.id)">
+                        {{item.amount + 'x '}}{{articles.find(article => article.value === item.id).text}}<br>
+                        </span>
+                        <span v-else></span>
+                        </template>
+                      </template>
+
+                      <template v-slot:subitems-modal="{crudModalData}">
+                        <!-- TODO: add autocomplete and list with items, each removable, just simple quick-->
+                        <div style="display: grid; grid-template-columns: 1fr 1fr auto;grid-gap: 8px">
+                          <tt-autocomplete v-model="subItemsAutocomplete"
+                                           :items="articles"
+                                           ref="subItemsAutocomplete"
+                                           label="Subitems" sm/>
+                          <tt-input v-model="newSubItemAmount" label="Menge" sm/>
+                          <button type="button" class="btn btn-primary" @click="addSubItem" style="max-height: 32px; align-self: center">
+                            <i class="fas fa-plus"></i>
+                          </button>
+                        </div>
+                        <ul class="list-group" v-if="typeof subItems !== 'undefined' && subItems.length > 0" :key="updateCounter">
+                          <template v-for="item in subItems">
+                            <li class="list-group-item d-flex justify-content-between align-items-center">
+                              Menge {{item.amount}} | Artikel {{articles.find(article => article.value === item.id).text}}
+                              <button type="button" class="btn btn-danger btn-sm" @click="removeSubItem(item)">
+                                <i class="fas fa-trash"></i>
+                              </button>
+                            </li>
+                          </template>
+                        </ul>
+                        <span v-else>Keine Artikel hinzugefügt</span>
+
+                      </template>
+
+                    </tt-table-crud>
+                    <warehouse-history-modal :show.sync="historyModal" :id="historyModalId"/>
+                  </tt-card>
+                `, data() {
+        return {
+            window:               window,
+            historyModal:         false,
+            historyModalId:       null,
+            subItemsAutocomplete: '',
+            articles:             [],
+            updateCounter:        0,
+            newSubItemAmount:     1,
+            subItems:             []
+        }
+    }, beforeMount() {
+        this.articles = window['TT_CONFIG']['CRUD_CONFIG'].columns.find(column => column.key === 'subItems').modal.items;
+    }, methods: {
+        updateCrudModalData() {
+            const ref = this.$refs.WarehouseArticlePacketCrud;
+            ref.$set(ref.crudModalData, 'subItems', JSON.stringify(this.subItems));
+            this.updateCounter++;
+        }, removeSubItem(item) {
+            this.subItems = this.subItems.filter(subItem => subItem !== item);
+            this.updateCrudModalData();
+        }, addSubItem() {
+            // only continue if id and amount are set else use window.notify('error', 'Bitte Artikel und Menge auswählen');
+            if (this.subItemsAutocomplete === '' || this.newSubItemAmount === '') {
+                window.notify('error', 'Bitte Artikel und Menge auswählen');
+                return;
+            }
+
+            this.subItems.push({id: this.subItemsAutocomplete, amount: this.newSubItemAmount});
+            this.updateCrudModalData();
+            this.$refs.subItemsAutocomplete.clear();
+            this.newSubItemAmount = 1;
+        }
+    }, mounted() {
+        this.$watch(() => {
+            return this.$refs.WarehouseArticlePacketCrud.crudModal
+        }, () => {
+            // check if this.$refs.WarehouseArticlePacketCrud.crudModalData.subItems is defined
+            if (typeof this.$refs.WarehouseArticlePacketCrud.crudModalData.subItems === 'undefined') {
+                this.$set(this.$refs.WarehouseArticlePacketCrud.crudModalData, 'subItems', JSON.stringify([]));
+            }
+            this.subItems = JSON.parse(this.$refs.WarehouseArticlePacketCrud.crudModalData.subItems);
+        })
+
+    }
+})

public/js/pages/WarehouseEShop/WarehouseEShop.js

@@ -25,9 +25,12 @@ Vue.component('tt-expandable-shopping-cart', {
         <h3>Einkaufswagen</h3>
         <ul class="list-group">
           <template v-for="item in cartItems">
-          <li class="list-group-item d-flex justify-content-between align-items-center">
+          <li class="list-group-item" style="display:grid;grid-template-columns: 1fr auto;gap: 10px;">
             {{ item.title }}
-            <span class="badge badge-primary badge-pill">{{ item.amount }}</span>
+            <div style="display:grid;grid-template-columns: 1fr 1fr;gap: 10px;">
+              <span class="badge badge-primary badge-pill" style="height: 16px">{{ item.amount }}</span>
+              <i style="cursor: pointer" class="fas fa-trash-alt text-danger" @click="cartItems.splice(cartItems.indexOf(item), 1)"></i>
+            </div>
           </li>
             </template>
         </ul>
@@ -52,7 +55,7 @@ Vue.component('warehouse-e-shop', {
                     
                     <tt-select v-model="createOrderDialogData.deliveryMode" label="Adresse" :options="[
                         {text: 'Einzelne Adresse', value: 'singleAddress'},
-                        {text: 'Mehrere Adressen', value: 'multipleAddresses'},
+                        // {text: 'Mehrere Adressen', value: 'multipleAddresses'},
                     ]" sm row/>
                     <tt-input v-model="createOrderDialogData.deliveryAddressName" label="Name" sm row/>
                     <tt-input v-model="createOrderDialogData.deliveryAddressLine" label="Straße" sm row/>
@@ -63,13 +66,18 @@ Vue.component('warehouse-e-shop', {
 
                   <tt-table-crud>
 
+                    <template v-slot:price="{ row }">
+                      <span v-if="row.hasOwnProperty('calculatedSellPrice')"> {{ row.calculatedSellPrice.toFixed(2) }} €</span>
+                      <span v-else>{{ JSON.parse(row.cheapestSellPrice).find(price => price.title === 'Energie Steiermark').price.toFixed(2) }} €</span>
+                    </template>
+
                     <template v-slot:amount="{ row }">
                       <!-- this has no padding - add a full width full height tt-input with  -->
-                      <tt-input type="number" style="width: 100%; height: 100%;margin:0 !important" v-model="itemAmounts[row.id]"/>
+                      <tt-input type="number" style="width: 100%; height: 100%;margin:0 !important" v-model="itemAmounts[row.hasOwnProperty('calculatedSellPrice') ? 'P-' + row.id : 'I-' + row.id]" sm/>
                     </template>
                     
                     <template v-slot:add="{ row }">
-                      <a style="cursor: pointer;" @click="addToCart(row)">
+                      <a style="cursor: pointer;" @click="addToCart(row, row.hasOwnProperty('calculatedSellPrice') ? 'P' : 'I')">
                         <i class="fas fa-shopping-cart text-primary"></i>
                       </a>
                     </template>
@@ -110,12 +118,16 @@ Vue.component('warehouse-e-shop', {
                         'Ein Fehler ist aufgetreten');
             }
         },
-        addToCart(row) {
+        addToCart(row, type) {
+            row = JSON.parse(JSON.stringify(row));
+            row.id = `${type}-${row.id}`;
             if (!this.itemAmounts[row.id] || this.itemAmounts[row.id] === 0) {
                 window.notify('error', 'Bitte geben Sie eine Menge ein.');
                 return;
             }
 
+            console.log(this.shoppingCart, row)
+
             // Check if Article is already in the shopping cart
             if (this.shoppingCart.some(item => item.itemId === row.id)) {
                 window.notify('warning', `${row.title} ist bereits im Warenkorb.`);