mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
rewrite the destination for household / leave household
This commit is contained in:
parent
e2230409b8
commit
704ec76ca4
@ -2,171 +2,110 @@
|
||||
|
||||
<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="item-bloc">
|
||||
<household-render-box :household="household" :isAddressMultiline="true"></household-render-box>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alert alert-info">{{ $t('household_members_editor.household.no_household_choose_one') }}</div>
|
||||
|
||||
<div v-if="isHouseholdNew && !hasHouseholdAddress">
|
||||
|
||||
<div v-if="hasAddressSuggestion" class="householdAddressSuggestion my-5">
|
||||
<h4 class="mb-3">
|
||||
{{ $t('household_members_editor.household.where_live_the_household') }}
|
||||
</h4>
|
||||
<div class="accordion" id="addressSuggestions">
|
||||
<div class="accordion-item">
|
||||
<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 class="flex-table householdSuggestionList">
|
||||
<div v-if="isModeNewAllowed" class="item-bloc">
|
||||
<div>
|
||||
<section>
|
||||
<div class="item-row">
|
||||
<div class="item-col">
|
||||
<div class="h4">
|
||||
<i class="fa fa-home"></i> {{ $t('household_members_editor.household.new_household') }}
|
||||
</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>
|
||||
|
||||
<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 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 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">
|
||||
<li v-if="allowHouseholdCreate">
|
||||
<button class="btn btn-create" @click="createHousehold">
|
||||
{{ $t('household_members_editor.household.create_household') }}
|
||||
</button>
|
||||
</li>
|
||||
<li v-if="allowHouseholdSearch">
|
||||
<button class="btn btn-misc">
|
||||
<i class="fa fa-search"></i>{{ $t('household_members_editor.household.search_household') }}
|
||||
</button>
|
||||
</li>
|
||||
<li v-if="allowLeaveWithoutHousehold" >
|
||||
<button @click="forceLeaveWithoutHousehold" class="btn btn-orange">
|
||||
<i class="fa fa-sign-out"></i>{{ $t('household_members_editor.household.leave_without_household') }}
|
||||
</button>
|
||||
</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 v-else>
|
||||
<div class="flex-table">
|
||||
<div class="item-bloc">
|
||||
<template v-if="isModeLeave">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-row">
|
||||
{{ $t('household_members_editor.household.will_leave_any_household_explanation')}}
|
||||
</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>
|
||||
|
||||
<script>
|
||||
@ -214,6 +153,9 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'isModeNewAllowed',
|
||||
'isModeLeaveAllowed',
|
||||
'getSuggestions',
|
||||
'hasHousehold',
|
||||
'isHouseholdNew',
|
||||
'hasHouseholdSuggestion',
|
||||
@ -223,47 +165,31 @@ export default {
|
||||
'countAddressSuggestion',
|
||||
'filterAddressesSuggestion',
|
||||
'hasHouseholdAddress',
|
||||
'isModeLeave'
|
||||
]),
|
||||
...mapState([
|
||||
'showHouseholdSuggestion',
|
||||
'showAddressSuggestion'
|
||||
'showAddressSuggestion',
|
||||
'mode',
|
||||
]),
|
||||
household() {
|
||||
return this.$store.state.household;
|
||||
},
|
||||
allowHouseholdCreate() {
|
||||
return this.$store.state.allowHouseholdCreate && !this.$store.getters.hasHousehold;
|
||||
},
|
||||
allowHouseholdSearch() {
|
||||
return false;
|
||||
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: {
|
||||
createHousehold() {
|
||||
setModeNew() {
|
||||
this.$store.dispatch('createHousehold');
|
||||
},
|
||||
forceLeaveWithoutHousehold() {
|
||||
setModeLeave() {
|
||||
this.$store.dispatch('forceLeaveWithoutHousehold');
|
||||
},
|
||||
resetMode() {
|
||||
this.$store.commit('resetMode');
|
||||
},
|
||||
toggleHouseholdSuggestion() {
|
||||
this.$store.commit('toggleHouseholdSuggestion');
|
||||
},
|
||||
@ -272,7 +198,6 @@ export default {
|
||||
},
|
||||
selectHousehold(h) {
|
||||
this.$store.dispatch('selectHousehold', h);
|
||||
this.toggleHouseholdSuggestion();
|
||||
},
|
||||
removeHousehold() {
|
||||
this.$store.dispatch('removeHousehold');
|
||||
|
||||
@ -7,9 +7,11 @@ const appMessages = {
|
||||
household: {
|
||||
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",
|
||||
create_household: "Créer un nouveau ménage de destination",
|
||||
create_household: "Créer",
|
||||
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",
|
||||
where_live_the_household: "À quelle adresse habite ce ménage ?",
|
||||
household_live_to_this_address: "Sélectionner l'adresse",
|
||||
@ -17,6 +19,7 @@ const appMessages = {
|
||||
delete_this_address: "Supprimer cette adresse",
|
||||
create_new_address: "Créer une nouvelle adresse",
|
||||
or_create_new_address: "Ou créer une nouvelle adresse",
|
||||
reset_mode: "Modifier la destination",
|
||||
},
|
||||
concerned: {
|
||||
title: "Nouveaux membres du ménage",
|
||||
@ -34,7 +37,7 @@ const appMessages = {
|
||||
is_not_holder: "N'est pas titulaire",
|
||||
remove_position: "Retirer des {position}",
|
||||
remove_concerned: "Ne plus transférer",
|
||||
household_part: "Ménage de destination",
|
||||
household_part: "Destination",
|
||||
suggestions: "Suggestions",
|
||||
hide_household_suggestion: "Masquer les suggestions",
|
||||
show_household_suggestion: 'Aucune suggestion | Afficher une suggestion | Afficher {count} suggestions',
|
||||
|
||||
@ -29,6 +29,15 @@ const store = createStore({
|
||||
return 0;
|
||||
}),
|
||||
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,
|
||||
allowHouseholdSearch: window.household_members_editor_data.allowHouseholdSearch,
|
||||
allowLeaveWithoutHousehold: window.household_members_editor_data.allowLeaveWithoutHousehold,
|
||||
@ -41,11 +50,48 @@ const store = createStore({
|
||||
errors: []
|
||||
},
|
||||
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) {
|
||||
return state.mode === "new";
|
||||
/*
|
||||
if (state.household === null) {
|
||||
return false;
|
||||
}
|
||||
return !Number.isInteger(state.household.id);
|
||||
|
||||
*/
|
||||
},
|
||||
hasHouseholdAddress(state) {
|
||||
if (null === state.household) {
|
||||
@ -180,6 +226,11 @@ const store = createStore({
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
resetMode(state) {
|
||||
state.mode = null;
|
||||
state.household = null;
|
||||
state.forceLeaveWithoutHousehold = false;
|
||||
},
|
||||
addConcerned(state, person) {
|
||||
let persons = state.concerned.map(conc => conc.person.id);
|
||||
if (!persons.includes(person.id)) {
|
||||
@ -222,6 +273,7 @@ const store = createStore({
|
||||
current_address: null,
|
||||
current_members_id: []
|
||||
};
|
||||
state.mode = "new";
|
||||
state.forceLeaveWithoutHousehold = false;
|
||||
},
|
||||
removeHousehold(state) {
|
||||
@ -246,10 +298,12 @@ const store = createStore({
|
||||
},
|
||||
forceLeaveWithoutHousehold(state) {
|
||||
state.household = null;
|
||||
state.mode = "leave";
|
||||
state.forceLeaveWithoutHousehold = true;
|
||||
},
|
||||
selectHousehold(state, household) {
|
||||
state.household = household;
|
||||
state.mode = "existing";
|
||||
state.forceLeaveWithoutHousehold = false;
|
||||
},
|
||||
setHouseholdSuggestionByAccompanyingPeriod(state, households) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user