From 595c937d502defbdec9cdd1b7b827a608e6d131c Mon Sep 17 00:00:00 2001
From: th33xitus <th33xitus@googlemail.com>
Date: Tue, 18 Jan 2022 22:07:27 +0100
Subject: [PATCH] fix: improve machine settings number inputs (#537)

* fix: truncate excessive decimal places

fix: add `toString` casting to labels

fix: disable spinner appropriately

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* fix: allow smooth time with 3 decimal places

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* fix: disable both spinners if input value triggers error

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* feat: add spinnerFactor prop

Simple multiplicator that can be used in combination with spinners to increase/decrease values with a different step size.

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* fix: smooth time step size of 0.001

fix: spinnerFactor of 10

Allows for manual input of numbers with 3 decimal places. Spinners will still increase/decrease by 0.01

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* feat: add hasSpinner prop

Allows for individually activating/disabling spinners on a number input field

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* fix: add sane values as spinnerFactor for motion and fw retract spinners

Signed-off-by: Dominik Willner <th33xitus@gmail.com>

* fix: nullish coalescing operator logic

Signed-off-by: Dominik Willner <th33xitus@gmail.com>
---
 .../FirmwareRetractionSettingsInput.vue       | 31 ++++++++++++----
 src/components/inputs/MotionSettingsInput.vue | 31 ++++++++++++----
 .../inputs/PressureAdvanceSettingsInput.vue   | 31 ++++++++++++----
 .../FirmwareRetractionSettings.vue            | 32 ++++++++++------
 .../MachineSettings/MachineSettingsPanel.vue  |  8 ++--
 .../panels/MachineSettings/MotionSettings.vue | 37 +++++++++++--------
 .../PressureAdvanceSettings.vue               | 21 ++++++-----
 7 files changed, 130 insertions(+), 61 deletions(-)

diff --git a/src/components/inputs/FirmwareRetractionSettingsInput.vue b/src/components/inputs/FirmwareRetractionSettingsInput.vue
index 09f1fae5..0874ca94 100644
--- a/src/components/inputs/FirmwareRetractionSettingsInput.vue
+++ b/src/components/inputs/FirmwareRetractionSettingsInput.vue
@@ -13,8 +13,8 @@
             @click:append="resetLimit"
             :label="label"
             :suffix="unit"
-            :append-icon="this.value !== this.defaultValue ? 'mdi-restart' : ''"
-            :error="(this.value < this.min) || ((this.value > this.max) && this.max !== null)"
+            :append-icon="value !== defaultValue ? 'mdi-restart' : ''"
+            :error="error = ((value < min) || ((value > max) && max !== null))"
             :step="step"
             :min="min"
             :max="max"
@@ -25,10 +25,24 @@
             outlined
             dense
         >
-            <template v-slot:append-outer>
+            <template v-if="hasSpinner" v-slot:append-outer>
                 <div class="_spin_button_group">
-                    <v-btn @click="increment" class="mt-n3" icon plain small><v-icon>mdi-chevron-up</v-icon></v-btn>
-                    <v-btn @click="decrement" class="mb-n3" icon plain small><v-icon>mdi-chevron-down</v-icon></v-btn>
+                    <v-btn
+                        @click="increment"
+                        :disabled="((value >= max) && max !== null) || error"
+                        class="mt-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-up</v-icon>
+                    </v-btn>
+                    <v-btn
+                        @click="decrement"
+                        :disabled="(value <= min) || error"
+                        class="mb-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-down</v-icon>
+                    </v-btn>
                 </div>
             </template>
         </v-text-field>
@@ -44,9 +58,12 @@ import BaseMixin from '@/components/mixins/base'
 @Component
 export default class FirmwareRetractionSettingsInput extends Mixins(BaseMixin) {
     private value: number = 0
+    private error: boolean | undefined
 
     @Prop({ type: String, required: true }) readonly label!: string
     @Prop({ type: Number, required: false , default: 1 }) readonly step!: number
+    @Prop({ type: Boolean, required: false , default: false }) readonly hasSpinner!: number
+    @Prop({ type: Number, required: false , default: 1 }) readonly spinnerFactor!: number
     @Prop({ type: Number, required: true , default: 0 }) readonly min!: number
     @Prop({ type: Number, default: null }) readonly max!: number | null
     @Prop({ type: Number, required: true , default: 0 }) readonly dec!: number
@@ -71,12 +88,12 @@ export default class FirmwareRetractionSettingsInput extends Mixins(BaseMixin) {
     }
 
     decrement(): void {
-        this.value = (this.value > this.min) ? Math.round((this.value - this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.min
+        this.value = (this.value > this.min) ? Math.round((this.value - this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.min
         this.sendCmd()
     }
 
     increment(): void {
-        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.max
+        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.max
         this.sendCmd()
     }
 
diff --git a/src/components/inputs/MotionSettingsInput.vue b/src/components/inputs/MotionSettingsInput.vue
index d978a9d3..696f5373 100644
--- a/src/components/inputs/MotionSettingsInput.vue
+++ b/src/components/inputs/MotionSettingsInput.vue
@@ -13,8 +13,8 @@
             @click:append="resetLimit"
             :label="label"
             :suffix="unit"
-            :append-icon="this.value !== this.defaultValue ? 'mdi-restart' : ''"
-            :error="(this.value < this.min) || ((this.value > this.max) && this.max !== null)"
+            :append-icon="value !== defaultValue ? 'mdi-restart' : ''"
+            :error="error = ((value < min) || ((value > max) && max !== null))"
             :step="step"
             :min="min"
             :max="max"
@@ -25,10 +25,24 @@
             outlined
             dense
         >
-            <template v-slot:append-outer>
+            <template v-if="hasSpinner" v-slot:append-outer>
                 <div class="_spin_button_group">
-                    <v-btn @click="increment" class="mt-n3" icon plain small><v-icon>mdi-chevron-up</v-icon></v-btn>
-                    <v-btn @click="decrement" class="mb-n3" icon plain small><v-icon>mdi-chevron-down</v-icon></v-btn>
+                    <v-btn
+                        @click="increment"
+                        :disabled="((value >= max) && max !== null) || error"
+                        class="mt-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-up</v-icon>
+                    </v-btn>
+                    <v-btn
+                        @click="decrement"
+                        :disabled="(value <= min) || error"
+                        class="mb-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-down</v-icon>
+                    </v-btn>
                 </div>
             </template>
         </v-text-field>
@@ -44,9 +58,12 @@ import BaseMixin from '@/components/mixins/base'
 @Component
 export default class MotionSettingsInput extends Mixins(BaseMixin) {
     private value: number = 0
+    private error: boolean | undefined
 
     @Prop({ type: String, required: true }) readonly label!: string
     @Prop({ type: Number, required: false , default: 1 }) readonly step!: number
+    @Prop({ type: Boolean, required: false , default: false }) readonly hasSpinner!: number
+    @Prop({ type: Number, required: false , default: 1 }) readonly spinnerFactor!: number
     @Prop({ type: Number, required: true , default: 0 }) readonly min!: number
     @Prop({ type: Number, default: null }) readonly max!: number | null
     @Prop({ type: Number, required: true , default: 0 }) readonly dec!: number
@@ -71,12 +88,12 @@ export default class MotionSettingsInput extends Mixins(BaseMixin) {
     }
 
     decrement(): void {
-        this.value = (this.value > this.min) ? Math.round((this.value - this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.min
+        this.value = (this.value > this.min) ? Math.round((this.value - this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.min
         this.sendCmd()
     }
 
     increment(): void {
-        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.max
+        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.max
         this.sendCmd()
     }
 
diff --git a/src/components/inputs/PressureAdvanceSettingsInput.vue b/src/components/inputs/PressureAdvanceSettingsInput.vue
index b86e8f53..b45e70ee 100644
--- a/src/components/inputs/PressureAdvanceSettingsInput.vue
+++ b/src/components/inputs/PressureAdvanceSettingsInput.vue
@@ -13,8 +13,8 @@
             @click:append="resetLimit"
             :label="label"
             :suffix="unit"
-            :append-icon="this.value !== this.defaultValue ? 'mdi-restart' : ''"
-            :error="(this.value < this.min) || ((this.value > this.max) && this.max !== null)"
+            :append-icon="value !== defaultValue ? 'mdi-restart' : ''"
+            :error="error = ((value < min) || ((value > max) && max !== null))"
             :step="step"
             :min="min"
             :max="max"
@@ -25,10 +25,24 @@
             outlined
             dense
         >
-            <template v-slot:append-outer>
+            <template v-if="hasSpinner" v-slot:append-outer>
                 <div class="_spin_button_group">
-                    <v-btn @click="increment" class="mt-n3" icon plain small><v-icon>mdi-chevron-up</v-icon></v-btn>
-                    <v-btn @click="decrement" class="mb-n3" icon plain small><v-icon>mdi-chevron-down</v-icon></v-btn>
+                    <v-btn
+                        @click="increment"
+                        :disabled="((value >= max) && max !== null) || error"
+                        class="mt-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-up</v-icon>
+                    </v-btn>
+                    <v-btn
+                        @click="decrement"
+                        :disabled="(value <= min) || error"
+                        class="mb-n3"
+                        icon plain small
+                    >
+                        <v-icon>mdi-chevron-down</v-icon>
+                    </v-btn>
                 </div>
             </template>
         </v-text-field>
@@ -44,9 +58,12 @@ import BaseMixin from '@/components/mixins/base'
 @Component
 export default class PressureAdvanceSettingsInput extends Mixins(BaseMixin) {
     private value: number = 0
+    private error: boolean | undefined
 
     @Prop({ type: String, required: true }) readonly label!: string
     @Prop({ type: Number, required: false , default: 1 }) readonly step!: number
+    @Prop({ type: Boolean, required: false , default: false }) readonly hasSpinner!: number
+    @Prop({ type: Number, required: false , default: 1 }) readonly spinnerFactor!: number
     @Prop({ type: Number, required: true , default: 0 }) readonly min!: number
     @Prop({ type: Number, default: null }) readonly max!: number | null
     @Prop({ type: Number, required: true , default: 0 }) readonly dec!: number
@@ -72,12 +89,12 @@ export default class PressureAdvanceSettingsInput extends Mixins(BaseMixin) {
     }
 
     decrement(): void {
-        this.value = (this.value > this.min) ? Math.round((this.value - this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.min
+        this.value = (this.value > this.min) ? Math.round((this.value - this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.min
         this.sendCmd()
     }
 
     increment(): void {
-        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step) * (10 ** this.dec)) / (10 ** this.dec) : this.max
+        this.value = (this.value < this.max! || this.max === null) ? Math.round((this.value + this.step * this.spinnerFactor) * (10 ** this.dec)) / (10 ** this.dec) : this.max
         this.sendCmd()
     }
 
diff --git a/src/components/panels/MachineSettings/FirmwareRetractionSettings.vue b/src/components/panels/MachineSettings/FirmwareRetractionSettings.vue
index 013bf04e..8f724600 100644
--- a/src/components/panels/MachineSettings/FirmwareRetractionSettings.vue
+++ b/src/components/panels/MachineSettings/FirmwareRetractionSettings.vue
@@ -3,9 +3,11 @@
         <v-row>
             <v-col class="col-12 col-md-6">
                 <firmware-retraction-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.RetractLength')"
+                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.RetractLength').toString()"
                     :target="current_retract_length"
                     :default-value="config_retract_length"
+                    :hasSpinner="true"
+                    :spinnerFactor="10"
                     :step="0.01"
                     :min="0"
                     :max="null"
@@ -16,9 +18,11 @@
             </v-col>
             <v-col class="col-12 col-md-6">
                 <firmware-retraction-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.RetractSpeed')"
+                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.RetractSpeed').toString()"
                     :target="current_retract_speed"
                     :default-value="config_retract_speed"
+                    :hasSpinner="true"
+                    :spinnerFactor="5"
                     :step="1"
                     :min="1"
                     :max="null"
@@ -31,9 +35,11 @@
         <v-row>
             <v-col class="col-12 col-md-6">
                 <firmware-retraction-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.UnretractExtraLength')"
+                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.UnretractExtraLength').toString()"
                     :target="current_unretract_extra_length"
                     :default-value="config_unretract_extra_length"
+                    :hasSpinner="true"
+                    :spinnerFactor="10"
                     :step="0.01"
                     :min="0"
                     :max="null"
@@ -44,9 +50,11 @@
             </v-col>
             <v-col class="col-12 col-md-6">
                 <firmware-retraction-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.UnretractSpeed')"
+                    :label="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.UnretractSpeed').toString()"
                     :target="current_unretract_speed"
                     :default-value="config_unretract_speed"
+                    :hasSpinner="true"
+                    :spinnerFactor="5"
                     :step="1"
                     :min="1"
                     :max="null"
@@ -71,35 +79,35 @@ import FirmwareRetractionSettingsInput from '@/components/inputs/FirmwareRetract
 export default class FirmwareRetractionSettings extends Mixins(BaseMixin) {
 
     get current_retract_length(): number {
-        return this.$store.state.printer?.firmware_retraction?.retract_length ?? 0
+        return Math.floor((this.$store.state.printer?.firmware_retraction?.retract_length ?? 0) * 100) / 100
     }
 
     get current_retract_speed(): number {
-        return this.$store.state.printer?.firmware_retraction?.retract_speed ?? 20
+        return Math.trunc(this.$store.state.printer?.firmware_retraction?.retract_speed ?? 20)
     }
 
     get current_unretract_extra_length(): number {
-        return this.$store.state.printer?.firmware_retraction?.unretract_extra_length ?? 0
+        return Math.floor((this.$store.state.printer?.firmware_retraction?.unretract_extra_length ?? 0) * 100) / 100
     }
 
     get current_unretract_speed(): number {
-        return this.$store.state.printer?.firmware_retraction?.unretract_speed ?? 10
+        return Math.trunc(this.$store.state.printer?.firmware_retraction?.unretract_speed ?? 10)
     }
     
     get config_retract_length(): number {
-        return this.$store.state.printer?.configfile?.settings?.firmware_retraction?.retract_length ?? 0
+        return Math.floor((this.$store.state.printer?.configfile?.settings?.firmware_retraction?.retract_length ?? 0) * 100) / 100
     }
 
     get config_retract_speed(): number {
-        return this.$store.state.printer?.configfile?.settings?.firmware_retraction?.retract_speed ?? 20
+        return Math.trunc(this.$store.state.printer?.configfile?.settings?.firmware_retraction?.retract_speed ?? 20)
     }
 
     get config_unretract_extra_length(): number {
-        return this.$store.state.printer?.configfile?.settings?.firmware_retraction?.unretract_extra_length ?? 0
+        return Math.floor((this.$store.state.printer?.configfile?.settings?.firmware_retraction?.unretract_extra_length ?? 0) * 100) / 100
     }
 
     get config_unretract_speed(): number {
-        return this.$store.state.printer?.configfile?.settings?.firmware_retraction?.unretract_speed ?? 10
+        return Math.trunc(this.$store.state.printer?.configfile?.settings?.firmware_retraction?.unretract_speed ?? 0)
     }
 }
 </script>
diff --git a/src/components/panels/MachineSettings/MachineSettingsPanel.vue b/src/components/panels/MachineSettings/MachineSettingsPanel.vue
index c6e8e265..1c4825db 100644
--- a/src/components/panels/MachineSettings/MachineSettingsPanel.vue
+++ b/src/components/panels/MachineSettings/MachineSettingsPanel.vue
@@ -2,26 +2,26 @@
     <panel
         v-if="klipperReadyForGui"
         icon="mdi-engine"
-        :title="$t('Panels.MachineSettingsPanel.Headline')"
+        :title="$t('Panels.MachineSettingsPanel.Headline').toString()"
         :collapsible="true"
         card-class="machine-settings-panel"
     >
         <div>
             <sub-panel
-                :title="$t('Panels.MachineSettingsPanel.MotionSettings.Motion')"
+                :title="$t('Panels.MachineSettingsPanel.MotionSettings.Motion').toString()"
                 sub-panel-class="motion-settings-subpanel"
             >
                 <motion-settings></motion-settings>
             </sub-panel>
             <sub-panel
-                :title="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.PressureAdvance')"
+                :title="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.PressureAdvance').toString()"
                 sub-panel-class="pressure-advance-settings-subpanel"
             >
                 <pressure-advance-settings></pressure-advance-settings>
             </sub-panel>
             <sub-panel
                 v-if="existsFirmwareRetraction"
-                :title="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.FirmwareRetraction')"
+                :title="$t('Panels.MachineSettingsPanel.FirmwareRetractionSettings.FirmwareRetraction').toString()"
                 sub-panel-class="firmware-retraction-settings-subpanel"
             >
                 <firmware-retraction-settings></firmware-retraction-settings>
diff --git a/src/components/panels/MachineSettings/MotionSettings.vue b/src/components/panels/MachineSettings/MotionSettings.vue
index eb808f64..a3afe2ee 100644
--- a/src/components/panels/MachineSettings/MotionSettings.vue
+++ b/src/components/panels/MachineSettings/MotionSettings.vue
@@ -3,9 +3,11 @@
         <v-row>
             <v-col class="col-12 col-md-6">
                 <motion-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.Velocity')"
+                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.Velocity').toString()"
                     :target="current_velocity"
                     :default-value="max_velocity"
+                    :hasSpinner="true"
+                    :spinnerFactor="5"
                     :step="1"
                     :min="1"
                     :max="null"
@@ -16,13 +18,14 @@
             </v-col>
             <v-col class="col-12 col-md-6">
                 <motion-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.SquareCornerVelocity')"
+                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.SquareCornerVelocity').toString()"
                     :target="current_square_corner_velocity"
                     :default-value="max_square_corner_velocity"
-                    :step="1"
-                    :min="1"
+                    :hasSpinner="true"
+                    :step="0.1"
+                    :min="0.1"
                     :max="null"
-                    :dec="0"
+                    :dec="1"
                     unit="mm/s"
                     attribute-name="SQUARE_CORNER_VELOCITY"
                 ></motion-settings-input>
@@ -31,9 +34,11 @@
         <v-row>
             <v-col class="col-12 col-md-6">
                 <motion-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.Acceleration')"
+                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.Acceleration').toString()"
                     :target="current_accel"
                     :default-value="max_accel"
+                    :hasSpinner="true"
+                    :spinnerFactor="100"
                     :step="1"
                     :min="1"
                     :max="null"
@@ -44,9 +49,11 @@
             </v-col>
             <v-col class="col-12 col-md-6">
                 <motion-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.MaxAccelToDecel')"
+                    :label="$t('Panels.MachineSettingsPanel.MotionSettings.MaxAccelToDecel').toString()"
                     :target="current_accel_to_decel"
                     :default-value="max_accel_to_decel"
+                    :hasSpinner="true"
+                    :spinnerFactor="100"
                     :step="1"
                     :min="1"
                     :max="null"
@@ -71,35 +78,35 @@ import MotionSettingsInput from '@/components/inputs/MotionSettingsInput.vue'
 export default class MotionSettings extends Mixins(BaseMixin) {
     
     get current_velocity(): number {
-        return this.$store.state.printer?.toolhead?.max_velocity ?? 300
+        return Math.trunc(this.$store.state.printer?.toolhead?.max_velocity ?? 300)
     }
 
     get current_accel(): number {
-        return this.$store.state.printer?.toolhead?.max_accel ?? 3000
+        return Math.trunc(this.$store.state.printer?.toolhead?.max_accel ?? 3000)
     }
 
     get current_accel_to_decel(): number {
-        return this.$store.state.printer?.toolhead?.max_accel_to_decel ?? 1500
+        return Math.trunc(this.$store.state.printer?.toolhead?.max_accel_to_decel ?? 1500)
     }
 
     get current_square_corner_velocity(): number {
-        return this.$store.state.printer?.toolhead?.square_corner_velocity ?? 8
+        return Math.floor((this.$store.state.printer?.toolhead?.square_corner_velocity ?? 8) * 10) / 10
     }
     
     get max_velocity(): number {
-        return this.$store.state.printer?.configfile?.settings?.printer?.max_velocity ?? 300
+        return Math.trunc(this.$store.state.printer?.configfile?.settings?.printer?.max_velocity ?? 300)
     }
 
     get max_accel(): number {
-        return this.$store.state.printer?.configfile?.settings?.printer?.max_accel ?? 3000
+        return Math.trunc(this.$store.state.printer?.configfile?.settings?.printer?.max_accel ?? 3000)
     }
 
     get max_accel_to_decel(): number {
-        return this.$store.state.printer?.configfile?.settings?.printer?.max_accel_to_decel ?? 1500
+        return Math.trunc(this.$store.state.printer?.configfile?.settings?.printer?.max_accel_to_decel ?? 1500)
     }
 
     get max_square_corner_velocity(): number {
-        return this.$store.state.printer?.configfile?.settings?.printer?.square_corner_velocity ?? 8
+        return Math.floor((this.$store.state.printer?.configfile?.settings?.printer?.square_corner_velocity ?? 8) * 10) / 10
     }
 }
 </script>
diff --git a/src/components/panels/MachineSettings/PressureAdvanceSettings.vue b/src/components/panels/MachineSettings/PressureAdvanceSettings.vue
index e9976fce..7727da13 100644
--- a/src/components/panels/MachineSettings/PressureAdvanceSettings.vue
+++ b/src/components/panels/MachineSettings/PressureAdvanceSettings.vue
@@ -13,7 +13,7 @@
                     </v-btn>
                     <v-select
                         v-model="selectedExtruder"
-                        :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.Extruder')"
+                        :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.Extruder').toString()"
                         :items="all_extruders"
                         :value="active_extruder"
                         hide-details
@@ -24,10 +24,11 @@
             </v-col>
             <v-col :class="(this.all_extruders.length > 1) ? 'col-12 col-md-6 col-xl-4' : 'col-12 col-md-6'">
                 <pressure-advance-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.Advance')"
+                    :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.Advance').toString()"
                     :target="current_pressure_advance"
                     :default-value="default_pressure_advance"
                     :extruder="selectedExtruder"
+                    :hasSpinner="true"
                     :min="0"
                     :max="1"
                     :step="0.001"
@@ -38,14 +39,16 @@
             </v-col>
             <v-col :class="(this.all_extruders.length > 1) ? 'col-12 col-md-6 col-xl-4' : 'col-12 col-md-6'">
                 <pressure-advance-settings-input
-                    :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.SmoothTime')"
+                    :label="$t('Panels.MachineSettingsPanel.PressureAdvanceSettings.SmoothTime').toString()"
                     :target="current_smooth_time"
                     :default-value="default_smooth_time"
                     :extruder="selectedExtruder"
+                    :hasSpinner="true"
                     :min="0"
                     :max="0.2"
-                    :step="0.01"
-                    :dec="2"
+                    :step="0.001"
+                    :spinnerFactor="10"
+                    :dec="3"
                     unit="s"
                     attribute-name="SMOOTH_TIME"
                 ></pressure-advance-settings-input>
@@ -86,19 +89,19 @@ export default class PressureAdvanceSettings extends Mixins(BaseMixin) {
     }
 
     get current_pressure_advance(): number {
-        return this.$store.state.printer?.[this.selectedExtruder]?.pressure_advance ?? 0
+        return Math.floor((this.$store.state.printer?.[this.selectedExtruder]?.pressure_advance ?? 0) * 1000) / 1000
     }
 
     get current_smooth_time(): number {
-        return this.$store.state.printer?.[this.selectedExtruder]?.smooth_time ?? 0.04
+        return Math.floor((this.$store.state.printer?.[this.selectedExtruder]?.smooth_time ?? 0.04) * 1000) / 1000
     }
 
     get default_pressure_advance(): number {
-        return this.$store.state.printer.configfile?.settings?.[this.selectedExtruder]?.pressure_advance ?? 0
+        return Math.floor((this.$store.state.printer.configfile?.settings?.[this.selectedExtruder]?.pressure_advance ?? 0) * 1000) / 1000
     }
 
     get default_smooth_time(): number {
-        return this.$store.state.printer.configfile?.settings?.[this.selectedExtruder]?.pressure_advance_smooth_time ?? 0.04
+        return Math.floor((this.$store.state.printer.configfile?.settings?.[this.selectedExtruder]?.pressure_advance_smooth_time ?? 0.04) * 1000) / 1000
     }
 
 }