Change models, new migrations, fix front and make tests work

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/components/Account/Account.vue

@@ -29,11 +29,16 @@
                      :src="account.avatarRemoteUrl"
                 >
               </v-avatar>
-              <v-card-title class="pl-5 pt-5">
-                <div class="display-1 pl-5 pt-5">@{{ account.username }}<span v-if="account.server">@{{ account.server.address }}</span></div>
-              </v-card-title>
-              <v-card-text v-if="account.description" v-html="account.description"></v-card-text>
             </div>
+            <v-container fluid grid-list-lg>
+              <v-layout row>
+                <v-flex xs7>
+                  <div class="headline">{{ account.display_name }}</div>
+                  <div><span class="subheading">@{{ account.username }}</span><span v-if="account.server">@{{ account.server.address }}</span></div>
+                  <v-card-text v-if="account.description" v-html="account.description"></v-card-text>
+                </v-flex>
+              </v-layout>
+            </v-container>
           </v-layout>
         <v-list three-line>
           <v-list-tile>
@@ -69,7 +74,7 @@
             </v-list-tile-content>
           </v-list-tile>
         </v-list>
-        <v-container fluid grid-list-md v-if="account.participatingEvents.length > 0">
+        <v-container fluid grid-list-md v-if="account.participatingEvents && account.participatingEvents.length > 0">
           <v-subheader>Participated at</v-subheader>
           <v-layout row wrap>
             <v-flex v-for="event in account.participatingEvents" :key="event.id">
@@ -110,7 +115,7 @@
             </v-flex>
           </v-layout>
         </v-container>
-        <v-container fluid grid-list-md v-if="account.organizingEvents.length > 0">
+        <v-container fluid grid-list-md v-if="account.organizingEvents && account.organizingEvents.length > 0">
           <v-subheader>Organized events</v-subheader>
           <v-layout row wrap>
             <v-flex v-for="event in account.organizingEvents" :key="event.id">
@@ -178,11 +183,12 @@ export default {
   },
   methods: {
     fetchData() {
-      eventFetch('/accounts/' + this.id, this.$store)
+      eventFetch(`/accounts/${this.id}`, this.$store)
         .then(response => response.json())
         .then((response) => {
-          this.account = response;
+          this.account = response.data;
           this.loading = false;
+          console.log(this.account);
         })
     }
   }

js/src/components/Category/Create.vue

@@ -4,11 +4,10 @@
     <v-form>
       <v-text-field
         label="Name of the category"
-        v-model="category.name"
+        v-model="category.title"
         :counter="100"
         required
       ></v-text-field>
-      <input type="file" @change="processFile($event.target)">
     </v-form>
     <v-btn color="primary" @click="create">Create category</v-btn>
   </div>
@@ -22,32 +21,20 @@
     data() {
       return {
         category: {
-          name: '',
-          imageDataUri: null,
+          title: '',
         },
       };
     },
     methods: {
       create() {
         const router = this.$router;
-        eventFetch('/categories', this.$store, { method: 'POST', body: JSON.stringify(this.category) })
+        eventFetch('/categories', this.$store, { method: 'POST', body: JSON.stringify({ category: this.category }) })
           .then(response => response.json())
           .then(() => {
             this.loading = false;
             router.push('/category')
           });
       },
-      processFile(target) {
-        const reader = new FileReader();
-        const file = target.files[0];
-        reader.addEventListener('load', () => {
-          this.category.imageDataUri = reader.result;
-        });
-
-        if (file) {
-          reader.readAsDataURL(file);
-        }
-      }
     },
   };
 </script>

js/src/components/Category/List.vue

@@ -11,7 +11,7 @@
             </v-card-media>
             <v-card-title primary-title>
               <div>
-                <h3 class="headline mb-0">{{ category.name }}</h3>
+                <h3 class="headline mb-0">{{ category.title }}</h3>
                 <div>{{ category.description }}</div>
               </div>
             </v-card-title>
@@ -49,9 +49,9 @@
       fetchData() {
         eventFetch('/categories', this.$store)
           .then(response => response.json())
-          .then((data) => {
+          .then((response) => {
             this.loading = false;
-            this.categories = data['hydra:member'];
+            this.categories = response.data;
           });
       },
       deleteCategory(categoryId) {

js/src/components/Event/Create.vue

@@ -36,7 +36,7 @@
               <v-select
                 v-bind:items="categories"
                 v-model="event.category"
-                item-text="name"
+                item-text="title"
                 item-value="@id"
                 label="Categories"
                 single-line
@@ -62,7 +62,7 @@
         <v-stepper-step step="2" :complete="e1 > 2">Date and place</v-stepper-step>
         <v-stepper-content step="2">
           Event starts at:
-          <v-text-field type="datetime-local" v-model="event.startDate"></v-text-field>
+          <v-text-field type="datetime-local" v-model="event.begins_on"></v-text-field>
           <!--<v-layout row wrap>
             <v-flex md6>
               <v-dialog
@@ -113,7 +113,7 @@
             </v-flex>
           </v-layout>-->
           Event ends at:
-          <v-text-field type="datetime-local" v-model="event.endDate"></v-text-field>
+          <v-text-field type="datetime-local" v-model="event.ends_on"></v-text-field>
           <!--<v-layout row wrap>
             <v-flex md6>
               <v-dialog
@@ -216,8 +216,8 @@
         event: {
           title: '',
           description: '',
-          startDate: new Date(),
-          endDate: new Date(),
+          begins_on: new Date(),
+          ends_on: new Date(),
           seats: 0,
           address: {
             description: null,
@@ -261,12 +261,12 @@
             // '@type': 'Tag',
           });
         });
-        this.event.organizer = "/accounts/" + this.$store.state.user.account.id;
-        this.event.participants = ["/accounts/" + this.$store.state.user.account.id];
+        this.event.organizer_id = this.$store.state.user.account.id;
+        this.event.participants = [this.$store.state.user.account.id];
         this.event.price = parseFloat(this.event.price);
 
         if (this.id === undefined) {
-          eventFetch('/events', this.$store, {method: 'POST', body: JSON.stringify(this.event)})
+          eventFetch('/events', this.$store, {method: 'POST', body: JSON.stringify({ event: this.event })})
             .then(response => response.json())
             .then((data) => {
               this.loading = false;
@@ -284,17 +284,17 @@
       fetchCategories() {
         eventFetch('/categories', this.$store)
           .then(response => response.json())
-          .then((data) => {
+          .then((response) => {
             this.loading = false;
-            this.categories = data['hydra:member'];
+            this.categories = response.data;
           });
       },
       fetchTags() {
         eventFetch('/tags', this.$store)
           .then(response => response.json())
-          .then((data) => {
+          .then((response) => {
             this.loading = false;
-            data['hydra:member'].forEach((tag) => {
+            response.data.forEach((tag) => {
               this.tagsFetched.push(tag.name);
             });
           });

js/src/components/Event/EventList.vue

@@ -26,7 +26,7 @@
             <div class="headline">{{ event.title }}</div>
           </v-card-title>
           <v-container>
-              <span class="grey--text">{{ event.startDate | formatDate }} à <router-link :to="{name: 'EventList', params: {location: geocode(event.address.geo.latitude, event.address.geo.longitude, 10) }}">{{ event.address.addressLocality }}</router-link></span><br>
+              <!--<span class="grey&#45;&#45;text">{{ event.startDate | formatDate }} à <router-link :to="{name: 'EventList', params: {location: geocode(event.address.geo.latitude, event.address.geo.longitude, 10) }}">{{ event.address.addressLocality }}</router-link></span><br>-->
               <p><vue-markdown>{{ event.description }}</vue-markdown></p>
               <p v-if="event.organizer">Organisé par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p>
           </v-container>
@@ -93,9 +93,9 @@
         this.locationChip = true;
         eventFetch(queryString, this.$store)
           .then(response => response.json())
-          .then((data) => {
+          .then((response) => {
             this.loading = false;
-            this.events = data['hydra:member'];
+            this.events = response.data;
           });
       },
       deleteEvent(id) {

js/src/components/Group/Create.vue

@@ -98,7 +98,7 @@
           .then(response => response.json())
           .then((data) => {
             this.loading = false;
-            this.categories = data['hydra:member'];
+            this.categories = data;
           });
       },
       getAddressData: function (addressData) {

js/src/components/Group/GroupList.vue

@@ -58,7 +58,7 @@
           .then(response => response.json())
           .then((data) => {
             this.loading = false;
-            this.groups = data['hydra:member'];
+            this.groups = data;
           });
       },
       deleteEvent(id) {

js/src/components/Home.vue

@@ -1,6 +1,6 @@
 <template>
   <v-container>
-    <h1 class="welcome" v-if="$store.state.user">{{ $t("home.welcome", { 'username': $store.state.user.username}) }}</h1>
+    <h1 class="welcome" v-if="$store.state.user">{{ $t("home.welcome", { 'username': this.displayed_name }) }}</h1>
     <h1 class="welcome" v-else>{{ $t("home.welcome_off", { 'username': $store.state.user.username}) }}</h1>
     <router-link :to="{ name: 'EventList' }">{{ $t('home.events') }}</router-link>
     <router-link v-if="$store.state.user === false" :to="{ name: 'Login' }">{{ $t('home.login') }}</router-link>
@@ -48,12 +48,17 @@ export default {
   mounted() {
     // this.fetchLocations();
   },
+  computed: {
+    displayed_name: function() {
+      return this.$store.state.user.account.display_name === null ? this.$store.state.user.account.username : this.$store.state.user.account.display_name
+    },
+  },
   methods: {
     fetchLocations() {
       eventFetch('/locations', this.$store)
         .then((response) => (response.json()))
         .then((response) => {
-          this.locations = response['hydra:member'];
+          this.locations = response;
         });
     },
     geoLocalize() {

js/src/components/Login.vue

@@ -65,10 +65,19 @@
     methods: {
       loginAction(e) {
         e.preventDefault();
-        auth.login(JSON.stringify(this.credentials), this.$store, '/', (error) => {
-          this.error.show = true;
-          this.error.text = error.message;
-          this.error.field[error.field] = true;
+        auth.login(JSON.stringify(this.credentials), (data) => {
+          this.$store.commit('LOGIN_USER', data.user);
+          this.$router.push({ name: 'Home' });
+        }, (error) => {
+          Promise.resolve(error).then((errorMsg) => {
+            console.log(errorMsg);
+            this.error.show = true;
+            this.error.text = this.$t(errorMsg.display_error);
+          }).catch((e) => {
+            console.log(e);
+            this.error.show = true;
+            this.error.text = e.message;
+          });
         });
       },
     },

js/src/components/NavBar.vue

@@ -58,7 +58,7 @@
         </v-card-actions>
       </v-card>
     </v-menu>
-    <v-btn flat @click="$router.push({name: 'Account', params: {'id': getUser().account.id}})" v-if="$store.state.isLogged && getUser()">{{ getUser().username }}</v-btn>
+    <v-btn flat @click="$router.push({name: 'Account', params: {'id': getUser().account.id}})" v-if="$store.state.user">{{ this.displayed_name }}</v-btn>
   </v-toolbar>
 </template>
 
@@ -95,6 +95,11 @@
         }
       }
     },
+    computed: {
+      displayed_name: function() {
+        return this.$store.state.user.account.display_name === null ? this.$store.state.user.account.username : this.$store.state.user.account.display_name
+      },
+    },
     methods: {
       getUser() {
         return this.$store.state.user === undefined ? false : this.$store.state.user;

js/src/components/Register.vue

@@ -72,7 +72,11 @@
     methods: {
       registerAction(e) {
         e.preventDefault();
-        auth.signup(JSON.stringify(this.credentials), this.$store, {name: 'Home'}, (error) => {
+        auth.signup(JSON.stringify(this.credentials), (response) => {
+          console.log(response);
+          this.$store.commit('LOGIN_USER', response.user);
+          this.$router.push({ name: 'Home' });
+        }, (error) => {
           this.error.show = true;
           this.error.text = error.message;
           this.error.field[error.field] = true;