Apply prettier rules

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Referrer.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="vue-component">
-    <h2><a id="section-80" />{{ $t('referrer.title') }}</h2>
+    <h2><a id="section-80" />{{ $t("referrer.title") }}</h2>
 
     <teleport to="body">
       <modal
@@ -10,33 +10,31 @@
       >
         <template #header>
           <h3 class="modal-title">
-            {{ $t('confirm.title') }}
+            {{ $t("confirm.title") }}
           </h3>
         </template>
 
         <template #body-head>
           <div class="modal-body">
-            <p v-html="$t('confirm.sure_referrer', { referrer: this.value.text })" />
+            <p
+              v-html="
+                $t('confirm.sure_referrer', { referrer: this.value.text })
+              "
+            />
           </div>
         </template>
 
         <template #footer>
-          <button
-            class="btn btn-save"
-            @click.prevent="this.confirmReferrer"
-          >
-            {{ $t('confirm.ok_referrer') }}
+          <button class="btn btn-save" @click.prevent="this.confirmReferrer">
+            {{ $t("confirm.ok_referrer") }}
           </button>
         </template>
       </modal>
     </teleport>
 
     <div>
-      <label
-        class="col-form-label"
-        for="selectJob"
-      >
-        {{ $t('job.label') }}
+      <label class="col-form-label" for="selectJob">
+        {{ $t("job.label") }}
       </label>
 
       <VueMultiselect
@@ -54,11 +52,8 @@
         :selected-label="$t('multiselect.selected_label')"
       />
 
-      <label
-        class="col-form-label"
-        for="selectReferrer"
-      >
-        {{ $t('referrer.label') }}
+      <label class="col-form-label" for="selectReferrer">
+        {{ $t("referrer.label") }}
       </label>
 
       <VueMultiselect
@@ -101,55 +96,57 @@
             name="button"
             @click="assignMe"
           >
-            {{ $t('referrer.assign_me') }}
+            {{ $t("referrer.assign_me") }}
           </button>
         </li>
       </ul>
     </div>
 
-    <div
-      v-if="!isJobValid"
-      class="alert alert-warning to-confirm"
-    >
-      {{ $t('job.not_valid') }}
+    <div v-if="!isJobValid" class="alert alert-warning to-confirm">
+      {{ $t("job.not_valid") }}
     </div>
   </div>
 </template>
 
 <script>
-import VueMultiselect from 'vue-multiselect';
-import {makeFetch} from 'ChillMainAssets/lib/api/apiMethods';
-import {mapState, mapGetters} from 'vuex';
+import VueMultiselect from "vue-multiselect";
+import { makeFetch } from "ChillMainAssets/lib/api/apiMethods";
+import { mapState, mapGetters } from "vuex";
 import UserRenderBoxBadge from "ChillMainAssets/vuejs/_components/Entity/UserRenderBoxBadge";
-import Modal from 'ChillMainAssets/vuejs/_components/Modal';
+import Modal from "ChillMainAssets/vuejs/_components/Modal";
 
 export default {
   name: "Referrer",
   components: {
     UserRenderBoxBadge,
     VueMultiselect,
-    Modal
+    Modal,
   },
   data() {
     return {
       jobs: [],
       modal: {
         showModal: false,
-        modalDialogClass: "modal-dialog-scrollable modal-xl"
+        modalDialogClass: "modal-dialog-scrollable modal-xl",
       },
       value: this.$store.state.accompanyingCourse.user,
-      confirmed: false
-    }
+      confirmed: false,
+    };
   },
   computed: {
     ...mapState({
-      valueJob: state => state.accompanyingCourse.job,
+      valueJob: (state) => state.accompanyingCourse.job,
     }),
-    ...mapGetters(['isJobValid', 'usersSuggestedFilteredByJob']),
+    ...mapGetters(["isJobValid", "usersSuggestedFilteredByJob"]),
     users: function () {
       let users = this.$store.getters.usersFilteredByJob;
       // ensure that the selected user is in the list. add it if necessary
-      if (this.$store.state.accompanyingCourse.user !== null && users.find(u => this.$store.state.accompanyingCourse.user.id === u.id) === undefined) {
+      if (
+        this.$store.state.accompanyingCourse.user !== null &&
+        users.find(
+          (u) => this.$store.state.accompanyingCourse.user.id === u.id,
+        ) === undefined
+      ) {
         users.push(this.$store.state.accompanyingCourse.user);
       }
       return users;
@@ -159,15 +156,18 @@ export default {
         return this.$store.state.accompanyingCourse.job;
       },
       set(value) {
-        this.$store.dispatch('updateJob', value)
-            .catch(({name, violations}) => {
-              if (name === 'ValidationException' || name === 'AccessException') {
-                violations.forEach((violation) => this.$toast.open({message: violation}));
-              } else {
-                this.$toast.open({message: 'An error occurred'})
-              }
-            });
-      }
+        this.$store
+          .dispatch("updateJob", value)
+          .catch(({ name, violations }) => {
+            if (name === "ValidationException" || name === "AccessException") {
+              violations.forEach((violation) =>
+                this.$toast.open({ message: violation }),
+              );
+            } else {
+              this.$toast.open({ message: "An error occurred" });
+            }
+          });
+      },
     },
   },
   mounted() {
@@ -179,57 +179,62 @@ export default {
       this.toggleModal();
     },
     getJobs() {
-      const url = '/api/1.0/main/user-job.json';
-      makeFetch('GET', url)
-          .then(response => {
-            this.jobs = response.results;
-          })
-          .catch((error) => {
-            this.$toast.open({message: error.txt})
-          })
+      const url = "/api/1.0/main/user-job.json";
+      makeFetch("GET", url)
+        .then((response) => {
+          this.jobs = response.results;
+        })
+        .catch((error) => {
+          this.$toast.open({ message: error.txt });
+        });
     },
     customJobLabel(value) {
       return value.label.fr;
     },
     assignMe() {
       const url = `/api/1.0/main/whoami.json`;
-      makeFetch('GET', url)
-          .then(user => {
-            // this.value = user
-            this.updateReferrer(user);
-          })
+      makeFetch("GET", url).then((user) => {
+        // this.value = user
+        this.updateReferrer(user);
+      });
     },
     toggleModal() {
       this.modal.showModal = !this.modal.showModal;
     },
     confirmReferrer() {
-      this.$store.dispatch('updateReferrer', this.value)
-          .catch(({name, violations}) => {
-            if (name === 'ValidationException' || name === 'AccessException') {
-              violations.forEach((violation) => this.$toast.open({message: violation}));
-            } else {
-              this.$toast.open({message: 'An error occurred'})
-            }
-          });
-      this.toggleModal()
+      this.$store
+        .dispatch("updateReferrer", this.value)
+        .catch(({ name, violations }) => {
+          if (name === "ValidationException" || name === "AccessException") {
+            violations.forEach((violation) =>
+              this.$toast.open({ message: violation }),
+            );
+          } else {
+            this.$toast.open({ message: "An error occurred" });
+          }
+        });
+      this.toggleModal();
     },
     removeReferrer() {
-      console.log('remove option')  
-      this.$store.dispatch('updateReferrer', null)
-          .catch(({name, violations}) => {
-            if (name === 'ValidationException' || name === 'AccessException') {
-              violations.forEach((violation) => this.$toast.open({message: violation}));
-            } else {
-              this.$toast.open({message: 'An error occurred'})
-            }
-          });
+      console.log("remove option");
+      this.$store
+        .dispatch("updateReferrer", null)
+        .catch(({ name, violations }) => {
+          if (name === "ValidationException" || name === "AccessException") {
+            violations.forEach((violation) =>
+              this.$toast.open({ message: violation }),
+            );
+          } else {
+            this.$toast.open({ message: "An error occurred" });
+          }
+        });
     },
     cancelChange() {
-      this.value = this.$store.state.accompanyingCourse.user
-      this.toggleModal()
-    }
-  }
-}
+      this.value = this.$store.state.accompanyingCourse.user;
+      this.toggleModal();
+    },
+  },
+};
 </script>
 
 <style src="vue-multiselect/dist/vue-multiselect.css"></style>