various model editor functions

vue3/src/components/model_editors/AccessTokenEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form :disabled="loading">
@@ -40,7 +40,7 @@ import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
 
 const props = defineProps({
     item: {type: {} as PropType<AccessToken>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/FoodEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
 
         <v-tabs v-model="tab" :disabled="loading">
@@ -167,7 +167,7 @@ import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
 
 const props = defineProps({
     item: {type: {} as PropType<Food>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/InviteLinkEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form :disabled="loading">
@@ -24,7 +24,7 @@
 <script setup lang="ts">
 
 import {VDateInput} from 'vuetify/labs/VDateInput' //TODO remove once component is out of labs
-import { onMounted, PropType, ref} from "vue";
+import {onMounted, PropType, ref} from "vue";
 import {ApiApi, Group, InviteLink} from "@/openapi";
 import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
 import {DateTime} from "luxon";
@@ -34,7 +34,7 @@ import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
 
 const props = defineProps({
     item: {type: {} as PropType<InviteLink>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/KeywordEditor.vue

@@ -0,0 +1,55 @@
+<template>
+    <model-editor-base
+        :loading="loading"
+        :dialog="dialog"
+        @save="saveObject"
+        @delete="deleteObject"
+        @close="emit('close')"
+        :is-update="isUpdate()"
+        :model-class="modelClass"
+        :object-name="editingObjName()">
+        <v-card-text>
+            <v-form :disabled="loading">
+
+                <v-text-field :label="$t('Name')" v-model="editingObj.name"></v-text-field>
+                <v-textarea :label="$t('Description')" v-model="editingObj.description"></v-textarea>
+
+            </v-form>
+        </v-card-text>
+    </model-editor-base>
+
+</template>
+
+<script setup lang="ts">
+
+import {onMounted, PropType} from "vue";
+import {Keyword} from "@/openapi";
+import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
+import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
+import {useI18n} from "vue-i18n";
+
+const {t} = useI18n()
+
+const props = defineProps({
+    item: {type: {} as PropType<Keyword>, required: false, default: null},
+    itemId: {type: [Number, String], required: false, default: undefined},
+    dialog: {type: Boolean, default: false}
+})
+
+const emit = defineEmits(['create', 'save', 'delete', 'close'])
+const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading, editingObj, modelClass} = useModelEditorFunctions<Keyword>('Keyword', emit)
+
+// object specific data (for selects/display)
+
+onMounted(() => {
+    if (!setupState(props.item, props.itemId)) {
+        // functions to populate defaults
+
+    }
+})
+
+</script>
+
+<style scoped>
+
+</style>

vue3/src/components/model_editors/MealTypeEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form :disabled="loading">
@@ -47,7 +47,7 @@ import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
 
 const props = defineProps({
     item: {type: {} as PropType<MealType>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/ModelEditorBase.vue

@@ -1,7 +1,7 @@
 <template>
     <v-card :loading="loading">
         <v-card-title>
-            {{ modelName }}
+            <i :class="modelClass.model.icon"></i> {{ $t(modelClass.model.localizationKey) }}
             <v-btn class="float-right" icon="$close" variant="plain" @click="emit('close')" v-if="dialog"></v-btn>
             <v-card-subtitle class="pa-0">{{ objectName }}</v-card-subtitle>
         </v-card-title>
@@ -11,10 +11,11 @@
         </slot>
         <v-divider></v-divider>
         <v-card-actions>
-            <v-btn color="delete" prepend-icon="$delete" v-if="isUpdate">{{ $t('Delete') }}
-                <delete-confirm-dialog :object-name="objectName" :model-name="modelName" @delete="emit('delete')"></delete-confirm-dialog>
+            <v-btn color="delete" prepend-icon="$delete" v-if="isUpdate && !modelClass.model.disableDelete">{{ $t('Delete') }}
+                <delete-confirm-dialog :object-name="objectName" :model-name="$t(modelClass.model.localizationKey)" @delete="emit('delete')"></delete-confirm-dialog>
             </v-btn>
-            <v-btn color="save" prepend-icon="$save" @click="emit('save')">{{ isUpdate ? $t('Save') : $t('Create') }}</v-btn>
+            <v-btn color="save" prepend-icon="$create" @click="emit('save')" v-if="!isUpdate && !modelClass.model.disableCreate">{{ $t('Create') }}</v-btn>
+            <v-btn color="save" prepend-icon="$save" @click="emit('save')" v-if="isUpdate && !modelClass.model.disableUpdate">{{ $t('Update') }}</v-btn>
         </v-card-actions>
     </v-card>
 </template>
@@ -22,6 +23,7 @@
 <script setup lang="ts">
 
 import DeleteConfirmDialog from "@/components/dialogs/DeleteConfirmDialog.vue";
+import {GenericModel} from "@/types/Models";
 
 const emit = defineEmits(['save', 'delete', 'close'])
 
@@ -29,7 +31,7 @@ const props = defineProps({
     loading: {type: Boolean, default: false},
     dialog: {type: Boolean, default: false},
     objectName: {type: String, default: ''},
-    modelName: {type: String, default: ''},
+    modelClass: {type: GenericModel, default: null},
     isUpdate: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/PropertyEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form>
@@ -36,7 +36,7 @@ import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
 
 const props = defineProps({
     item: {type: {} as PropType<Property>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/UnitConversionEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form>
@@ -56,7 +56,7 @@ import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
 
 const props = defineProps({
     item: {type: {} as PropType<UnitConversion>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })
 

vue3/src/components/model_editors/UnitEditor.vue

@@ -0,0 +1,80 @@
+<template>
+    <model-editor-base
+        :loading="loading"
+        :dialog="dialog"
+        @save="saveObject"
+        @delete="deleteObject"
+        @close="emit('close')"
+        :is-update="isUpdate()"
+        :model-class="modelClass"
+        :object-name="editingObjName()">
+        <v-card-text>
+            <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>
+                <v-select :label="$t('BaseUnit')" :hint="$t('BaseUnitHelp')" :items="BASE_UNITS" v-model="editingObj.baseUnit"></v-select>
+                <v-text-field :label="$t('Open_Data_Slug')" :hint="$t('open_data_help_text')" persistent-hint v-model="editingObj.openDataSlug" disabled></v-text-field>
+
+            </v-form>
+        </v-card-text>
+    </model-editor-base>
+
+</template>
+
+<script setup lang="ts">
+
+import {onMounted, PropType} from "vue";
+import {Unit} from "@/openapi";
+import ModelEditorBase from "@/components/model_editors/ModelEditorBase.vue";
+import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
+import {useI18n} from "vue-i18n";
+
+const {t} = useI18n()
+
+const props = defineProps({
+    item: {type: {} as PropType<Unit>, required: false, default: null},
+    itemId: {type: [Number, String], required: false, default: undefined},
+    dialog: {type: Boolean, default: false}
+})
+
+const emit = defineEmits(['create', 'save', 'delete', 'close'])
+const {setupState, deleteObject, saveObject, isUpdate, editingObjName, loading, editingObj, modelClass} = useModelEditorFunctions<Unit>('Unit', emit)
+
+// object specific data (for selects/display)
+
+const BASE_UNITS = [
+    {value: "g", title: t("g")},
+    {value: "kg", title: t("kg")},
+    {value: "ounce", title: t("ounce")},
+    {value: "pound", title: t("pound")},
+    {value: "ml", title: t("ml")},
+    {value: "l", title: t("l")},
+    {value: "fluid_ounce", title: t("fluid_ounce")},
+    {value: "us_cup", title: t("us_cup")},
+    {value: "pint", title: t("pint")},
+    {value: "quart", title: t("quart")},
+    {value: "gallon", title: t("gallon")},
+    {value: "tbsp", title: t("tbsp")},
+    {value: "tsp", title: t("tsp")},
+    {value: "imperial_fluid_ounce", title: t("imperial_fluid_ounce")},
+    {value: "imperial_pint", title: t("imperial_pint")},
+    {value: "imperial_quart", title: t("imperial_quart")},
+    {value: "imperial_gallon", title: t("imperial_gallon")},
+    {value: "imperial_tbsp", title: t("imperial_tbsp")},
+    {value: "imperial_tsp", title: t("imperial_tsp")},
+]
+
+onMounted(() => {
+    if (!setupState(props.item, props.itemId)) {
+        // functions to populate defaults
+
+    }
+})
+
+</script>
+
+<style scoped>
+
+</style>

vue3/src/components/model_editors/UserSpaceEditor.vue

@@ -6,7 +6,7 @@
         @delete="deleteObject"
         @close="emit('close')"
         :is-update="isUpdate()"
-        :model-name="$t(modelClass.model.localizationKey)"
+        :model-class="modelClass"
         :object-name="editingObjName()">
         <v-card-text>
             <v-form>
@@ -30,7 +30,7 @@ import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
 
 const props = defineProps({
     item: {type: {} as PropType<UserSpace>, required: false, default: null},
-    itemId: {type: Number, required: false, default: undefined},
+    itemId: {type: [Number, String], required: false, default: undefined},
     dialog: {type: Boolean, default: false}
 })