switched REST to GRAPHQL strapi api

build/webpack.config.base.js

@@ -16,7 +16,8 @@ module.exports = {
       'pages': utils.resolve('src/pages'),
       'static': utils.resolve('static'),
       'components': utils.resolve('src/components'),
-      'api': utils.resolve('src/api')
+      'api': utils.resolve('src/api'),
+      'store': utils.resolve('src/store')
     }
   },
 

src/App.vue

@@ -38,11 +38,9 @@
 
             <template v-if="projects.length">
               <project
-                v-for="(project, index) in projects"
+                v-for="(project) in projects"
                 :key="project.id"
                 :data="project"
-                :len="projects.length"
-                :index="index"
               />
             </template>
 

src/api/graphql-axios.js

@@ -0,0 +1,27 @@
+import axios from 'axios'
+
+// TODO: make this one as settings (or find an other solution)
+// https://dev.to/sanfra1407/how-to-use-env-file-in-javascript-applications-with-webpack-18df
+// switch (app_env) {
+//   case 'dev':
+//     let path = `http://${window.location.hostname}:8984`
+//     break;
+//   case 'prod':
+//     let path = `http://${window.location.hostname}/api`
+//     break;
+// }
+// let path = 'http://dev.api.gdp.fr'
+// let path = 'http://localhost:8984'
+// const
+// let path = 'http://' + window.location.hostname + (window.env === 'prod' ? '/api' : ':8984')
+
+export const GRAPHQL = axios.create({
+  baseURL: 'https://api.anarchive-muntadas.figli.io/graphql',
+  // withCredentials: true,
+  crossorigin: true,
+  headers: {
+    'Accept': 'application/json'
+    // 'Access-Control-Allow-Origin': '*'
+    // 'Access-Control-Allow-Credentials':
+  }
+})

src/store/modules/projects.js

@@ -1,5 +1,6 @@
-import qs from 'querystring'
-import { REST } from 'api/rest-axios'
+// import qs from 'querystring'
+// import { REST } from 'api/rest-axios'
+import { GRAPHQL } from 'api/graphql-axios'
 
 export default {
   namespaced: true,
@@ -124,19 +125,40 @@ export default {
   actions: {
     // async get authors
     getProjects ({ dispatch, commit, state }) {
-      let params = {
-        _sort: `weight:ASC`
-      }
-      let q = qs.stringify(params)
-      REST.get(`projects?` + q, {})
-        .then(({ data }) => {
-          console.log('projects getProjects REST: data', data)
-          commit('setProjects', data)
+      // GRAPHQL
+      let query = `query {
+        projects {
+          id
+          Weight
+          Titre
+        }
+      }`
+      GRAPHQL.post('', { query: query })
+        .then((resp) => {
+          console.log('graphql projects', resp)
         })
         .catch((error) => {
           console.warn('Issue with getProjects', error)
           Promise.reject(error)
         })
+
+      // REST
+      // let params = {
+      //   _sort: `weight:ASC`
+      // }
+      // let q = qs.stringify(params)
+      // REST.get(`projects?` + q, {})
+      //   .then(({ data }) => {
+      //     console.log('projects getProjects REST: data', data)
+      //     commit('setProjects', data)
+      //   })
+      //   .catch((error) => {
+      //     console.warn('Issue with getProjects', error)
+      //     Promise.reject(error)
+      //   })
+    },
+    build3dBuilding ({ dispatch, commit, state }) {
+
     }
   }