From c43d5b67e864b0f7381ff2f6953f0b2bfdeabce6 Mon Sep 17 00:00:00 2001
From: jedi <git@m.j3d1.de>
Date: Tue, 17 Dec 2024 21:52:57 +0100
Subject: [PATCH] fix container selection in AddItemModal.vue
---
web/src/components/AddItemModal.vue | 49 ++++++++++++++++++-----
web/src/components/AddTicketModal.vue | 3 +-
web/src/components/EditItem.vue | 50 ------------------------
web/src/components/inputs/InputCombo.vue | 6 +--
web/src/views/Item.vue | 2 -
web/src/views/Items.vue | 5 +--
6 files changed, 46 insertions(+), 69 deletions(-)
delete mode 100644 web/src/components/EditItem.vue
diff --git a/web/src/components/AddItemModal.vue b/web/src/components/AddItemModal.vue
index a3c23fd..f3f4e96 100644
--- a/web/src/components/AddItemModal.vue
+++ b/web/src/components/AddItemModal.vue
@@ -2,7 +2,30 @@
<div>
<Modal v-if="isModal" title="Add Item" @close="$emit('close')">
<template #body>
- <EditItem :item="item"/>
+ <div>
+ <h6>Editing Item <span class="badge badge-secondary">#{{ item.uid }}</span></h6>
+ <InputPhoto
+ :model="item"
+ field="file"
+ :on-capture="storeImage"
+ />
+ <InputString
+ label="description"
+ :model="item"
+ field="description"
+ :validation-fn="str => str && str.length > 0"
+ />
+ <div class="form-group">
+ <label for="box">box</label>
+ <InputCombo
+ label="box"
+ :model="item"
+ nameKey="box"
+ uniqueKey="cid"
+ :options="boxes"
+ />
+ </div>
+ </div>
</template>
<template #buttons>
<button type="button" class="btn btn-secondary" @click="$emit('close')">Cancel</button>
@@ -13,26 +36,34 @@
</template>
<script>
+import {mapActions, mapGetters, mapState} from "vuex";
import Modal from '@/components/Modal';
-import EditItem from '@/components/EditItem';
-import {mapActions, mapState} from "vuex";
+import InputCombo from "@/components/inputs/InputCombo.vue";
+import InputPhoto from "@/components/inputs/InputPhoto.vue";
+import InputString from "@/components/inputs/InputString.vue";
export default {
name: 'AddItemModal',
- components: {Modal, EditItem},
+ components: {InputString, InputPhoto, InputCombo, Modal},
props: ['isModal'],
data: () => ({
item: {}
}),
computed: {
- ...mapState(['lastUsed'])
+ ...mapState(['lastUsed']),
+ ...mapGetters(['getBoxes']),
+ boxes({getBoxes}) {
+ return getBoxes.map(obj => ({cid: obj.id, box: obj.name}));
+ }
},
methods: {
...mapActions(['postItem', 'loadBoxes', 'scheduleAfterInit']),
- saveNewItem() {
- this.postItem(this.item).then(() => {
- this.$emit('close');
- });
+ async saveNewItem() {
+ await this.postItem(this.item);
+ this.$emit('close');
+ },
+ storeImage(image) {
+ this.item.dataImage = image;
}
},
created() {
diff --git a/web/src/components/AddTicketModal.vue b/web/src/components/AddTicketModal.vue
index 37d539c..b407670 100644
--- a/web/src/components/AddTicketModal.vue
+++ b/web/src/components/AddTicketModal.vue
@@ -19,11 +19,10 @@
<script>
import {mapActions} from 'vuex';
import Modal from '@/components/Modal';
-import EditItem from '@/components/EditItem';
export default {
name: 'AddTicketModal',
- components: {Modal, EditItem},
+ components: {Modal},
props: ['isModal'],
data: () => ({
ticket: {
diff --git a/web/src/components/EditItem.vue b/web/src/components/EditItem.vue
deleted file mode 100644
index 833bfd5..0000000
--- a/web/src/components/EditItem.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-<template>
- <div>
- <h6>Editing Item <span class="badge badge-secondary">#{{ item.uid }}</span></h6>
- <InputPhoto
- :model="item"
- field="file"
- :on-capture="storeImage"
- />
- <InputString
- label="description"
- :model="item"
- field="description"
- :validation-fn="str => str && str.length > 0"
- />
- <div class="form-group">
- <label for="box">box</label>
- <InputCombo
- label="box"
- :model="item"
- nameKey="box"
- uniqueKey="cid"
- :options="boxes"
- />
- </div>
- </div>
-</template>
-
-<script>
-import InputString from './inputs/InputString';
-import InputCombo from './inputs/InputCombo';
-import {mapGetters} from 'vuex';
-import InputPhoto from './inputs/InputPhoto';
-
-export default {
- name: 'EditItem',
- components: {InputPhoto, InputCombo, InputString},
- props: ['item'],
- computed: {
- ...mapGetters(['getBoxes']),
- boxes({getBoxes}) {
- return getBoxes.map(obj => ({cid: obj.cid, box: obj.name}));
- }
- },
- methods: {
- storeImage(image) {
- this.item.dataImage = image;
- }
- }
-};
-</script>
diff --git a/web/src/components/inputs/InputCombo.vue b/web/src/components/inputs/InputCombo.vue
index fc64d42..2a291e0 100644
--- a/web/src/components/inputs/InputCombo.vue
+++ b/web/src/components/inputs/InputCombo.vue
@@ -43,11 +43,11 @@ export default {
props: ['label', 'model', 'nameKey', 'uniqueKey', 'options', 'onOptionAdd'],
data: ({options, model, nameKey, uniqueKey}) => ({
internalName: model[nameKey],
- selectedOption: options.filter(e => e[uniqueKey] == model[uniqueKey])[0],
+ selectedOption: options.filter(e => e[uniqueKey] === model[uniqueKey])[0],
addingOption: false
}),
computed: {
- isValid: ({options, nameKey, internalName}) => options.some(e => e[nameKey] == internalName),
+ isValid: ({options, nameKey, internalName}) => options.some(e => e[nameKey] === internalName),
sortedOptions: ({
options,
nameKey
@@ -56,7 +56,7 @@ export default {
watch: {
internalName(newValue) {
if (this.isValid) {
- if (!this.selectedOption || newValue != this.selectedOption[this.nameKey]) {
+ if (!this.selectedOption || newValue !== this.selectedOption[this.nameKey]) {
this.selectedOption = this.options.filter(e => e[this.nameKey] === newValue)[0];
}
this.model[this.nameKey] = this.selectedOption[this.nameKey];
diff --git a/web/src/views/Item.vue b/web/src/views/Item.vue
index d00b8b1..7b9f484 100644
--- a/web/src/views/Item.vue
+++ b/web/src/views/Item.vue
@@ -112,14 +112,12 @@ import InputString from "@/components/inputs/InputString.vue";
import AuthenticatedImage from "@/components/AuthenticatedImage.vue";
import InputPhoto from "@/components/inputs/InputPhoto.vue";
import Modal from "@/components/Modal.vue";
-import EditItem from "@/components/EditItem.vue";
import AsyncButton from "@/components/inputs/AsyncButton.vue";
export default {
name: 'Item',
components: {
AsyncButton,
- EditItem,
Modal, InputPhoto, AuthenticatedImage, InputString, InputCombo, AsyncLoader, ClipboardButton, Timeline
},
data() {
diff --git a/web/src/views/Items.vue b/web/src/views/Items.vue
index 21b11d1..30e553f 100644
--- a/web/src/views/Items.vue
+++ b/web/src/views/Items.vue
@@ -67,11 +67,10 @@
</template>
<script>
+import {mapActions, mapGetters, mapMutations} from 'vuex';
import Table from '@/components/Table';
import Cards from '@/components/Cards';
import Modal from '@/components/Modal';
-import EditItem from '@/components/EditItem';
-import {mapActions, mapGetters, mapMutations} from 'vuex';
import AuthenticatedImage from "@/components/AuthenticatedImage.vue";
import AsyncLoader from "@/components/AsyncLoader.vue";
import router from "@/router";
@@ -82,7 +81,7 @@ export default {
lightboxHash: null,
editingItem: null,
}),
- components: {AsyncLoader, AuthenticatedImage, Table, Cards, Modal, EditItem},
+ components: {AsyncLoader, AuthenticatedImage, Table, Cards, Modal},
computed: {
...mapGetters(['getEventItems', 'isItemsLoaded', 'layout']),
},