- Auth/roles (no self-reg), admin user provision, JWT - Analyze: sales kit + initial pain-fit from form/upload - Persona generator: 15 personas (5/tier) w/ pain variety, negotiation, init mode, channel, latent/revealable, wrong_text special - Chat simulator: per-mode initiation, one-shot, hidden signals, judge-LLM debrief+coaching - Trainee loop: win/lose board, weak-areas, user-generated personas - Admin analytics; EN+TH Vue SPA served by Flask - Deploy: Dockerfile, docker-compose, README, eng-log + HANDOFF - Tests (mock LLM): m0/m1/routes/e2e all pass
40 lines
1.7 KiB
Vue
40 lines
1.7 KiB
Vue
<template>
|
|
<div>
|
|
<div class="row" style="align-items:center">
|
|
<h2 style="margin:0">{{ i18n.t('weakAreas') }}</h2>
|
|
<router-link :to="`/my/generate?mode=weak`" style="margin-left:auto"><button class="primary">🔒 Generate a lock persona</button></router-link>
|
|
</div>
|
|
<div class="row" style="gap:16px;margin:16px 0">
|
|
<div class="card stat"><div>Wins</div><strong>{{ insight.wins }}</strong></div>
|
|
<div class="card stat"><div>Losses</div><strong>{{ insight.losses }}</strong></div>
|
|
<div class="card stat"><div>Total</div><strong>{{ insight.total_sessions }}</strong></div>
|
|
</div>
|
|
|
|
<div v-for="g in insight.by_tier" :key="g.value" class="card" style="margin-bottom:8px">
|
|
<span class="badge" :class="g.value">Tier {{ g.value }}</span> — {{ g.losses }} losses
|
|
</div>
|
|
|
|
<h3 style="margin-top:20px">Top loss personas</h3>
|
|
<div v-if="!insight.top_loss_personas || !insight.top_loss_personas.length" class="card muted">No losses yet — 🎉</div>
|
|
<div class="card" v-for="(p, i) in insight.top_loss_personas" :key="i" style="margin-bottom:8px">
|
|
<strong>{{ p.persona_name }}</strong> — score {{ p.score }}<br />
|
|
<span class="muted">{{ p.why }}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onMounted, ref } from 'vue'
|
|
import { api } from '../api'
|
|
import { i18n } from '../i18n'
|
|
|
|
const insight = ref({ wins: 0, losses: 0, total_sessions: 0, by_tier: [], top_loss_personas: [] })
|
|
onMounted(async () => { insight.value = (await api.weakAreas()).insight })
|
|
</script>
|
|
|
|
<style scoped>
|
|
.stat { text-align: center; min-width: 100px; }
|
|
.stat div { color: var(--muted); font-size: 12px; }
|
|
.stat strong { font-size: 22px; }
|
|
</style>
|