Merging pull request #110 from fga-gpp-mds/us07_visualizar_gpa

src/components/GitHub/GitHubProjects.vue

@@ -64,81 +64,79 @@
 </template>
 
 <script>
-import { HTTP } from '../../http-common';
-
-export default{
-  data() {
-    return {
-      userRepos: [],
-      orgsRepos: [],
-      selectedRepos: [],
-    };
-  },
-  methods: {
-    getRepos() {
-      const token = localStorage.getItem('token');
-      const tokenSimple = token.replace(/"/, '');
-      const tokenSimple2 = tokenSimple.replace(/"/, '');
-      const headers = { Authorization: tokenSimple2 };
+  import { HTTP } from '../../http-common';
+  export default{
+    data() {
+      return {
+        userRepos: [],
+        orgsRepos: [],
+        selectedRepos: [],
+        user: ""
+      }
+    },
+    methods: {
+      getRepos() {
+        let token = localStorage.getItem('token');
+        let tokenSimple = token.replace(/"/, '');
+        let tokenSimple2 = tokenSimple.replace(/"/, '');
+        let headers = { Authorization:tokenSimple2 };
 
-      HTTP.get('repos', { headers })
-        .then((response) => {
+        HTTP.get("repos", { headers })
+        .then(response => {
           this.userRepos = response.data.user[1].repos;
           this.orgsRepos = response.data.orgs;
+          this.user = response.data.user[0].login;
         })
         .catch((e) => {
           this.errors.push(e);
         });
+      },
+      toggleButtonChanged(name, event) {
+        if (event.value === true) {
+          this.selectedRepos.push(name);
+        } else {
+          this.selectedRepos = this.selectedRepos.filter(item => item !== name);
+        }
+      },
+      importGithubProjects() {
+        doRequisitions(this.selectedRepos, this.selectedRepos.length)
+          .then((response) => { this.$emit('added'); })
+          .catch(e => console.log(e.message));
+      },
     },
-    toggleButtonChanged(name, event) {
-      if (event.value === true) {
-        this.selectedRepos.push(name);
-      } else {
-        this.selectedRepos = this.selectedRepos.filter(item => item !== name);
-      }
-    },
-    importGithubProjects() {
-      doRequisitions(this.selectedRepos, this.selectedRepos.length)
-        .then((response) => { this.$emit('added'); })
-        .catch(e => console.log(e.message));
-    },
-  },
-};
-
-function doRequisitions(repos, length) {
-  return new Promise((resolve, reject) => {
-    const rawToken = localStorage.getItem('token');
-    const token = rawToken.replace(/"/, '').replace(/"/, '');
-    const headers = { Authorization: token };
-    const userId = localStorage.getItem('user_id');
+  };
+  function doRequisitions(repos, length, user) {
+    return new Promise((resolve, reject) => {
+      const rawToken = localStorage.getItem('token');
+      const token = rawToken.replace(/"/, '').replace(/"/, '');
+      const headers = { Authorization: token };
+      const userId = localStorage.getItem('user_id');
 
-    let count = 0;
-    for (const repo of repos) {
-      HTTP.post(`users/${userId}/projects`, {
-        name: repo,
-        is_project_from_github: true,
-      }, { headers })
-        .then((response) => {
-          count++;
-          if (count === length) {
-            resolve(response);
-          }
-        })
-        .catch(e => reject(e));
-    }
-  });
-}
+      let count = 0;
+      for (const repo of repos) {
+        HTTP.post(`users/${userId}/projects`, {
+          name: repo,
+          github_slug: user + "/" + repo,
+          is_project_from_github: true,
+        }, { headers })
+          .then((response) => {
+            count++;
+            if (count === length) {
+              resolve(response);
+            }
+          })
+          .catch(e => reject(e));
+      }
+    });
+  }
 
 </script>
 
 <style scoped>
-
 .vue-js-switch {
   float: right;
 }
-
 .pointer-cursor {
   cursor: pointer;
 }
-
 </style>

src/components/Gpa.vue

@@ -0,0 +1,108 @@
+<template>
+	<div class="gpa">
+		<!-- <div class="card-body"> -->
+		    <div class="row align-itens-arround">
+		      <div class="col-5 align-content-center">
+		        <p class="card-text">
+		          <div class="number-circle">
+		            <div class="gpa-font v-green" v-if="gpa > 3">
+		            	{{gpa}}
+		            </div>
+								<div class="gpa-font v-red" v-else-if="gpa < 2">
+		            	{{gpa}}
+		            </div>
+								<div class="gpa-font v-yellow" v-else-if="gpa >= 2 && gpa <= 3">
+		            	{{gpa}}
+		            </div>
+		            <h4> GPA </h4>
+		          </div>
+		        </p>
+		      </div>
+		      <div class="col">
+		        <p class="card-text text-justify"> </p>
+		      </div>
+		    </div>
+		<!-- </div>		     -->
+	</div>
+</template>
+
+<script>
+import {HTTP} from '../http-common.js';
+export default {
+  	props: ['projectId'],
+  	data() {
+  		return {
+  			gpa: 0
+  		}
+  	},
+	methods: {
+	    async getGpa() {
+			var token = localStorage.getItem('token');
+			var tokenSimple = token.replace(/"/, "");
+			var tokenSimple2 = tokenSimple.replace(/"/, "");
+			var headers = { 'Authorization':tokenSimple2 };
+
+			try {
+					let response = await HTTP.get(`projects/${ this.$route.params.id }`, { headers:headers });
+					let id = response.data.id;
+					console.log(id);
+					const result2 = await HTTP.get(`projects/${id}/gpa`, { headers: headers });
+					console.log(result2);
+					this.gpa = result2.data;
+				} catch(err) {
+					console.log(err)
+				}
+	    }
+	},
+	mounted() {
+		this.getGpa();
+	}
+
+};
+
+</script>
+
+<style>
+
+.number-circle {
+  font: 32px Arial, sans-serif;
+
+  width: 2.5em;
+  height: 2.5em;
+  box-sizing: initial;
+
+  background: #fff;
+  border: 0.2em solid #7799A5;
+  border-style: solid;
+  color: #7799A5;
+  text-align: center;
+  border-radius: 50%;
+
+  line-height: 2.5em;
+  box-sizing: content-box;
+  top: 50%;
+  left: 50%;
+}
+
+.gpa-font {
+  font-weight:bolder;
+  font-size:1.2em;
+}
+
+.v-red{
+	color: red;
+}
+
+.v-yellow{
+	color: yellow;
+}
+
+.v-green{
+	color: green;
+}
+
+h4 {
+	margin-top: 0.5em;
+	font-weight:bolder;
+}
+</style>>

src/components/Projects/Project.vue

@@ -3,8 +3,15 @@
     <div class="row justify-content-center">
       <div class="col-md-10">
         <div class="card">
-          <div class="card-body text-center">
-            <h4 class="card-title">{{project.name}}</h4>
+            <div class="card-body text-center">
+              <div class="row">
+                <div class="col-md-4">
+                  <Gpa></Gpa>
+                </div>
+                <div class="col-md-3">
+                  <h4 class="card-title">{{project.name}}</h4>
+                </div>
+              </div>
             <p class="card-text text-muted">{{project.description}}</p>
           </div>
         </div>
@@ -18,7 +25,16 @@
         <delete-project></delete-project>
       </div>
       <div class="col-md-2" align="center">
-        <router-link v-bind:to="'/projects/'+project.id+'/releases'">
+      </div>
+      <div class="col-md-2" align="center">
+        <router-link v-bind:to="'/project/'+project.id+'/sprints'">
+          <button type="button" class="btn btn-info btn-md falko-button" id="sprints">
+            Sprints
+          </button>
+        </router-link>
+      </div>
+      <div class="col-md-2" align="center">
+        <router-link v-bind:to="'/project/'+project.id+'/releases'">
           <button type="button" class="btn btn-info btn-md falko-button">
             Releases
           </button>
@@ -29,6 +45,7 @@
 </template>
 
 <script>
+import Gpa from '../Gpa';
 import DeleteProject from './DeleteProject.vue';
 import EditProject from './EditProject.vue';
 import { HTTP } from '../../http-common';
@@ -38,6 +55,7 @@ export default{
   components: {
     'delete-project': DeleteProject,
     'edit-project': EditProject,
+     Gpa,
   },
   data() {
     return {
@@ -50,6 +68,7 @@ export default{
       const tokenSimple = token.replace(/"/, '');
       const tokenSimple2 = tokenSimple.replace(/"/, '');
       const headers = { Authorization: tokenSimple2 };
+      
       HTTP.get(`projects/${this.$route.params.id}`, { headers })
         .then((response) => {
           this.project = response.data;
@@ -74,5 +93,4 @@ export default{
 #buttons {
   margin-top: 1em;
 }
-
 </style>

src/components/Projects/Projects.vue

@@ -12,6 +12,9 @@
                 {{project.name}}
               </h4>
               <p class="card-text text-muted">{{project.description}}</p>
+              <div class="col-md-0" align="center">
+                <Gpa></Gpa>
+              </div>
             </div>
           </div>
         </router-link>
@@ -34,6 +37,7 @@ import AddProject from './AddProject.vue';
 import NoContent from '../NoContent.vue';
 import GitHubProjects from '../GitHub/GitHubProjects.vue';
 import { HTTP } from '../../http-common';
+import Gpa from '../Gpa';
 
 export default {
 
@@ -42,6 +46,7 @@ export default {
     'add-project': AddProject,
     'no-content': NoContent,
     'github-projects': GitHubProjects,
+     Gpa
   },
   data() {
     return {

src/router/index.js

@@ -22,6 +22,7 @@ import UserProfile from '@/components/Users/UserProfile';
 import EditUserProfile from '@/components/Users/EditUserProfile';
 import DeleteUserProfile from '@/components/Users/DeleteUserProfile';
 import NotFound from '@/components/NotFound';
+import Gpa from '@/components/Gpa';
 import Retrospective from '@/components/Retrospective/Retrospective'
 
 Vue.use(Router);
@@ -145,6 +146,11 @@ const router = new Router({
       name: 'NotFound',
       component: NotFound,
     },
+    {
+      path: '/gpa',
+      name: 'Gpa',
+      component: Gpa,
+    },
     {
       path: '/retrospectives/:id',
       name: 'Retrospective',