Cost units can be edited

app/Views/Components/AmountInput.vue

@@ -0,0 +1,46 @@
+<script setup>
+const model = defineModel({ type: String, default: '' })
+
+function onInput(e) {
+  let val = e.target.value
+
+  // nur Ziffern und Komma erlauben
+  val = val.replace(/[^0-9,]/g, '')
+
+  // nur das erste Komma behalten
+  const parts = val.split(',')
+  if (parts.length > 2) {
+    val = parts[0] + ',' + parts.slice(1).join('')
+  }
+
+  // Nachkommastellen auf 2 begrenzen
+  if (parts.length === 2) {
+    val = parts[0] + ',' + parts[1].slice(0, 2)
+  }
+
+  model.value = val
+}
+
+function onKeypress(e) {
+  const key = e.key
+
+  // Ziffern sind immer erlaubt
+  if (/[0-9]/.test(key)) return
+
+  // Komma nur wenn noch keines im Wert enthalten ist
+  if (key === ',' && !model.value.includes(',')) return
+
+  // alles andere blocken (inkl. Minuszeichen, Punkte, Buchstaben)
+  e.preventDefault()
+}
+</script>
+
+<template>
+  <input
+      type="text"
+      :value="model"
+      inputmode="decimal"
+      @input="onInput"
+      @keypress="onKeypress"
+  />
+</template>