Added ESlint to client and applied rules

client/src/pages/index-page.vue

@@ -2,8 +2,12 @@
   <div class="container-fluid">
     <section class="d-flex justify-content-center align-items-center">
       <main class="px-4">
-        <h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">"C'est magique, ta gueule."</h1>
-        <div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div>
+        <h1 class="title text-dark mb-4 font-display font-weight-black line-height-100">
+          "C'est magique, ta gueule."
+        </h1>
+        <div class="lead font-display font-weight-bold">
+          — N'importe quel MJ, une fois dans sa vie
+        </div>
         <hr class="w-50">
         <div class="lead">
           <span class="font-display font-weight-bold">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Leïm</span>.
@@ -15,8 +19,8 @@
 
 <script>
 export default {
-  name: 'index-page',
-}
+  name: 'IndexPage',
+};
 </script>
 
 <style lang="scss" scoped>

client/src/pages/schools/schools-page.vue

@@ -1,17 +1,22 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">Écoles</h1>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      Écoles
+    </h1>
   </div>
 </template>
 
 <script>
 
 export default {
-  name: 'schools-page',
+  name: 'SchoolsPage',
   metaInfo: {
     titleTemplate: '%s - Maîtrises'
   },
-}
+};
 
 </script>
 

client/src/pages/schools/single-school-page.vue

@@ -1,8 +1,13 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">{{ school.name }}</h1>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      {{ school.name }}
+    </h1>
     <p>{{ school.description }}</p>
-    <spell-list :school_id="id"/>
+    <spell-list :school_id="id" />
   </div>
 </template>
 
@@ -11,14 +16,14 @@
 import { RepositoryFactory } from "@/api/repositories";
 const Schools = RepositoryFactory.get('schools');
 
-import SpellsList from "~/components/spells/spells-list";
+import SpellsList from "@/components/spells/spells-list";
 
 export default {
-  name: 'single-school-page',
+  name: 'SingleSchoolPage',
   metaInfo() {
     return {
       titleTemplate: `%s - ${this.school.name}`,
-    }
+    };
   },
   components: {
     'spell-list': SpellsList,
@@ -30,7 +35,7 @@ export default {
       errors: {
         loading: "",
       }
-    }
+    };
   },
   created() {
     Schools.getOne(this.id)
@@ -41,7 +46,7 @@ export default {
         console.log(err);
       });
   },
-}
+};
 </script>
 
 <style lang="scss" scoped>

client/src/pages/spells/single-spell-page.vue

@@ -1,7 +1,15 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">{{ spell.name }}</h1>
-    <p class="prewrap">{{ spell.description }}</p>  </div>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      {{ spell.name }}
+    </h1>
+    <p class="prewrap">
+      {{ spell.description }}
+    </p>
+  </div>
 </template>
 
 <script>
@@ -10,11 +18,11 @@ import { RepositoryFactory } from "@/api/repositories";
 const Spells = RepositoryFactory.get('spells');
 
 export default {
-  name: 'single-spell-page',
+  name: 'SingleSpellPage',
   metaInfo() {
     return {
       titleTemplate: this.spell.name ? `%s - ${this.spell.name}` : '%s',
-    }
+    };
   },
   data() {
     return {
@@ -23,7 +31,7 @@ export default {
       errors: {
         loading: "",
       }
-    }
+    };
   },
   created() {
     Spells.getOne(this.id)
@@ -34,7 +42,7 @@ export default {
         console.log(err);
       });
   },
-}
+};
 </script>
 
 <style>

client/src/pages/spells/spells-page.vue

@@ -1,7 +1,12 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">Sortilèges</h1>
-    <spell-list/>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      Sortilèges
+    </h1>
+    <spell-list />
   </div>
 </template>
 
@@ -9,14 +14,14 @@
 import SpellsList from "@/components/spells/spells-list.vue";
 
 export default {
-  name: 'spells-page',
+  name: 'SpellsPage',
   metaInfo: {
     titleTemplate: '%s - Grimoire'
   },
   components: {
     'spell-list': SpellsList,
   }
-}
+};
 </script>
 
 <style lang="scss"></style>

client/src/pages/timelines/timeline-page.vue

@@ -1,22 +1,27 @@
 <template>
-  <div class="container-fluid p-4" id="spell-container">
-    <h1 class="display-3 font-display mb-3">Chronologie</h1>
-    <timeline/>
+  <div
+    id="spell-container"
+    class="container-fluid p-4"
+  >
+    <h1 class="display-3 font-display mb-3">
+      Chronologie
+    </h1>
+    <timeline />
   </div>
 </template>
 
 <script>
-import Timeline from "~/components/timeline/timeline"
+import Timeline from "@/components/timeline/timeline";
 
 export default {
-  name: 'timeline-page',
+  name: 'TimelinePage',
   metaInfo: {
     titleTemplate: '%s - Âges'
   },
   components: {
     'timeline': Timeline
   }
-}
+};
 </script>
 
 <style>

client/src/pages/user/profile-page.vue

@@ -1,38 +1,72 @@
 <template>
   <div
     v-if="user"
-    class="container-fluid p-4"
     id="spell-container"
+    class="container-fluid p-4"
   >
     <h2 class="display-3 font-display mb-3">
       <span class="username">{{ user.name }}</span>
     </h2>
     <span>Membre depuis le {{ registered_date }}</span>
 
-    <ul class="nav nav-tabs mt-3 mb-3" id="tabs-tab" role="tablist">
+    <ul
+      id="tabs-tab"
+      class="nav nav-tabs mt-3 mb-3"
+      role="tablist"
+    >
       <li class="nav-item">
-        <a class="nav-link active" id="tabs-home-tab" data-toggle="pill" href="#tabs-home" role="tab" aria-controls="tabs-home" aria-selected="true">Mes sorts</a>
+        <a
+          id="tabs-home-tab"
+          class="nav-link active"
+          data-toggle="pill"
+          href="#tabs-home"
+          role="tab"
+          aria-controls="tabs-home"
+          aria-selected="true"
+        >Mes sorts</a>
       </li>
       <li class="nav-item">
-        <a class="nav-link" id="tabs-contact-tab" data-toggle="pill" href="#tabs-contact" role="tab" aria-controls="tabs-contact" aria-selected="false">Paramètres</a>
+        <a
+          id="tabs-contact-tab"
+          class="nav-link"
+          data-toggle="pill"
+          href="#tabs-contact"
+          role="tab"
+          aria-controls="tabs-contact"
+          aria-selected="false"
+        >Paramètres</a>
       </li>
     </ul>
-    <div class="tab-content" id="tabs-tabContent">
-      <div class="tab-pane fade show active" id="tabs-home" role="tabpanel" aria-labelledby="tabs-home-tab">...</div>
-      <div class="tab-pane fade" id="tabs-contact" role="tabpanel" aria-labelledby="tabs-contact-tab">
-        <update-form :user="user"/>
+    <div
+      id="tabs-tabContent"
+      class="tab-content"
+    >
+      <div
+        id="tabs-home"
+        class="tab-pane fade show active"
+        role="tabpanel"
+        aria-labelledby="tabs-home-tab"
+      >
+        ...
+      </div>
+      <div
+        id="tabs-contact"
+        class="tab-pane fade"
+        role="tabpanel"
+        aria-labelledby="tabs-contact-tab"
+      >
+        <update-form :user="user" />
       </div>
     </div>
-
   </div>
 </template>
 
 <script>
 
-import UpdateForm from '~/components/user/profile/update-form.vue'
+import UpdateForm from '@/components/user/profile/update-form.vue';
 
 export default {
-  name: 'profile-page',
+  name: 'ProfilePage',
   metaInfo: {
     titleTemplate: '%s - Profil'
   },
@@ -41,11 +75,11 @@ export default {
   },
   data() {
     return {
-    }
+    };
   },
   computed: {
     user() {
-      return this.$store.getters.getUserProfile
+      return this.$store.getters.getUserProfile;
     },
     registered_date() {
       let raw_date = new Date(this.user.register_date);
@@ -59,7 +93,7 @@ export default {
       return new Intl.DateTimeFormat("fr", date_options).format(raw_date);
     }
   },
-}
+};
 </script>
 
 <style lang="scss" scoped>