add intensity in teleported toggleFlags

This commit is contained in:
Mathieu Jaumotte 2021-05-18 16:14:10 +02:00
parent 5acc78507e
commit f978636d57
7 changed files with 71 additions and 10 deletions

View File

@ -182,3 +182,15 @@ div.results {
color: grey;
margin-right: 1em;
}
a.flag-toggle {
color: white;
padding: 0 10px;
cursor: pointer;
&:hover {
color: white;
//border: 1px solid rgba(255,255,255,0.2);
text-decoration: underline;
border-radius: 20px;
}
}

View File

@ -9,6 +9,7 @@
<teleport to="#header-accompanying_course-name .grid-4">
<toggle-flags
v-bind:intensity="accompanyingCourse.intensity"
v-bind:emergency="accompanyingCourse.emergency"
v-bind:confidential="accompanyingCourse.confidential">
</toggle-flags>

View File

@ -24,7 +24,11 @@
ckeditor="ckeditor"
v-model="content">
</textarea>
<button type="submit" class="sc-button bt-save">{{ $t('action.save') }}</button>
<ul class="record_actions">
<li>
<button type="submit" class="sc-button bt-save">{{ $t('action.save') }}</button>
</li>
</ul>
</form>
</div>

View File

@ -4,27 +4,33 @@
{{ $t('confirm.title') }}
<span v-if="accompanyingCourse.step !== 'DRAFT'"
class="badge badge-pill badge-primary">
{{ $t('course.step.active') }}</span>
{{ $t('course.step.active') }}
</span>
<span v-else class="badge badge-pill badge-secondary">
{{ $t('course.step.draft') }}</span>
{{ $t('course.step.draft') }}
</span>
</h3>
<p v-if="accompanyingCourse.step === 'DRAFT'">
{{ $t('confirm.text_draft') }}
</p>
<dl>
<dl v-if="accompanyingCourse.closingDate">
<dt>{{ $t('course.closing_date') }}</dt>
<dd v-if="accompanyingCourse.closingDate">{{ $d(accompanyingCourse.closingDate.datetime, 'short') }}</dd>
<dd>{{ $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>
<ul class="record_actions">
<li>
<button class="sc-button bt-save"
@click="confirmCourse">
{{ $t('confirm.ok') }}
</button>
</li>
</ul>
</div>
</template>

View File

@ -1,5 +1,12 @@
<template>
<p style="text-align: right;">
<a @click="toggleIntensity" class="flag-toggle">
{{ $t('course.occasional') }}
<i class="fa" :class="{ 'fa-toggle-on': isRegular, 'fa-toggle-off': !isRegular }"></i>
{{ $t('course.regular') }}
</a>
<button class="badge badge-pill"
:class="{ 'badge-primary': isEmergency, 'badge-secondary': !isEmergency }"
@click="toggleEmergency">
@ -17,8 +24,11 @@
<script>
export default {
name: "ToggleFlags",
props: ['emergency', 'confidential'],
props: ['emergency', 'confidential', 'intensity'],
computed: {
isRegular() {
return (this.intensity === 'regular')? true : false;
},
isEmergency() {
return (this.emergency) ? true : false;
},
@ -27,6 +37,21 @@ export default {
}
},
methods: {
toggleIntensity() {
let value;
switch (this.intensity) {
case "occasional":
value = "regular";
break;
case "regular":
value = "occasional";
break;
default:
//temporaire (modif backend)
value = "occasional";
}
this.$store.dispatch('toggleIntensity', value);
},
toggleEmergency() {
this.$store.dispatch('toggleEmergency', (!this.isEmergency));
},

View File

@ -21,6 +21,8 @@ const appMessages = {
by: "par ",
emergency: "urgent",
confidential: "confidentiel",
regular: "régulier",
occasional: "ponctuel"
},
persons_associated: {
title: "Usagers concernés",

View File

@ -62,6 +62,9 @@ let initPromise = getAccompanyingCourse(id)
//console.log('### mutation: addResource', resource);
state.accompanyingCourse.resources.push(resource);
},
toggleIntensity(state, value) {
state.accompanyingCourse.intensity = value;
},
toggleEmergency(state, value) {
//console.log('### mutation: toggleEmergency');
state.accompanyingCourse.emergency = value;
@ -136,6 +139,14 @@ let initPromise = getAccompanyingCourse(id)
resolve();
})).catch((error) => { commit('catchError', error) });
},
toggleIntensity({ commit }, payload) {
console.log(payload);
patchAccompanyingCourse(id, { type: "accompanying_period", intensity: payload })
.then(course => new Promise((resolve, reject) => {
commit('toggleIntensity', course.intensity);
resolve();
})).catch((error) => { commit('catchError', error) });
},
toggleEmergency({ commit }, payload) {
patchAccompanyingCourse(id, { type: "accompanying_period", emergency: payload })
.then(course => new Promise((resolve, reject) => {