Encode the board as blocks of stacked-section columns (C1) and render it as the ASCII-styled DOM grid (C2) with hover highlight and a select emit. Layout mirrors the physical board (Client Satisfaction above Product Architecture; Macroplan above Defect Visualisation, both left of Feature Kanban) and boxes use true ISO 216 proportions (1:√2, each step up scaled by √2). Both views render from the one definition; tests pin section presence, click, hover, layout order, and a snapshot.
14 lines
342 B
Vue
14 lines
342 B
Vue
<script setup lang="ts">
|
|
const selected = ref<string | null>(null)
|
|
</script>
|
|
|
|
<template>
|
|
<main>
|
|
<h1>Andon — report a board problem</h1>
|
|
<BoardView @select="(id) => (selected = id)" />
|
|
<p v-if="selected">
|
|
Selected section: <code>{{ selected }}</code> — the defect form arrives in Task 5.
|
|
</p>
|
|
</main>
|
|
</template>
|