Skip to content

Commit 1fed881

Browse files
Daniel-AlvarengaDaniel-Alvarenga
authored
Merge pull request VitorCarvalho67#33 from Daniel-Alvarenga/main
Vaga view
2 parents 0bccafe + 204a8e9 commit 1fed881

File tree

15 files changed

+330
-20
lines changed

15 files changed

+330
-20
lines changed

‎client/src/components/aluno/AsideDashboard.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
</router-link>
3434
</li>
3535
<li :class="getClassForPage('estagios')">
36-
<router-link to="">
36+
<router-link to="/vagas">
3737
<img :src="icons.job">
3838
<p v-if="showPs">Estágios</p>
3939
</router-link>

‎client/src/router/routes/shared.js

+6
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import PublicPerfilAluno from '../../views/shared/PerfilAluno.vue';
44
import PublicPerfilProfessor from '../../views/shared/PerfilProfessor.vue';
55
import Pesquisa from '../../views/shared/Pesquisa.vue';
66
import Vagas from '../../views/shared/Vagas.vue';
7+
import Vaga from '../../views/shared/Vaga.vue';
78
import { isAuthSomebody } from '../guards/guards';
89

910
export const sharedRoutes = [
@@ -40,6 +41,11 @@ export const sharedRoutes = [
4041
name: 'Vagas',
4142
component: Vagas
4243
},
44+
{
45+
path: '/vaga/:id',
46+
name: 'Vaga',
47+
component: Vaga
48+
},
4349
{
4450
path: '/:pathMatch(.*)*',
4551
name: 'NotFound',

‎client/src/scss/pages/shared/_vaga.scss

+78
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
main {
2+
@include flex(row, flex-start, start);
3+
height: calc(100vh - 80px);
4+
background-color: $primary-color-dark;
5+
.content {
6+
height: calc(100vh - 80px);
7+
width: 100%;
8+
background-color: $primary-color-dark;
9+
@include flex(column, flex-start, start);
10+
padding: 20px 100px;
11+
12+
.vaga-header {
13+
h3 {
14+
@include font-inter(700);
15+
font-size: 2rem;
16+
color: $font-color-dark;
17+
}
18+
19+
.status {
20+
@include font-inter(300);
21+
font-size: 1rem;
22+
color: $font-color-dark-2;
23+
}
24+
}
25+
26+
.vaga-info {
27+
margin-top: 20px;
28+
29+
h2 {
30+
@include font-inter(700);
31+
font-size: 1.5rem;
32+
color: $secondary-color-orange;
33+
margin-bottom: 10px;
34+
}
35+
36+
.requisitos, .beneficios {
37+
list-style: none;
38+
padding: 0;
39+
margin: 0;
40+
41+
li {
42+
margin-bottom: 5px;
43+
44+
p {
45+
@include font-inter(300);
46+
font-size: 1rem;
47+
color: $font-color-dark-2;
48+
}
49+
}
50+
}
51+
52+
.vaga-details, .vaga-remuneracao {
53+
margin-top: 20px;
54+
55+
p {
56+
@include font-inter(300);
57+
font-size: 1rem;
58+
color: $font-color-dark-2;
59+
60+
strong {
61+
font-weight: 700;
62+
}
63+
}
64+
}
65+
66+
.descricao {
67+
margin-top: 20px;
68+
margin-bottom: 20px;
69+
70+
p {
71+
@include font-inter(300);
72+
font-size: 1rem;
73+
color: $font-color-dark-2;
74+
}
75+
}
76+
}
77+
}
78+
}

‎client/src/scss/pages/shared/_vagas.scss

+14-6
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,8 @@
33

44
main {
55
@include flex(row, flex-start, start);
6-
width: 100vw;
7-
height: 100vh;
8-
min-height: calc(100vh - 80px);
9-
border-bottom: 1px solid #0000008f;
6+
height: calc(100vh - 80px);
107
background-color: $primary-color-dark;
11-
position: relative;
128

139
.content {
1410
@include flex(column, flex-start, start);
@@ -88,7 +84,7 @@
8884
.vaga {
8985
@include flex(column, flex-start, start);
9086
width: 80%;
91-
height: 90px;
87+
height: 140px;
9288
margin-bottom: 10px;
9389

9490
@include m-screen(1400px) {
@@ -130,6 +126,18 @@
130126

131127
.contentVaga {
132128
@include flex(column, flex-start, start);
129+
width: 70%;
130+
131+
.info{
132+
@include flex(row, space-between, start);
133+
width: 100%;
134+
135+
label {
136+
@include font-inter(600);
137+
color: $primary-color-dark;
138+
139+
}
140+
}
133141
}
134142

135143
.box-button{

‎client/src/services/api/shared.js

+12
Original file line numberDiff line numberDiff line change
@@ -50,4 +50,16 @@ export const getVagas = async () => {
5050
} catch (error) {
5151
return error.response.data;
5252
}
53+
}
54+
55+
export const getVaga = async (id) => {
56+
try {
57+
const response = await api.get('shared/vaga', {
58+
params: id
59+
});
60+
console.log(response.data.alunos);
61+
return response;
62+
} catch (error) {
63+
return error.response.data;
64+
}
5365
}

‎client/src/views/shared/PerfilAluno.vue

-1
Original file line numberDiff line numberDiff line change
@@ -359,7 +359,6 @@ export default {
359359
this.aluno.rm = this.$route.params.rm;
360360
await this.getCurriculoAluno();
361361
await this.possuiVinculo();
362-
await this.getCurriculoAluno();
363362
364363
console.log(this.conected);
365364

‎client/src/views/shared/Pesquisa.vue

+4-2
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,9 @@
2020
</div>
2121
</a>
2222
</li>
23-
<p class="resultado" v-else v-text="filteredUsers.length + ' resultados encontrados para sua busca'"></p>
23+
<p class="resultado" v-else v-text="(filteredUsers.length > 1)?
24+
filteredUsers.length + ' resultados encontrados para sua busca' :
25+
filteredUsers.length + ' resultado encontrado para sua busca'"></p>
2426
<li class="user" v-for="(estudante, index) in filteredUsers" :key="index">
2527
<router-link :to="'/aluno/profile/' + estudante.rm">
2628
<img v-if="estudante.imageUrl == 'default'" src="../../assets/icons/artwork.png" :alt="estudante.name">
@@ -39,8 +41,8 @@
3941
</ul>
4042
</section>
4143
</main>
44+
<Footer />
4245
</div>
43-
<Footer />
4446
</template>
4547

4648
<script>

‎client/src/views/shared/Vaga.vue

+128
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
<template>
2+
<Header />
3+
<div id="app">
4+
<main>
5+
<AsideDashboard v-if="aluno.email" pageName="estagios"/>
6+
<div class="content">
7+
<div class="vaga-header">
8+
<h3 v-text="vaga.titulo"></h3>
9+
<router-link :to="'/empresa/' + vaga.empresa.cnpj">{{ vaga.empresa.name }}</router-link>
10+
<p class="status" v-text="situacao[vaga.status]"></p>
11+
</div>
12+
13+
<section class="vaga-info">
14+
<h2>Requisitos</h2>
15+
<ul class="requisitos">
16+
<li v-for="(requisito, index) in parsedRequisitos" :key="index">
17+
<p v-text="requisito"></p>
18+
</li>
19+
</ul>
20+
21+
<div class="vaga-details">
22+
<p><strong>Carga Horária:</strong> <span v-text="vaga.cargaHoraria"></span></p>
23+
<p><strong>Entrada:</strong> <span v-text="vaga.entrada"></span></p>
24+
<p><strong>Saída:</strong> <span v-text="vaga.saida"></span></p>
25+
</div>
26+
27+
<section class="descricao">
28+
<h2>Descrição</h2>
29+
<div class="vaga-remuneracao">
30+
<p><strong>Remuneração:</strong> <span v-text="vaga.remuneracao"></span></p>
31+
</div>
32+
<p v-text="vaga.descricao"></p>
33+
</section>
34+
35+
36+
<h2>Benefícios</h2>
37+
<ul class="beneficios">
38+
<li v-for="(beneficio, index) in parsedBeneficios" :key="index">
39+
<p v-text="beneficio"></p>
40+
</li>
41+
</ul>
42+
</section>
43+
</div>
44+
</main>
45+
</div>
46+
<Footer />
47+
</template>
48+
49+
<script>
50+
import Header from '../../components/Header.vue';
51+
import Footer from '../../components/Footer.vue';
52+
import AsideDashboard from '../../components/aluno/AsideDashboard.vue';
53+
import router from '../../router/index.js';
54+
import Cookies from 'js-cookie';
55+
import { getVaga } from '../../services/api/shared';
56+
import {
57+
getMeAluno,
58+
} from '../../services/api/aluno';
59+
60+
export default {
61+
name: 'Vaga',
62+
components: {
63+
Header,
64+
AsideDashboard,
65+
Footer
66+
},
67+
data() {
68+
return {
69+
vaga: {
70+
requisitos: '[]',
71+
beneficios: '[]'
72+
},
73+
aluno: {
74+
email: '',
75+
token: ''
76+
},
77+
situacao: {
78+
"DISPONIVEL": "Vaga disponível",
79+
"INDISPONIVEL": "Vaga indisponível"
80+
}
81+
};
82+
},
83+
computed: {
84+
parsedRequisitos() {
85+
return JSON.parse(this.vaga.requisitos);
86+
},
87+
parsedBeneficios() {
88+
return JSON.parse(this.vaga.beneficios);
89+
}
90+
},
91+
methods: {
92+
async getVaga() {
93+
try {
94+
const response = await getVaga({ id: this.$route.params.id });
95+
if (response.status >= 200 && response.status < 300) {
96+
this.vaga = response.data.vaga;
97+
} else {
98+
console.error("Erro ao recuperar os dados da vaga:", response.message);
99+
}
100+
} catch (error) {
101+
console.error("Erro ao recuperar os dados da vaga:", error.message);
102+
}
103+
},
104+
async testAluno(){
105+
this.aluno.token = Cookies.get('token');
106+
107+
if(this.aluno.token){
108+
const responseMail = await getMeAluno(this.aluno.token);
109+
if (responseMail.status >= 200 && responseMail.status < 300) {
110+
this.aluno.email = responseMail.data.email;
111+
} else{
112+
console.log("Erro ao buscar aluno");
113+
}
114+
} else {
115+
console.log("Token de aluno não encontrado");
116+
}
117+
}
118+
},
119+
async created() {
120+
await this.testAluno();
121+
await this.getVaga();
122+
}
123+
};
124+
</script>
125+
126+
<style lang="scss" scoped>
127+
@import "../../scss/pages/shared/vaga.scss";
128+
</style>

‎client/src/views/shared/Vagas.vue

+24-9
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
<Header />
33
<div id="app">
44
<main>
5-
<AsideDashboard v-if="aluno.connected" pageName="pesquisa" />
5+
<AsideDashboard v-if="aluno.connected" pageName="estagios" />
66
<section class="content">
77
<div class="search">
88
<div class="box">
9-
<input type="text" placeholder="Buscar usuário" v-model="busca" @keyup.enter="filterVagas">
9+
<input type="text" placeholder="Buscar estágio" v-model="busca" @keyup.enter="filterVagas">
1010
<button @click="filterVagas">
1111
<img :src="icons.search" alt="Buscar">
1212
</button>
@@ -20,16 +20,31 @@
2020
</div>
2121
</a>
2222
</li>
23-
<p class="resultado" v-else v-text="filteredVagas.length + ' resultados encontrados para sua busca'"></p>
23+
<p class="resultado" v-else v-text="(filteredVagas.length > 1)?
24+
filteredVagas.length + ' resultados encontrados para sua busca' :
25+
filteredVagas.length + ' resultado encontrado para sua busca'"></p>
2426
<li class="vaga" v-for="(vaga, index) in filteredVagas" :key="index">
25-
<router-link :to="'/aluno/profile/' + vaga.titulo">
27+
<router-link :to="'/vaga/' + vaga.id">
2628
<div class="infoVaga">
2729
<div class="contentVaga name">
2830
<p class="who">{{ vaga.titulo }}</p>
29-
<p>{{ vaga.remuneracao }}</p>
30-
<p>{{ vaga.cargaHoraria }}</p>
31-
<p>{{ vaga.endereco }}</p>
32-
<p>{{ vaga.curso }}</p>
31+
32+
<div class="info">
33+
<label>Salário</label>
34+
<p v-text="vaga.remuneracao"></p>
35+
</div>
36+
<div class="info">
37+
<label>Carga horária</label>
38+
<p v-text="vaga.cargaHoraria"></p>
39+
</div>
40+
<div class="info">
41+
<label>Oferecida por</label>
42+
<p v-text="vaga.empresa"></p>
43+
</div>
44+
<div class="info">
45+
<label>Curso preferencial</label>
46+
<p v-text="vaga.curso"></p>
47+
</div>
3348
</div>
3449
<div class="box-button">
3550
<button>Ver vaga</button>
@@ -40,8 +55,8 @@
4055
</ul>
4156
</section>
4257
</main>
58+
<Footer />
4359
</div>
44-
<Footer />
4560
</template>
4661

4762
<script>

0 commit comments

Comments
 (0)