Basic ingredient editor

vue3/src/apps/tandoor/main.ts

@@ -27,11 +27,13 @@ import ApiSettings from "@/components/settings/ApiSettings.vue";
 import ModelListPage from "@/pages/ModelListPage.vue";
 import ModelEditPage from "@/pages/ModelEditPage.vue";
 import RecipeImportPage from "@/pages/RecipeImportPage.vue";
+import IngredientEditorPage from "@/pages/IngredientEditorPage.vue";
 
 const routes = [
     {path: '/', component: StartPage, name: 'view_home'},
     {path: '/test', component: TestPage, name: 'view_test'},
-    {path: '/settings', component: SettingsPage, name: 'view_settings', redirect: '/settings/account',
+    {
+        path: '/settings', component: SettingsPage, name: 'view_settings', redirect: '/settings/account',
         children: [
             {path: 'account', component: AccountSettings, name: 'view_settings_account'},
             {path: 'cosmetic', component: CosmeticSettings, name: 'view_settings_cosmetic'},
@@ -41,7 +43,8 @@ const routes = [
             {path: 'space-members', component: SpaceMemberSettings, name: 'view_settings_space_member'},
             {path: 'user-space', component: UserSpaceSettings, name: 'view_settings_user_space'},
             {path: 'api', component: ApiSettings, name: 'view_settings_api'},
-        ]},
+        ]
+    },
     //{path: '/settings/:page', component: SettingsPage, name: 'view_settings_page', props: true},
     {path: '/search', component: SearchPage, name: 'view_search'},
     {path: '/shopping', component: ShoppingListPage, name: 'view_shopping'},
@@ -51,9 +54,10 @@ const routes = [
     {path: '/recipe/:id', component: RecipeViewPage, name: 'view_recipe', props: true},
     {path: '/recipe/edit/:recipe_id', component: RecipeEditPage, name: 'edit_recipe', props: true},
 
-    {path: '/list/:model?', component: ModelListPage,  props: true, name: 'ModelListPage'},
-    {path: '/edit/:model/:id?', component: ModelEditPage,  props: true, name: 'ModelEditPage'},
+    {path: '/list/:model?', component: ModelListPage, props: true, name: 'ModelListPage'},
+    {path: '/edit/:model/:id?', component: ModelEditPage, props: true, name: 'ModelEditPage'},
 
+    {path: '/ingredient-editor', component: IngredientEditorPage, name: 'IngredientEditorPage'},
 ]
 
 const router = createRouter({

vue3/src/components/inputs/ModelSelect.vue

@@ -1,13 +1,14 @@
 <template>
     <!-- TODO label is not showing for some reason, for now in placeholder -->
     <!-- TODO support density prop -->
-    <v-input :hint="props.hint" persistent-hint :label="props.label" class="" >
+    <v-input :hint="props.hint" persistent-hint :label="props.label" >
 
         <!-- TODO resolve-on-load false for now, race condition with model class, make prop once better solution is found -->
         <Multiselect
 
             :ref="`ref_${props.id}`"
-            class="material-multiselect"
+            class="material-multiselect "
+            :class="{'model-select--density-compact': props.density == 'compact', 'model-select--density-comfortable': props.density == 'comfortable', 'model-select--density-default': props.density == ''}"
             :resolve-on-load="props.searchOnLoad"
             v-model="model"
             :options="search"
@@ -53,7 +54,7 @@ const emit = defineEmits(['update:modelValue', 'create'])
 const props = defineProps({
     model: {type: String as PropType<EditorSupportedModels>, required: true},
 
-    id: {type: String, required: false, default: Math.floor(Math.random()*10000).toString()},
+    id: {type: String, required: false, default: Math.floor(Math.random() * 10000).toString()},
 
     limit: {type: Number, default: 25},
 
@@ -71,6 +72,7 @@ const props = defineProps({
 
     label: {type: String, default: ''},
     hint: {type: String, default: ''},
+    density: {type: String as PropType<''|'compact'|'comfortable'>, default: ''},
 
     searchOnLoad: {type: Boolean, default: false},
 })
@@ -79,7 +81,7 @@ const props = defineProps({
  * check if model has a non-standard value attribute defined, if not use "id" as the value attribute
  */
 const itemValue = computed(() => {
-    if(modelClass.value.model.itemValue){
+    if (modelClass.value.model.itemValue) {
         return modelClass.value.model.itemValue
     }
     return 'id'
@@ -89,7 +91,7 @@ const itemValue = computed(() => {
  * check if model has a non-standard label attribute defined, if not use "name" as the value attribute
  */
 const itemLabel = computed(() => {
-    if(modelClass.value.model.itemLabel){
+    if (modelClass.value.model.itemLabel) {
         return modelClass.value.model.itemLabel
     }
     return 'name'
@@ -135,7 +137,7 @@ function search(query: string) {
  * @param select$ reference to multiselect instance
  */
 async function createObject(object: any, select$: Multiselect) {
-    return await modelClass.value.create({name: object[itemLabel.value]}).then((createdObj : any) => {
+    return await modelClass.value.create({name: object[itemLabel.value]}).then((createdObj: any) => {
         useMessageStore().addMessage(MessageType.SUCCESS, 'Created', 5000, createdObj)
         emit('create', object)
         return createdObj
@@ -148,17 +150,29 @@ async function createObject(object: any, select$: Multiselect) {
 </script>
 
 <style src="@vueform/multiselect/themes/default.css"></style>
-<style>
+<style scoped>
 .material-multiselect {
-    --ms-line-height: 2.3;
-    --ms-bg: rgba(235, 235, 235, 0.3);
+    --ms-bg: rgba(210, 210, 210, 0.1);
     --ms-border-color: 0;
     --ms-border-color-active: 0;
-    border-bottom: inset 1px #323232;
+    border-bottom: inset 1px rgba(50, 50, 50, 0.8);
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
 }
 
+.model-select--density-compact {
+    --ms-line-height: 1.3;
+}
+
+.model-select--density-comfortable {
+    --ms-line-height: 1.8;
+}
+
+.model-select--density-default {
+    --ms-line-height: 2.3;
+}
+
+
 .multiselect-tag {
     background-color: #b98766 !important;
 }

vue3/src/components/inputs/StepEditor.vue

@@ -178,7 +178,6 @@ import {useDisplay} from "vuetify";
 import {VueDraggable} from "vue-draggable-plus";
 import VClosableCardTitle from "@/components/dialogs/VClosableCardTitle.vue";
 import IngredientString from "@/components/display/IngredientString.vue";
-import numberInput from "../../../../vue/src/components/Modals/NumberInput.vue";
 
 const emit = defineEmits(['delete'])
 

vue3/src/locales/ar.json

@@ -140,6 +140,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "",
+  "Ingredient": "",
   "Ingredient Editor": "",
   "Ingredient Overview": "",
   "IngredientInShopping": "",

vue3/src/locales/bg.json

@@ -137,6 +137,7 @@
   "Imported_From": "Внесено от",
   "Importer_Help": "Повече информация и помощ за този вносител:",
   "Information": "Информация",
+  "Ingredient": "",
   "Ingredient Editor": "Редактор на съставки",
   "IngredientInShopping": "Тази съставка е във вашия списък за пазаруване.",
   "Ingredients": "Съставки",

vue3/src/locales/ca.json

@@ -183,6 +183,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "",
+  "Ingredient": "",
   "Ingredient Editor": "Editor d'ingredients",
   "Ingredient Overview": "",
   "IngredientInShopping": "",

vue3/src/locales/cs.json

@@ -183,6 +183,7 @@
   "Imported_From": "Importováno z",
   "Importer_Help": "Nápověda k importu z této aplikace:",
   "Information": "Informace",
+  "Ingredient": "",
   "Ingredient Editor": "Editace ingrediencí",
   "Ingredient Overview": "Přehled ingrediencí",
   "IngredientInShopping": "Tato ingredience je na vašem nákupním seznamu.",

vue3/src/locales/da.json

@@ -171,6 +171,7 @@
   "Imported_From": "Importeret fra",
   "Importer_Help": "Mere information og hjælp til denne importer:",
   "Information": "Information",
+  "Ingredient": "",
   "Ingredient Editor": "Ingrediens redigeringsværktøj",
   "Ingredient Overview": "Ingrediensoversigt",
   "IngredientInShopping": "Denne ingrediens er i din indkøbsliste.",

vue3/src/locales/de.json

@@ -185,6 +185,7 @@
   "Imported_From": "Importiert aus",
   "Importer_Help": "Zusätzliche Informationen und Hilfe zu diesem Importer:",
   "Information": "Information",
+  "Ingredient": "Zutat",
   "Ingredient Editor": "Zutateneditor",
   "Ingredient Overview": "Zutatenübersicht",
   "IngredientInShopping": "Diese Zutat befindet sich auf Ihrer Einkaufsliste.",

vue3/src/locales/el.json

@@ -166,6 +166,7 @@
   "Imported_From": "Πηγή",
   "Importer_Help": "Περισσότερες πληροφορίες και βοήθεια για αυτό το πρόγραμμα εισαγωγής:",
   "Information": "Πληροφορίες",
+  "Ingredient": "",
   "Ingredient Editor": "Επεξεργαστής συστατικών",
   "Ingredient Overview": "Σύνοψη υλικών",
   "IngredientInShopping": "Αυτό το υλικό είναι στη λίστα αγορών.",

vue3/src/locales/en.json

@@ -184,6 +184,7 @@
   "Imported_From": "Imported from",
   "Importer_Help": "More information and help on this importer:",
   "Information": "Information",
+  "Ingredient": "Ingredient",
   "Ingredient Editor": "Ingredient Editor",
   "Ingredient Overview": "Ingredient Overview",
   "IngredientInShopping": "This ingredient is in your shopping list.",

vue3/src/locales/es.json

@@ -184,6 +184,7 @@
   "Imported_From": "Importado de",
   "Importer_Help": "Más información y ayuda con este importador:",
   "Information": "Información",
+  "Ingredient": "",
   "Ingredient Editor": "Ingredientes",
   "Ingredient Overview": "Vistazo de Ingredientes",
   "IngredientInShopping": "Este ingrediente ya esta en la lista de la compra.",

vue3/src/locales/fi.json

@@ -100,6 +100,7 @@
   "Import": "Tuo",
   "Import_finished": "Tuonti valmistui",
   "Information": "Tiedot",
+  "Ingredient": "",
   "Ingredients": "Ainesosat",
   "Instructions": "Ohjeet",
   "InstructionsEditHelp": "",

vue3/src/locales/fr.json

@@ -183,6 +183,7 @@
   "Imported_From": "Importé depuis",
   "Importer_Help": "Plus d'information et d'aide sur cet importateur :",
   "Information": "Information",
+  "Ingredient": "",
   "Ingredient Editor": "Éditeur d’ingrédients",
   "Ingredient Overview": "Aperçu des ingrédients",
   "IngredientInShopping": "Cet ingrédient est dans votre liste de courses.",

vue3/src/locales/he.json

@@ -184,6 +184,7 @@
   "Imported_From": "יובא מ",
   "Importer_Help": "עוד מידע ועזרה על כלי ייבוא זה:",
   "Information": "מידע",
+  "Ingredient": "",
   "Ingredient Editor": "עורך המרכיב",
   "Ingredient Overview": "סקירת רכיב",
   "IngredientInShopping": "רכיב זה ברשימת הקניות.",

vue3/src/locales/hu.json

@@ -167,6 +167,7 @@
   "Imported_From": "Importálva",
   "Importer_Help": "",
   "Information": "Információ",
+  "Ingredient": "",
   "Ingredient Editor": "Hozzávalók szerkesztője",
   "Ingredient Overview": "Hozzávalók áttekintése",
   "IngredientInShopping": "Ez a hozzávaló szerepel a bevásárlólistán.",

vue3/src/locales/hy.json

@@ -75,6 +75,7 @@
   "Import": "Ներմուծել",
   "Import_finished": "Ներմուծումն ավարտված է",
   "Information": "Տեղեկություն",
+  "Ingredient": "",
   "Ingredients": "",
   "InstructionsEditHelp": "",
   "Invite_Link": "",

vue3/src/locales/id.json

@@ -154,6 +154,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "Informasi",
+  "Ingredient": "",
   "Ingredient Editor": "Editor Bahan",
   "Ingredient Overview": "",
   "IngredientInShopping": "",

vue3/src/locales/is.json

@@ -183,6 +183,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "",
+  "Ingredient": "",
   "Ingredient Editor": "",
   "Ingredient Overview": "",
   "IngredientInShopping": "",

vue3/src/locales/it.json

@@ -159,6 +159,7 @@
   "Imported_From": "Importato da",
   "Importer_Help": "Per altre informazioni e aiuto su questo importer:",
   "Information": "Informazioni",
+  "Ingredient": "",
   "Ingredient Editor": "Editor Ingredienti",
   "Ingredient Overview": "Panoramica Ingredienti",
   "IngredientInShopping": "Questo ingrediente è nella tua lista della spesa.",

vue3/src/locales/lt.json

@@ -169,6 +169,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "",
+  "Ingredient": "",
   "Ingredient Editor": "Ingredientų redaktorius",
   "Ingredient Overview": "",
   "IngredientInShopping": "",

vue3/src/locales/nb_NO.json

@@ -164,6 +164,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "Informasjon",
+  "Ingredient": "",
   "Ingredient Editor": "Ingrediens Behandler",
   "Ingredient Overview": "",
   "IngredientInShopping": "Denne ingrediensen er i handlekurven din.",

vue3/src/locales/nl.json

@@ -168,6 +168,7 @@
   "Imported_From": "Geïmporteerd van",
   "Importer_Help": "Meer informatie en hulp over de importtool:",
   "Information": "Informatie",
+  "Ingredient": "",
   "Ingredient Editor": "Ingrediënten editor",
   "Ingredient Overview": "Ingrediëntenlijst",
   "IngredientInShopping": "Dit ingrediënt staat op je boodschappenlijst.",

vue3/src/locales/pl.json

@@ -185,6 +185,7 @@
   "Imported_From": "Zaimportowane z",
   "Importer_Help": "Więcej informacji i pomoc na temat tego importera:",
   "Information": "Informacja",
+  "Ingredient": "",
   "Ingredient Editor": "Edytor składników",
   "Ingredient Overview": "Przegląd składników",
   "IngredientInShopping": "Ten składnik znajduje się na Twojej liście zakupów.",

vue3/src/locales/pt.json

@@ -132,6 +132,7 @@
   "Import": "Importar",
   "Import_finished": "Importação terminada",
   "Information": "Informação",
+  "Ingredient": "",
   "Ingredient Editor": "Editor de Ingredientes",
   "IngredientInShopping": "Este ingrediente está na sua lista de compras.",
   "Ingredients": "Ingredientes",

vue3/src/locales/pt_BR.json

@@ -178,6 +178,7 @@
   "Imported_From": "Importado de",
   "Importer_Help": "Mais informações neste importador:",
   "Information": "Informação",
+  "Ingredient": "",
   "Ingredient Editor": "Editor de Ingrediente",
   "Ingredient Overview": "Ingredientes - Visão Geral",
   "IngredientInShopping": "Este ingrediente está na sua lista de compras.",

vue3/src/locales/ro.json

@@ -162,6 +162,7 @@
   "Imported_From": "Importat din",
   "Importer_Help": "Mai multe informații și ajutor cu privire la acest importator:",
   "Information": "Informație",
+  "Ingredient": "",
   "Ingredient Editor": "Editor de ingrediente",
   "Ingredient Overview": "Prezentare generală a ingredientelor",
   "IngredientInShopping": "Acest ingredient se află în lista de cumpărături.",

vue3/src/locales/ru.json

@@ -124,6 +124,7 @@
   "Imported": "Импортировано",
   "Imported_From": "Импортировано из",
   "Information": "Информация",
+  "Ingredient": "",
   "Ingredient Editor": "Редактор ингредиентов",
   "IngredientInShopping": "Этот ингредиент в вашем списке покупок.",
   "Ingredients": "Ингредиенты",

vue3/src/locales/sl.json

@@ -120,6 +120,7 @@
   "Import": "Uvozi",
   "Import_finished": "Uvoz je končan",
   "Information": "Informacija",
+  "Ingredient": "",
   "Ingredient Editor": "Urejevalnik Sestavin",
   "IngredientInShopping": "Ta sestavina je v tvojem nakupovalnem listku.",
   "Ingredients": "Sestavine",

vue3/src/locales/sv.json

@@ -185,6 +185,7 @@
   "Imported_From": "Importerad från",
   "Importer_Help": "Mer information och hjälp om denna import:",
   "Information": "Information",
+  "Ingredient": "",
   "Ingredient Editor": "Ingrediensredigerare",
   "Ingredient Overview": "Ingrediensöversikt",
   "IngredientInShopping": "Denna ingrediens finns i din inköpslista.",

vue3/src/locales/tr.json

@@ -184,6 +184,7 @@
   "Imported_From": "İçe Aktarıldığı Yer",
   "Importer_Help": "Bu içe aktarıcı hakkında daha fazla bilgi ve yardım:",
   "Information": "Bilgi",
+  "Ingredient": "",
   "Ingredient Editor": "Malzeme Düzenleyici",
   "Ingredient Overview": "Malzeme Genel Bakış",
   "IngredientInShopping": "Bu malzeme alışveriş listenizde.",

vue3/src/locales/uk.json

@@ -146,6 +146,7 @@
   "Imported_From": "",
   "Importer_Help": "",
   "Information": "Інформація",
+  "Ingredient": "",
   "Ingredient Editor": "Редактор Інгредієнтів",
   "IngredientInShopping": "Цей інгредієнт є в вашому списку покупок.",
   "Ingredients": "Інгредієнти",

vue3/src/locales/zh_Hans.json

@@ -180,6 +180,7 @@
   "Imported_From": "导入",
   "Importer_Help": "有关此进口商的更多信息和帮助：",
   "Information": "更多信息",
+  "Ingredient": "",
   "Ingredient Editor": "食材编辑器",
   "Ingredient Overview": "食材概述",
   "IngredientInShopping": "此食材已在购物清单中。",

vue3/src/locales/zh_Hant.json

@@ -60,6 +60,7 @@
   "Import": "",
   "Import_finished": "匯入完成",
   "Information": "",
+  "Ingredient": "",
   "Ingredients": "",
   "InstructionsEditHelp": "",
   "Invite_Link": "",