work in progess, calc tabs title suffix when component is not rendered

application/controllers/api/frontend/v1/stv/Config.php

@@ -68,7 +68,8 @@ class Config extends FHCAPI_Controller
 			'title' => $this->p->t('stv', 'tab_notes'),
 			'component' => './Stv/Studentenverwaltung/Details/Notizen.js',
 			'config'	=> $config['notes'],
-			'showSuffix' => $showSuffix && ($config['notes']['showCountNotes'] ?? false)
+			'showSuffix' => $showSuffix && ($config['notes']['showCountNotes'] ?? false),
+			'suffixhelper' => APP_ROOT . 'public/js/components/Stv/Studentenverwaltung/Details/Notizen/NotizenSuffixHelper.js'
 		];
 
 		$result['contact'] = [

public/js/components/Notiz/Notiz.js

@@ -517,6 +517,9 @@ export default {
 						});
 					})
 				.catch(this.$fhcAlert.handleSystemError);
+		},
+		getSuffix() {
+			return '(bhtest)';
 		}
 	},
 	created() {

public/js/components/Tabs.js

@@ -67,9 +67,9 @@ export default {
 		}
 	},
 	methods: {
-		handleTabClick: function(index) {
+		handleTabClick: function (e) {
 			let keys = Object.keys(this.tabs);
-			this.change(keys[index]);
+			this.change(keys[e.index]);
 		},
 		change(key) {
 			this.$emit("change", key)
@@ -108,8 +108,24 @@ export default {
 					title: Vue.computed(() => item.title || key),
 					config: item.config,
 					key,
-					value
+					value,
+					suffixhelper: null
 				};
+
+				const fetchhelper = async function (tab, item) {
+					if (!item.showSuffix)
+						return null;
+
+					const mod = await import(item.suffixhelper);
+					tab.suffixhelper = mod.getSuffix;
+					// TODO call suffixhelper with modelValue - but modelValue not defined in this scope
+					/*
+					tab.suffixhelper(modelValue).then((response) => {
+						tab.value.suffix = response.data;
+					});
+					 */
+				};
+				fetchhelper(tabs[key], item);
 			}
 
 			if (Array.isArray(config))