Merge pull request #464 from AOEpeople/bugfix/#263719-cash-input

Bugfix/#263719 cash input

Author: FeBe94

src/Resources/src/components/misc/MoneyInput.vue

@@ -1,31 +1,48 @@
 <template>
   <input
     v-model="value"
-    type="text"
-    pattern="\d*([.,]?\d{0,2})"
+    type="number"
     required
+    min="0.00"
+    step=".01"
     class="h-[46px] rounded-full border-[2px] border-solid border-[#CAD6E1] bg-white text-center"
+    @focus="(e) => selectAllAndPlaceCursor(e.target as HTMLInputElement)"
   />
 </template>
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import { useI18n } from 'vue-i18n';
 
 const props = defineProps<{
   modelValue: number;
 }>();
 
-const { locale } = useI18n();
-
 const emit = defineEmits(['update:modelValue']);
 
 const value = computed({
   get() {
-    return locale.value === 'en' ? props.modelValue.toFixed(2) : props.modelValue.toFixed(2).replace(/\./g, ',');
+    return props.modelValue;
   },
   set(value) {
-    emit('update:modelValue', parseFloat(value.replace(/,/, '.')));
+    emit('update:modelValue', parseFloat(value.toFixed(2)));
   }
 });
+
+function selectAllAndPlaceCursor(element: HTMLInputElement) {
+  element.select();
+  element.focus();
+  element.setSelectionRange(0, 0);
+}
 </script>
+
+<style scoped>
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+input[type='number'] {
+  -moz-appearance: textfield;
+}
+</style>