building Confirm component

This commit is contained in:
Mathieu Jaumotte 2021-05-18 10:15:45 +02:00
parent 1722cf721e
commit 5acc78507e
3 changed files with 60 additions and 39 deletions

View File

@ -1,25 +1,11 @@
<template>
<div class="vue-component">
<div class="vue-component" style="display: none;">
<h3>{{ $t('course.title') }}</h3>
<dl>
<dt>{{ $t('course.id') }}</dt>
<dd>{{ accompanyingCourse.id }}</dd>
<dt>{{ $t('course.status') }}</dt>
<dd>
<div v-if="accompanyingCourse.step !== 'DRAFT'"
class="badge badge-pill badge-primary">
{{ $t('course.step.active') }}</div>
<div v-else class="badge badge-pill badge-secondary">
{{ $t('course.step.draft') }}</div>
</dd>
<dt>{{ $t('course.closing_date') }}</dt>
<dd v-if="accompanyingCourse.closingDate">{{ $d(accompanyingCourse.closingDate.datetime, 'short') }}</dd>
<dt>{{ $t('course.closing_motive') }}</dt>
<dd v-if="accompanyingCourse.closingMotive">{{ accompanyingCourse.closingMotive.name.fr }}</dd>
</dl>
</div>
<teleport to="#header-accompanying_course-name .grid-4">
<toggle-flags
@ -39,7 +25,6 @@
</p>
</teleport>
</div>
</template>
<script>

View File

@ -1,11 +1,45 @@
<template>
<div class="vue-component">
<h3>{{ $t('confirm.title') }}</h3>
<h3>
{{ $t('confirm.title') }}
<span v-if="accompanyingCourse.step !== 'DRAFT'"
class="badge badge-pill badge-primary">
{{ $t('course.step.active') }}</span>
<span v-else class="badge badge-pill badge-secondary">
{{ $t('course.step.draft') }}</span>
</h3>
<p v-if="accompanyingCourse.step === 'DRAFT'">
{{ $t('confirm.text_draft') }}
</p>
<dl>
<dt>{{ $t('course.closing_date') }}</dt>
<dd v-if="accompanyingCourse.closingDate">{{ $d(accompanyingCourse.closingDate.datetime, 'short') }}</dd>
<dt>{{ $t('course.closing_motive') }}</dt>
<dd v-if="accompanyingCourse.closingMotive">{{ accompanyingCourse.closingMotive.name.fr }}</dd>
</dl>
<button class="sc-button bt-save"
@click="confirmCourse">
{{ $t('confirm.ok') }}
</button>
</div>
</template>
<script>
export default {
name: "Confirm",
computed: {
accompanyingCourse() {
return this.$store.state.accompanyingCourse
}
},
methods: {
confirmCourse() {
console.log('confirmCourse');
}
}
}
</script>

View File

@ -67,6 +67,8 @@ const appMessages = {
},
confirm: {
title: "Confirmation",
text_draft: "Le parcours est actuellement au statut de brouillon. En validant cette étape, vous lui donnez le statut actif.",
ok: "Activer le parcours"
},
}