form acc work edit: save action

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue

@@ -41,11 +41,11 @@
         <div>
           <div @click="removeGoal(g)" class="objective-title">
             <i class="fa fa-times"></i>
-            {{ g.title.fr }}
+            {{ g.goal.title.fr }}
           </div> 
         </div>
         <div>
-          <add-result destination="goal" :goal="g"></add-result>  
+          <add-result destination="goal" :goal="g.goal"></add-result>  
         </div>
       </div>
 
@@ -145,21 +145,47 @@
         </ul>
       </div>
 
-        <ul class="record_actions">
-          <li>
-            <add-persons
-               buttonTitle="Ajouter des tiers"
-               modalTitle="Choisir des tiers"
-               v-bind:key="thirdPartyPicker.key"
-               v-bind:options="thirdPartyPicker.options"
-               @addNewPersons="addThirdParties"
-               ref="thirdPartyPicker"> <!-- to cast child method -->
-            </add-persons>
-          </li>
-        </ul>
+      <ul class="record_actions">
+        <li>
+          <add-persons
+             buttonTitle="Ajouter des tiers"
+             modalTitle="Choisir des tiers"
+             v-bind:key="thirdPartyPicker.key"
+             v-bind:options="thirdPartyPicker.options"
+             @addNewPersons="addThirdParties"
+             ref="thirdPartyPicker"> <!-- to cast child method -->
+          </add-persons>
+        </li>
+      </ul>
+    </div>
+
+    <div id="errors" v-if="errors.length > 0">
+      <p>Veuillez corriger les erreurs suivantes:</p>
+      <ul>
+        <li v-for="e in errors">{{ e }}</li>
+      </ul> 
     </div>
   </div>
 
+  <ul class="record_actions sticky-form-buttons">
+    <li v-if="!isPosting">
+      <button
+        class="sc-button bt-save"
+        @click="submit"
+      >
+        {{ $t('action.save') }}
+      </button>
+    </li>
+    <li v-if="isPosting">
+      <button
+        class="sc-button bt-save"
+        disabled
+      >
+        {{ $t('action.save') }}
+      </button>
+    </li>
+  </ul>
+
 </template>
 
 <style lang="scss">
@@ -174,6 +200,7 @@
     "persons persons"
     "handling handling"
     "tparties tparties"
+    "errors errors"
     ;
 
   grid-template-columns: 50%;
@@ -293,6 +320,9 @@
   #thirdParties {
     grid-area: tparties;
   }
+  #errors {
+    grid-area: errors;
+  }
 }
 
 </style>
@@ -314,9 +344,9 @@ const i18n = {
       action_title: "Action d'accompagnement",
       startDate: "Date de début",
       endDate: "Date de fin",
-      results_without_objective: "Résultats sans objectifs",
+      results_without_objective: "Résultats - orientations sans objectifs",
       add_objectif: "Ajouter un motif - objectif - dispositif",
-      persons_involved: "Usagers concernés", 
+      persons_involved: "Usagers concernés",
     }
 }
 };
@@ -360,7 +390,9 @@ export default {
       'goalsPicked',
       'personsReachables',
       'handlingThirdParty',
-      'thirdParties'
+      'thirdParties',
+      'isPosting',
+      'errors',
     ]),
     ...mapGetters([
       'hasResultsForAction',
@@ -390,11 +422,11 @@ export default {
         return this.$store.state.note;
       },
       set(v) {
-        this.$store.commit('setNote', note);
+        this.$store.commit('setNote', v);
       }
     },
     availableForCheckGoal() {
-      let pickedIds = this.$store.state.goalsPicked.map(g => g.id);
+      let pickedIds = this.$store.state.goalsPicked.map(g => g.goal.id);
       console.log('pickeds goals id', pickedIds);
       console.log(this.$store.state.goalsForAction);
 
@@ -445,6 +477,9 @@ export default {
       console.log('remove third party', t);
       this.$store.commit('removeThirdParty', t);
     },
+    submit() {
+      this.$store.dispatch('submit');
+    },
   }
 };