mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-02 12:49:02 -05:00
model related stuff
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<!-- TODO label is not showing for some reason, for now in placeholder -->
|
||||
<!-- TODO support density prop -->
|
||||
<v-input :hint="hint" persistent-hint :label="label" class="">
|
||||
<v-input :hint="props.hint" persistent-hint :label="props.label" class="">
|
||||
|
||||
<!-- TODO resolve-on-load false for now, race condition with model class, make prop once better solution is found -->
|
||||
<!-- TODO strange behavior/layering issues with appendTo body, find solution to make it work -->
|
||||
@@ -28,6 +28,7 @@
|
||||
:placeholder="label"
|
||||
:noOptionsText="$t('No_Results')"
|
||||
:noResultsText="$t('No_Results')"
|
||||
:loading="loading"
|
||||
/>
|
||||
|
||||
</v-input>
|
||||
@@ -81,7 +82,8 @@ const props = defineProps({
|
||||
})
|
||||
|
||||
const model = defineModel()
|
||||
const modelClass = ref({} as GenericModel<any>)
|
||||
const modelClass = ref({} as GenericModel)
|
||||
const loading = ref(false)
|
||||
|
||||
/**
|
||||
* create instance of model class when mounted
|
||||
@@ -95,16 +97,17 @@ onMounted(() => {
|
||||
* @param query input to search for on the API
|
||||
*/
|
||||
function search(query: string) {
|
||||
return modelClass.value.list({query: query}).then((r) => {
|
||||
loading.value = true
|
||||
return modelClass.value.list({query: query, page: 1, pageSize: 25}).then((r: any) => {
|
||||
if (modelClass.value.model.isPaginated) {
|
||||
return r.results
|
||||
} else {
|
||||
return r
|
||||
}
|
||||
}).catch((err) => {
|
||||
}).catch((err: any) => {
|
||||
useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
|
||||
}).finally(() => {
|
||||
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
@@ -115,11 +118,11 @@ function search(query: string) {
|
||||
* @param select$ reference to multiselect instance
|
||||
*/
|
||||
async function createObject(object: any, select$: Multiselect) {
|
||||
return await modelClass.value.create({name: object[props.itemLabel]}).then((createdObj) => {
|
||||
return await modelClass.value.create({name: object[props.itemLabel]}).then((createdObj : any) => {
|
||||
useMessageStore().addMessage(MessageType.SUCCESS, 'Created', 5000, createdObj)
|
||||
emit('create', object)
|
||||
return createdObj
|
||||
}).catch((err) => {
|
||||
}).catch((err: any) => {
|
||||
useMessageStore().addError(ErrorMessageType.CREATE_ERROR, err)
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<v-card>
|
||||
<v-card :loading="loading">
|
||||
<v-card-title>
|
||||
{{ $t(OBJ_LOCALIZATION_KEY) }} <span class="text-disabled">{{ editingObj.name }}</span>
|
||||
<v-btn class="float-right" icon="$close" variant="plain" @click="emit('close')" v-if="dialog"></v-btn>
|
||||
</v-card-title>
|
||||
<v-tabs v-model="tab">
|
||||
<v-tabs v-model="tab" :disabled="loading">
|
||||
<v-tab value="food">{{ $t('Food') }}</v-tab>
|
||||
<v-tab value="properties">{{ $t('Properties') }}</v-tab>
|
||||
<v-tab value="conversions">{{ $t('Conversion') }}</v-tab>
|
||||
@@ -14,7 +14,7 @@
|
||||
<v-card-text>
|
||||
<v-tabs-window v-model="tab">
|
||||
<v-tabs-window-item value="food">
|
||||
<v-form>
|
||||
<v-form :disabled="loading">
|
||||
<v-text-field :label="$t('Name')" v-model="editingObj.name"></v-text-field>
|
||||
<v-text-field :label="$t('Plural')" v-model="editingObj.pluralName"></v-text-field>
|
||||
<v-textarea :label="$t('Description')" v-model="editingObj.description"></v-textarea>
|
||||
@@ -64,7 +64,7 @@
|
||||
<template #append>
|
||||
<v-btn color="edit">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="Property" :item="p"></model-editor-dialog>
|
||||
<model-edit-dialog model="Property" :item="p"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-list-item>
|
||||
@@ -88,7 +88,7 @@
|
||||
</v-btn>
|
||||
<v-btn color="edit" class="float-right d-md-none">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="UnitConversion" :item="uc" @delete="deleteUnitConversion(uc, false)" :disabled-fields="['food']"></model-editor-dialog>
|
||||
<model-edit-dialog model="UnitConversion" :item="uc" @delete="deleteUnitConversion(uc, false)" :disabled-fields="['food']"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</v-card-title>
|
||||
<v-card-text class="d-none d-md-block">
|
||||
@@ -138,7 +138,7 @@
|
||||
</v-tabs-window>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-card-actions class="float-right">
|
||||
<v-btn color="delete" prepend-icon="$delete" v-if="isUpdate">{{ $t('Delete') }}
|
||||
<delete-confirm-dialog :object-name="objectName" @delete="deleteObject"></delete-confirm-dialog>
|
||||
</v-btn>
|
||||
@@ -156,7 +156,7 @@ import {useI18n} from "vue-i18n";
|
||||
import {ErrorMessageType, PreparedMessage, useMessageStore} from "@/stores/MessageStore";
|
||||
import ModelSelect from "@/components/inputs/ModelSelect.vue";
|
||||
import {VNumberInput} from 'vuetify/labs/VNumberInput'
|
||||
import ModelEditorDialog from "@/components/dialogs/ModelEditorDialog.vue"; //TODO remove once component is out of labs
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
|
||||
const {t} = useI18n()
|
||||
|
||||
@@ -173,7 +173,7 @@ const editingObj = ref({} as Food)
|
||||
const loading = ref(false)
|
||||
|
||||
// object specific data (for selects/display)
|
||||
const tab = ref("misc")
|
||||
const tab = ref("food")
|
||||
|
||||
const unitConversions = ref([] as UnitConversion[])
|
||||
|
||||
@@ -196,7 +196,7 @@ const isUpdate = computed(() => {
|
||||
* display name for object in headers/delete dialog/...
|
||||
*/
|
||||
const objectName = computed(() => {
|
||||
return isUpdate ? `${t(OBJ_LOCALIZATION_KEY)} ${editingObj.value.token}` : `${t(OBJ_LOCALIZATION_KEY)} (${t('New')})`
|
||||
return isUpdate ? `${t(OBJ_LOCALIZATION_KEY)} ${editingObj.value.name}` : `${t(OBJ_LOCALIZATION_KEY)} (${t('New')})`
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
@@ -204,10 +204,13 @@ onMounted(() => {
|
||||
editingObj.value = props.item
|
||||
} else if (props.itemId != null) {
|
||||
const api = new ApiApi()
|
||||
loading.value = true
|
||||
api.apiFoodRetrieve({id: props.itemId}).then(r => {
|
||||
editingObj.value = r
|
||||
}).catch(err => {
|
||||
useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
})
|
||||
} else {
|
||||
// functions to populate defaults for new item
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
<v-alert color="warning" variant="tonal">Make sure to save your token after creation as they cannot be viewed afterwards.</v-alert>
|
||||
|
||||
<v-btn prepend-icon="$create" color="create" class="mt-2">{{ $t('New') }}
|
||||
<model-editor-dialog model="AccessToken" @create="loadAccessTokens()" :close-after-create="false"></model-editor-dialog>
|
||||
<model-edit-dialog model="AccessToken" @create="loadAccessTokens()" :close-after-create="false"></model-edit-dialog>
|
||||
</v-btn>
|
||||
|
||||
<v-list class="mt-2" border>
|
||||
@@ -39,7 +39,7 @@
|
||||
<v-chip color="error" class="me-2" v-if="at.expires < DateTime.now().toJSDate()">Expired</v-chip>
|
||||
<v-btn color="edit">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="AccessToken" :item="at" class="mt-2" @delete="loadAccessTokens()"></model-editor-dialog>
|
||||
<model-edit-dialog model="AccessToken" :item="at" class="mt-2" @delete="loadAccessTokens()"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-list-item>
|
||||
@@ -53,14 +53,12 @@
|
||||
<script setup lang="ts">
|
||||
|
||||
import {onMounted, ref} from "vue";
|
||||
import {ApiApi} from "@/openapi";
|
||||
import {AccessToken, ApiApi} from "@/openapi";
|
||||
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
|
||||
import {DateTime} from "luxon";
|
||||
import AccessTokenEditor from "@/components/model_editors/AccessTokenEditor.vue";
|
||||
import ModelEditorDialog from "@/components/dialogs/ModelEditorDialog.vue";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
|
||||
const accessTokenList = ref([] as AccessToken[])
|
||||
const accessToken = ref({} as AccessToken)
|
||||
|
||||
onMounted(() => {
|
||||
loadAccessTokens()
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<p class="text-h6 mt-2">{{ $t('Meal_Types') }}
|
||||
<v-btn prepend-icon="$create" color="create" size="small" class="float-right">
|
||||
{{ $t('New') }}
|
||||
<model-editor-dialog model="MealType" @create="item => mealTypes.push(item)" @delete="deleteMealType"></model-editor-dialog>
|
||||
<model-edit-dialog model="MealType" @create="item => mealTypes.push(item)" @delete="deleteMealType"></model-edit-dialog>
|
||||
</v-btn>
|
||||
|
||||
</p>
|
||||
@@ -41,7 +41,7 @@
|
||||
<v-chip class="me-2">{{ mt.time}}</v-chip>
|
||||
<v-btn color="edit">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="MealType" :item="mt" @delete="deleteMealType"></model-editor-dialog>
|
||||
<model-edit-dialog model="MealType" :item="mt" @delete="deleteMealType"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-list-item>
|
||||
@@ -58,7 +58,7 @@ import {useI18n} from "vue-i18n";
|
||||
import {onMounted, ref} from "vue";
|
||||
import {ApiApi, MealType} from "@/openapi";
|
||||
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
|
||||
import ModelEditorDialog from "@/components/dialogs/ModelEditorDialog.vue";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
|
||||
const {t} = useI18n()
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<v-form>
|
||||
<p class="text-h6">{{ $t('SpaceMembers') }}</p>
|
||||
<v-divider></v-divider>
|
||||
<p class="text-subtitle-2">{{$t('SpaceMemberHelp')}}</p>
|
||||
<p class="text-subtitle-2">{{ $t('SpaceMemberHelp') }}</p>
|
||||
|
||||
<v-data-table :items="spaceUserSpaces" :headers="userTableHeaders" density="compact" :hide-default-footer="spaceUserSpaces.length < 10" class="mt-3">
|
||||
<template #item.groups="{item}">
|
||||
@@ -12,16 +12,16 @@
|
||||
<template #item.edit="{item}">
|
||||
<v-btn color="edit" size="small" v-if="item.user.id != useUserPreferenceStore().activeSpace.createdBy.id">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="UserSpace" :item="item" @delete="deleteUserSpace(item)" class="mt-2"></model-editor-dialog>
|
||||
<model-edit-dialog model="UserSpace" :item="item" @delete="deleteUserSpace(item)" class="mt-2"></model-edit-dialog>
|
||||
</v-btn>
|
||||
<v-chip color="edit" v-else>{{$t('Owner')}}</v-chip>
|
||||
<v-chip color="edit" v-else>{{ $t('Owner') }}</v-chip>
|
||||
</template>
|
||||
</v-data-table>
|
||||
|
||||
<p class="text-h6 mt-3">{{ $t('Invites') }}
|
||||
<v-btn size="small" class="float-right" prepend-icon="$create" color="create">
|
||||
{{ $t('New') }}
|
||||
<model-editor-dialog model="InviteLink" @delete="deleteInviteLink" @create="item => spaceInviteLinks.push(item)" class="mt-2"></model-editor-dialog>
|
||||
<model-edit-dialog model="InviteLink" @delete="deleteInviteLink" @create="item => spaceInviteLinks.push(item)" class="mt-2"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</p>
|
||||
<v-divider class="mb-3"></v-divider>
|
||||
@@ -31,7 +31,7 @@
|
||||
<btn-copy size="small" :copy-value="inviteLinkUrl(item)" class="me-1"></btn-copy>
|
||||
<v-btn color="edit" size="small">
|
||||
<v-icon icon="$edit"></v-icon>
|
||||
<model-editor-dialog model="InviteLink" :item="item" @delete="deleteInviteLink(item)" class="mt-2"></model-editor-dialog>
|
||||
<model-edit-dialog model="InviteLink" :item="item" @delete="deleteInviteLink(item)" class="mt-2"></model-edit-dialog>
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
@@ -43,14 +43,12 @@
|
||||
|
||||
|
||||
import {onMounted, ref} from "vue";
|
||||
import {ApiApi, Group, InviteLink, UserSpace} from "@/openapi";
|
||||
import {ErrorMessageType, PreparedMessage, useMessageStore} from "@/stores/MessageStore";
|
||||
import {ApiApi, InviteLink, UserSpace} from "@/openapi";
|
||||
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {DateTime} from "luxon";
|
||||
import {useClipboard} from "@vueuse/core";
|
||||
import ModelEditorDialog from "@/components/dialogs/ModelEditorDialog.vue";
|
||||
import BtnCopy from "@/components/buttons/BtnCopy.vue";
|
||||
import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
|
||||
import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
|
||||
|
||||
const {t} = useI18n()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user