Many Changes
This commit is contained in:
@@ -10,7 +10,7 @@ const mode = ref("incoming")
|
||||
const toast = useToast()
|
||||
|
||||
const inventoryChangeData = ref({
|
||||
productId: "",
|
||||
productId: null,
|
||||
sourceSpaceId: null,
|
||||
sourceProjectId: null,
|
||||
destinationSpaceId: null,
|
||||
@@ -18,6 +18,17 @@ const inventoryChangeData = ref({
|
||||
quantity: 1
|
||||
})
|
||||
|
||||
const resetInput = () => {
|
||||
inventoryChangeData.value = {
|
||||
productId: null,
|
||||
sourceSpaceId: null,
|
||||
sourceProjectId: null,
|
||||
destinationSpaceId: null,
|
||||
destinationProjectId: null,
|
||||
quantity: 1
|
||||
}
|
||||
}
|
||||
|
||||
const createMovement = async () => {
|
||||
|
||||
let movements = []
|
||||
@@ -164,39 +175,61 @@ const processBarcodeInput = () => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UDashboardNavbar
|
||||
title="Lager Vorgänge"
|
||||
>
|
||||
<template #right>
|
||||
<UButton
|
||||
@click="resetInput"
|
||||
class="mt-3"
|
||||
color="rose"
|
||||
variant="outline"
|
||||
>
|
||||
Abbrechen
|
||||
</UButton>
|
||||
<UButton
|
||||
@click="createMovement"
|
||||
:disabled="mode === '' && checkSpaceId(inventoryChangeData.spaceId) && checkProductId(inventoryChangeData.productId)"
|
||||
class="mt-3"
|
||||
>
|
||||
Bestätigen
|
||||
</UButton>
|
||||
|
||||
<div class="w-80 mx-auto mt-5">
|
||||
<div class="flex flex-col">
|
||||
<UButton
|
||||
@click="mode = 'incoming'"
|
||||
class="my-2"
|
||||
:variant="mode === 'incoming' ? 'solid' : 'outline'"
|
||||
>Wareneingang</UButton>
|
||||
<UButton
|
||||
@click="mode = 'outgoing'"
|
||||
class="my-2"
|
||||
:variant="mode === 'outgoing' ? 'solid' : 'outline'"
|
||||
>Warenausgang</UButton>
|
||||
<UButton
|
||||
@click="mode = 'change'"
|
||||
class="my-2"
|
||||
:variant="mode === 'change' ? 'solid' : 'outline'"
|
||||
>Umlagern</UButton>
|
||||
</div>
|
||||
</template>
|
||||
</UDashboardNavbar>
|
||||
<UDashboardPanelContent>
|
||||
<div class="w-80 mx-auto mt-5">
|
||||
<div class="flex flex-col">
|
||||
<UButton
|
||||
@click="mode = 'incoming'"
|
||||
class="my-2"
|
||||
:variant="mode === 'incoming' ? 'solid' : 'outline'"
|
||||
>Wareneingang</UButton>
|
||||
<UButton
|
||||
@click="mode = 'outgoing'"
|
||||
class="my-2"
|
||||
:variant="mode === 'outgoing' ? 'solid' : 'outline'"
|
||||
>Warenausgang</UButton>
|
||||
<UButton
|
||||
@click="mode = 'change'"
|
||||
class="my-2"
|
||||
:variant="mode === 'change' ? 'solid' : 'outline'"
|
||||
>Umlagern</UButton>
|
||||
</div>
|
||||
|
||||
<UAlert
|
||||
title="Info"
|
||||
variant="outline"
|
||||
color="primary"
|
||||
v-if="showBarcodeTip"
|
||||
@close="showBarcodeTip = false"
|
||||
:close-button="{ icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false }"
|
||||
description="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
|
||||
/>
|
||||
<UAlert
|
||||
title="Info"
|
||||
variant="outline"
|
||||
color="primary"
|
||||
v-if="showBarcodeTip"
|
||||
@close="showBarcodeTip = false"
|
||||
:close-button="{ icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false }"
|
||||
description="Über die Barcode Eingabe können folgende Werte automatisch erkannt werden: Quelllagerplatz, Ziellagerplatz, Artikel (EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
|
||||
/>
|
||||
|
||||
<!-- <UTooltip
|
||||
text="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
|
||||
>-->
|
||||
<!-- <UTooltip
|
||||
text="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
|
||||
>-->
|
||||
<UFormGroup
|
||||
label="Barcode:"
|
||||
class="mt-3"
|
||||
@@ -211,189 +244,152 @@ const processBarcodeInput = () => {
|
||||
/>
|
||||
|
||||
</UFormGroup>
|
||||
<!-- <template #text>
|
||||
<span class="text-wrap">Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt.</span>
|
||||
<!-- <template #text>
|
||||
<span class="text-wrap">Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt.</span>
|
||||
|
||||
</template>
|
||||
</UTooltip>-->
|
||||
</template>
|
||||
</UTooltip>-->
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
v-if="mode !== 'incoming'"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Quell Lagerplatz:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'incoming' "
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.spaces"
|
||||
searchable
|
||||
option-attribute="spaceNumber"
|
||||
:color="checkSpaceId(inventoryChangeData.sourceSpaceId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.sourceSpaceId"
|
||||
@change="inventoryChangeData.sourceProjectId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId).description : "Kein Lagerplatz ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Quell Projekt:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'incoming' "
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.projects"
|
||||
searchable
|
||||
option-attribute="name"
|
||||
:color="checkProjectId(inventoryChangeData.sourceProjectId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.sourceProjectId"
|
||||
@change="inventoryChangeData.sourceSpaceId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getProjectById(inventoryChangeData.sourceProjectId) ? dataStore.getProjectById(inventoryChangeData.sourceProjectId).name : "Kein Projekt ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Artikel:"
|
||||
class="mt-3 w-80"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.products"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
variant="outline"
|
||||
searchable
|
||||
:search-attributes="['name','ean', 'barcode']"
|
||||
:color="checkProductId(inventoryChangeData.productId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.productId"
|
||||
v-on:select="changeFocusToSpaceId"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.products.find(product => product.id === inventoryChangeData.productId) ? dataStore.products.find(product => product.id === inventoryChangeData.productId).name : "Bitte Artikel auswählen"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Ziel Lagerplatz:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.spaces"
|
||||
searchable
|
||||
option-attribute="spaceNumber"
|
||||
:color="checkSpaceId(inventoryChangeData.destinationSpaceId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.destinationSpaceId"
|
||||
@change="inventoryChangeData.destinationProjectId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId).description : "Kein Lagerplatz ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Ziel Projekt:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.projects"
|
||||
searchable
|
||||
option-attribute="name"
|
||||
:color="checkProjectId(inventoryChangeData.destinationProjectId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.destinationProjectId"
|
||||
value-attribute="id"
|
||||
@change="inventoryChangeData.destinationSpaceId = null"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getProjectById(inventoryChangeData.destinationProjectId) ? dataStore.getProjectById(inventoryChangeData.destinationProjectId).name : "Kein Projekt ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Anzahl:"
|
||||
class="mt-3 w-80"
|
||||
>
|
||||
<UInput
|
||||
variant="outline"
|
||||
color="primary"
|
||||
placeholder="Anzahl"
|
||||
v-model="inventoryChangeData.quantity"
|
||||
type="number"
|
||||
id="quantityInput"
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
v-if="mode !== 'incoming'"
|
||||
/>
|
||||
</UFormGroup>
|
||||
<UButton
|
||||
@click="createMovement"
|
||||
:disabled="mode === '' && checkSpaceId(inventoryChangeData.spaceId) && checkProductId(inventoryChangeData.productId)"
|
||||
class="mt-3"
|
||||
>
|
||||
Bestätigen
|
||||
</UButton>
|
||||
|
||||
<UFormGroup
|
||||
label="Quell Lagerplatz:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'incoming' "
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.spaces"
|
||||
searchable
|
||||
option-attribute="spaceNumber"
|
||||
:color="checkSpaceId(inventoryChangeData.sourceSpaceId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.sourceSpaceId"
|
||||
@change="inventoryChangeData.sourceProjectId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId).description : "Kein Lagerplatz ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Quell Projekt:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'incoming' "
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.projects"
|
||||
searchable
|
||||
option-attribute="name"
|
||||
:color="checkProjectId(inventoryChangeData.sourceProjectId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.sourceProjectId"
|
||||
@change="inventoryChangeData.sourceSpaceId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getProjectById(inventoryChangeData.sourceProjectId) ? dataStore.getProjectById(inventoryChangeData.sourceProjectId).name : "Kein Projekt ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Artikel:"
|
||||
class="mt-3 w-80"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.products"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
variant="outline"
|
||||
searchable
|
||||
:search-attributes="['name','ean', 'barcode']"
|
||||
:color="checkProductId(inventoryChangeData.productId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.productId"
|
||||
v-on:select="changeFocusToSpaceId"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.products.find(product => product.id === inventoryChangeData.productId) ? dataStore.products.find(product => product.id === inventoryChangeData.productId).name : "Bitte Artikel auswählen"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
/>
|
||||
|
||||
<!-- <div class="my-3">
|
||||
<UFormGroup
|
||||
label="Ziel Lagerplatz:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.spaces"
|
||||
searchable
|
||||
option-attribute="spaceNumber"
|
||||
:color="checkSpaceId(inventoryChangeData.destinationSpaceId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.destinationSpaceId"
|
||||
@change="inventoryChangeData.destinationProjectId = null"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId).description : "Kein Lagerplatz ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Ziel Projekt:"
|
||||
class="mt-3 w-80"
|
||||
v-if="mode !== 'outgoing'"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.projects"
|
||||
searchable
|
||||
option-attribute="name"
|
||||
:color="checkProjectId(inventoryChangeData.destinationProjectId) ? 'primary' : 'rose'"
|
||||
v-model="inventoryChangeData.destinationProjectId"
|
||||
value-attribute="id"
|
||||
@change="inventoryChangeData.destinationSpaceId = null"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getProjectById(inventoryChangeData.destinationProjectId) ? dataStore.getProjectById(inventoryChangeData.destinationProjectId).name : "Kein Projekt ausgewählt"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UDivider
|
||||
class="mt-5 w-80"
|
||||
/>
|
||||
|
||||
<UFormGroup
|
||||
label="Anzahl:"
|
||||
class="mt-3 w-80"
|
||||
>
|
||||
<UInput
|
||||
variant="outline"
|
||||
color="primary"
|
||||
placeholder="Anzahl"
|
||||
v-model="inventoryChangeData.quantity"
|
||||
type="number"
|
||||
id="quantityInput"
|
||||
/>
|
||||
</UFormGroup>
|
||||
|
||||
</div>
|
||||
</UDashboardPanelContent>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
-->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
#main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
#left {
|
||||
width: 25vw;
|
||||
}
|
||||
|
||||
#right {
|
||||
width: 60vw;
|
||||
padding-left: 3vw;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user