From c9f7171f0ebac57b0c51d0cc6b0b46b027598fef Mon Sep 17 00:00:00 2001
From: Pedro Lopes <pedrolopeshls99@gmail.com>
Date: Thu, 1 Oct 2020 20:51:03 -0300
Subject: [PATCH] starting coment screen

---
 src/components/EventCard/EventCard.vue | 78 ++++++++++++++++++++++++++
 src/components/cpmCard.vue             |  2 +-
 src/router/index.js                    |  5 ++
 src/store/modules/EventVuex.js         | 21 +++++++
 src/views/private/Coment.vue           | 22 ++++++++
 5 files changed, 127 insertions(+), 1 deletion(-)
 create mode 100644 src/components/EventCard/EventCard.vue
 create mode 100644 src/views/private/Coment.vue

diff --git a/src/components/EventCard/EventCard.vue b/src/components/EventCard/EventCard.vue
new file mode 100644
index 0000000..d69380a
--- /dev/null
+++ b/src/components/EventCard/EventCard.vue
@@ -0,0 +1,78 @@
+<template>
+    <div>
+        <div class="p15 mt-10" v-for="(item, i) in dataEventResult" :key="i">
+
+            <v-card max-width="500" class="ac cp card-style-1">
+
+                <img :src='item.img' class="img-size">
+                
+                <div class="p10 alg-txt-s">
+                    <h4 class="clr-red">{{ item.eventDate }}</h4>
+                    <h1 class="mt-1">{{ item.title }}</h1>
+                    <span class="mt-2 display-b">Criado por <strong>{{ item.user.name }}</strong> </span>
+                </div>
+
+                <v-divider class="mt-2"></v-divider>
+                <div class="p10 d-flex">
+
+                    <div class="d-block">
+                        <v-avatar class="cp" color="orange" size="62">
+                            <v-icon v-if="!item.user.avatar" dark>mdi-account-circle</v-icon>
+                            <img v-else :src="item.user.avatar" alt="avatar" />
+                        </v-avatar>
+                    </div>
+
+                </div>
+               
+
+            </v-card>
+
+        </div>
+
+        <!-- <h1>conteuno: {{ eventDataId }}</h1> -->
+    </div>
+</template>
+<script>
+import {
+  mapActions, mapGetters
+} from 'vuex'
+export default {
+    data:() => ({
+        url:process.env.VUE_APP_BASE_URL,
+
+        dataEventResult:[]
+    }),
+
+    computed:{
+        ...mapGetters({
+            eventDataId: 'EventVuex/eventDataId'
+        })
+    },
+
+    methods:{
+
+        ...mapActions({
+            getEventById: 'EventVuex/getEventById'
+        }),
+
+        async getEventComents(){
+            
+            let resultRequest = await this.getEventById(3)
+            // console.log("jusadiosaihdsahiudsaihduiah")
+            // console.log(resultRequest)
+            this.dataEventResult.push(resultRequest)
+        }
+
+    },
+
+    created(){
+        this.getEventComents()
+    }
+}
+</script>
+<style>
+    .card-coment{
+        display: block;
+        border-top: 1px solid rgba(78, 78, 78, 0.644) !important
+    }
+</style>
\ No newline at end of file
diff --git a/src/components/cpmCard.vue b/src/components/cpmCard.vue
index e31a1c4..ebb1753 100644
--- a/src/components/cpmCard.vue
+++ b/src/components/cpmCard.vue
@@ -6,7 +6,7 @@
             <v-app-bar color="white" class="d-flex align-center" dense>
 
                 <v-avatar size="36" color="orange">
-                   <v-icon v-if="!card.user.avatar" dark>mdi-account-circle</v-icon>
+                    <v-icon v-if="!card.user.avatar" dark>mdi-account-circle</v-icon>
                     <img v-else :src="card.user.avatar" alt="avatar">
                 </v-avatar>
 
diff --git a/src/router/index.js b/src/router/index.js
index 949ee82..387f83e 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -51,6 +51,11 @@ const routes = [
         path: '/Profile',
         name: 'Profile',
         component: () => import('../views/private/Profile.vue')
+      },
+      {
+        path: '/Coment/1',
+        name: 'Coment',
+        component: () => import('../views/private/Coment.vue')
       }
 
     ]
diff --git a/src/store/modules/EventVuex.js b/src/store/modules/EventVuex.js
index 6220f1c..c197881 100644
--- a/src/store/modules/EventVuex.js
+++ b/src/store/modules/EventVuex.js
@@ -1,17 +1,38 @@
 
+import axios from '../../util/axios'
+
+
 export default {
 
   namespaced: true,
 
   state: {
+    eventDataId:''
   },
 
   getters: {
+    eventDataId: state=> state.eventDataId
   },
 
   mutations: {
+    setEventDataId(state, newState){
+      state.eventDataId = newState
+    }
   },
 
   actions: {
+    async getEventById(context, newData){
+
+      const eventResult = await axios.get(process.env.VUE_APP_BASE_URL + `/event/${newData}`)
+      try {
+        context.commit('setEventDataId', eventResult.data)
+        return eventResult.data
+      }
+
+      catch{
+        console.log(eventResult)
+      }
+
+    }
   }
 }
diff --git a/src/views/private/Coment.vue b/src/views/private/Coment.vue
new file mode 100644
index 0000000..b70b0b6
--- /dev/null
+++ b/src/views/private/Coment.vue
@@ -0,0 +1,22 @@
+<template>
+    <div>
+        <EventCard/>
+    </div>
+</template>
+<script>
+import EventCard from '../../components/EventCard/EventCard'
+export default {
+    components:{
+        EventCard
+    },
+    data:() => ({
+
+    }),
+    methods:{
+
+    },
+    created(){
+
+    }
+}
+</script>
\ No newline at end of file