mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-09-27 09:05:01 +00:00
rewrite the destination for household / leave household
This commit is contained in:
@@ -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');
|
||||
|
||||
Reference in New Issue
Block a user