Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-13 22:04:23 +00:00
Code Issues Actions Projects Releases Wiki Activity

vue_household_members_editor: suggestions in bootstrap accordion style

Browse Source
This commit is contained in:
Mathieu Jaumotte 2021-09-13 14:03:07 +02:00
parent 337a6eb974
commit dc2f094ca2
2 changed files with 56 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -82,42 +82,54 @@
</li> </li>
</ul> </ul>
<ul class="record_actions"> <div v-if="hasHouseholdSuggestion" class="my-5">
<li v-if="!showHouseholdSuggestion" class="cancel"> <h4 class="mb-3">
<button class="btn btn-misc" @click="toggleHouseholdSuggestion"> {{ $t('household_members_editor.household_for_participants_accompanying_period') }} :
<i class="fa fa-fw fa-caret-right"></i> </h4>
{{ $tc('household_members_editor.show_household_suggestion', countHouseholdSuggestion) }}
</button>
</li>
<li v-if="showHouseholdSuggestion && hasHouseholdSuggestion" class="cancel">
<button class="btn btn-misc" @click="toggleHouseholdSuggestion">
<i class="fa fa-fw fa-caret-down"></i>
{{ $t('household_members_editor.hide_household_suggestion') }}
</button>
</li>
</ul>
<div class="householdSuggestions"> <div class="accordion" id="householdSuggestions">
<div v-if="showHouseholdSuggestion && hasHouseholdSuggestion"> <div class="accordion-item">
<h2 class="accordion-header" id="heading_suggestions">
<h3>{{ $t('household_members_editor.suggestions') }}</h3> <button v-if="!showHouseholdSuggestion"
<p>{{ $t('household_members_editor.household_for_participants_accompanying_period') }}:</p> class="accordion-button collapsed"
type="button"
<div class="flex-table householdSuggestionList"> data-bs-toggle="collapse"
<div v-for="h in filterHouseholdSuggestionByAccompanyingPeriod" class="item-bloc"> aria-expanded="false"
<household-render-box :household="h"></household-render-box> @click="toggleHouseholdSuggestion">
<ul class="record_actions"> {{ $tc('household_members_editor.show_household_suggestion', countHouseholdSuggestion) }}
<li> </button>
<button class="btn btn-sm btn-choose" @click="selectHousehold(h)"> <button v-if="showHouseholdSuggestion && hasHouseholdSuggestion"
{{ $t('household_members_editor.select_household') }} class="accordion-button"
</button> type="button"
</li> data-bs-toggle="collapse"
</ul> aria-expanded="true"
</div> @click="toggleHouseholdSuggestion">
{{ $t('household_members_editor.hide_household_suggestion') }}
</button>
<!-- disabled bootstrap behaviour: data-bs-target="#collapse_suggestions" aria-controls="collapse_suggestions" -->
</h2>
<div class="accordion-collapse"
aria-labelledby="heading_suggestions"
data-bs-parent="#householdSuggestions"
id="collapse_suggestions">
<div v-if="showHouseholdSuggestion && hasHouseholdSuggestion">
<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>
</div>
</div>
</div>
</template> </template>
<script> <script>
@ -245,12 +257,15 @@ export default {
div#household_members_editor div, div#household_members_editor div,
div.householdSuggestionList { div.householdSuggestionList {
&.flex-table div.item-bloc div.item-row div.item-col { &.flex-table {
&:first-child { margin: 0;
width: 25%; div.item-bloc div.item-row div.item-col {
} &:first-child {
&:last-child { width: 25%;
display: initial; }
&:last-child {
display: initial;
}
} }
} }
} }

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

@ -36,7 +36,7 @@ const appMessages = {
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',
household_for_participants_accompanying_period: "Ces ménages partagent le même parcours", household_for_participants_accompanying_period: "Des ménages partagent le même parcours",
select_household: "Sélectionner", select_household: "Sélectionner",
dates_title: "Période de validité", dates_title: "Période de validité",
dates: { dates: {