mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-03 21:37:49 -05:00
made ModelEditor setupState function properly handle async requests
This commit is contained in:
@@ -49,11 +49,10 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
setupState(props.item, props.itemId, () => {
|
||||
editingObj.value.expires = DateTime.now().plus({year: 1}).toJSDate()
|
||||
editingObj.value.scope = 'read write'
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -36,6 +36,7 @@ import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
|
||||
import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {VNumberInput} from "vuetify/labs/VNumberInput";
|
||||
import {DateTime} from "luxon";
|
||||
|
||||
const {t} = useI18n()
|
||||
|
||||
@@ -64,10 +65,9 @@ const AUTOMATION_TYPES = [
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
setupState(props.item, props.itemId, () => {
|
||||
editingObj.value.order = 0
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -189,11 +189,10 @@ const stopConversionsWatcher = watch(tab, (value, oldValue, onCleanup) => {
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
setupState(props.item, props.itemId, () => {
|
||||
editingObj.value.propertiesFoodAmount = 100
|
||||
editingObj.value.propertiesFoodUnit = {name: 'g'} as Unit // TODO properly fetch default unit
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
@@ -50,11 +50,11 @@ onMounted(() => {
|
||||
api.apiGroupList().then(r => {
|
||||
groups.value = r
|
||||
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
setupState(props.item, props.itemId, () => {
|
||||
editingObj.value.validUntil = DateTime.now().plus({month: 1}).toJSDate()
|
||||
editingObj.value.group = groups.value[0]
|
||||
}
|
||||
})
|
||||
|
||||
}).catch(err => {
|
||||
useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
|
||||
})
|
||||
|
||||
@@ -27,6 +27,7 @@ import {Keyword} from "@/openapi";
|
||||
import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
|
||||
import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {DateTime} from "luxon";
|
||||
|
||||
const {t} = useI18n()
|
||||
|
||||
@@ -42,10 +43,7 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
// object specific data (for selects/display)
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -43,6 +43,7 @@ import {MealType} from "@/openapi";
|
||||
import {VTimePicker} from 'vuetify/labs/VTimePicker'; // TODO remove once out of labs
|
||||
import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
|
||||
import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
|
||||
import {DateTime} from "luxon";
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
@@ -59,9 +60,7 @@ const timePickerMenu = ref(false)
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -45,9 +45,7 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
|
||||
|
||||
@@ -44,10 +44,7 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
// object specific data (for selects/display)
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -42,10 +42,7 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
// object specific data (for selects/display)
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -119,19 +119,16 @@ const unusedSupermarketCategories = computed(() => {
|
||||
onMounted(() => {
|
||||
const api = new ApiApi()
|
||||
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
}
|
||||
|
||||
api.apiSupermarketCategoryList({pageSize: 100}).then(r => {
|
||||
supermarketCategories.value = r.results
|
||||
|
||||
//TODO fix performing this in a way that async setupState works
|
||||
setupState(props.item, props.itemId, undefined, () => {
|
||||
editingObj.value.categoryToSupermarket.forEach(cTS => {
|
||||
editingObjSupermarketCategories.value.push(cTS.category)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
function updateEditingObjectSupermarketCategoryRelation(operation: any) {
|
||||
if (operation.to == operation.from) {
|
||||
|
||||
@@ -65,9 +65,7 @@ const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading,
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -67,10 +67,7 @@ const BASE_UNITS = [
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
@@ -48,9 +48,7 @@ onMounted(() => {
|
||||
useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
|
||||
})
|
||||
|
||||
if (!setupState(props.item, props.itemId)) {
|
||||
// functions to populate defaults
|
||||
}
|
||||
setupState(props.item, props.itemId)
|
||||
})
|
||||
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ import {useI18n} from "vue-i18n";
|
||||
|
||||
export function useModelEditorFunctions<T>(modelName: string, emit: any) {
|
||||
|
||||
const loading = ref(false)
|
||||
const loading = ref(true)
|
||||
const editingObj = ref({} as T)
|
||||
const modelClass = ref({} as GenericModel)
|
||||
|
||||
@@ -22,34 +22,54 @@ export function useModelEditorFunctions<T>(modelName: string, emit: any) {
|
||||
})
|
||||
|
||||
/**
|
||||
* if given an object or id, sets up the editingObj with that item or loads the data from the API using the ID
|
||||
* if both item and itemId are undefined return false to indicate that no editingObj has been initialized
|
||||
* if given an item or itemId, sets up the editingObj with that item or loads the data from the API using the ID
|
||||
* once finished loading updates the loading state to false, indicating finished initialization
|
||||
*
|
||||
* @throws Error if an error if neither item or itemId are given and create is disabled
|
||||
* @param item item object to set as editingObj
|
||||
* @param itemId id of object to be retrieved and set as editingObj
|
||||
* @param newItemFunction optional function to execute if no object is given (by either item or itemId)
|
||||
* @param existingItemFunction optional function to execute once the existing item was loaded (instantly with item, async with itemId)
|
||||
* @return promise resolving to either the editingObj or undefined if errored
|
||||
*/
|
||||
function setupState(item: T | null, itemId: number|string | undefined) {
|
||||
function setupState(item: T | null, itemId: number | string | undefined,
|
||||
newItemFunction: () => void = () => {},
|
||||
existingItemFunction: () => void = () => {}): Promise<T | undefined> {
|
||||
if (item === null && itemId === undefined) {
|
||||
// neither item nor itemId given => new item
|
||||
|
||||
if (modelClass.value.model.disableCreate) {
|
||||
throw Error('Trying to use a ModelEditor without an item and a model that does not allow object creation!')
|
||||
}
|
||||
return false
|
||||
|
||||
newItemFunction()
|
||||
loading.value = false
|
||||
return Promise.resolve(editingObj.value)
|
||||
} else if (item !== null) {
|
||||
// item is given so return that
|
||||
editingObj.value = item
|
||||
existingItemFunction()
|
||||
loading.value = false
|
||||
return Promise.resolve(editingObj.value)
|
||||
} else if (itemId !== undefined) {
|
||||
// itemId is given => fetch from server and return item
|
||||
loading.value = true
|
||||
|
||||
// itemId might be a string (router parameter) or number (component prop)
|
||||
if (typeof itemId == "string") {
|
||||
itemId = Number(itemId)
|
||||
}
|
||||
modelClass.value.retrieve(itemId).then((r: T) => {
|
||||
return modelClass.value.retrieve(itemId).then((r: T) => {
|
||||
editingObj.value = r
|
||||
existingItemFunction()
|
||||
return editingObj.value
|
||||
}).catch((err: any) => {
|
||||
useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
|
||||
return undefined
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user