From 3412049f3a47e87854fe5348e045d55d95961bd2 Mon Sep 17 00:00:00 2001 From: Daniel Klamt Date: Mon, 23 Dec 2019 18:43:01 +0100 Subject: [PATCH] implemented deletion --- src/components/Table.vue | 2 +- src/store/index.js | 7 +++++++ src/views/Boxes.vue | 2 +- src/views/Items.vue | 5 +++-- 4 files changed, 12 insertions(+), 4 deletions(-) diff --git a/src/components/Table.vue b/src/components/Table.vue index 6cd6dee..72c5872 100644 --- a/src/components/Table.vue +++ b/src/components/Table.vue @@ -32,7 +32,7 @@ {{ item[column] }}
- +
diff --git a/src/store/index.js b/src/store/index.js index 90572f0..603da70 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -48,6 +48,9 @@ const store = new Vuex.Store({ const item = state.loadedItems.filter(({ item_uid }) => item_uid === updatedItem.item_uid)[0]; Object.assign(item, updatedItem); }, + removeItem(state, item) { + state.loadedItems = state.loadedItems.filter(it => it !== item ); + }, appendItem(state, item) { state.loadedItems.push(item); } @@ -79,6 +82,10 @@ const store = new Vuex.Store({ const { data } = await axios.put(`/1/${getters.getEventSlug}/item/${item.uid}`, item); commit('updateItem', data); }, + async deleteItem({ commit, getters }, item) { + await axios.delete(`/1/${getters.getEventSlug}/item/${item.uid}`, item); + commit('removeItem',item); + }, async postItem({ commit, getters }, item) { let blob = await fetch(item.dataImage).then(res => res.blob()); let file = new File([blob], 'dot.png', blob); diff --git a/src/views/Boxes.vue b/src/views/Boxes.vue index 2cda19e..b6eb776 100644 --- a/src/views/Boxes.vue +++ b/src/views/Boxes.vue @@ -6,7 +6,7 @@ :columns="['cid', 'name']" :actions="[ {name:'enlarge'}, - {name:'content', fun: (item,action) => showBoxContent(item.name)}, + {name:'content', fun: item => showBoxContent(item.name)}, {name:'delete'}, ]" :items="loadedBoxes" diff --git a/src/views/Items.vue b/src/views/Items.vue index 48b9601..89ebf22 100644 --- a/src/views/Items.vue +++ b/src/views/Items.vue @@ -18,7 +18,7 @@ :columns="['uid', 'description', 'box']" :actions="[ {name: 'enlarge'}, - {name: 'delete'} + {name: 'delete',fun: item => deleteItem(item)} ]" :items="loadedItems" :keyName="'uid'" @@ -54,7 +54,7 @@ import Table from '@/components/Table'; import Cards from '@/components/Cards'; import Modal from '@/components/Modal'; import EditItem from '@/components/EditItem'; -import { mapState } from 'vuex'; +import {mapActions, mapState} from 'vuex'; import config from '../config'; export default { @@ -66,6 +66,7 @@ export default { components: { Table, Cards, Modal, EditItem }, computed: mapState(['loadedItems', 'layout']), methods: { + ...mapActions(['deleteItem']), openModalWith(item) { // Opens the editing modal with a copy of the selected item. this.selectedItem = { ...item }; },