keep going with api porting in nuxt

pages/Login.vue

@@ -16,7 +16,7 @@
 <script>
 import { mapActions } from 'vuex'
 import { Message } from 'element-ui'
-import api from '@/plugins/api'
+// import api from '@/plugins/api'
 
 export default {
   name: 'Login',
@@ -36,7 +36,7 @@ export default {
         return
       }
       this.loading = true
-      await api.forgotPassword(this.email)
+      // await api.forgotPassword(this.email)
       this.loading = false
       Message({ message: this.$t('Check your email!'), type: 'success' })
     },
@@ -44,7 +44,7 @@ export default {
       e.preventDefault()
       try {
         this.loading = true
-        const user = await api.login(this.email, this.password)
+        const user = await this.$axios.$post('/login', { email: this.email, password: this.password })
         this.loading = false
         if (!user) {
           Message({ message: this.$t('Login error'), type: 'error' })

pages/admin.vue

@@ -127,6 +127,10 @@ export default {
     // this.settings = await api.getAdminSettings()
     this.mastodon_instance = this.settings.mastodon_auth && this.settings.mastodon_auth.instance
   },
+  async asyncData ({ $axios, params }) {
+    const users = await $axios.$get('/users')
+    return { users }
+  },
   computed: {
     ...mapState(['tags', 'places']),
     paginatedEvents () {

pages/event/_id.vue

@@ -1,8 +1,9 @@
 <template lang="pug">
   b-modal#eventDetail(ref='eventDetail' hide-body hide-header hide-footer @hidden='$router.replace("/")' size='lg' :visible='true')
     b-card(no-body, :img-src='imgPath' v-loading='loading')
-      el-button.close_button(circle icon='el-icon-close' type='success'
-        @click='$refs.eventDetail.hide()')
+      nuxt-link(to='/')
+        el-button.close_button(circle icon='el-icon-close' type='success'
+          @click='$refs.eventDetail.hide()')
       b-card-header
         h3 {{event.title}}
         v-icon(name='clock')
@@ -40,7 +41,7 @@
 </template>
 <script>
 import { mapState, mapActions } from 'vuex';
-import api from '@/plugins/api'
+// import api from '@/plugins/api'
 //import filters from '@/filters'
 
 export default {
@@ -61,17 +62,25 @@ export default {
       loading: true,
     }
   },
-  mounted () {
-    this.id = this.$route.params.id
-    this.load()
+  // mounted () {
+  //   this.id = this.$route.params.id
+  //   this.load()
+  // },
+  async asyncData ( { $axios, params }) {
+    console.error('daje dentro asyncData!')
+    console.error('async data porcod')
+    const event = await $axios.$get(`/event/${params.id}`)
+    // this.event = event
+    // this.loading = false
+    return { event, id: params.id, loading: false }
   },
   methods: {
     ...mapActions(['delEvent']),
-    async load () {
-      const event = await api.getEvent(this.id)
-      this.event = event
-      this.loading = false
-    },
+    // async load () {
+    //   const event = await this.api.getEvent(this.id)
+    //   this.event = event
+    //   this.loading = false
+    // },
     async remove () {
       await api.delEvent(this.event.id)
       this.delEvent(this.event.id)
@@ -80,11 +89,12 @@ export default {
     async toggle () {
       try {
         if (this.event.is_visible) {
-
-          await api.unconfirmEvent(this.id)
+          await this.$axios.$get(`/event/unconfirm/${this.id}`)
+          // await api.unconfirmEvent(this.id)
           this.event.is_visible = false
         } else {
-          await api.confirmEvent(this.id)
+          await this.$axios.$get(`/event/confirm/${this.id}`)
+          // await api.confirmEvent(this.id)
           this.event.is_visible = true
         }
       } catch (e) {
@@ -95,6 +105,12 @@ export default {
 }
 </script>
 <style>
+
+/* #eventDetail {
+  display: block !important;
+  opacity: 1;
+} */
+
 #eventDetail .modal-body {
   padding: 0px;
   width: 100%;

pages/new_event.vue

@@ -62,7 +62,7 @@
 
 </template>
 <script>
-import api from '@/plugins/api'
+// import api from '@/plugins/api'
 import { mapActions, mapState } from 'vuex'
 import moment from 'dayjs'
 import Calendar from '@/components/Calendar'
@@ -110,7 +110,6 @@ export default {
       if (event.tags) {
         this.event.tags = event.tags.map(t => t.tag)
       }
-
     }
     this.updateMeta()
   },

pages/register.vue

@@ -6,14 +6,13 @@
       el-input.mb-2(ref='email' v-model='user.email' type='email'
         :placeholder='$t("Email")' autocomplete='email')
         span(slot='prepend') @
-      
+
       el-input.mb-2(v-model='user.password' type="password" placeholder="Password")
         v-icon(name='lock' slot='prepend')
 
       el-input.mb-2(v-model='user.description' type="textarea" rows='3' :placeholder="$t('Description')")
           v-icon(name='envelope-open-text')
 
-      
       el-button.float-right(plain type="success" icon='el-icon-arrow-right' @click='register') {{$t('Send')}}
 </template>
 
@@ -34,7 +33,8 @@ export default {
     ...mapActions(['login']),
     async register () {
       try {
-        const user = await api.register(this.user)
+        const user = await this.$axios.$post('/user', this.user) //api.register(this.user)
+        console.log(user)
         if (!user.is_admin) {
           this.$refs.modal.hide()
           Message({