add banners

components/Navbar.vue

@@ -107,15 +107,17 @@ export default {
           icon: 'mdi-newspaper',
           title: 'Posts',
           to: '/posts'
+        },
+        {
+          icon: ' mdi-image-marker-outline',
+          title: 'Banners',
+          to: '/banners'
         }
       ],
       miniVariant: false,
       title: 'Homepage'
     }
   },
-  mounted () {
-    console.log('123')
-  },
   methods: {
     async logout () {
       try {

components/PageCarousels.vue

@@ -6,9 +6,9 @@
     show-arrows-on-hover
   >
     <v-carousel-item
-      v-for="(slide, i) in slides"
-      :key="i"
-      :src="img[i]"
+      v-for="(item, index) in banners"
+      :key="index"
+      :src="item.image"
     >
       <v-row
         class="fill-height"
@@ -16,7 +16,7 @@
         justify="center"
       >
         <div class="text-h2">
-          {{ slide }} Slide
+          {{ index +1 }}
         </div>
       </v-row>
     </v-carousel-item>
@@ -28,15 +28,37 @@ export default {
   name: 'PageCarousels',
   data () {
     return {
-      img: [
-        'https://d-themes.com/html/riode/images/demos/demo1/slides/slide1.jpg',
-        'https://d-themes.com/html/riode/images/demos/demo1/slides/slide2.jpg'
+      bannerss: [
+        { src: 'https://d-themes.com/html/riode/images/demos/demo1/slides/slide1.jpg', ordering: 0 },
+        { src: 'https://d-themes.com/html/riode/images/demos/demo1/slides/slide2.jpg', ordering: 1 }
       ],
+      banners: [],
       slides: [
         'First',
         'Second'
       ]
     }
+  },
+  mounted () {
+    this.getBanners()
+  },
+  methods: {
+    async getBanners () {
+      await this.$axios
+        .get('guest/banners/get-active-banners', {
+          headers: {
+            Authorization: `Bearer ${this.$auth.$storage.getUniversal(
+              'token'
+            )}`
+          }
+        })
+        .then((response) => {
+          this.banners = response.data.data
+        })
+        .catch(function (error) {
+          console.log(error)
+        })
+    }
   }
 }
 </script>