Skip to content

Commit

Permalink
refactor: remove complexity in historyStatsMixin
Browse files Browse the repository at this point in the history 
Signed-off-by: Stefan Dej <[email protected]>
  • Loading branch information
@meteyou
meteyou committed Sep 15, 2024
1 parent 50d7707 commit 908d3c7
Showing 1 changed file with 54 additions and 104 deletions.
158 changes: 54 additions & 104 deletions src/components/mixins/historyStats.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,147 +7,79 @@ import {
} from '@/store/server/history/types'
import i18n from '@/plugins/i18n'

type StatusKeys = 'completed' | 'in_progress' | 'cancelled' | 'default'

@Component
export default class HistoryStatsMixin extends Vue {
valueName!: HistoryStatsValueNames

get allPrintStatusChartData() {
const output: ServerHistoryStateAllPrintStatusEntry[] = []
const hidePrintStatus = this.$store.state.gui.view.history.hidePrintStatus ?? []
const jobs = this.$store.state.server.history.jobs ?? []

jobs.forEach((current: ServerHistoryStateJob) => {
const index = output.findIndex((element) => element.name === current.status)
if (index !== -1) {
output[index].value += 1
output[index].valueFilament += current.filament_used
output[index].valueTime += current.print_duration
return
}

const displayName = i18n.te(`History.StatusValues.${current.status}`, 'en')
? i18n.t(`History.StatusValues.${current.status}`).toString()
: current.status

const itemStyle = {
opacity: 0.9,
color: '#424242',
borderColor: '#1E1E1E',
borderWidth: 2,
borderRadius: 3,
}

switch (current.status) {
case 'completed':
itemStyle['color'] = '#BDBDBD'
break

case 'in_progress':
itemStyle['color'] = '#EEEEEE'
break

case 'cancelled':
itemStyle['color'] = '#616161'
break
}

output.push({
name: current.status,
displayName,
value: 1,
valueFilament: current.filament_used,
valueTime: current.print_duration,
itemStyle,
showInTable: !hidePrintStatus.includes(current.status),
})
})

return output
return this.getChartData(this.$store.state.server.history.jobs ?? [])
}

get selectedPrintStatusChartData() {
return this.getChartData(this.$store.getters['server/history/getSelectedJobs'])
}

private getChartData(jobs: ServerHistoryStateJob[]) {
const output: ServerHistoryStateAllPrintStatusEntry[] = []
const jobs = this.$store.getters['server/history/getSelectedJobs']
const hidePrintStatus = this.$store.state.gui.view.history.hidePrintStatus ?? []

const colorMap: Record<StatusKeys, string> = {
completed: '#BDBDBD',
in_progress: '#EEEEEE',
cancelled: '#616161',
default: '#424242',
}

jobs.forEach((current: ServerHistoryStateJob) => {
const index = output.findIndex((element) => element.name === current.status)
if (index !== -1) {
output[index].value += 1
output[index].valueTime += current.print_duration
output[index].valueFilament += current.filament_used
output[index].valueTime += current.print_duration
return
}

const displayName = i18n.te(`History.StatusValues.${current.status}`, 'en').toString()
const displayName = i18n.te(`History.StatusValues.${current.status}`, 'en')
? i18n.t(`History.StatusValues.${current.status}`).toString()
: current.status
const itemStyle = {
opacity: 0.9,
color: '#424242',
borderColor: '#1E1E1E',
borderWidth: 2,
borderRadius: 3,
}

switch (current.status) {
case 'completed':
itemStyle['color'] = '#BDBDBD'
break

case 'in_progress':
itemStyle['color'] = '#EEEEEE'
break

case 'cancelled':
itemStyle['color'] = '#616161'
break
}

output.push({
name: current.status,
displayName,
value: 1,
valueTime: current.print_duration,
valueFilament: current.filament_used,
itemStyle: itemStyle,
valueTime: current.print_duration,
itemStyle: {
opacity: 0.9,
color: colorMap[current.status as StatusKeys] ?? colorMap.default,
borderColor: '#1E1E1E',
borderWidth: 2,
borderRadius: 3,
},
showInTable: !hidePrintStatus.includes(current.status),
})
})

return output
}

get printStatusArray() {
let output: ServerHistoryStateAllPrintStatusEntry[] = []
const countSelected = this.$store.getters['server/history/getSelectedJobs'].length
const orgArray = countSelected ? this.selectedPrintStatusChartData : this.allPrintStatusChartData

orgArray.forEach((status: ServerHistoryStateAllPrintStatusEntry) => {
const tmp = { ...status }
tmp.name = status.displayName

if (this.valueName === 'filament') {
tmp.value = status.valueFilament
} else if (this.valueName === 'time') {
tmp.value = status.valueTime
}

output.push(tmp)
})

// group all entries with less than 5% of the total
const totalCount = output.reduce((acc, cur) => acc + cur.value, 0)
const otherLimit = totalCount * 0.05
const others = output.filter((entry) => entry.value < otherLimit)
private groupSmallEntries(
entries: ServerHistoryStateAllPrintStatusEntry[],
threshold: number
): ServerHistoryStateAllPrintStatusEntry[] {
const totalCount = entries.reduce((acc, cur) => acc + cur.value, 0)
const otherLimit = totalCount * threshold
const others = entries.filter((entry) => entry.value < otherLimit)

// no, or only one entry found
if (others.length < 2) return output
if (others.length < 2) return entries

const value = others.reduce((acc, cur) => acc + cur.value, 0)
output = output.filter((entry) => entry.value >= otherLimit)
const remaining = entries.filter((entry) => entry.value >= otherLimit)
const displayName = i18n.t(`History.StatusValues.Others`).toString() + ` (${others.length})`
output.push({

remaining.push({
name: displayName,
displayName,
value,
Expand All @@ -163,6 +95,24 @@ export default class HistoryStatsMixin extends Vue {
showInTable: true,
})

return output
return remaining
}

get printStatusArray() {
const countSelected = this.$store.getters['server/history/getSelectedJobs'].length
const orgArray = countSelected ? this.selectedPrintStatusChartData : this.allPrintStatusChartData

const output = orgArray.map((status) => ({
...status,
name: status.displayName,
value:
this.valueName === 'filament'
? status.valueFilament
: this.valueName === 'time'
? status.valueTime
: status.value,
}))

return this.groupSmallEntries(output, 0.05)
}
}

0 comments on commit 908d3c7

Please sign in to comment.