Skip to content

Commit 9c10597

Browse files
pedrolamaspedrolamas
authored
feat(Spoolman): adds new metadata (#1638)
Signed-off-by: Pedro Lamas <[email protected]>
1 parent 25c60ad commit 9c10597

File tree

17 files changed

+508
-290
lines changed

17 files changed

+508
-290
lines changed

‎src/components/settings/GeneralSettings.vue‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -284,6 +284,7 @@ import consola from 'consola'
284284
import { readFileAsTextAsync } from '@/util/file-system-entry'
285285
import { EventBus } from '@/eventBus'
286286
import { isFluiddContent, toFluiddContent } from '@/util/fluidd-content'
287+
import { getAllLocales } from '@/plugins/i18n'
287288
288289
@Component({
289290
components: {}
@@ -336,7 +337,7 @@ export default class GeneralSettings extends Mixins(StateMixin) {
336337
return Object.entries(DateFormats)
337338
.map(([key, entry]) => ({
338339
value: key,
339-
text: `${date.toLocaleDateString(entry.locales ?? this.$filters.getAllLocales(), entry.options)}${entry.suffix ?? ''}`
340+
text: `${date.toLocaleDateString(entry.locales ?? getAllLocales(), entry.options)}${entry.suffix ?? ''}`
340341
}))
341342
}
342343
@@ -358,7 +359,7 @@ export default class GeneralSettings extends Mixins(StateMixin) {
358359
return Object.entries(TimeFormats)
359360
.map(([key, entry]) => ({
360361
value: key,
361-
text: `${date.toLocaleTimeString(entry.locales ?? this.$filters.getAllLocales(), entry.options)}${entry.suffix ?? ''}`
362+
text: `${date.toLocaleTimeString(entry.locales ?? getAllLocales(), entry.options)}${entry.suffix ?? ''}`
362363
}))
363364
}
364365

‎src/components/settings/SpoolmanSettings.vue‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -251,12 +251,16 @@ export default class SpoolmanSettings extends Mixins(StateMixin) {
251251
'lot_nr',
252252
'price',
253253
'density',
254+
'diameter',
254255
'extruder_temp',
255256
'bed_temp',
256257
'first_used',
257258
'last_used',
258259
'comment'
259-
].map(field => ({ value: field, text: this.$t(`app.spoolman.label.${field}`) }))
260+
].map(field => ({
261+
value: field,
262+
text: this.$t(`app.spoolman.label.${field}`)
263+
}))
260264
}
261265
262266
get fieldsToShowInSpoolmanCard (): string[] {

‎src/components/widgets/spoolman/QRReader.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ export default class QRReader extends Mixins(StateMixin, BrowserMixin) {
131131
}
132132
133133
get availableSpools (): Spool[] {
134-
return this.$store.state.spoolman.availableSpools
134+
return this.$store.getters['spoolman/getAvailableSpools']
135135
}
136136
137137
handleCodeFound (code: string) {

‎src/components/widgets/spoolman/SpoolSelectionDialog.vue‎

Lines changed: 106 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<app-dialog
33
v-model="open"
44
scrollable
5-
:max-width="isMobileViewport ? '90vw' : '75vw'"
5+
:max-width="$vuetify.breakpoint.mdAndDown ? '90vw' : '75vw'"
66
:title="$tc('app.spoolman.title.spool_selection', targetMacro ? 2 : 1, { macro: targetMacro })"
77
title-shadow
88
>
@@ -94,7 +94,7 @@
9494
/>
9595
</v-toolbar>
9696

97-
<v-card-text class="pa-0">
97+
<v-card-text class="pa-0 file-system">
9898
<v-data-table
9999
:items="availableSpools"
100100
:headers="headers"
@@ -104,6 +104,7 @@
104104
:no-results-text="$t('app.file_system.msg.not_found')"
105105
:sort-by="sortOrder.key ?? undefined"
106106
:sort-desc="sortOrder.desc ?? undefined"
107+
item-key="id"
107108
mobile-breakpoint="0"
108109
class="spool-table"
109110
hide-default-footer
@@ -122,7 +123,7 @@
122123
<template #[`item.filament_name`]>
123124
<div class="d-flex my-1">
124125
<v-icon
125-
:color="`#${item.filament.color_hex ?? ($vuetify.theme.dark ? 'fff' : '000')}`"
126+
:color="getSpoolColor(item)"
126127
size="42px"
127128
class="mr-4 flex-column spool-icon"
128129
>
@@ -135,24 +136,56 @@
135136
<div class="flex-row">
136137
<small v-if="remainingFilamentUnit === 'weight'">
137138
<b>{{ $filters.getReadableWeightString(item.remaining_weight) }}</b>
138-
/ {{ $filters.getReadableWeightString(item.filament.weight) }}
139+
/ {{ $filters.getReadableWeightString(item.initial_weight) }}
139140
</small>
140141
<small v-else-if="remainingFilamentUnit === 'length'">
141142
<b>{{ $filters.getReadableLengthString(item.remaining_length) }}</b>
142-
/ {{ $filters.getReadableLengthString($filters.convertFilamentWeightToLength(item.filament.weight ?? 0, item.filament.density, item.filament.diameter)) }}
143+
/ {{ $filters.getReadableLengthString(item.initial_length) }}
143144
</small>
144145
</div>
145146
</div>
146147
</div>
147148
</template>
148149

150+
<template #[`item-value.price`]="{ value }">
151+
{{ $filters.getReadableCurrencyString(value, currency ?? '') }}
152+
</template>
153+
154+
<template #[`item-value.filament.density`]="{ value }">
155+
{{ value }} g/cm³
156+
</template>
157+
158+
<template #[`item-value.filament.diameter`]="{ value }">
159+
{{ value }} mm
160+
</template>
161+
162+
<template #[`item-value.filament.settings_extruder_temp`]="{ value }">
163+
{{ value }}<small>°C</small>
164+
</template>
165+
166+
<template #[`item-value.filament.settings_bed_temp`]="{ value }">
167+
{{ value }}<small>°C</small>
168+
</template>
169+
170+
<template #[`item.first_used`]="{ value }">
171+
{{
172+
value
173+
? $filters.formatRelativeTimeToNow(value)
174+
: $tc('app.setting.label.never')
175+
}}
176+
</template>
177+
149178
<template #[`item.last_used`]="{ value }">
150179
{{
151180
value
152181
? $filters.formatRelativeTimeToNow(value)
153182
: $tc('app.setting.label.never')
154183
}}
155184
</template>
185+
186+
<template #[`item-value.filament.colors`]="{ value }">
187+
<app-data-table-cell-colors :colors="value" />
188+
</template>
156189
</app-data-table-row>
157190
</template>
158191
</v-data-table>
@@ -270,49 +303,89 @@ export default class SpoolSelectionDialog extends Mixins(StateMixin, BrowserMixi
270303
}
271304
272305
get availableSpools () {
273-
const spools = []
274-
const availableSpools: Spool[] = this.$store.state.spoolman.availableSpools
275-
276-
for (const spool of availableSpools) {
277-
if (spool.archived) {
278-
continue
279-
}
306+
const availableSpools: Spool[] = this.$store.getters['spoolman/getAvailableSpools']
280307
281-
const filamentName = spool.filament.vendor
282-
? `${spool.filament.vendor.name} - ${spool.filament.name}`
283-
: spool.filament.name
284-
285-
spools.push({
286-
...spool,
287-
filament_name: filamentName,
288-
material: spool.filament.material
289-
})
290-
}
308+
return availableSpools
309+
.filter(x => !x.archived)
310+
}
291311
292-
return spools
312+
get currency (): string | null {
313+
return this.$store.state.spoolman.currency
293314
}
294315
295316
get configurableHeaders (): AppDataTableHeader[] {
296317
const headers: AppDataTableHeader[] = [
297318
{
298319
text: this.$tc('app.spoolman.label.id'),
299-
value: 'id'
320+
value: 'id',
321+
cellClass: 'text-no-wrap'
300322
},
301323
{
302324
text: this.$tc('app.spoolman.label.material'),
303-
value: 'material'
325+
value: 'filament.material',
326+
cellClass: 'text-no-wrap'
327+
},
328+
{
329+
text: this.$tc('app.spoolman.label.price'),
330+
value: 'price',
331+
visible: false,
332+
cellClass: 'text-no-wrap'
333+
},
334+
{
335+
text: this.$tc('app.spoolman.label.lot_nr'),
336+
value: 'lot_nr',
337+
visible: false,
338+
cellClass: 'text-no-wrap'
339+
},
340+
{
341+
text: this.$tc('app.spoolman.label.density'),
342+
value: 'filament.density',
343+
visible: false,
344+
cellClass: 'text-no-wrap'
345+
},
346+
{
347+
text: this.$tc('app.spoolman.label.diameter'),
348+
value: 'filament.diameter',
349+
visible: false,
350+
cellClass: 'text-no-wrap'
351+
},
352+
{
353+
text: this.$tc('app.spoolman.label.extruder_temp'),
354+
value: 'filament.settings_extruder_temp',
355+
visible: false,
356+
cellClass: 'text-no-wrap'
357+
},
358+
{
359+
text: this.$tc('app.spoolman.label.bed_temp'),
360+
value: 'filament.settings_bed_temp',
361+
visible: false,
362+
cellClass: 'text-no-wrap'
363+
},
364+
{
365+
text: this.$tc('app.spoolman.label.colors'),
366+
value: 'filament.colors',
367+
cellClass: 'text-no-wrap'
304368
},
305369
{
306370
text: this.$tc('app.spoolman.label.location'),
307-
value: 'location'
371+
value: 'location',
372+
cellClass: 'text-no-wrap'
308373
},
309374
{
310375
text: this.$tc('app.spoolman.label.comment'),
311-
value: 'comment'
376+
value: 'comment',
377+
cellClass: 'text-no-wrap'
378+
},
379+
{
380+
text: this.$tc('app.spoolman.label.first_used'),
381+
value: 'first_used',
382+
visible: false,
383+
cellClass: 'text-no-wrap'
312384
},
313385
{
314386
text: this.$tc('app.spoolman.label.last_used'),
315-
value: 'last_used'
387+
value: 'last_used',
388+
cellClass: 'text-no-wrap'
316389
},
317390
]
318391
@@ -482,12 +555,7 @@ export default class SpoolSelectionDialog extends Mixins(StateMixin, BrowserMixi
482555
return
483556
}
484557
} else if (this.warnOnNotEnoughFilament) {
485-
let remainingLength = spool.remaining_length
486-
if (!remainingLength && spool.remaining_weight) {
487-
remainingLength = this.$filters.convertFilamentWeightToLength(spool.remaining_weight, spool.filament.density, spool.filament.diameter)
488-
}
489-
490-
if (typeof remainingLength === 'number' && requiredLength >= remainingLength) {
558+
if (spool.remaining_length != null && requiredLength >= spool.remaining_length) {
491559
// not enough filament
492560
493561
const confirmation = await this.$confirm(
@@ -564,5 +632,9 @@ export default class SpoolSelectionDialog extends Mixins(StateMixin, BrowserMixi
564632
server: true
565633
})
566634
}
635+
636+
getSpoolColor (spool?: Spool) {
637+
return spool?.filament.color_hex ?? (this.$vuetify.theme.dark ? '#fff' : '#000')
638+
}
567639
}
568640
</script>

‎src/components/widgets/spoolman/SpoolmanCard.vue‎

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
small
1212
class="me-1 my-1"
1313
:disabled="!isConnected"
14-
@click="() => handleSelectSpool()"
14+
@click="handleSelectSpool"
1515
>
1616
{{ $t('app.spoolman.label.change_spool') }}
1717
</app-btn>
@@ -43,7 +43,7 @@
4343
</app-btn>
4444
</template>
4545
<v-list dense>
46-
<v-list-item @click="() => handleSelectSpool()">
46+
<v-list-item @click="handleSelectSpool">
4747
<v-list-item-content>
4848
<v-list-item-title>
4949
{{ $t('app.spoolman.label.active_spool') }}
@@ -65,8 +65,10 @@
6565
<template v-for="macro of targetableMacros">
6666
<v-list-item
6767
:key="macro.name"
68-
:class="{primary: macro.variables?.active}"
69-
@click="() => handleSelectSpool(macro)"
68+
:class="{
69+
primary: macro.variables?.active
70+
}"
71+
@click="handleSelectSpool(macro)"
7072
>
7173
<v-list-item-content>
7274
<v-list-item-title>
@@ -94,7 +96,7 @@
9496
v-if="activeSpool && $vuetify.breakpoint.lgAndDown"
9597
value="100"
9698
:height="6"
97-
:color="`#${activeSpool.filament.color_hex ?? ($vuetify.theme.dark ? 'fff' : '000')}`"
99+
:color="getSpoolColor(activeSpool)"
98100
/>
99101

100102
<v-card-text>
@@ -114,22 +116,22 @@
114116
<template v-if="field === 'remaining_weight'">
115117
<span v-if="remainingFilamentUnit === 'weight'">
116118
{{ $filters.getReadableWeightString(activeSpool.remaining_weight) }}
117-
<small>/ {{ $filters.getReadableWeightString(activeSpool.filament.weight) }}</small>
119+
<small>/ {{ $filters.getReadableWeightString(activeSpool.initial_weight) }}</small>
118120
</span>
119121
<span v-else-if="remainingFilamentUnit === 'length'">
120122
{{ $filters.getReadableLengthString(activeSpool.remaining_length) }}
121-
<small>/ {{ $filters.getReadableLengthString($filters.convertFilamentWeightToLength(activeSpool.filament.weight ?? 0, activeSpool.filament.density, activeSpool.filament.diameter)) }}</small>
123+
<small>/ {{ $filters.getReadableLengthString(activeSpool.initial_length) }}</small>
122124
</span>
123125
</template>
124126

125127
<template v-else-if="field === 'used_weight'">
126128
<span v-if="remainingFilamentUnit === 'weight'">
127129
{{ $filters.getReadableWeightString(activeSpool.used_weight) }}
128-
<small>/ {{ $filters.getReadableWeightString(activeSpool.filament.weight) }}</small>
130+
<small>/ {{ $filters.getReadableWeightString(activeSpool.initial_weight) }}</small>
129131
</span>
130132
<span v-else-if="remainingFilamentUnit === 'length'">
131133
{{ $filters.getReadableLengthString(activeSpool.used_length) }}
132-
<small>/ {{ $filters.getReadableLengthString($filters.convertFilamentWeightToLength(activeSpool.filament.weight ?? 0, activeSpool.filament.density, activeSpool.filament.diameter)) }}</small>
134+
<small>/ {{ $filters.getReadableLengthString(activeSpool.initial_length) }}</small>
133135
</span>
134136
</template>
135137

@@ -248,7 +250,7 @@ export default class SpoolmanCard extends Mixins(StateMixin) {
248250
}
249251
250252
getSpoolColor (spool?: Spool) {
251-
return `#${spool?.filament.color_hex ?? (this.$vuetify.theme.dark ? 'fff' : '000')}`
253+
return spool?.filament.color_hex ?? (this.$vuetify.theme.dark ? '#fff' : '#000')
252254
}
253255
254256
getFormattedField (field: string) {
@@ -271,14 +273,14 @@ export default class SpoolmanCard extends Mixins(StateMixin) {
271273
return this.activeSpool.last_used ? this.$filters.formatRelativeTimeToNow(this.activeSpool.last_used) : this.$tc('app.setting.label.never')
272274
273275
case 'price':
274-
return [
275-
this.activeSpool.filament.price?.toFixed(2),
276-
this.currency
277-
].filter(x => x != null).join(' ') || '-'
276+
return this.activeSpool.price != null ? this.$filters.getReadableCurrencyString(this.activeSpool.price, this.currency ?? '') : '-'
278277
279278
case 'density':
280279
return this.activeSpool.filament.density || '-'
281280
281+
case 'diameter':
282+
return this.activeSpool.filament.diameter ? this.$filters.getReadableLengthString(this.activeSpool.filament.diameter) : '-'
283+
282284
case 'extruder_temp':
283285
return this.activeSpool.filament.settings_extruder_temp || '-'
284286

‎src/components/widgets/toolhead/ToolChangeCommands.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ export default class ToolChangeCommands extends Mixins(StateMixin) {
118118
}
119119
120120
getSpoolColor (spool: Spool | undefined) {
121-
return `#${spool?.filament.color_hex ?? (this.$vuetify.theme.dark ? 'fff' : '000')}`
121+
return spool?.filament.color_hex ?? (this.$vuetify.theme.dark ? '#fff' : '#000')
122122
}
123123
}
124124
</script>

‎src/locales/en.yaml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -911,9 +911,11 @@ app:
911911
active_spool: Active Spool
912912
bed_temp: Bed Temp
913913
change_spool: Change Spool
914+
colors: Colors
914915
comment: Comment
915916
density: Density
916917
device_camera: Device
918+
diameter: Diameter
917919
extruder_temp: Extruder Temp
918920
filament_name: Filament
919921
first_used: First Used

0 commit comments

Comments
 (0)