mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-01 04:10:06 -05:00
Code Issues Packages Projects Releases Wiki Activity

WIP supermarket category editor

Browse Source
This commit is contained in:
vabene1111
2024-10-05 07:26:42 +02:00
parent d1379935b7
commit 4ab0fbf36b
1 changed files with 51 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
vue3/src/components/model_editors/SupermarketEditor.vue
View File

@@ -33,7 +33,8 @@
</v-btn>
</h3>
<draggable class="mt-4" tag="VList" v-model="supermarketCategories" handle=".drag-handle" item-key="id" group="categories">
<draggable class="mt-4" tag="VList" v-model="unusedSupermarketCategories" handle=".drag-handle" item-key="id" group="categories"
>
<template #item="{element}">
<v-list-item border :key="element.id">
<template #prepend>
@@ -49,16 +50,20 @@
<h3> {{ $t('SelectedCategories') }} </h3>
<draggable
tag="VList"
v-model="editingObj.categoryToSupermarket"
v-model="editingObjSupermarketCategories"
handle=".drag-handle" item-key="id" group="categories"
>
:empty-insert-threshold="20"
@sort="updateEditingObjectSupermarketCategoryRelation"
@add="addTest"
@remove="removeTest"
>
<template #item="{element}">
<v-list-item border :key="element.id">
<template #prepend>
<v-icon class="drag-handle" icon="$dragHandle"></v-icon>
</template>
{{ element.category.name }}
{{ element.order }}
{{ element.name }}
<template #append>
<v-btn color="warning">
<i class="fa-solid fa-link-slash"></i>
@@ -84,12 +89,13 @@
<script setup lang="ts">
import {onMounted, PropType, ref} from "vue";
import {ApiApi, Supermarket, SupermarketCategory} from "@/openapi";
import {computed, onMounted, PropType, ref} from "vue";
import {ApiApi, Supermarket, SupermarketCategory, SupermarketCategoryRelation} from "@/openapi";
import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
import draggable from "vuedraggable";
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
const props = defineProps({
item: {type: {} as PropType<Supermarket>, required: false, default: null},
@@ -104,6 +110,11 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
const tab = ref("categories")
const supermarketCategories = ref([] as SupermarketCategory[])
const editingObjSupermarketCategories = ref([] as SupermarketCategory[])
const unusedSupermarketCategories = computed(() => {
return supermarketCategories.value.filter(e => !editingObjSupermarketCategories.value.includes(e))
})
onMounted(() => {
const api = new ApiApi()
@@ -114,9 +125,42 @@ onMounted(() => {
api.apiSupermarketCategoryList({pageSize: 100}).then(r => {
supermarketCategories.value = r.results
//TODO fix performing this in a way that async setupState works
editingObj.value.categoryToSupermarket.forEach(cTS => {
editingObjSupermarketCategories.value.push(cTS.category)
})
})
})
function updateEditingObjectSupermarketCategoryRelation(operation: any) {
if (operation.to == operation.from) {
console.log('sort', operation)
}
}
function addTest(operation: any) {
let api = new ApiApi()
if (typeof operation.newIndex == "number" && editingObjSupermarketCategories.value.length >= operation.newIndex) {
let sC = {
category: editingObjSupermarketCategories.value[operation.newIndex],
order: operation.newIndex,
supermarket: editingObj.value.id,
} as SupermarketCategoryRelation
api.apiSupermarketCategoryRelationCreate({supermarketCategoryRelation: sC}).then(r => {
}).catch((err: any) => {
useMessageStore().addError(ErrorMessageType.CREATE_ERROR, err)
})
}
}
function removeTest(operation: any) {
console.log('remove', operation)
}
</script>
<style scoped>