Restructured Update Process Into Store

This commit is contained in:
2024-01-15 21:54:12 +01:00
parent 9f5a142680
commit 497d768d4e
20 changed files with 176 additions and 918 deletions

View File

@@ -1,236 +0,0 @@
<script setup>
import axios from "axios";
definePageMeta({
middleware: "auth"
})
const dataStore = useDataStore()
const supabase = useSupabaseClient()
const route = useRoute()
const router = useRouter()
const toast = useToast()
const id = ref(route.params.id ? route.params.id : null )
const numberRange = useNumberRange("spaces")
let currentItem = ref(null)
let currentNumberRange = null
//Working
const mode = ref(route.params.mode || "show")
const itemInfo = ref({
spaceNumber: ""
})
const spaceTypes = ["Regalplatz", "Kiste", "Palettenplatz", "Sonstiges"]
const spaceProducts = ref([])
const spaceMovements = ref([])
//Functions
const setupPage = async () => {
console.log("Called Setup")
if(mode.value === "show" || mode.value === "edit"){
currentItem.value = await dataStore.getSpaceById(Number(useRoute().params.id))
spaceMovements.value = await dataStore.getMovementsBySpace(currentItem.value.id)
spaceProducts.value = []
spaceMovements.value.forEach(movement => {
if(spaceProducts.value.filter(product => product.id === movement.productId).length === 0) spaceProducts.value.push(dataStore.getProductById(movement.productId))
})
}
if(mode.value === "edit") itemInfo.value = currentItem.value
}
const createItem = async () => {
if(!itemInfo.value.spaceNumber) itemInfo.value.spaceNumber = await numberRange.useNextNumber()
const {data,error} = await supabase
.from("spaces")
.insert([itemInfo.value])
.select()
if(error) {
console.log(error)
} else {
console.log(data[0])
mode.value = "show"
toast.add({title: "Lagerplatz erfolgreich erstellt"})
await dataStore.fetchSpaces()
router.push(`/inventory/spaces/show/${data[0].id}`)
//setupPage()
}
}
const editItem = async () => {
router.push(`/inventory/spaces/edit/${currentItem.value.id}`)
setupPage()
}
const cancelEditorCreate = () => {
router.push(`/inventory/spaces/`)
}
const updateItem = async () => {
const {error} = await supabase
.from("spaces")
.update(itemInfo.value)
.eq('id',itemInfo.value.id)
if(error) {
console.log(error)
} else {
mode.value = "show"
itemInfo.value = {}
toast.add({title: "Lagerplatz erfolgreich gespeichert"})
dataStore.fetchSpaces()
}
}
function getSpaceProductCount(productId) {
let productMovements = spaceMovements.value.filter(movement => movement.productId === productId)
let count = 0;
productMovements.forEach(movement => count += movement.quantity)
return count
}
const printSpaceLabel = async () => {
axios
.post(`http://${dataStore.ownTenant.value.labelPrinterIp}/pstprnt`, `^XA^FO10,20^BCN,100^FD${currentItem.value.spaceNumber}^XZ` )
.then(console.log)
.catch(console.log)
}
setupPage()
</script>
<template>
<div>
<DevOnly>
{{currentItem}}
{{mode}}
</DevOnly>
<UCard v-if="currentItem && mode == 'show'" >
<template #header>
<UBadge>{{currentItem.spaceNumber}}</UBadge> {{currentItem.type}}
</template>
{{currentItem.description}}
<UDivider
class="my-2"
/>
<div v-if="spaceProducts.length > 0">
<p class="mt-5">Artikel in diesem Lagerplatz</p>
<table>
<tr>
<th>Artikel</th>
<th>Anzahl</th>
<th>Einheit</th>
</tr>
<tr v-for="product in spaceProducts">
<td>{{product.name}}</td>
<td>{{getSpaceProductCount(product.id)}}</td>
<td>{{dataStore.units.find(unit => unit.id === product.unit).name}}</td>
</tr>
</table>
</div>
<p v-else>Es befinden sich keine Artikel in diesem Lagerplatz</p>
<template #footer>
<UButton
v-if="mode == 'show' && currentItem.id"
@click="editItem"
>
Bearbeiten
</UButton>
<UButton
v-if="mode == 'show' && currentItem.id"
@click="printSpaceLabel"
class="ml-2"
>
Label Drucken
</UButton>
<UButton
color="red"
class="ml-2"
disabled
>
Archivieren
</UButton>
</template>
</UCard>
<UCard v-else-if="mode === 'edit' || mode === 'create'" >
<template #header v-if="mode === 'edit'">
<UBadge>{{itemInfo.spaceNumber}}</UBadge>{{itemInfo.type}}
</template>
<UFormGroup
label="Typ:"
>
<USelectMenu
:options="spaceTypes"
v-model="itemInfo.type"
>
</USelectMenu>
</UFormGroup>
<UFormGroup
label="Beschreibung.:"
>
<UTextarea
v-model="itemInfo.description"
/>
</UFormGroup>
<template #footer>
<UButton
v-if="mode == 'edit'"
@click="updateItem"
>
Speichern
</UButton>
<UButton
v-else-if="mode == 'create'"
@click="createItem"
>
Erstellen
</UButton>
<UButton
@click="cancelEditorCreate"
color="red"
class="ml-2"
>
Abbrechen
</UButton>
</template>
</UCard>
</div>
</template>
<style scoped>
</style>

View File

@@ -1,79 +0,0 @@
<template>
<div id="main">
<div class="flex items-center gap-1">
<UButton @click="router.push(`/inventory/spaces/create/`)">+ Lagerplatz</UButton>
<UInput
v-model="searchString"
placeholder="Suche..."
/>
</div>
<UTable
:rows="filteredRows"
:columns="itemColumns"
@select="selectItem"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
/>
</div>
</template>
<script setup>
definePageMeta({
middleware: "auth"
})
const dataStore = useDataStore()
const router = useRouter()
const mode = ref("show")
const itemColumns = [
{
key: 'spaceNumber',
label: "Lagerplatznr.",
sortable: true
},
{
key: "description",
label: "Beschreibung",
sortable: true
},
{
key: "type",
label: "Typ",
sortable: true
}
]
const selectItem = (item) => {
console.log(item)
router.push(`/inventory/spaces/show/${item.id} `)
}
const searchString = ref('')
const filteredRows = computed(() => {
if(!searchString.value) {
return dataStore.spaces
}
return dataStore.spaces.filter(item => {
return Object.values(item).some((value) => {
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
})
})
})
</script>
<style scoped>
</style>