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

WIP test filtering elements on household [household editor]

Browse Source
This commit is contained in:
Julien Fastré 2021-10-04 15:02:07 +02:00
parent a4af30e542
commit 61488e9876
1 changed files with 50 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2,14 +2,15 @@
<h2 class="mt-4">{{ $t('household_members_editor.household_part') }}</h2>
<div v-if="mode == null">
<div>
<div class="alert alert-info">{{ $t('household_members_editor.household.no_household_choose_one') }}</div>
<div class="flex-table householdSuggestionList">
<div v-if="isModeNewAllowed" class="item-bloc">
<!-- mode new is allowed and no mode is checked -->
<div v-if="isModeNewAllowed && !isHouseholdNew" class="item-bloc">
<div>
<section>
<section :class="{filtered: isHouseholdNewDesactivated}">
<div class="item-row">
<div class="item-col">
<div class="h4">
@ -18,7 +19,7 @@
</div>
</div>
</section>
<ul class="record_actions">
<ul :class="{filteredButActive: isHouseholdNewDesactivated}" class="record_actions">
<li>
<button @click="setModeNew" class="btn btn-sm btn-create">{{ $t('household_members_editor.household.create_household') }}</button>
</li>
@ -26,10 +27,35 @@
</div>
</div>
<!-- mode new is allowed and checked -->
<div>
<div v-if="isModeNewAllowed && isHouseholdNew" class="item-bloc" >
<div>
<household-render-box :household="household" :isAddressMultiline="true"></household-render-box>
<ul class="record_actions" v-if="isHouseholdNew">
<li>
<add-address
:context="getAddressContext"
:key="addAddress.key"
:options="addAddress.options"
:addressChangedCallback="addressChanged"
></add-address>
</li>
<li v-if="hasHouseholdAddress">
<button class="btn btn-remove"
@click="removeHouseholdAddress">
{{ $t('household_members_editor.household.remove_address') }}
</button>
</li>
</ul>
</div>
</div>
</div>
<!-- if allow leave household -->
<div v-if="isModeLeaveAllowed" class="item-bloc">
<div>
<section>
<section :class="{filtered: isHouseholdNewDesactivated}">
<div class="item-row">
<div class="item-col">
<div class="h4">
@ -45,7 +71,7 @@
{{ $t('household_members_editor.household.will_leave_any_household_explanation')}}
</div>
</section>
<ul class="record_actions">
<ul class="record_actions" :class="{filteredButActive: isHouseholdNewDesactivated}">
<li>
<button @click="setModeLeave" class="btn btn-sm">
<i class="fa fa-sign-out"></i>
@ -71,57 +97,6 @@
</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 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>
<ul class="record_actions" v-if="isHouseholdNew">
<li>
<add-address
:context="getAddressContext"
:key="addAddress.key"
:options="addAddress.options"
:addressChangedCallback="addressChanged"
></add-address>
</li>
<li v-if="hasHouseholdAddress">
<button class="btn btn-remove"
@click="removeHouseholdAddress">
{{ $t('household_members_editor.household.remove_address') }}
</button>
</li>
</ul>
</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>
@ -190,6 +165,12 @@ export default {
return false;
return this.$store.state.allowHouseholdSearch && !this.$store.getters.hasHousehold;
},
isHouseholdNewDesactivated() {
return this.$store.state.mode !== null && !this.$store.getters.isHouseholdNew;
},
isHouseholdLeaveDesactivated() {
return this.$store.state.mode !== null && this.$store.state.mode !== "leave";
}
},
methods: {
setModeNew() {
@ -218,6 +199,18 @@ export default {
<style lang="scss">
.filtered {
filter: grayscale(1) opacity(0.6);
}
.filteredButActive {
filter: grayscale(1) opacity(0.6);
&:hover {
filter: unset;
}
}
div#household_members_editor div,
div.householdSuggestionList {
&.flex-table {