diff --git a/src/AppHeijunka.vue b/src/AppHeijunka.vue index abc3429..cecdc27 100644 --- a/src/AppHeijunka.vue +++ b/src/AppHeijunka.vue @@ -86,21 +86,47 @@ const createdAt = new Date('2026-01-01').toLocaleDateString(undefined, {

You know, from your years of experience, that in 3 days, you sell approximately -

+ +
+

Factory

+ + + + + + + + + + + + + + + + + +
DayHour 1Hour 2Hour 3Hour 4
Day {{ day }} + +
+
+
+
-
-

Factory

- - - - - - - - - - - - - - - - - -
DayHour 1Hour 2Hour 3Hour 4
Day {{ day }} - -
-
Mean lead time: {{ heijunkaStore.meanLeadTime }} +
+ Orders made: {{ heijunkaStore.orders.length }}
@@ -197,7 +194,7 @@ const createdAt = new Date('2026-01-01').toLocaleDateString(undefined, {

Orders

    -
  1. +
  2. @@ -250,6 +250,8 @@ const createdAt = new Date('2026-01-01').toLocaleDateString(undefined, {
    Mean lead time: {{ heijunkaStore.meanLeadTime }} +
    + Orders made: {{ heijunkaStore.orders.length }}

    diff --git a/src/modules/heijkunka/HeijunkaStat.vue b/src/modules/heijkunka/HeijunkaStat.vue index 0f1589f..a305e60 100644 --- a/src/modules/heijkunka/HeijunkaStat.vue +++ b/src/modules/heijkunka/HeijunkaStat.vue @@ -9,7 +9,7 @@ const svgElement = ref(null) const products: ProductType[] = ['shirt', 'jeans', 'shoes', 'hat'] const heijunkaStore = useHeijunkaStore() -const { orders } = storeToRefs(heijunkaStore) +const { orders, inventory } = storeToRefs(heijunkaStore) const renderChart = () => { if (orders.value.length === 0) { @@ -25,13 +25,15 @@ const renderChart = () => { xLabel: 'Products', yLabel: '# of orders', data: { - labels: products, + labels: products.map((p) => [`${p} ordered`, `${p} made |`]).flat(), datasets: [ { - data: products.map( - (product) => - orders.value.filter((o) => o.product === product).length - ) + data: products + .map((product) => [ + orders.value.filter((o) => o.product === product).length, + inventory.value[product] + ]) + .flat() } ] }, @@ -44,7 +46,7 @@ const renderChart = () => { } onMounted(renderChart) -watch(orders, renderChart, { deep: true }) +watch([orders, inventory], renderChart, { deep: true })