mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-08-22 15:43:51 +00:00
confirm modal "are you sure ?"
This commit is contained in:
@@ -1,42 +1,71 @@
|
||||
<template>
|
||||
<div class="vue-component">
|
||||
<h2><a name="section-70"></a>
|
||||
{{ $t('confirm.title') }}
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
{{ $t('confirm.text_draft') }}
|
||||
<span class="badge badge-secondary">{{ $t('course.step.draft') }}</span>
|
||||
</p>
|
||||
<p>
|
||||
{{ $t('confirm.text_active') }}
|
||||
<span class="badge badge-primary">{{ $t('course.step.active') }}</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<dl v-if="accompanyingCourse.closingDate">
|
||||
<dt>{{ $t('course.closing_date') }}</dt>
|
||||
<dd>{{ $d(accompanyingCourse.closingDate.datetime, 'short') }}</dd>
|
||||
|
||||
<dt>{{ $t('course.closing_motive') }}</dt>
|
||||
<dd v-if="accompanyingCourse.closingMotive">{{ accompanyingCourse.closingMotive.name.fr }}</dd>
|
||||
</dl>
|
||||
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="sc-button bt-save"
|
||||
@click="confirmCourse">
|
||||
{{ $t('confirm.ok') }}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="vue-component">
|
||||
<h2><a name="section-70"></a>
|
||||
{{ $t('confirm.title') }}
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
{{ $t('confirm.text_draft') }}
|
||||
<span class="badge badge-secondary">{{ $t('course.step.draft') }}</span>
|
||||
</p>
|
||||
<p>
|
||||
{{ $t('confirm.text_active') }}
|
||||
<span class="badge badge-primary">{{ $t('course.step.active') }}</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<dl v-if="accompanyingCourse.closingDate">
|
||||
<dt>{{ $t('course.closing_date') }}</dt>
|
||||
<dd>{{ $d(accompanyingCourse.closingDate.datetime, 'short') }}</dd>
|
||||
|
||||
<dt>{{ $t('course.closing_motive') }}</dt>
|
||||
<dd v-if="accompanyingCourse.closingMotive">{{ accompanyingCourse.closingMotive.name.fr }}</dd>
|
||||
</dl>
|
||||
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="sc-button bt-save" @click="modal.showModal = true">
|
||||
{{ $t('confirm.ok') }}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<teleport to="body">
|
||||
<modal v-if="modal.showModal" :modalDialogClass="modal.modalDialogClass" @close="modal.showModal = false">
|
||||
<template v-slot:header>
|
||||
<h2 class="modal-title">{{ $t('confirm.sure') }}</h2>
|
||||
</template>
|
||||
<template v-slot:body>
|
||||
<p>{{ $t('confirm.sure_description') }}</p>
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<button class="sc-button red" @click="confirmCourse">
|
||||
{{ $t('confirm.ok') }}
|
||||
</button>
|
||||
</template>
|
||||
</modal>
|
||||
</teleport>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Modal from 'ChillMainAssets/vuejs/_components/Modal';
|
||||
|
||||
export default {
|
||||
name: "Confirm",
|
||||
components: {
|
||||
Modal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: {
|
||||
showModal: false,
|
||||
modalDialogClass: "modal-dialog-centered modal-md"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
accompanyingCourse() {
|
||||
return this.$store.state.accompanyingCourse
|
||||
@@ -46,13 +75,14 @@ export default {
|
||||
confirmCourse() {
|
||||
console.log('@@ CLICK confirmCourse');
|
||||
this.$store.dispatch('confirmAccompanyingCourse');
|
||||
console.log('confirm last');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
div.vue-component > div {
|
||||
margin: 1em;
|
||||
}
|
||||
div.vue-component > div {
|
||||
margin: 1em;
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user