|
|
@@ -7,11 +7,15 @@ import { CommonStore } from '@/stores/common'
|
|
|
|
|
|
import CartoucheLayout from '@components/layout/CartoucheLayout.vue';
|
|
|
|
|
|
+import vSelect from 'vue-select';
|
|
|
+import 'vue-select/dist/vue-select.css';
|
|
|
+
|
|
|
export default {
|
|
|
props: ['id'],
|
|
|
data(){
|
|
|
return {
|
|
|
-
|
|
|
+ doleance: null,
|
|
|
+ doleance_selected: null
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -25,21 +29,58 @@ export default {
|
|
|
'p_mise_en_oeuvre_decision',
|
|
|
'p_reception_application_decision'
|
|
|
]),
|
|
|
- ...mapState(CommonStore,['hover_elmt'])
|
|
|
-
|
|
|
+ ...mapState(CommonStore,['hover_elmt']),
|
|
|
+ doleances_select_options () {
|
|
|
+ let os = [];
|
|
|
+ this.opened_concernement.doleances.forEach((doleance, index) => {
|
|
|
+ let o = {
|
|
|
+ label: doleance.leprobleme,
|
|
|
+ id: doleance.id
|
|
|
+ }
|
|
|
+ if (doleance.id === this.opened_concernement.opened_doleance.id) {
|
|
|
+ this.doleance_selected = o;
|
|
|
+ }
|
|
|
+ os.push(o);
|
|
|
+ })
|
|
|
+ return os;
|
|
|
+ },
|
|
|
+ // doleances_select_value () {
|
|
|
+ // let value;
|
|
|
+ // this.opened_concernement.doleances.forEach((doleance, index) => {
|
|
|
+ // if (doleance.id === this.opened_concernement.opened_doleance.id) {
|
|
|
+ // value = {
|
|
|
+ // label: doleance.leprobleme,
|
|
|
+ // id: doleance.id
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // return value;
|
|
|
+ // }
|
|
|
},
|
|
|
created () {
|
|
|
console.log(`Doleancer content created, id: ${this.id}, opened_concernement:`,this.opened_concernement);
|
|
|
+ this.opened_concernement.doleances.forEach((doleance, index) => {
|
|
|
+ if (doleance.id === this.opened_concernement.opened_doleance.id) {
|
|
|
+ this.doleance = doleance;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
methods: {
|
|
|
...mapActions(ConcernementsStore,['setOpenedDoleance']),
|
|
|
- openDoleance(did){
|
|
|
- console.log('openDoleance', did);
|
|
|
- this.setOpenedDoleance(parseInt(this.id), did)
|
|
|
+ onDoleanceSelected(option){
|
|
|
+ console.log('openDoleance', option);
|
|
|
+ this.setOpenedDoleance(parseInt(this.id), option.id)
|
|
|
+
|
|
|
+ this.opened_concernement.doleances.forEach((doleance, index) => {
|
|
|
+ if (option.id === this.opened_concernement.opened_doleance.id) {
|
|
|
+ this.doleance = doleance;
|
|
|
+ }
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
- CartoucheLayout
|
|
|
+ CartoucheLayout,
|
|
|
+ vSelect
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -56,108 +97,179 @@ export default {
|
|
|
<template v-slot:main>
|
|
|
<section
|
|
|
class="content-doleances">
|
|
|
- <section
|
|
|
- v-for="doleance in opened_concernement.doleances"
|
|
|
- class="doleance">
|
|
|
- <header
|
|
|
- @click="openDoleance(doleance.id)">
|
|
|
- <label for="leprobleme">{{ ct_cercle_politique.field_le_probleme.label }}</label>
|
|
|
- <h3 name="leprobleme">{{ doleance.leprobleme }}</h3>
|
|
|
- </header>
|
|
|
- <main>
|
|
|
- <section class="lenquete">
|
|
|
- <label for="lenquete">{{ ct_cercle_politique.field_enquete_terraindevie.label }}</label>
|
|
|
- <h4 name="lenquete">{{ doleance.lenquete }}</h4>
|
|
|
- </section>
|
|
|
-
|
|
|
- <section class="groupesinterets">
|
|
|
- <h5>{{ ct_cercle_politique.field_groupes.label }}</h5>
|
|
|
- <ul>
|
|
|
- <li
|
|
|
- v-for="groupe in doleance.groupesinterets">
|
|
|
-
|
|
|
- <label for="groupe">{{ p_groupes_interets.field_groupe_interets.label }}</label>
|
|
|
- <p name="groupe" v-html="groupe.groupe_interets" />
|
|
|
- <label for="accorder">{{ p_groupes_interets.field_accorder_interets.label }}</label>
|
|
|
- <p name="accorder" v-html="groupe.accorder_interets" />
|
|
|
- <label for="formuler">{{ p_groupes_interets.field_formuler.label }}</label>
|
|
|
- <p name="formuler" v-html="groupe.formuler" />
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </section>
|
|
|
-
|
|
|
- <section class="adresse">
|
|
|
- <label for="entite_addresse_doleance">{{ ct_cercle_politique.field_entite_adresse_doleance.label }}</label>
|
|
|
- <p name="entite_addresse_doleance" v-html="doleance.entite_addresse_doleance" />
|
|
|
- <label for="comment_ennonce_doleance">{{ ct_cercle_politique.field_comment_enonce_doleance.label }}</label>
|
|
|
- <p name="comment_ennonce_doleance" v-html="doleance.comment_ennonce_doleance" />
|
|
|
- <label for="aqui_addresse_doleance">{{ ct_cercle_politique.field_a_qui_adresse_doleance.label }}</label>
|
|
|
- <p name="aqui_addresse_doleance" v-html="doleance.aqui_addresse_doleance" />
|
|
|
- <h5>{{ ct_cercle_politique.field_receptions_et_traitements.label }}</h5>
|
|
|
- <ul class="reception_traitement">
|
|
|
- <li
|
|
|
- v-for="rec in doleance.reception_traitement">
|
|
|
- <label for="entite_adressee">{{ p_reception_et_traitement.field_entite_adressee.label }}</label>
|
|
|
- <p name="entite_adressee" v-html="rec.entite_adressee" />
|
|
|
- <label for="doleance_formulee">{{ p_reception_et_traitement.field_doleance_formulee.label }}</label>
|
|
|
- <p name="doleance_formulee" v-html="rec.doleance_formulee" />
|
|
|
- <label for="traite_doleance">{{ p_reception_et_traitement.field_traite_doleance.label }}</label>
|
|
|
- <p name="traite_doleance" v-html="rec.traite_doleance" />
|
|
|
- <label for="entite_recoit_doleance">{{ p_reception_et_traitement.field_entite_recoit_doleance.label }}</label>
|
|
|
- <p name="entite_recoit_doleance" v-html="rec.entite_recoit_doleance" />
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </section>
|
|
|
-
|
|
|
- <section class="miseenoeuvre">
|
|
|
- <label for="entites_decisionnaires">{{ ct_cercle_politique.field_entites_decisionnaires.label }}</label>
|
|
|
- <p name="entites_decisionnaires" v-html="doleance.entites_decisionnaires" />
|
|
|
- <label for="decision_formule">{{ ct_cercle_politique.field_decision_formulee.label }}</label>
|
|
|
- <p name="decision_formule" v-html="doleance.decision_formule" />
|
|
|
- <h5>{{ ct_cercle_politique.field_mise_en_oeuvre_decision.label }}</h5>
|
|
|
- <ul class="mise_en_oeuvre_decision">
|
|
|
- <li
|
|
|
- v-for="dec in doleance.mise_en_oeuvre_decision">
|
|
|
- <label for="entite_adresse_decision">{{ p_mise_en_oeuvre_decision.field_entite_adresse_decision.label }}</label>
|
|
|
- <p name="entite_adresse_decision" v-html="dec.entite_adresse_decision" />
|
|
|
- <label for="formule_decision">{{ p_mise_en_oeuvre_decision.field_formule_decision.label }}</label>
|
|
|
- <p name="formule_decision" v-html="dec.formule_decision" />
|
|
|
- <label for="entite_metenoeuvre_decisio">{{ p_mise_en_oeuvre_decision.field_entite_metenoeuvre_decisio.label }}</label>
|
|
|
- <p name="entite_metenoeuvre_decisio" v-html="dec.entite_metenoeuvre_decisio" />
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </section>
|
|
|
-
|
|
|
- <section class="receptions_et_applications">
|
|
|
- <label for="entite_adresse_application">{{ ct_cercle_politique.field_entite_adresse_application.label }}</label>
|
|
|
- <p name="entite_adresse_application" v-html="doleance.entite_adresse_application" />
|
|
|
- <label for="aqui_adresse_decision">{{ ct_cercle_politique.field_aqui_adresse_decision.label }}</label>
|
|
|
- <p name="aqui_adresse_decision" v-html="doleance.aqui_adresse_decision" />
|
|
|
- <label for="comment_formule_decision">{{ ct_cercle_politique.field_comment_formule_decision.label }}</label>
|
|
|
- <p name="comment_formule_decision" v-html="doleance.comment_formule_decision" />
|
|
|
- <h5>{{ ct_cercle_politique.field_receptions_et_applications.label }}</h5>
|
|
|
- <ul class="receptions_et_applications">
|
|
|
- <li
|
|
|
- v-for="app in doleance.receptions_et_applications">
|
|
|
- <label for="applique_decision">{{ p_reception_application_decision.field_applique_decision.label }}</label>
|
|
|
- <p name="applique_decision" v-html="app.applique_decision" />
|
|
|
- <label for="formule_decision_applic">{{ p_reception_application_decision.field_formule_decision_applic.label }}</label>
|
|
|
- <p name="formule_decision_applic" v-html="app.formule_decision_applic" />
|
|
|
- <label for="entite_recoit_decision">{{ p_reception_application_decision.field_entite_recoit_decision.label }}</label>
|
|
|
- <p name="entite_recoit_decision" v-html="app.entite_recoit_decision" />
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
-
|
|
|
- <label for="probleme_initial_resolu">{{ ct_cercle_politique.field_probleme_initial_resolu.label }}</label>
|
|
|
- <p name="probleme_initial_resolu" v-html="doleance.probleme_initial_resolu" />
|
|
|
- <label for="oui_nouvelle_situation">{{ ct_cercle_politique.field_oui_nouvelle_situation.label }}</label>
|
|
|
- <p name="oui_nouvelle_situation" v-html="doleance.oui_nouvelle_situation" />
|
|
|
- <label for="non_adresse_doleance">{{ ct_cercle_politique.field_non_adresse_doleance.label }}</label>
|
|
|
- <p name="non_adresse_doleance" v-html="doleance.non_adresse_doleance" />
|
|
|
-
|
|
|
- </section>
|
|
|
- </main>
|
|
|
- </section>
|
|
|
+
|
|
|
+ <label for="leprobleme">{{ ct_cercle_politique.field_le_probleme.label }}</label>
|
|
|
+ <v-select
|
|
|
+ :options="doleances_select_options"
|
|
|
+ item-value="id"
|
|
|
+ v-model="doleance_selected"
|
|
|
+ :clearable="false"
|
|
|
+ :searchable="false"
|
|
|
+ @option:selected="onDoleanceSelected"
|
|
|
+ >
|
|
|
+ </v-select>
|
|
|
+
|
|
|
+ <main v-if="opened_concernement.opened_doleance.id === doleance.id && opened_concernement.opened_doleance.field">
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'lenquete'"
|
|
|
+ class="lenquete">
|
|
|
+ <h5>Enquête menée sur le terrain de vie</h5>
|
|
|
+ <label for="lenquete">{{ ct_cercle_politique.field_enquete_terraindevie.label }}</label>
|
|
|
+ <h4 name="lenquete">{{ doleance.lenquete }}</h4>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'groupesinterets'"
|
|
|
+ class="groupesinterets">
|
|
|
+ <h5>Construction de groupes d'intérets avec qui composer la doléance</h5>
|
|
|
+ <section>
|
|
|
+ <label for="groupe">{{ p_groupes_interets.field_groupe_interets.label }}</label>
|
|
|
+ <p
|
|
|
+ name="groupe"
|
|
|
+ v-html="doleance.groupesinterets[opened_concernement.opened_doleance.field_index].groupe_interets" />
|
|
|
+
|
|
|
+ <label for="accorder">{{ p_groupes_interets.field_accorder_interets.label }}</label>
|
|
|
+ <p
|
|
|
+ name="accorder"
|
|
|
+ v-html="doleance.groupesinterets[opened_concernement.opened_doleance.field_index].accorder_interets" />
|
|
|
+
|
|
|
+ <label for="formuler">{{ p_groupes_interets.field_formuler.label }}</label>
|
|
|
+ <p
|
|
|
+ name="formuler"
|
|
|
+ v-html="doleance.groupesinterets[opened_concernement.opened_doleance.field_index].formuler" />
|
|
|
+ </section>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'adresse_de_la_doleance'"
|
|
|
+ class="adresse">
|
|
|
+
|
|
|
+ <h5>Adresse de la doléance</h5>
|
|
|
+
|
|
|
+ <label for="entite_addresse_doleance">{{ ct_cercle_politique.field_entite_adresse_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_addresse_doleance"
|
|
|
+ v-html="doleance.entite_addresse_doleance" />
|
|
|
+
|
|
|
+ <label for="comment_ennonce_doleance">{{ ct_cercle_politique.field_comment_enonce_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="comment_ennonce_doleance"
|
|
|
+ v-html="doleance.comment_ennonce_doleance" />
|
|
|
+
|
|
|
+ <label for="aqui_addresse_doleance">{{ ct_cercle_politique.field_a_qui_adresse_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="aqui_addresse_doleance"
|
|
|
+ v-html="doleance.aqui_addresse_doleance" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'reception_traitement'"
|
|
|
+ class="reception_traitement">
|
|
|
+ <h5>Reception et traitement de la doléance</h5>
|
|
|
+ <label for="entite_adressee">{{ p_reception_et_traitement.field_entite_adressee.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_adressee"
|
|
|
+ v-html="doleance.reception_traitement[opened_concernement.opened_doleance.field_index].entite_adressee" />
|
|
|
+ <label for="doleance_formulee">{{ p_reception_et_traitement.field_doleance_formulee.label }}</label>
|
|
|
+ <p
|
|
|
+ name="doleance_formulee"
|
|
|
+ v-html="doleance.reception_traitement[opened_concernement.opened_doleance.field_index].doleance_formulee" />
|
|
|
+ <label for="traite_doleance">{{ p_reception_et_traitement.field_traite_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="traite_doleance"
|
|
|
+ v-html="doleance.reception_traitement[opened_concernement.opened_doleance.field_index].traite_doleance" />
|
|
|
+ <label for="entite_recoit_doleance">{{ p_reception_et_traitement.field_entite_recoit_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_recoit_doleance"
|
|
|
+ v-html="doleance.reception_traitement[opened_concernement.opened_doleance.field_index].entite_recoit_doleance" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'decision'"
|
|
|
+ class="decision">
|
|
|
+ <h5>Décision</h5>
|
|
|
+ <label for="entites_decisionnaires">{{ ct_cercle_politique.field_entites_decisionnaires.label }}</label>
|
|
|
+ <p name="entites_decisionnaires" v-html="doleance.entites_decisionnaires" />
|
|
|
+ <label for="decision_formule">{{ ct_cercle_politique.field_decision_formulee.label }}</label>
|
|
|
+ <p name="decision_formule" v-html="doleance.decision_formule" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'mise_en_oeuvre_decision'"
|
|
|
+ class="mise_en_oeuvre_decision">
|
|
|
+ <h5>{{ ct_cercle_politique.field_mise_en_oeuvre_decision.label }}</h5>
|
|
|
+ <label for="entite_adresse_decision">{{ p_mise_en_oeuvre_decision.field_entite_adresse_decision.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_adresse_decision"
|
|
|
+ v-html="doleance.mise_en_oeuvre_decision[opened_concernement.opened_doleance.field_index].entite_adresse_decision" />
|
|
|
+ <label for="formule_decision">{{ p_mise_en_oeuvre_decision.field_formule_decision.label }}</label>
|
|
|
+ <p
|
|
|
+ name="formule_decision"
|
|
|
+ v-html="doleance.mise_en_oeuvre_decision[opened_concernement.opened_doleance.field_index].formule_decision" />
|
|
|
+ <label for="entite_metenoeuvre_decisio">{{ p_mise_en_oeuvre_decision.field_entite_metenoeuvre_decisio.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_metenoeuvre_decisio"
|
|
|
+ v-html="doleance.mise_en_oeuvre_decision[opened_concernement.opened_doleance.field_index].entite_metenoeuvre_decisio" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'adresse_de_la_decision'"
|
|
|
+ class="adresse_de_la_decision">
|
|
|
+ <h5>Adresse de la decision à appliquer</h5>
|
|
|
+
|
|
|
+ <label for="entite_adresse_application">{{ ct_cercle_politique.field_entite_adresse_application.label }}</label>
|
|
|
+ <p name="entite_adresse_application" v-html="doleance.entite_adresse_application" />
|
|
|
+ <label for="aqui_adresse_decision">{{ ct_cercle_politique.field_aqui_adresse_decision.label }}</label>
|
|
|
+ <p name="aqui_adresse_decision" v-html="doleance.aqui_adresse_decision" />
|
|
|
+ <label for="comment_formule_decision">{{ ct_cercle_politique.field_comment_formule_decision.label }}</label>
|
|
|
+ <p name="comment_formule_decision" v-html="doleance.comment_formule_decision" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'receptions_et_applications'"
|
|
|
+ class="receptions_et_applications">
|
|
|
+
|
|
|
+ <h5>{{ ct_cercle_politique.field_receptions_et_applications.label }}</h5>
|
|
|
+
|
|
|
+ <label for="applique_decision">{{ p_reception_application_decision.field_applique_decision.label }}</label>
|
|
|
+ <p
|
|
|
+ name="applique_decision"
|
|
|
+ v-html="doleance.receptions_et_applications[opened_concernement.opened_doleance.field_index].applique_decision" />
|
|
|
+
|
|
|
+ <label for="formule_decision_applic">{{ p_reception_application_decision.field_formule_decision_applic.label }}</label>
|
|
|
+ <p
|
|
|
+ name="formule_decision_applic"
|
|
|
+ v-html="doleance.receptions_et_applications[opened_concernement.opened_doleance.field_index].formule_decision_applic" />
|
|
|
+
|
|
|
+ <label for="entite_recoit_decision">{{ p_reception_application_decision.field_entite_recoit_decision.label }}</label>
|
|
|
+ <p
|
|
|
+ name="entite_recoit_decision"
|
|
|
+ v-html="doleance.receptions_et_applications[opened_concernement.opened_doleance.field_index].entite_recoit_decision" />
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section
|
|
|
+ v-if="opened_concernement.opened_doleance.field === 'probleme_initial_resolu'"
|
|
|
+ class="probleme_initial_resolu">
|
|
|
+
|
|
|
+ <h5>Réussite / échec / reprise du cercle politique</h5>
|
|
|
+
|
|
|
+ <label for="probleme_initial_resolu">{{ ct_cercle_politique.field_probleme_initial_resolu.label }}</label>
|
|
|
+ <p
|
|
|
+ name="probleme_initial_resolu"
|
|
|
+ v-html="doleance.probleme_initial_resolu" />
|
|
|
+
|
|
|
+ <label for="oui_nouvelle_situation">{{ ct_cercle_politique.field_oui_nouvelle_situation.label }}</label>
|
|
|
+ <p
|
|
|
+ name="oui_nouvelle_situation"
|
|
|
+ v-html="doleance.oui_nouvelle_situation" />
|
|
|
+
|
|
|
+ <label for="non_adresse_doleance">{{ ct_cercle_politique.field_non_adresse_doleance.label }}</label>
|
|
|
+ <p
|
|
|
+ name="non_adresse_doleance"
|
|
|
+ v-html="doleance.non_adresse_doleance" />
|
|
|
+ </section>
|
|
|
+ </main>
|
|
|
</section>
|
|
|
</template>
|
|
|
|
