model related stuff

This commit is contained in:
vabene1111
2024-09-26 15:02:07 +02:00
parent ddaeb054d0
commit 9a94c650da
42 changed files with 320 additions and 94 deletions

View File

@@ -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)
})
}

View File

@@ -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

View File

@@ -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()

View File

@@ -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()

View File

@@ -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()