ge-aerospace/shopdb-flask
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Name the toner on the forecast, keep the number on the hover

Browse Source
This commit is contained in:
Cameron Proudlock
2026-08-21 11:23:27 -04:00
parent 04107ff8ab
commit 65312c0502
2 changed files with 134 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
plugins/printers/frontend/views/TonerForecast.vue
View File

@@ -42,7 +42,11 @@
<ul v-else class="order-list">
<li v-for="item in mapped" :key="orderKey(item)">
<span class="quantity">{{ item.quantity }}x</span>
<span class="partnumber">{{ item.partnumber }}</span>
<!-- Name here too, number on hover. 'Copy list' still writes the
part number, which is what an order is placed against. -->
<span class="supplyname" :title="item.partnumber">
{{ item.marketingname || item.partnumber }}
</span>
<span class="muted order-detail">
{{ colorLabel(item.color) }}<template v-if="item.model">, {{ item.model }}</template>
</span>
@@ -107,7 +111,16 @@
</td>
<td>{{ c.name }}</td>
<td>
<span v-if="firstPart(c)" class="partnumber">{{ firstPart(c) }}</span>
<!-- The cartridge's NAME, with the part number on hover. A
name says which toner this is; 'W2020A' only identifies it
once you already know. The number is what purchasing wants,
so it stays one hover away and stays in the copied order
list verbatim. Falls back to the number when a supply has
no name on file - marketingname is nullable. -->
<span v-if="firstPart(c)" class="supplyname"
:title="firstPart(c).partnumber">
{{ firstPart(c).marketingname || firstPart(c).partnumber }}
</span>
<span v-else class="muted">-</span>
</td>
<td class="collevel">
@@ -259,9 +272,13 @@ function colorLabel(color) {
return color.charAt(0).toUpperCase() + color.slice(1)
}
// The whole part row, not just its number: the table shows the name and keeps
// the number for the hover, and both come from here. Several capacity tiers can
// match; the first is the standard one, which is what orderlist() groups on and
// what the low-supplies report shows first.
function firstPart(cartridge) {
const parts = cartridge.partnumbers || []
return parts.length ? parts[0].partnumber : null
return parts.length ? parts[0] : null
}
function levelText(cartridge) {
@@ -376,8 +393,10 @@ onMounted(load)
text-align: left;
}
.unmapped-block .order-list li { border-top: 1px dashed var(--border); }
.partnumber { font-family: monospace; font-weight: 700; }
.partnumber.unmapped { font-weight: 400; color: var(--warning); }
/* A name is prose, not a code, so it does not get the monospace the part number
used to carry here. The help cursor is the only signal that the number is on
the hover. Replaced .partnumber, which nothing renders any more. */
.supplyname { font-weight: 700; cursor: help; }
.order-detail { font-size: 0.9rem; }
.order-printers { font-size: 0.8rem; margin-left: auto; text-align: right; }