Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

rewrite the destination for household / leave household

Browse Source
This commit is contained in:
Julien Fastré 2021-09-28 21:35:41 +02:00
parent e2230409b8
commit 704ec76ca4
3 changed files with 165 additions and 183 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

285
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/components/Household.vue
View File

@ -2,171 +2,110 @@
<h2 class="mt-4">{{ $t('household_members_editor.household_part') }}</h2> <h2 class="mt-4">{{ $t('household_members_editor.household_part') }}</h2>
<div v-if="hasHousehold"> <div v-if="mode == null">
<div class="flex-table"> <div class="alert alert-info">{{ $t('household_members_editor.household.no_household_choose_one') }}</div>
<div class="item-bloc">
<household-render-box :household="household" :isAddressMultiline="true"></household-render-box>
</div>
</div>
<div v-if="isHouseholdNew && !hasHouseholdAddress"> <div class="flex-table householdSuggestionList">
<div v-if="isModeNewAllowed" class="item-bloc">
<div v-if="hasAddressSuggestion" class="householdAddressSuggestion my-5"> <div>
<h4 class="mb-3"> <section>
{{ $t('household_members_editor.household.where_live_the_household') }} <div class="item-row">
</h4> <div class="item-col">
<div class="accordion" id="addressSuggestions"> <div class="h4">
<div class="accordion-item"> <i class="fa fa-home"></i> {{ $t('household_members_editor.household.new_household') }}
<h2 class="accordion-header" id="heading_address_suggestions">
<button v-if="!showAddressSuggestion"
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
aria-expanded="false"
@click="toggleAddressSuggestion">
{{ $tc('household_members_editor.show_household_suggestion', countAddressSuggestion) }}
</button>
<button v-if="showAddressSuggestion"
class="accordion-button"
type="button"
data-bs-toggle="collapse"
aria-expanded="true"
@click="toggleAddressSuggestion">
{{ $t('household_members_editor.hide_household_suggestion') }}
</button>
</h2>
<div class="accordion-collapse" id="collapse_address_suggestions"
aria-labelledby="heading_address_suggestions" data-bs-parent="#addressSuggestions">
<div v-if="showAddressSuggestion">
<div class="flex-table householdAddressSuggestionList">
<div v-for="a in filterAddressesSuggestion" class="item-bloc">
<div class="float-button bottom">
<div class="box">
<div class="action">
<ul class="record_actions">
<li>
<button class="btn btn-sm btn-choose" @click="setHouseholdAddress(a)">
{{ $t('household_members_editor.household.household_live_to_this_address') }}
</button>
</li>
</ul>
</div>
<ul class="list-content fa-ul">
<li>
<i class="fa fa-li fa-map-marker"></i>
<address-render-box :address="a"></address-render-box>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div>
</section>
<ul class="record_actions">
<li>
<button @click="setModeNew" class="btn btn-sm btn-create">{{ $t('household_members_editor.household.create_household') }}</button>
</li>
</ul>
</div>
</div>
<!-- if allow leave household -->
<div v-if="isModeLeaveAllowed" class="item-bloc">
<div>
<section>
<div class="item-row">
<div class="item-col">
<div class="h4">
<span class="fa-stack fa-lg">
<i class="fa fa-home fa-stack-1x"></i>
<i class="fa fa-ban fa-stack-2x text-danger"></i>
</span>
{{ $t('household_members_editor.household.leave_without_household') }}
</div>
</div>
</div>
<div class="item-row">
{{ $t('household_members_editor.household.will_leave_any_household_explanation')}}
</div>
</section>
<ul class="record_actions">
<li>
<button @click="setModeLeave" class="btn btn-sm">
<i class="fa fa-sign-out"></i>
{{ $t('household_members_editor.household.leave') }}
</button>
</li>
</ul>
</div>
</div>
<div v-for="item in getSuggestions">
<div class="item-bloc">
<household-render-box :household="item.household"></household-render-box>
<ul class="record_actions">
<li>
<button class="btn btn-sm btn-choose" @click="selectHousehold(item.household)">
{{ $t('household_members_editor.select_household') }}
</button>
</li>
</ul>
</div> </div>
</div> </div>
<ul class="record_actions">
<li >
<add-address
:context="addAddress.context"
:key="addAddress.key"
:options="addAddress.options"
:result="addAddress.result"
@addressChangedCallback="setHouseholdCreatedAddress"
ref="addAddress">
</add-address>
</li>
</ul>
</div> </div>
<div v-if="isHouseholdNew && hasHouseholdAddress">
<ul class="record_actions">
<li >
<button class="btn btn-misc" @click="removeHouseholdAddress">
{{ $t('household_members_editor.household.delete_this_address') }}
</button>
</li>
</ul>
</div>
</div> </div>
<div v-else-if="isForceLeaveWithoutHousehold">
{{ $t('household_members_editor.household.will_leave_any_household') }}
</div>
<div v-else class="alert alert-info">{{ $t('household_members_editor.household.no_household_choose_one') }}</div>
<ul v-if="allowChangeHousehold" class="record_actions"> <div v-else>
<li v-if="allowHouseholdCreate"> <div class="flex-table">
<button class="btn btn-create" @click="createHousehold"> <div class="item-bloc">
{{ $t('household_members_editor.household.create_household') }} <template v-if="isModeLeave">
</button> <section>
</li> <div class="item-row">
<li v-if="allowHouseholdSearch"> <div class="item-col">
<button class="btn btn-misc"> <div class="h4">
<i class="fa fa-search"></i>{{ $t('household_members_editor.household.search_household') }} <span class="fa-stack fa-lg">
</button> <i class="fa fa-home fa-stack-1x"></i>
</li> <i class="fa fa-ban fa-stack-2x text-danger"></i>
<li v-if="allowLeaveWithoutHousehold" > </span>
<button @click="forceLeaveWithoutHousehold" class="btn btn-orange"> {{ $t('household_members_editor.household.leave_without_household') }}
<i class="fa fa-sign-out"></i>{{ $t('household_members_editor.household.leave_without_household') }} </div>
</button> </div>
</li>
<li v-if="allowRemoveHousehold">
<button @click="removeHousehold" class="btn">
{{ $t('household_members_editor.household.change') }}
</button>
</li>
</ul>
<div v-if="hasHouseholdSuggestion" class="householdSuggestions my-5">
<h4 class="mb-3">
{{ $t('household_members_editor.household_for_participants_accompanying_period') }} :
</h4>
<div class="accordion" id="householdSuggestions">
<div class="accordion-item">
<h2 class="accordion-header" id="heading_household_suggestions">
<button v-if="!showHouseholdSuggestion"
class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
aria-expanded="false"
@click="toggleHouseholdSuggestion">
{{ $tc('household_members_editor.show_household_suggestion', countHouseholdSuggestion) }}
</button>
<button v-if="showHouseholdSuggestion"
class="accordion-button"
type="button"
data-bs-toggle="collapse"
aria-expanded="true"
@click="toggleHouseholdSuggestion">
{{ $t('household_members_editor.hide_household_suggestion') }}
</button>
<!-- disabled bootstrap behaviour: data-bs-target="#collapse_household_suggestions" aria-controls="collapse_household_suggestions" -->
</h2>
<div class="accordion-collapse" id="collapse_household_suggestions"
aria-labelledby="heading_household_suggestions" data-bs-parent="#householdSuggestions">
<div v-if="showHouseholdSuggestion">
<div class="flex-table householdSuggestionList">
<div v-for="h in filterHouseholdSuggestionByAccompanyingPeriod" class="item-bloc">
<household-render-box :household="h"></household-render-box>
<ul class="record_actions">
<li>
<button class="btn btn-sm btn-choose" @click="selectHousehold(h)">
{{ $t('household_members_editor.select_household') }}
</button>
</li>
</ul>
</div>
</div>
</div>
</div> </div>
</div> <div class="item-row">
</div> {{ $t('household_members_editor.household.will_leave_any_household_explanation')}}
</div> </div>
</section>
</template>
<template v-else>
<household-render-box :household="household" :isAddressMultiline="true"></household-render-box>
</template>
</div>
<ul v-if="isModeNewAllowed || isModeLeaveAllowed || getModeSuggestions.length > 0" class="record_actions">
<li>
<button class="btn btn-sm btn-chill-beige" @click="resetMode">
{{ $t('household_members_editor.household.reset_mode') }}
</button>
</li>
</ul>
</div>
</div>
</template> </template>
<script> <script>
@ -214,6 +153,9 @@ export default {
}, },
computed: { computed: {
...mapGetters([ ...mapGetters([
'isModeNewAllowed',
'isModeLeaveAllowed',
'getSuggestions',
'hasHousehold', 'hasHousehold',
'isHouseholdNew', 'isHouseholdNew',
'hasHouseholdSuggestion', 'hasHouseholdSuggestion',
@ -223,47 +165,31 @@ export default {
'countAddressSuggestion', 'countAddressSuggestion',
'filterAddressesSuggestion', 'filterAddressesSuggestion',
'hasHouseholdAddress', 'hasHouseholdAddress',
'isModeLeave'
]), ]),
...mapState([ ...mapState([
'showHouseholdSuggestion', 'showHouseholdSuggestion',
'showAddressSuggestion' 'showAddressSuggestion',
'mode',
]), ]),
household() { household() {
return this.$store.state.household; return this.$store.state.household;
}, },
allowHouseholdCreate() {
return this.$store.state.allowHouseholdCreate && !this.$store.getters.hasHousehold;
},
allowHouseholdSearch() { allowHouseholdSearch() {
return false; return false;
return this.$store.state.allowHouseholdSearch && !this.$store.getters.hasHousehold; return this.$store.state.allowHouseholdSearch && !this.$store.getters.hasHousehold;
}, },
allowLeaveWithoutHousehold() {
return this.$store.state.allowLeaveWithoutHousehold && !this.$store.getters.hasHousehold;
},
allowRemoveHousehold() {
return this.$store.getters.hasHousehold &&
(
this.allowHouseholdCreate || this.allowHouseholdSearch ||
this.allowLeaveWithoutHousehold
)
;
},
allowChangeHousehold() {
return this.allowHouseholdCreate || this.allowHouseholdSearch ||
this.allowLeaveWithoutHousehold;
},
isForceLeaveWithoutHousehold() {
return this.$store.state.forceLeaveWithoutHousehold;
}
}, },
methods: { methods: {
createHousehold() { setModeNew() {
this.$store.dispatch('createHousehold'); this.$store.dispatch('createHousehold');
}, },
forceLeaveWithoutHousehold() { setModeLeave() {
this.$store.dispatch('forceLeaveWithoutHousehold'); this.$store.dispatch('forceLeaveWithoutHousehold');
}, },
resetMode() {
this.$store.commit('resetMode');
},
toggleHouseholdSuggestion() { toggleHouseholdSuggestion() {
this.$store.commit('toggleHouseholdSuggestion'); this.$store.commit('toggleHouseholdSuggestion');
}, },
@ -272,7 +198,6 @@ export default {
}, },
selectHousehold(h) { selectHousehold(h) {
this.$store.dispatch('selectHousehold', h); this.$store.dispatch('selectHousehold', h);
this.toggleHouseholdSuggestion();
}, },
removeHousehold() { removeHousehold() {
this.$store.dispatch('removeHousehold'); this.$store.dispatch('removeHousehold');

9
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/js/i18n.js
View File

@ -7,9 +7,11 @@ const appMessages = {
household: { household: {
no_household_choose_one: "Aucun ménage de destination. Choisissez un ménage. Les usagers concernés par la modification apparaitront ensuite.", no_household_choose_one: "Aucun ménage de destination. Choisissez un ménage. Les usagers concernés par la modification apparaitront ensuite.",
new_household: "Nouveau ménage", new_household: "Nouveau ménage",
create_household: "Créer un nouveau ménage de destination", create_household: "Créer",
search_household: "Chercher un ménage", search_household: "Chercher un ménage",
will_leave_any_household: "Ne rejoignent pas de ménage", will_leave_any_household: "Les usagers ne rejoignent pas de ménage",
leave: "Quitter",
will_leave_any_household_explanation: "Les usagers quitteront leur ménage actuel, et ne seront pas associés à un autre ménage. Par ailleurs, ils seront enregistrés comme étant sans adresse connue.",
leave_without_household: "Sans nouveau ménage", leave_without_household: "Sans nouveau ménage",
where_live_the_household: "À quelle adresse habite ce ménage ?", where_live_the_household: "À quelle adresse habite ce ménage ?",
household_live_to_this_address: "Sélectionner l'adresse", household_live_to_this_address: "Sélectionner l'adresse",
@ -17,6 +19,7 @@ const appMessages = {
delete_this_address: "Supprimer cette adresse", delete_this_address: "Supprimer cette adresse",
create_new_address: "Créer une nouvelle adresse", create_new_address: "Créer une nouvelle adresse",
or_create_new_address: "Ou créer une nouvelle adresse", or_create_new_address: "Ou créer une nouvelle adresse",
reset_mode: "Modifier la destination",
}, },
concerned: { concerned: {
title: "Nouveaux membres du ménage", title: "Nouveaux membres du ménage",
@ -34,7 +37,7 @@ const appMessages = {
is_not_holder: "N'est pas titulaire", is_not_holder: "N'est pas titulaire",
remove_position: "Retirer des {position}", remove_position: "Retirer des {position}",
remove_concerned: "Ne plus transférer", remove_concerned: "Ne plus transférer",
household_part: "Ménage de destination", household_part: "Destination",
suggestions: "Suggestions", suggestions: "Suggestions",
hide_household_suggestion: "Masquer les suggestions", hide_household_suggestion: "Masquer les suggestions",
show_household_suggestion: 'Aucune suggestion | Afficher une suggestion | Afficher {count} suggestions', show_household_suggestion: 'Aucune suggestion | Afficher une suggestion | Afficher {count} suggestions',

54
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdMembersEditor/store/index.js
View File

@ -29,6 +29,15 @@ const store = createStore({
return 0; return 0;
}), }),
startDate: new Date(), startDate: new Date(),
/**
* Indicates if the destination is:
*
* * "new" => a new household
* * "existing" => an existing household
* * "leave" => leave without household
* * null if not set
*/
mode: window.household_members_editor_data.household === null ? null : "existing",
allowHouseholdCreate: window.household_members_editor_data.allowHouseholdCreate, allowHouseholdCreate: window.household_members_editor_data.allowHouseholdCreate,
allowHouseholdSearch: window.household_members_editor_data.allowHouseholdSearch, allowHouseholdSearch: window.household_members_editor_data.allowHouseholdSearch,
allowLeaveWithoutHousehold: window.household_members_editor_data.allowLeaveWithoutHousehold, allowLeaveWithoutHousehold: window.household_members_editor_data.allowLeaveWithoutHousehold,
@ -41,11 +50,48 @@ const store = createStore({
errors: [] errors: []
}, },
getters: { getters: {
/**
* return true if this page allow to create a new household
*
* @returns {boolean}
*/
isModeNewAllowed(state) {
return state.allowHouseholdCreate;
},
/**
* return true if this page allow to "leave without household"
*
* @returns {boolean}
*/
isModeLeaveAllowed(state) {
return state.allowLeaveWithoutHousehold;
},
/**
* return true if the mode "leave" is selected
*
* @returns {boolean}
*/
isModeLeave(state) {
return state.mode === "leave";
},
getSuggestions(state) {
let suggestions = [];
state.householdSuggestionByAccompanyingPeriod.forEach(h => {
console.log(h);
suggestions.push({household: h});
});
return suggestions;
},
isHouseholdNew(state) { isHouseholdNew(state) {
return state.mode === "new";
/*
if (state.household === null) { if (state.household === null) {
return false; return false;
} }
return !Number.isInteger(state.household.id); return !Number.isInteger(state.household.id);
*/
}, },
hasHouseholdAddress(state) { hasHouseholdAddress(state) {
if (null === state.household) { if (null === state.household) {
@ -180,6 +226,11 @@ const store = createStore({
}, },
}, },
mutations: { mutations: {
resetMode(state) {
state.mode = null;
state.household = null;
state.forceLeaveWithoutHousehold = false;
},
addConcerned(state, person) { addConcerned(state, person) {
let persons = state.concerned.map(conc => conc.person.id); let persons = state.concerned.map(conc => conc.person.id);
if (!persons.includes(person.id)) { if (!persons.includes(person.id)) {
@ -222,6 +273,7 @@ const store = createStore({
current_address: null, current_address: null,
current_members_id: [] current_members_id: []
}; };
state.mode = "new";
state.forceLeaveWithoutHousehold = false; state.forceLeaveWithoutHousehold = false;
}, },
removeHousehold(state) { removeHousehold(state) {
@ -246,10 +298,12 @@ const store = createStore({
}, },
forceLeaveWithoutHousehold(state) { forceLeaveWithoutHousehold(state) {
state.household = null; state.household = null;
state.mode = "leave";
state.forceLeaveWithoutHousehold = true; state.forceLeaveWithoutHousehold = true;
}, },
selectHousehold(state, household) { selectHousehold(state, household) {
state.household = household; state.household = household;
state.mode = "existing";
state.forceLeaveWithoutHousehold = false; state.forceLeaveWithoutHousehold = false;
}, },
setHouseholdSuggestionByAccompanyingPeriod(state, households) { setHouseholdSuggestionByAccompanyingPeriod(state, households) {