refactor: ExtruderControlPanel.vue

Signed-off-by: Stefan Dej <[email protected]>

src/components/mixins/base.ts

@@ -47,6 +47,10 @@ export default class BaseMixin extends Vue {
         return this.klipperReadyForGui && ['printing', 'paused'].includes(this.printer_state)
     }
 
+    get printerIsPrintingOnly() {
+        return this.klipperReadyForGui && this.printer_state === 'printing'
+    }
+
     get printerPowerDevice(): string {
         let deviceName = this.$store.state.gui.uiSettings.powerDeviceName ?? null
         if (deviceName === null) deviceName = 'printer'

src/components/mixins/extruder.ts

@@ -0,0 +1,40 @@
+import Vue from 'vue'
+import { Component } from 'vue-property-decorator'
+@Component
+export default class ExtruderMixin extends Vue {
+    get activeExtruder(): string {
+        return this.$store.state.printer.toolhead?.extruder
+    }
+
+    get activeExtruderSettings(): any {
+        return this.$store.state.printer.configfile?.settings?.[this.activeExtruder]
+    }
+
+    get filamentDiameter(): number {
+        return this.activeExtruderSettings?.filament_diameter ?? 1.75
+    }
+
+    get nozzleDiameter(): number {
+        return this.activeExtruderSettings?.nozzle_diameter ?? 0.4
+    }
+
+    get feedamount(): number {
+        return parseFloat(this.$store.state.gui.control.extruder.feedamount)
+    }
+
+    get feedrate(): number {
+        return parseFloat(this.$store.state.gui.control.extruder.feedrate)
+    }
+
+    get extrudeFactor() {
+        return this.$store.state.printer?.gcode_move?.extrude_factor ?? 1
+    }
+
+    get extrudePossible(): boolean {
+        return this.$store.getters['printer/getExtrudePossible']
+    }
+
+    get minExtrudeTemp(): number {
+        return this.activeExtruderSettings?.min_extrude_temp ?? 170
+    }
+}

src/components/panels/Extruder/EstimatedExtrusionOutput.vue

@@ -0,0 +1,44 @@
+<template>
+    <v-container v-if="showEstimatedExtrusion" class="pa-0 ma-0 pb-1">
+        <div style="font-size: 0.8em" class="text--disabled text-caption font-weight-light d-flex justify-center">
+            <span>
+                {{ $t('Panels.ExtruderControlPanel.EstimatedExtrusion') }} ~ {{ extrudedLength }} mm @
+                {{ volumetricFlow }} mm³/s -
+                <v-icon x-small style="opacity: 0.4; margin-top: -2px">
+                    {{ mdiDiameterVariant }}
+                </v-icon>
+                {{ nozzleDiameter }} mm
+            </span>
+        </div>
+    </v-container>
+</template>
+
+<script lang="ts">
+import { Component, Mixins } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import { mdiDiameterVariant } from '@mdi/js'
+import ExtruderMixin from '@/components/mixins/extruder'
+
+@Component({})
+export default class PressureAdvanceSettings extends Mixins(BaseMixin, ExtruderMixin) {
+    mdiDiameterVariant = mdiDiameterVariant
+
+    get showEstimatedExtrusion() {
+        const showBool = this.$store.state.gui.control.extruder.showEstimatedExtrusionInfo ?? true
+
+        return showBool && this.filamentDiameter && this.nozzleDiameter
+    }
+
+    get extrudedLength(): number {
+        return Math.round(
+            this.feedamount *
+                this.extrudeFactor *
+                (Math.pow(this.filamentDiameter, 2) / Math.pow(this.nozzleDiameter, 2))
+        )
+    }
+
+    get volumetricFlow(): number {
+        return Math.round(Math.pow(this.filamentDiameter / 2, 2) * Math.PI * this.feedrate * 10) / 10
+    }
+}
+</script>