ff0f680090
Security (requesting-code-review pipeline + independent reviewer): - Fix path traversal on file upload (basename sanitize + resolve-containment) - Fix IDOR: org + owner scoping on all group/chat routes (_authorize_group/_get_owned_group), hide other users' personal groups in listings - Remove XSS via v-html in Chat task (text interpolation) - Add test_security.py (traversal + cross-user denial) — all pass UX/UI (ui-ux-pro-max + frontend-dev-verification): - Global: focus rings, 44px touch targets, hover/press transitions, input focus glow, prefers-reduced-motion, skeleton loaders, empty states, back links, spinner - Login: password toggle, autocomplete, spinner, disabled-when-empty - Cards lift on hover; dashboard skeleton + empty state; analyze button spinner All backend tests pass (m0/m1/routes/security/e2e); frontend builds; served SPA verified via curl.
60 lines
2.4 KiB
Vue
60 lines
2.4 KiB
Vue
<template>
|
|
<div>
|
|
<router-link to="/" class="btn-back">← {{ i18n.t('dashboard') }}</router-link>
|
|
<div class="row" style="align-items:center">
|
|
<h2 style="margin:0">{{ i18n.t('personas') }}</h2>
|
|
<span class="muted" style="margin-left:auto">Levels: choose one to practice (one-shot)</span>
|
|
</div>
|
|
|
|
<div v-for="tier in ['A','B','C']" :key="tier" style="margin:20px 0">
|
|
<h4>{{ tierLabel(tier) }}</h4>
|
|
<div class="grid">
|
|
<div v-for="p in byTier(tier)" :key="p.id" class="card pcard lift">
|
|
<div class="row">
|
|
<strong>{{ p.name }}</strong>
|
|
<span class="badge" :class="p.my_outcome">{{ outcomeLabel(p.my_outcome) }}</span>
|
|
</div>
|
|
<div class="muted">
|
|
{{ p.profession }} · {{ p.age_group }} · {{ p.location }}<br />
|
|
<span class="badge" :class="p.channel">{{ p.channel }}</span>
|
|
<span class="muted"> · {{ p.initiation_mode === 'seller' ? i18n.t('sellerInitiated') : i18n.t('customerInitiated') }}</span>
|
|
</div>
|
|
<div class="muted" style="margin-top:6px">{{ p.product_context }}</div>
|
|
<router-link v-if="p.my_outcome === 'not_tried'" :to="`/groups/${gid}/chat/${p.id}`" style="margin-top:auto">
|
|
<button class="primary" style="width:100%">{{ i18n.t('chat') }}</button>
|
|
</router-link>
|
|
<div v-else class="muted" style="margin-top:auto;font-size:12px">✓ Trained ({{ outcomeLabel(p.my_outcome) }})</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, onMounted, ref } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { api } from '../api'
|
|
import { i18n } from '../i18n'
|
|
|
|
const route = useRoute()
|
|
const gid = route.params.gid
|
|
const personas = ref([])
|
|
const loading = ref(true)
|
|
|
|
async function load() {
|
|
try { personas.value = (await api.listPersonas(gid)).personas }
|
|
finally { loading.value = false }
|
|
}
|
|
function byTier(t) { return personas.value.filter((p) => p.tier === t) }
|
|
function tierLabel(t) { return i18n.t(t === 'A' ? 'tierA' : t === 'B' ? 'tierB' : 'tierC') }
|
|
function outcomeLabel(o) {
|
|
return o === 'won' ? i18n.t('won') : o === 'lost' ? i18n.t('lost') : i18n.t('notTried')
|
|
}
|
|
onMounted(load)
|
|
</script>
|
|
|
|
<style scoped>
|
|
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
|
|
.pcard { display: flex; flex-direction: column; min-height: 170px; }
|
|
</style>
|