[household member editor] integrate with adresses and course

* redirection to a returnPath given into query search
* button for creating address

src/Bundle/ChillPersonBundle/Resources/public/vuejs/<

@@ -1,374 +0,0 @@
-import { createStore } from 'vuex';
-import { householdMove, fetchHouseholdSuggestionByAccompanyingPeriod, fetchAddressSuggestionByPerson} from './../api.js';
-import { datetimeToISO } from 'ChillMainAssets/chill/js/date.js';
-
-const debug = process.env.NODE_ENV !== 'production';
-
-const concerned = window.household_members_editor_data.persons.map(p => {
-  return {
-    person: p,
-    position: null,
-    allowRemove: false,
-    holder: false,
-    comment: "",
-  };
-});
-
-console.log('expand suggestions', window.household_members_editor_expand_suggestions === 1);
-
-const store = createStore({
-  strict: debug,
-  state: {
-    concerned,
-    household: window.household_members_editor_data.household,
-    positions: window.household_members_editor_data.positions.sort((a, b) => {
-        if (a.ordering < b.ordering) {
-          return -1;
-        }
-        if (a.ordering > b.ordering) {
-          return 1;
-        }
-        return 0;
-      }),
-    startDate: new Date(),
-    allowHouseholdCreate: window.household_members_editor_data.allowHouseholdCreate,
-    allowHouseholdSearch: window.household_members_editor_data.allowHouseholdSearch,
-    allowLeaveWithoutHousehold: window.household_members_editor_data.allowLeaveWithoutHousehold,
-    forceLeaveWithoutHousehold: false,
-    householdSuggestionByAccompanyingPeriod: [],
-    showHouseholdSuggestion: window.household_members_editor_expand_suggestions === 1,
-    addressesSuggestion: [],
-    warnings: [],
-    errors: []
-  },
-  getters: {
-    isHouseholdNew(state) {
-      if (state.household === null) {
-        return false;
-      }
-      return !Number.isInteger(state.household.id);
-    },
-    hasHousehold(state) {
-      return state.household !== null;
-    },
-    hasHouseholdOrLeave(state) {
-      return state.household !== null || state.forceLeaveWithoutHousehold;
-    },
-    hasHouseholdSuggestion(state, getters) {
-      return getters.filterHouseholdSuggestionByAccompanyingPeriod.length > 0;
-    },
-    countHouseholdSuggestion(state, getters) {
-      return getters.filterHouseholdSuggestionByAccompanyingPeriod.length;
-    },
-    filterHouseholdSuggestionByAccompanyingPeriod(state) {
-      if (state.household === null) {
-        return state.householdSuggestionByAccompanyingPeriod;
-      }
-
-      return state.householdSuggestionByAccompanyingPeriod
-        .filter(h => h.id !== state.household.id)
-        ;
-    },
-    hasPersonsWellPositionnated(state, getters) {
-      return getters.needsPositionning === false
-        || (getters.persons.length > 0 && getters.concUnpositionned.length === 0);
-    },
-    persons(state) {
-      return state.concerned.map(conc => conc.person);
-    },
-    concUnpositionned(state) {
-      return state.concerned
-        .filter(conc => conc.position === null)
-      ;
-    },
-    positions(state) {
-      return state.positions;
-    },
-    personByPosition: (state) => (position_id) => {
-      return state.concerned
-        .filter(conc =>
-          conc.position !== null ? conc.position.id === position_id : false
-        )
-        .map(conc => conc.person)
-      ;
-    },
-    concByPosition: (state) => (position_id) => {
-      return state.concerned
-        .filter(conc =>
-          conc.position !== null ? conc.position.id === position_id : false
-        )
-      ;
-    },
-    concByPersonId: (state) => (person_id) => {
-      return state.concerned
-        .find(conc => conc.person.id === person_id)
-      ;
-    },
-    needsPositionning(state) {
-      return state.forceLeaveWithoutHousehold === false;
-    },
-    buildPayload: (state) => {
-      let
-        conc,
-        payload_conc,
-        payload = {
-          concerned: [],
-          destination: null
-        }
-      ;
-
-      if (state.forceLeaveWithoutHousehold === false) {
-        payload.destination = {
-            id: state.household.id,
-            type: state.household.type
-          };
-      }
-
-      for (let i in state.concerned) {
-        conc = state.concerned[i];
-        payload_conc = {
-          person: {
-            id: conc.person.id,
-            type: conc.person.type
-          },
-          start_date: {
-            datetime: datetimeToISO(state.startDate)
-          }
-        };
-
-        if (state.forceLeaveWithoutHousehold === false) {
-          payload_conc.position = {
-            id: conc.position.id,
-            type: conc.position.type
-          };
-          payload_conc.holder = conc.holder;
-          payload_conc.comment = conc.comment;
-        }
-
-        payload.concerned.push(payload_conc);
-      }
-
-      return payload;
-    },
-  },
-  mutations: {
-    addConcerned(state, person) {
-      let persons = state.concerned.map(conc => conc.person.id);
-      if (!persons.includes(person.id)) {
-        state.concerned.push({
-          person,
-          position: null,
-          allowRemove: true,
-          holder: false,
-          comment: "",
-        });
-      } else {
-        console.err("person already included");
-      }
-    },
-    markPosition(state, { person_id, position_id}) {
-      let
-        position = state.positions.find(pos => pos.id === position_id),
-        conc = state.concerned.find(c => c.person.id === person_id);
-      conc.position = position;
-    },
-    setComment(state, {conc, comment}) {
-      conc.comment = comment;
-    },
-    toggleHolder(state, conc) {
-      conc.holder = !conc.holder;
-    },
-    removePosition(state, conc) {
-      conc.holder = false;
-      conc.position = null;
-    },
-    removeConcerned(state, conc) {
-      state.concerned = state.concerned.filter(c =>
-        c.person.id !== conc.person.id
-      )
-    },
-    createHousehold(state) {
-      state.household = { type: 'household', members: [], current_address: null, 
-        current_members_id: [] };
-      state.forceLeaveWithoutHousehold = false;
-    },
-    removeHousehold(state) {
-      state.household = null;
-      state.forceLeaveWithoutHousehold = false;
-    },
-    setHouseholdAddress(state, address) {
-      if (null === state.household) {
-        console.error("no household");
-        throw new Error("No household");
-      }
-
-      state.household.current_address = address;
-      state.household.force_new_address = address;
-    },
-    forceLeaveWithoutHousehold(state) {
-      state.household = null;
-      state.forceLeaveWithoutHousehold = true;
-    },
-    selectHousehold(state, household) {
-      state.household = household;
-      state.forceLeaveWithoutHousehold = false;
-    },
-    setHouseholdSuggestionByAccompanyingPeriod(state, households) {
-      let existingIds = state.householdSuggestionByAccompanyingPeriod
-        .map(h => h.id);
-      for (let i in households) {
-        if (!existingIds.includes(households[i].id)) {
-          state.householdSuggestionByAccompanyingPeriod.push(households[i]);
-        }
-      }
-    },
-    setStartDate(state, dateI) {
-      state.startDate = dateI;
-    },
-    toggleHouseholdSuggestion(state) {
-      state.showHouseholdSuggestion = !state.showHouseholdSuggestion;
-    },
-    setWarnings(state, warnings) {
-      state.warnings = warnings;
-      // reset errors, which should come from servers
-      state.errors.splice(0, state.errors.length);
-    },
-    setErrors(state, errors) {
-      state.errors = errors;
-    },
-    addAddressesSuggestion(state, addresses) {
-      let existingIds = state.addressesSuggestion
-        .map(a => a.id);
-
-      for (let i in addresses) {
-        if (!existingIds.includes(addresses[i].id)) {
-          state.addressesSuggestion.push(addresses[i]);
-        }
-      }
-    }
-  },
-  actions: {
-    addConcerned({ commit, dispatch }, person) {
-      commit('addConcerned', person);
-      dispatch('computeWarnings');
-      dispatch('fetchAddressSuggestions');
-    },
-    markPosition({ commit, state, dispatch }, { person_id, position_id }) {
-      commit('markPosition', { person_id, position_id });
-      dispatch('computeWarnings');
-    },
-    toggleHolder({ commit, dispatch }, conc) {
-      commit('toggleHolder', conc);
-      dispatch('computeWarnings');
-    },
-    removePosition({ commit, dispatch }, conc) {
-      commit('removePosition', conc);
-      dispatch('computeWarnings');
-    },
-    removeConcerned({ commit, dispatch }, conc) {
-      commit('removeConcerned', conc);
-      dispatch('computeWarnings');
-      dispatch('fetchAddressSuggestions');
-    },
-    removeHousehold({ commit, dispatch }) {
-      commit('removeHousehold');
-      dispatch('computeWarnings');
-    },
-    createHousehold({ commit, dispatch }) {
-      commit('createHousehold');
-      dispatch('computeWarnings');
-    },
-    forceLeaveWithoutHousehold({ commit, dispatch }) {
-      commit('forceLeaveWithoutHousehold');
-      dispatch('computeWarnings');
-    },
-    selectHousehold({ commit }, h) {
-      commit('selectHousehold', h);
-      dispatch('computeWarnings');
-    },
-    setStartDate({ commit, dispatch }, date) {
-      commit('setStartDate', date);
-      dispatch('computeWarnings');
-    },
-    setComment({ commit }, payload) {
-      commit('setComment', payload);
-    },
-    fetchHouseholdSuggestionForConcerned({ commit, state }, person) {
-      fetchHouseholdSuggestionByAccompanyingPeriod(person.id)
-        .then(households => {
-          commit('setHouseholdSuggestionByAccompanyingPeriod', households);
-        });
-    },
-    fetchAddressSuggestions({ commit, state }) {
-      for (let i in state.concerned) {
-        fetchAddressSuggestionByPerson(state.concerned[i].person.id)
-          .then(addresses => {
-            commit('addAddressesSuggestion', addresses);
-          })
-          .catch(e => {
-            console.log(e);
-          });
-      }
-    },
-    computeWarnings({ commit, state, getters }) {
-      let warnings = [],
-        payload;
-
-      if (!getters.hasHousehold && !state.forceLeaveWithoutHousehold) {
-        warnings.push({ m: 'household_members_editor.add_destination', a: {} });
-      }
-
-      if (state.concerned.length === 0) {
-        warnings.push({ m: 'household_members_editor.add_at_least_onePerson', a: {} });
-      }
-
-      if (getters.concUnpositionned.length > 0
-        && !state.forceLeaveWithoutHousehold) {
-        warnings.push({ m: 'household_members_editor.give_a_position_to_every_person', a: {} })
-      }
-
-      commit('setWarnings', warnings);
-    },
-    confirm({ getters, state, commit }) {
-      let payload = getters.buildPayload,
-        errors = [],
-        person_id,
-        household_id,
-        error
-      ;
-
-        householdMove(payload).then(household => {
-          if (household === null) {
-            person_id = getters.persons[0].id;
-            window.location.replace(`/fr/person/${person_id}/general`);
-          } else {
-            if (household.type === 'household') {
-              household_id = household.id;
-              // nothing to do anymore here, bye-bye !
-              window.location.replace(`/fr/person/household/${household_id}/summary`);
-            } else {
-              // we assume the answer was 422...
-              error = household;
-              for (let i in error.violations) {
-                let e = error.violations[i];
-                errors.push(e.title);
-              }
-
-              commit('setErrors', errors);
-            }
-          }
-      });
-    },
-  }
-});
-
-store.dispatch('computeWarnings');
-store.dispatch('fetchAddressSuggestions');
-
-if (concerned.length > 0) {
-  concerned.forEach(c => {
-    store.dispatch('fetchHouseholdSuggestionForConcerned', c.person);
-  });
-}
-
-export { store };

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

@@ -7,25 +7,33 @@
     </div>
     <div v-if="isHouseholdNew && !hasHouseholdAddress">
 
-      <h3>À quelle adresse habite ce ménage ?</h3>
+      <h3 >À quelle adresse habite ce ménage ?</h3>
 
-      <ul v-if="filterAddressesSuggestion.length > 0">
-        <li v-for="a in filterAddressesSuggestion">
-          <show-address :address="a"></show-address> 
-          <button class="btn" @click="setHouseholdAddress(a)">
+      <div v-if="filterAddressesSuggestion.length > 0" class="flex-table householdAddressSuggestionList">
+        <div v-for="a in filterAddressesSuggestion" class="item-bloc">
+          <show-address :address="a"></show-address>
+          <button class="btn btn-action" @click="setHouseholdAddress(a)">
             Le ménage habite cette adresse
           </button>
-        </li>
-      </ul>
+        </div>
+      </div>
+        <div v-else>
+          <span class="chill-no-data-statement">Aucune adresse à suggérer</span>
+      </div>
 
       <ul class="record_actions">
         <li >
-          <button class="btn">
-            Créer une adresse
-          </button>
+          <add-address
+              :context="addAddress.context"
+              :key="addAddress.key"
+              :options="addAddress.options"
+              :result="addAddress.result"
+              @submitAddress="setHouseholdAddress"
+              ref="addAddress">
+          </add-address>
         </li>
       </ul>
-      
+
     </div>
     <div v-if="isHouseholdNew && hasHouseholdAddress">
       <ul class="record_actions">
@@ -35,7 +43,7 @@
           </button>
         </li>
       </ul>
-      
+
     </div>
   </div>
   <div v-else-if="isForceLeaveWithoutHousehold">
@@ -51,7 +59,7 @@
         class="btn btn-misc"
         @click="toggleHouseholdSuggestion"
       >
-        {{ $tc('household_members_editor.show_household_suggestion', 
+        {{ $tc('household_members_editor.show_household_suggestion',
           countHouseholdSuggestion) }}
       </button>
     </li>
@@ -106,11 +114,24 @@
       </div>
     </div>
   </div>
-  
+
 </template>
 
 <style lang="scss">
 
+div.householdAddressSuggestionList {
+  /*
+  display: flex;
+  list-style-type: none;
+  padding: 0;
+
+   */
+
+  & > li {
+
+  }
+}
+
 .householdSuggestionList {
   display: flex;
   flex-direction: row;
@@ -136,12 +157,45 @@
 import { mapGetters, mapState } from 'vuex';
 import HouseholdViewer from 'ChillPersonAssets/vuejs/_components/Household/Household.vue';
 import ShowAddress from 'ChillMainAssets/vuejs/Address/components/ShowAddress.vue';
+import AddAddress from 'ChillMainAssets/vuejs/Address/components/AddAddress.vue';
 
 export default {
   name: 'Household',
   components: {
     HouseholdViewer,
     ShowAddress,
+    AddAddress,
+  },
+  data() {
+    return {
+      addAddress: {
+        context: {
+          entity: {
+            type: 'household',
+            id: 0
+          },
+          edit: false,
+          addressId: null
+        },
+        key: 'household_new',
+        options: {
+          hideDateFrom: true,
+          bindModal: {
+
+          },
+          button: {
+            text:  {
+              create: null,
+              edit: null,
+            }
+          },
+          title: {
+            create: null,
+            edit: null,
+          },
+        }
+      }
+    }
   },
   computed: {
     ...mapGetters([
@@ -172,13 +226,13 @@ export default {
     allowRemoveHousehold() {
       return this.$store.getters.hasHousehold &&
         (
-          this.allowHouseholdCreate || this.allowHouseholdSearch || 
+          this.allowHouseholdCreate || this.allowHouseholdSearch ||
             this.allowLeaveWithoutHousehold
         )
       ;
     },
     allowChangeHousehold() {
-      return this.allowHouseholdCreate || this.allowHouseholdSearch || 
+      return this.allowHouseholdCreate || this.allowHouseholdSearch ||
         this.allowLeaveWithoutHousehold;
     },
     isForceLeaveWithoutHousehold() {

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

@@ -14,8 +14,6 @@ const concerned = window.household_members_editor_data.persons.map(p => {
   };
 });
 
-console.log('expand suggestions', window.household_members_editor_expand_suggestions === 1);
-
 const store = createStore({
   strict: debug,
   state: {
@@ -211,7 +209,12 @@ const store = createStore({
       )
     },
     createHousehold(state) {
-      state.household = { type: 'household', members: [], current_address: null, current_members_id: [] }
+      state.household = {
+        type: 'household',
+        members: [],
+        current_address: null,
+        current_members_id: []
+      };
       state.forceLeaveWithoutHousehold = false;
     },
     removeHousehold(state) {
@@ -373,8 +376,14 @@ const store = createStore({
           } else {
             if (household.type === 'household') {
               household_id = household.id;
+
               // nothing to do anymore here, bye-bye !
-              window.location.replace(`/fr/person/household/${household_id}/summary`);
+              let params = new URLSearchParams(window.location.search);
+              if (params.has('returnPath')) {
+                window.location.replace(params.get('returnPath'));
+              } else {
+                window.location.replace(`/fr/person/household/${household_id}/summary`);
+              }
             } else {
               // we assume the answer was 422...
               error = household;

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Household/Household.vue

@@ -10,7 +10,7 @@
       {{ $t('household_number', { number: household.id } ) }}
     </div>
 
-    <!-- member part --> 
+    <!-- member part -->
     <div v-if="hasCurrentMembers" class="members">
       <span class="current-members">{{ $t('current_members') }}: </span>
       <template v-for="(m, index) in currentMembers()" :key="m.id">
@@ -40,7 +40,7 @@
 <style lang="scss">
 .chill-entity__household {
   display: grid;
-  grid-template-areas: 
+  grid-template-areas:
     "identifier identifier where"
     "who        who        where"
     ;
@@ -50,7 +50,7 @@
 
   .identifier {
     grid-area: identifier;
-    
+
     font-size: 1.3em;
     font-weight: 700;
     color: var(--chill-blue);
@@ -104,13 +104,14 @@ export default {
   i18n,
   methods: {
     hasCurrentMembers() {
+      console.log(this.household);
       return this.household.current_members_id.length > 0;
     },
     currentMembers() {
       return this.household.members.filter(m => this.household.current_members_id.includes(m.id))
         .sort((a, b) => {
           if (a.position.ordering < b.position.ordering) {
-            return -1;  
+            return -1;
           }
           if (a.position.ordering > b.position.ordering) {
             return 1;

src/Bundle/ChillPersonBundle/Resources/views/AccompanyingCourse/_join_household.html.twig

@@ -14,7 +14,7 @@
 
     <div id="withoutHouseholdList" class="collapse p-3">
         <form method="GET"
-              action="{{ chill_path_add_return_path('chill_person_household_members_editor') }}">
+              action="{{ path('chill_person_household_members_editor') }}">
 
             <h3>{{ 'household.Select people to move'|trans }}</h3>
             <ul>
@@ -27,6 +27,7 @@
             </ul>
 
             <input type="hidden" name="expand_suggestions" value="true" />
+            <input type="hidden" name="returnPath" value="{{ app.request.requestUri|escape('html_attr') }}" />
             <input type="hidden" name="accompanying_period_id" value="{{ accompanyingCourse.id }}" />
             <ul class="record_actions mb-0">
                 <li>

src/Bundle/ChillPersonBundle/Resources/views/Household/members_editor.html.twig

@@ -1,4 +1,4 @@
-{% extends accompanyingCourse != null ? '@ChillPerson/AccompanyingCourse/layout.html.twig' 
+{% extends accompanyingCourse != null ? '@ChillPerson/AccompanyingCourse/layout.html.twig'
   : '@ChillMain/layout.html.twig' %}
 
 {% block title 'household.Edit household members'|trans  %}
@@ -13,11 +13,12 @@
 {% endblock %}
 
 {% block js %}
-  <script type="text/javascript">
-    window.household_members_editor_data = {{ data|json_encode|raw }};
-    window.household_members_editor_expand_suggestions = {{ expandSuggestions }};
-  </script>
-  {{ encore_entry_script_tags('vue_household_members_editor') }}
+    {{ parent() }}
+    <script type="text/javascript">
+      window.household_members_editor_data = {{ data|json_encode|raw }};
+      window.household_members_editor_expand_suggestions = {{ expandSuggestions }};
+    </script>
+    {{ encore_entry_script_tags('vue_household_members_editor') }}
 {% endblock %}
 
 {% block css %}