- CSS: couleurs saturees sans pastels, border-radius 4-6px, inputs mood-aware - Header: allege (3.25rem), logo typographique, bouton connexion fin - Login: redesign complet avec steps dots et input natif style - Dashboard: entry cards epurees, tags toolbox compacts - Seed: 34 vraies clauses forgeron v2.0.0 (forum topic 33165) - Seed: 9 clauses certification (licence G1) - Seed: 11 votants simules + 3 sessions de vote (10 pour / 1 contre) - MoodSwitcher: dots colores au lieu d'icones Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
74 lines
2.1 KiB
Vue
74 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
const props = withDefaults(defineProps<{
|
|
status: string
|
|
type?: 'document' | 'decision' | 'mandate' | 'vote' | 'version'
|
|
clickable?: boolean
|
|
active?: boolean
|
|
}>(), {
|
|
clickable: true,
|
|
active: false,
|
|
})
|
|
|
|
const emit = defineEmits<{
|
|
click: []
|
|
}>()
|
|
|
|
const STATUS_MAP: Record<string, { label: string; cssClass: string }> = {
|
|
// Universal statuses
|
|
draft: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
active: { label: 'En vigueur', cssClass: 'status-vigueur' },
|
|
closed: { label: 'Clos', cssClass: 'status-clos' },
|
|
|
|
// Decision/vote specific
|
|
qualification: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
review: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
voting: { label: 'En vote', cssClass: 'status-vote' },
|
|
open: { label: 'En vote', cssClass: 'status-vote' },
|
|
executed: { label: 'En vigueur', cssClass: 'status-vigueur' },
|
|
|
|
// Version specific
|
|
pending: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
accepted: { label: 'En vigueur', cssClass: 'status-vigueur' },
|
|
rejected: { label: 'Clos', cssClass: 'status-clos' },
|
|
|
|
// Mandate specific
|
|
formulation: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
candidature: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
candidacy: { label: 'En prepa', cssClass: 'status-prepa' },
|
|
investiture: { label: 'En vote', cssClass: 'status-vote' },
|
|
revoked: { label: 'Clos', cssClass: 'status-clos' },
|
|
completed: { label: 'Clos', cssClass: 'status-clos' },
|
|
archived: { label: 'Clos', cssClass: 'status-clos' },
|
|
reporting: { label: 'En vote', cssClass: 'status-vote' },
|
|
}
|
|
|
|
const resolved = computed(() => {
|
|
return STATUS_MAP[props.status] ?? { label: props.status, cssClass: 'status-prepa' }
|
|
})
|
|
|
|
function handleClick() {
|
|
if (props.clickable) {
|
|
emit('click')
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
v-if="clickable"
|
|
type="button"
|
|
class="status-pill"
|
|
:class="[resolved.cssClass, { active: active }]"
|
|
@click="handleClick"
|
|
>
|
|
{{ resolved.label }}
|
|
</button>
|
|
<span
|
|
v-else
|
|
class="status-pill"
|
|
:class="[resolved.cssClass]"
|
|
>
|
|
{{ resolved.label }}
|
|
</span>
|
|
</template>
|