From 559f5a1fddddb4cabdb5bc110339bf2740223e5f Mon Sep 17 00:00:00 2001 From: Brian Burton Date: Sat, 14 Dec 2024 15:15:40 -0600 Subject: [PATCH 01/20] Add files via upload --- src/components/panels/AfcPanel.vue | 456 +++++++++++++++++++++++++++++ 1 file changed, 456 insertions(+) create mode 100644 src/components/panels/AfcPanel.vue diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue new file mode 100644 index 000000000..93052efb6 --- /dev/null +++ b/src/components/panels/AfcPanel.vue @@ -0,0 +1,456 @@ + + + + + From 1dca3800ce7cf8e3fbd5b6bd1a7252f8dd6e1713 Mon Sep 17 00:00:00 2001 From: Brian Burton Date: Sat, 14 Dec 2024 15:16:26 -0600 Subject: [PATCH 02/20] Add files via upload --- .../dialogs/AfcChangeSpoolDialog.vue | 235 ++++++++++++++++++ 1 file changed, 235 insertions(+) create mode 100644 src/components/dialogs/AfcChangeSpoolDialog.vue diff --git a/src/components/dialogs/AfcChangeSpoolDialog.vue b/src/components/dialogs/AfcChangeSpoolDialog.vue new file mode 100644 index 000000000..dc83faeff --- /dev/null +++ b/src/components/dialogs/AfcChangeSpoolDialog.vue @@ -0,0 +1,235 @@ + + + From 7795d22a4aee54639fc7ef26bdec7d2889c84ce9 Mon Sep 17 00:00:00 2001 From: Brian Burton Date: Sat, 14 Dec 2024 15:17:14 -0600 Subject: [PATCH 03/20] Add files via upload --- src/components/ui/BoxTurtleIcon.vue | 40 +++++++++++ src/components/ui/FilamentReelIcon.vue | 83 ++++++++++++++++++++++ src/components/ui/InfinityIcon.vue | 38 ++++++++++ src/components/ui/NightOwlIcon.vue | 40 +++++++++++ src/components/ui/SpoolIcon.vue | 96 +++++++++++++------------- 5 files changed, 249 insertions(+), 48 deletions(-) create mode 100644 src/components/ui/BoxTurtleIcon.vue create mode 100644 src/components/ui/FilamentReelIcon.vue create mode 100644 src/components/ui/InfinityIcon.vue create mode 100644 src/components/ui/NightOwlIcon.vue diff --git a/src/components/ui/BoxTurtleIcon.vue b/src/components/ui/BoxTurtleIcon.vue new file mode 100644 index 000000000..f838921f5 --- /dev/null +++ b/src/components/ui/BoxTurtleIcon.vue @@ -0,0 +1,40 @@ + + + diff --git a/src/components/ui/FilamentReelIcon.vue b/src/components/ui/FilamentReelIcon.vue new file mode 100644 index 000000000..21634c8a4 --- /dev/null +++ b/src/components/ui/FilamentReelIcon.vue @@ -0,0 +1,83 @@ + + + + + diff --git a/src/components/ui/InfinityIcon.vue b/src/components/ui/InfinityIcon.vue new file mode 100644 index 000000000..c5f239aec --- /dev/null +++ b/src/components/ui/InfinityIcon.vue @@ -0,0 +1,38 @@ + + + + diff --git a/src/components/ui/NightOwlIcon.vue b/src/components/ui/NightOwlIcon.vue new file mode 100644 index 000000000..3a1b0c167 --- /dev/null +++ b/src/components/ui/NightOwlIcon.vue @@ -0,0 +1,40 @@ + + + diff --git a/src/components/ui/SpoolIcon.vue b/src/components/ui/SpoolIcon.vue index d0b65e6c8..2e9442c66 100644 --- a/src/components/ui/SpoolIcon.vue +++ b/src/components/ui/SpoolIcon.vue @@ -1,48 +1,48 @@ - - - + + + From f95f0743db191bf78a8b0a471b2c823c2eb2fd9d Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sat, 14 Dec 2024 16:16:29 -0600 Subject: [PATCH 04/20] brought to current mainsail --- src/components/panels/AfcPanel.vue | 207 ++++++++++++++++++----------- src/pages/Dashboard.vue | 2 + src/store/variables.ts | 1 + 3 files changed, 129 insertions(+), 81 deletions(-) diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index 93052efb6..c35e12acb 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -5,50 +5,45 @@ card-class="afc-panel" :collapsible="true" :expanded="true"> -
- - - - Extruder Tools - - -
-
- - - {{ toolName }} - - -
-
- {{ tool.buffer }}: {{ tool.buffer_status }} -
-
- Lane Loaded: {{ tool.lane_loaded }} -
-
- Lane Loaded: - - NONE - -
-
-
-
-
+ +
+
+ Tool: + +
+
+ + Buffer: {{ bufferStatus() }} + +
- +
{{ String(unitName).replace(/_/g, " ") }} | - + Hub +
- -

{{ spool.laneName }}

-
- -

{{ spool.laneName }}

-
- -

{{ spool.laneName }}

-
- -

{{ spool.laneName }}

+ +

{{ spool.laneName }}

+ viewBox="0 0 60 60" xml:space="preserve"/> - + viewBox="0 0 60 60" xml:space="preserve"/> +

{{ spool.material }}

{{ spoolWeight(spool) }}

@@ -156,8 +169,7 @@
- +} diff --git a/src/pages/Dashboard.vue b/src/pages/Dashboard.vue index 2b531c980..bc1c6d77d 100644 --- a/src/pages/Dashboard.vue +++ b/src/pages/Dashboard.vue @@ -96,6 +96,7 @@ import StatusPanel from '@/components/panels/StatusPanel.vue' import ToolheadControlPanel from '@/components/panels/ToolheadControlPanel.vue' import TemperaturePanel from '@/components/panels/TemperaturePanel.vue' import WebcamPanel from '@/components/panels/WebcamPanel.vue' +import AfcPanel from '@/components/panels/AfcPanel.vue' @Component({ components: { @@ -112,6 +113,7 @@ import WebcamPanel from '@/components/panels/WebcamPanel.vue' ToolheadControlPanel, TemperaturePanel, WebcamPanel, + AfcPanel, }, }) export default class PageDashboard extends Mixins(DashboardMixin) { diff --git a/src/store/variables.ts b/src/store/variables.ts index a56935af5..aefff3cb2 100644 --- a/src/store/variables.ts +++ b/src/store/variables.ts @@ -95,6 +95,7 @@ export const allDashboardPanels = [ 'spoolman', 'temperature', 'webcam', + 'afc', ] export const thumbnailSmallMin = 30 From c4a4e174bc0da5a79d44058b9574dfb2f86a1af7 Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sat, 14 Dec 2024 16:20:18 -0600 Subject: [PATCH 05/20] Update AfcPanel.vue --- src/components/panels/AfcPanel.vue | 197 +++++++++++------------------ 1 file changed, 76 insertions(+), 121 deletions(-) diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index c35e12acb..f5ca1ceda 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -5,40 +5,45 @@ card-class="afc-panel" :collapsible="true" :expanded="true"> - -
-
- Tool: - -
-
- - Buffer: {{ bufferStatus() }} - -
+
+ + + + Extruder Tools + + +
+
+ + + {{ toolName }} + + +
+
+ {{ tool.buffer }}: {{ tool.buffer_status }} +
+
+ Lane Loaded: {{ tool.lane_loaded }} +
+
+ Lane Loaded: + + NONE + +
+
+
+
+
{{ String(unitName).replace(/_/g, " ") }} | - + Hub -
- + +

{{ spool.laneName }}

+
+ +

{{ spool.laneName }}

+
+ +

{{ spool.laneName }}

+
+ +

{{ spool.laneName }}

-

{{ spool.laneName }}

+ viewBox="0 0 60 60" xml:space="preserve" /> - + viewBox="0 0 60 60" xml:space="preserve" /> +

{{ spool.material }}

{{ spoolWeight(spool) }}

@@ -169,7 +156,8 @@
- +} + + + From 610ef22e4b530ae10e45de1b29ea86a0dee99b8d Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sat, 14 Dec 2024 18:52:57 -0600 Subject: [PATCH 06/20] changed scaling and position of spool cards --- src/components/panels/AfcPanel.vue | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index f5ca1ceda..2eac996d3 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -376,7 +376,6 @@ export default class AfcPanel extends Mixins(BaseMixin) { .spool-container { display: flex; - float: left; flex-wrap: wrap; justify-content: space-evenly; gap: 8px; @@ -398,8 +397,8 @@ export default class AfcPanel extends Mixins(BaseMixin) { padding-top: 0px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); flex: 1 1 calc(23% - 16px); - max-width: 120px; - min-width: 80px; + max-width: 180px; + min-width: 120px; min-height: 117px; position: relative; transition: box-shadow 0.3s; From 9454a4b92657a8e77b7145dca61f49098f59029b Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sun, 15 Dec 2024 12:04:29 -0600 Subject: [PATCH 07/20] fixed spool div size --- src/components/panels/AfcPanel.vue | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index 2eac996d3..68366c5e3 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -76,17 +76,15 @@ :key="index" class="spool-card">
+ style="width: 100%; float: left"/> + style="width: 100%; float: left" + :color='spool.empty'/>
@@ -408,8 +406,7 @@ export default class AfcPanel extends Mixins(BaseMixin) { .filament-reel { position: absolute; - bottom: -10px; - left: -10px; + bottom: 10px; } .spool-card p { From 72ce6e7f8cf90fb080e6a3d334d0e988069dc817 Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sun, 15 Dec 2024 12:10:46 -0600 Subject: [PATCH 08/20] added pointer to reel --- src/components/panels/AfcPanel.vue | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index 68366c5e3..196a8e818 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -407,6 +407,7 @@ export default class AfcPanel extends Mixins(BaseMixin) { .filament-reel { position: absolute; bottom: 10px; + cursor: pointer; } .spool-card p { From 26909ac34852a3f49b748480e9bb0abc1855d71d Mon Sep 17 00:00:00 2001 From: MG-longshot Date: Sun, 15 Dec 2024 15:27:00 -0600 Subject: [PATCH 09/20] new spool svg --- src/components/panels/AfcPanel.vue | 14 +- src/components/ui/FilamentReelEmptyIcon.vue | 35 ++++ src/components/ui/FilamentReelIcon.vue | 168 ++++++++++---------- 3 files changed, 127 insertions(+), 90 deletions(-) create mode 100644 src/components/ui/FilamentReelEmptyIcon.vue diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index 196a8e818..9bb91229c 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -79,12 +79,12 @@ style="padding: 5px; width: 50%;" :key="index" @click="openChangeSpoolDialog(spool)"> - - + style="float: left"/> +
@@ -160,7 +160,7 @@ import BaseMixin from "@/components/mixins/base" import Panel from "@/components/ui/Panel.vue" import { mdiAdjust, mdiRefresh, mdiDotsVertical } from "@mdi/js" import AfcChangeSpoolDialog from "@/components/dialogs/AfcChangeSpoolDialog.vue" -import FilamentReelIcon from '@/components/ui/FilamentReelIcon.vue' +import FilamentReelIcon from '@/components/ui/FilamentReelIcon.vue' import SpoolIcon from "@/components/ui/SpoolIcon.vue" import { AFCRoot } from '@/store/server/afc' import BoxTurtleIcon from "@/components/ui/BoxTurtleIcon.vue" @@ -171,7 +171,7 @@ import InfinityIcon from '@/components/ui/InfinityIcon.vue' Panel, AfcChangeSpoolDialog, SpoolIcon, - FilamentReelIcon, + FilamentReelIcon, BoxTurtleIcon, InfinityIcon }, diff --git a/src/components/ui/FilamentReelEmptyIcon.vue b/src/components/ui/FilamentReelEmptyIcon.vue new file mode 100644 index 000000000..8bd183235 --- /dev/null +++ b/src/components/ui/FilamentReelEmptyIcon.vue @@ -0,0 +1,35 @@ + + + diff --git a/src/components/ui/FilamentReelIcon.vue b/src/components/ui/FilamentReelIcon.vue index 21634c8a4..0496d7035 100644 --- a/src/components/ui/FilamentReelIcon.vue +++ b/src/components/ui/FilamentReelIcon.vue @@ -1,83 +1,85 @@ - - - - - + + + + + + From c47a4675eade10341f35109b7df54b17f0a5883c Mon Sep 17 00:00:00 2001 From: Brian Burton Date: Sun, 15 Dec 2024 15:37:25 -0600 Subject: [PATCH 10/20] Update BoxTurtleIcon.vue --- src/components/ui/BoxTurtleIcon.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/ui/BoxTurtleIcon.vue b/src/components/ui/BoxTurtleIcon.vue index f838921f5..43ec8fde2 100644 --- a/src/components/ui/BoxTurtleIcon.vue +++ b/src/components/ui/BoxTurtleIcon.vue @@ -1,6 +1,5 @@ + {{ mdiEject }} {{ mdiRefresh }} @@ -44,6 +48,7 @@ + +
+ + + + +
+ + +
+
+ + + +
+ + + + + + + + + + + + +
+
+
+ + + + {{ $t('Panels.AfcSpoolmanPanel.UpdateSpool') }} + + + +
+
@@ -93,6 +147,10 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { mdiRefresh = mdiRefresh mdiEject = mdiEject + filamentType = '' + remainingWeight = 0 + spoolColor = '#ffffff' + @Prop({ required: true }) declare readonly showDialog: boolean search = '' @@ -145,6 +203,53 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { return this.$store.state.server.config.config?.spoolman?.server ?? null } + updateSpool() { + console.log('Updating spool with the following data:') + console.log('Filament Type:', this.filamentType) + console.log('Remaining Weight:', this.remainingWeight) + console.log('Spool Color:', this.spoolColor) + + if (this.laneData != null) { + const cleanedColor = this.spoolColor.replace('#', '') + + const setColor = `SET_COLOR LANE=${this.laneData.laneName} COLOR=${cleanedColor}` + const setWeight = `SET_WEIGHT LANE=${this.laneData.laneName} WEIGHT=${this.remainingWeight}` + const setMaterial = `SET_MATERIAL LANE=${this.laneData.laneName} MATERIAL=${this.filamentType}` + + this.$nextTick(async () => { + try { + await this.$store.dispatch('printer/sendGcode', setColor) + await this.$store.dispatch('printer/sendGcode', setWeight) + await this.$store.dispatch('printer/sendGcode', setMaterial) + } catch (error) { + console.error('Failed to send G-code:', error) + } + }) + + this.close() + } + } + + manualyClearSpool() { + if (this.laneData != null) { + const cleanedColor = this.spoolColor.replace('#', '') + + const setColor = `SET_COLOR LANE=${this.laneData.laneName} COLOR=000000` + const setWeight = `SET_WEIGHT LANE=${this.laneData.laneName} WEIGHT=0` + const setMaterial = `SET_MATERIAL LANE=${this.laneData.laneName} MATERIAL=` + + this.$nextTick(async () => { + try { + await this.$store.dispatch('printer/sendGcode', setColor) + await this.$store.dispatch('printer/sendGcode', setWeight) + await this.$store.dispatch('printer/sendGcode', setMaterial) + } catch (error) { + console.error('Failed to send G-code:', error) + } + }) + } + } + openSpoolManager() { window.open(this.spoolManagerUrl, '_blank') } @@ -163,20 +268,30 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { ejectSpool() { if (this.laneData != null) { - const gcode = `SET_SPOOL_ID LANE=${this.laneData.laneName} SPOOL_ID=` - console.log('Dispatching G-code:', gcode) + const setSpoolId = `SET_SPOOL_ID LANE=${this.laneData.laneName} SPOOL_ID=` + const unloadLane = `LANE_UNLOAD LANE=${this.laneData.laneName}` + console.log('Dispatching G-code:', setSpoolId) + console.log('Dispatching G-code:', unloadLane) this.$nextTick(async () => { try { - await this.$store.dispatch('printer/sendGcode', gcode) - console.log('G-code sent successfully') + await this.$store.dispatch('printer/sendGcode', setSpoolId) + console.log('SET_SPOOL_ID sent successfully') + + await this.$store.dispatch('printer/sendGcode', unloadLane) + console.log('UNLOAD_LANE sent successfully') } catch (error) { console.error('Failed to send G-code:', error) } }) - this.$emit('fetch-spool') - this.close() + // Spoolman not active manualy clear the spool info + if (!this.spoolManagerUrl) { + this.manualyClearSpool() + } + + this.$emit('fetch-spool') + this.close() } } @@ -227,9 +342,47 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { this.close() } + initializeFields() { + if (this.laneData) { + console.log('Initializing with laneData:', this.laneData) + this.filamentType = this.laneData.material || '' + this.remainingWeight = this.laneData.weight || 0 + this.spoolColor = this.laneData.color || '#ffffff' + } + } + + resetFields() { + this.filamentType = '' + this.remainingWeight = 0 + this.spoolColor = '#ffffff' + } + @Watch('showDialog') onShowDialogChanged(newVal: boolean) { - if (newVal) this.search = '' + if (newVal) { + if (this.spoolManagerUrl) { + this.search = '' + } + } + } + + @Watch('laneData', { immediate: true }) + onLaneDataChanged() { + if (this.showDialog && this.laneData && !this.spoolManagerUrl) { + this.initializeFields() + } } } + diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index 9bb91229c..fa4bb188c 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -1,169 +1,189 @@ +.theme--light .spool-card, +.theme--light .tool-card { + background-color: #ebebeb; +} + +.filament-reel { + bottom: 5px; + min-width: 30px; + max-width: 40px; + width: 100%; + flex: 1 1 auto; + cursor: pointer; +} + +.infinite-spool { + display: flex; + justify-content: flex-start; + flex-wrap: nowrap; +} +.spacer { + flex-grow: 1; +} + +.afclist { + cursor: pointer; + padding-left: 6px; + padding-right: 1px; + float: left; +} +.theme--dark .spool-card .afclist { + color: white; + background-color: #2e2e2e; +} + +.theme--light .spool-card .afclist { + background-color: #ebebeb; +} + +.infinity-icon { + float: right; + width: 20px; + height: 20px; +} + +.status-light { + width: 10px; + height: 10px; + border-radius: 50%; + display: inline-block; + margin-right: 5px; + margin-left: 5px; +} + +.box-turtle-icon { + width: 70px; + height: 70px; + margin-left: 10px; +} + +.lane-status { + margin-right: 10px; + margin-left: 5px; +} + diff --git a/src/components/ui/FilamentReelIcon.vue b/src/components/ui/FilamentReelIcon.vue index 0496d7035..776617041 100644 --- a/src/components/ui/FilamentReelIcon.vue +++ b/src/components/ui/FilamentReelIcon.vue @@ -1,85 +1,91 @@ - - + diff --git a/src/locales/en.json b/src/locales/en.json index c897531ac..58a29d813 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -608,6 +608,12 @@ "Headline": "Manual Probe" }, "Panels": { + "AfcSpoolmanPanel": { + "FilamentType": "Filament Type", + "RemainingWeight": "Remaining Weight", + "SpoolColor": "Filament Color", + "UpdateSpool": "Update Spool" + }, "ExtruderControlPanel": { "Allowed": "Allowed", "CleanNozzle": "Clean Nozzle", From e7d4cfe6f8df638a20d677c0b1364299e1a9a199 Mon Sep 17 00:00:00 2001 From: Wondro Date: Sat, 28 Dec 2024 02:15:22 -0600 Subject: [PATCH 12/20] Added lang vars Split afc into sub components --- .../panels/Afc/AfcExtruderTools.vue | 55 +++ .../panels/Afc/AfcExtruderToolsItem.vue | 64 +++ src/components/panels/Afc/AfcUnits.vue | 26 ++ src/components/panels/Afc/AfcUnitsItem.vue | 116 ++++++ .../panels/Afc/AfcUnitsItemLane.vue | 195 +++++++++ src/components/panels/AfcPanel.vue | 384 +----------------- src/locales/en.json | 11 + 7 files changed, 487 insertions(+), 364 deletions(-) create mode 100644 src/components/panels/Afc/AfcExtruderTools.vue create mode 100644 src/components/panels/Afc/AfcExtruderToolsItem.vue create mode 100644 src/components/panels/Afc/AfcUnits.vue create mode 100644 src/components/panels/Afc/AfcUnitsItem.vue create mode 100644 src/components/panels/Afc/AfcUnitsItemLane.vue diff --git a/src/components/panels/Afc/AfcExtruderTools.vue b/src/components/panels/Afc/AfcExtruderTools.vue new file mode 100644 index 000000000..26eec5317 --- /dev/null +++ b/src/components/panels/Afc/AfcExtruderTools.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/src/components/panels/Afc/AfcExtruderToolsItem.vue b/src/components/panels/Afc/AfcExtruderToolsItem.vue new file mode 100644 index 000000000..c0fa0eaf2 --- /dev/null +++ b/src/components/panels/Afc/AfcExtruderToolsItem.vue @@ -0,0 +1,64 @@ + + + + + diff --git a/src/components/panels/Afc/AfcUnits.vue b/src/components/panels/Afc/AfcUnits.vue new file mode 100644 index 000000000..4c59fa1d6 --- /dev/null +++ b/src/components/panels/Afc/AfcUnits.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/src/components/panels/Afc/AfcUnitsItem.vue b/src/components/panels/Afc/AfcUnitsItem.vue new file mode 100644 index 000000000..7269e7519 --- /dev/null +++ b/src/components/panels/Afc/AfcUnitsItem.vue @@ -0,0 +1,116 @@ + + + + + diff --git a/src/components/panels/Afc/AfcUnitsItemLane.vue b/src/components/panels/Afc/AfcUnitsItemLane.vue new file mode 100644 index 000000000..89af7aaa7 --- /dev/null +++ b/src/components/panels/Afc/AfcUnitsItemLane.vue @@ -0,0 +1,195 @@ + + + + + diff --git a/src/components/panels/AfcPanel.vue b/src/components/panels/AfcPanel.vue index fa4bb188c..1ee6ee881 100644 --- a/src/components/panels/AfcPanel.vue +++ b/src/components/panels/AfcPanel.vue @@ -1,8 +1,9 @@ @@ -179,21 +31,13 @@ import { Component, Mixins } from 'vue-property-decorator' import BaseMixin from '@/components/mixins/base' import Panel from '@/components/ui/Panel.vue' import { mdiAdjust, mdiRefresh, mdiDotsVertical } from '@mdi/js' -import AfcChangeSpoolDialog from '@/components/dialogs/AfcChangeSpoolDialog.vue' -import FilamentReelIcon from '@/components/ui/FilamentReelIcon.vue' import SpoolIcon from '@/components/ui/SpoolIcon.vue' import { AFCRoot } from '@/store/server/afc' -import BoxTurtleIcon from '@/components/ui/BoxTurtleIcon.vue' -import InfinityIcon from '@/components/ui/InfinityIcon.vue' @Component({ components: { Panel, - AfcChangeSpoolDialog, SpoolIcon, - FilamentReelIcon, - BoxTurtleIcon, - InfinityIcon, }, }) export default class AfcPanel extends Mixins(BaseMixin) { @@ -219,13 +63,17 @@ export default class AfcPanel extends Mixins(BaseMixin) { selectedStyle: number = 1 styleIndex: number = 1 + get showPanel(): boolean { + return this.klipperReadyForGui /* && Check if AFC is initialized */ + } + async mounted() { const savedStyleIndex = localStorage.getItem('styleIndex') if (savedStyleIndex !== null) { this.styleIndex = parseInt(savedStyleIndex, 10) } this.fetchSpoolData() - this.intervalId = setInterval(this.fetchSpoolData, 500) + this.intervalId = setInterval(this.fetchSpoolData, 100) } beforeDestroy() { @@ -242,14 +90,21 @@ export default class AfcPanel extends Mixins(BaseMixin) { fetchSpoolData() { const afcData = this.afc_Data ? JSON.parse(JSON.stringify(this.afc_Data)) : null if (afcData) { - this.unitsData = this.groupByUnit(this.spoolData) this.spoolData = this.extractLaneData(afcData) + this.unitsData = this.groupByUnit(this.spoolData) this.toolData = afcData.system.extruders || {} this.systemData = afcData.system || {} for (const unitName in afcData) { if (afcData.hasOwnProperty(unitName) && unitName !== 'system') { if (this.unitsData[unitName]) { - this.unitsData[unitName].system = afcData[unitName].system || {} + const unit = afcData[unitName] + + // Add system data + this.unitsData[unitName].system = unit.system || {} + + // Add lane list and map list + this.unitsData[unitName].laneList = this.laneList || [] + this.unitsData[unitName].mapList = this.mapList || [] } } } @@ -323,210 +178,11 @@ export default class AfcPanel extends Mixins(BaseMixin) { return units } - openChangeSpoolDialog(spool: any) { - this.selectedLane = spool - this.showChangeSpoolDialog = true - } - - bufferStatus() { - return this.systemData?.extruders?.extruder?.buffer_status || false - } - - getHubStatus({ unitName }: { unitName: any }) { - if (this.unitsData[unitName]?.system?.hub_loaded !== undefined) { - return this.unitsData[unitName].system.hub_loaded - } - return this.systemData?.hub_loaded || false - } - - get toolStartSensorStatus() { - return this.systemData?.extruders?.extruder?.tool_start_sensor || false - } - spoolWeight(spool: any) { const weight = parseInt(spool.weight, 10) return weight ? `${weight} g` : '' } - - handleRunoutChange(event: Event, spool: any) { - const selectedValue = (event.target as HTMLSelectElement).value - console.log(`Selected value for ${spool.laneName}: ${selectedValue}`) - - const gcode = `SET_RUNOUT LANE=${spool.laneName} RUNOUT=${selectedValue}` - console.log('Dispatching G-code:', gcode) - - this.$nextTick(async () => { - try { - await this.$store.dispatch('printer/sendGcode', gcode) - console.log('G-code sent successfully') - } catch (error) { - console.error('Failed to send G-code:', error) - } - }) - } - - handleMapChange(event: Event, spool: any) { - const selectedValue = (event.target as HTMLSelectElement).value - console.log(`Selected value for ${spool.laneName}: ${selectedValue}`) - - //Example G-Code Call for you - const gcode = `SET_MAP LANE=${spool.laneName} MAP=${selectedValue}` - console.log('Dispatching G-code:', gcode) - - this.$nextTick(async () => { - try { - await this.$store.dispatch('printer/sendGcode', gcode) - console.log('G-code sent successfully') - } catch (error) { - console.error('Failed to send G-code:', error) - } - }) - } } - + diff --git a/src/locales/en.json b/src/locales/en.json index 58a29d813..1ff45cf45 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -608,6 +608,17 @@ "Headline": "Manual Probe" }, "Panels": { + "AfcPanel": { + "ExtruderTools": "Extruder Tools", + "Headline": "Automated Filament Control", + "Hub": "Hub", + "InfiniteSpool": "Next lane to load if the current lane runs out", + "LaneLoaded": "Loaded", + "LaneLoadedNone": "NONE", + "LaneMap": "Remap current lane to selected T command", + "PostExtruderSensor": "Post-Extruder Sensor", + "PreExtruderSensor": "Pre-Extruder Sensor" + }, "AfcSpoolmanPanel": { "FilamentType": "Filament Type", "RemainingWeight": "Remaining Weight", From 976a756581a42e297ad2ed4277a5f7e3a54e4c95 Mon Sep 17 00:00:00 2001 From: Wondro Date: Sat, 28 Dec 2024 18:52:00 -0600 Subject: [PATCH 13/20] Format cleanup --- .../dialogs/AfcChangeSpoolDialog.vue | 4 - .../panels/Afc/AfcExtruderTools.vue | 1 + .../panels/Afc/AfcExtruderToolsItem.vue | 108 ++++++---- src/components/panels/Afc/AfcUnitsItem.vue | 28 +-- .../panels/Afc/AfcUnitsItemLane.vue | 74 +++++-- src/components/panels/AfcPanel.vue | 190 ++++++++---------- src/components/ui/FilamentReelIcon.vue | 10 +- src/locales/en.json | 1 + 8 files changed, 244 insertions(+), 172 deletions(-) diff --git a/src/components/dialogs/AfcChangeSpoolDialog.vue b/src/components/dialogs/AfcChangeSpoolDialog.vue index 1c9aa5c8a..051ce3be5 100644 --- a/src/components/dialogs/AfcChangeSpoolDialog.vue +++ b/src/components/dialogs/AfcChangeSpoolDialog.vue @@ -232,8 +232,6 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { manualyClearSpool() { if (this.laneData != null) { - const cleanedColor = this.spoolColor.replace('#', '') - const setColor = `SET_COLOR LANE=${this.laneData.laneName} COLOR=000000` const setWeight = `SET_WEIGHT LANE=${this.laneData.laneName} WEIGHT=0` const setMaterial = `SET_MATERIAL LANE=${this.laneData.laneName} MATERIAL=` @@ -290,7 +288,6 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { this.manualyClearSpool() } - this.$emit('fetch-spool') this.close() } } @@ -338,7 +335,6 @@ export default class AfcChangeSpoolDialog extends Mixins(BaseMixin) { console.error('Failed to send G-code:', error) } }) - this.$emit('fetch-spool') this.close() } diff --git a/src/components/panels/Afc/AfcExtruderTools.vue b/src/components/panels/Afc/AfcExtruderTools.vue index 26eec5317..8091c9840 100644 --- a/src/components/panels/Afc/AfcExtruderTools.vue +++ b/src/components/panels/Afc/AfcExtruderTools.vue @@ -28,6 +28,7 @@ export default class AfcExtruderTools extends Mixins(BaseMixin) { transition: background-color 0.3s ease; padding: 5px; padding-left: 10px; + padding-right: 10px; width: 100%; display: flex; flex-wrap: wrap; diff --git a/src/components/panels/Afc/AfcExtruderToolsItem.vue b/src/components/panels/Afc/AfcExtruderToolsItem.vue index c0fa0eaf2..c9265daed 100644 --- a/src/components/panels/Afc/AfcExtruderToolsItem.vue +++ b/src/components/panels/Afc/AfcExtruderToolsItem.vue @@ -1,41 +1,43 @@ @@ -53,12 +55,44 @@ export default class AfcExtruderToolsItem extends Mixins(BaseMixin) { diff --git a/src/components/panels/Afc/AfcUnitsItem.vue b/src/components/panels/Afc/AfcUnitsItem.vue index 7269e7519..903258084 100644 --- a/src/components/panels/Afc/AfcUnitsItem.vue +++ b/src/components/panels/Afc/AfcUnitsItem.vue @@ -3,15 +3,22 @@
-

{{ String(unitName).replace(/_/g, ' ') }} |

+

{{ formattedUnitName }} |

{{ $t('Panels.AfcPanel.Hub') }} - + + + {{ $t('Panels.AfcPanel.HubStatus', { unit: formattedUnitName }) }} +
@@ -42,10 +49,8 @@ export default class AfcUnitsItem extends Mixins(BaseMixin) { @Prop({ type: Object, required: true }) readonly unit!: Record @Prop({ type: String, required: true }) readonly unitName!: string - getHubStatus({ unitName }: { unitName: any }) { - if (this.unit?.system?.hub_loaded !== undefined) { - return this.unit.system.hub_loaded - } + get formattedUnitName(): string { + return String(this.unitName).replace(/_/g, ' ') } } @@ -79,7 +84,6 @@ export default class AfcUnitsItem extends Mixins(BaseMixin) { padding-top: 0px; max-width: 150px; min-width: 110px; - min-height: 150px; flex: 1 1 110px; position: relative; text-align: right; diff --git a/src/components/panels/Afc/AfcUnitsItemLane.vue b/src/components/panels/Afc/AfcUnitsItemLane.vue index 89af7aaa7..022751156 100644 --- a/src/components/panels/Afc/AfcUnitsItemLane.vue +++ b/src/components/panels/Afc/AfcUnitsItemLane.vue @@ -18,9 +18,9 @@