Verschieden Settings hinzugefügt (inkomplett)

frontend/src/components/SettingsWidget.vue

@@ -1,9 +1,7 @@
 <template>
     <div class="settings-widget">
-        <h2>{{ $t("settings.personal.title") }}</h2>
         <template v-for="setting in settings">
-            <InputStringWidget v-if="setting.datatype == 'string'"
-                :labelTr="`settings.personal.label.${setting.name}`"
+            <InputStringWidget v-if="setting.datatype == 'string'" :labelTr="`settings.personal.label.${setting.name}`"
                 :tooltipTr="`settings.personal.tooltip.${setting.name}`" :value=setting.value :list="languagesList()"
                 @input="handleInput(setting.id, $event)" />
             <DateInputWidget v-else-if="setting.datatype == 'date'" :labelTr="`settings.personal.label.${setting.name}`"
@@ -13,6 +11,18 @@
                 :labelTr="`settings.personal.label.${setting.name}`"
                 :tooltipTr="`settings.personal.tooltip.${setting.name}`" :value=setting.value
                 :list="getSettingOptions(setting.name, setting.options)" @input="handleInput(setting.id, $event)" />
+            <InputNumberWidget v-else-if="setting.datatype == 'int'"
+                :labelTr="`settings.personal.label.${setting.name}`"
+                :tooltipTr="`settings.personal.tooltip.${setting.name}`" :value=setting.value min="0" max="200"
+                @input="handleInput(setting.id, $event)" />
+            <FloatInputWidget v-else-if="setting.datatype == 'float'"
+                :labelTr="`settings.personal.label.${setting.name}`"
+                :tooltipTr="`settings.personal.tooltip.${setting.name}`" :value=setting.value
+                @input="handleInput(setting.id, $event)" />
+            <CheckboxWidget v-else-if="setting.datatype == 'bool'"
+                :labelTr="`settings.personal.label.${setting.name}`"
+                :tooltipTr="`settings.personal.tooltip.${setting.name}`" :value=setting.value
+                @input="handleInput(setting.id, $event)" />
             <div v-else>{{ setting }}
             </div>
         </template>
@@ -25,6 +35,9 @@ import { mapGetters } from 'vuex';
 import InputStringWidget from '@/components/form/InputStringWidget.vue';
 import DateInputWidget from '@/components/form/DateInputWidget.vue';
 import SelectDropdownWidget from '@/components/form/SelectDropdownWidget';
+import InputNumberWidget from '@/components/form/InputNumberWidget';
+import FloatInputWidget from '@/components/form/FloatInputWidget';
+import CheckboxWidget from '@/components/form/CheckboxWidget';
 
 export default {
     name: "SettingsWidget",
@@ -32,6 +45,9 @@ export default {
         InputStringWidget,
         DateInputWidget,
         SelectDropdownWidget,
+        InputNumberWidget,
+        FloatInputWidget,
+        CheckboxWidget
     },
     props: {
         settingsType: {
@@ -79,7 +95,6 @@ export default {
                     settingId: settingId,
                     value: value
                 });
-                console.log('Setting updated:', settingId, value);
             } catch (err) {
                 console.error('Error updating setting:', err);
             }

frontend/src/components/form/InputNumberWidget.vue

@@ -43,3 +43,17 @@ export default {
     }
 };
 </script>
+
+<style scoped>
+label {
+    display: block;
+}
+
+label>span {
+    display: inline-block;
+}
+
+input {
+    margin-left: 0.5em;
+}
+</style>