forked from fga-eps-mds/2021-2-PUMA-Frontend
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #16 from fga-eps-mds/feature/destaca-disciplinas
[#98] [#109] Destaca as disciplinas e lista professores
- Loading branch information
Showing
4 changed files
with
225 additions
and
30 deletions.
There are no files selected for viewing
102 changes: 99 additions & 3 deletions
102
puma/src/components/disciplina/consulta-disciplina/ConsultaDisciplina.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,101 @@ | ||
| <template src="./consulta-disciplina.html"></template> | ||
| <template> | ||
| <div class="main-content hidden-scroll-bar"> | ||
| <h1 class="tittle ml-4"> | ||
| Disciplinas | ||
| </h1> | ||
|
|
||
| <script src="./consulta-disciplina.js"></script> | ||
| <div class="tittle sub-tittle ml-4 mb-4"> | ||
| Disciplinas Cadastradas na Plataforma | ||
| </div> | ||
|
|
||
| <style src="./consulta-disciplina.css"></style> | ||
| <div class="ml-4 input-group"> | ||
| <input | ||
| v-model="subjectSearch" | ||
| type="text" | ||
| id="caixaPesquisa" | ||
| class="search-input" | ||
| placeholder="Pesquise por uma disciplina"> | ||
| <i class="fas fa-search input-group-prepend search-icon"></i> | ||
| </div> | ||
|
|
||
| <div> | ||
| <button | ||
| class="btn cd-btn ml-4 my-3" | ||
| onclick="window.location.href = '/disciplinas/cadastrar'"> | ||
| <i class="fa-solid fa-plus-square mr-2 add-project"></i>Criar Disciplina | ||
| </button> | ||
| </div> | ||
|
|
||
| <div class="tabelas"> | ||
| <ListagemConsultaDisciplinaComponent class="minhasDisciplinas" | ||
| :dataSubjects="mySubjects" | ||
| :subjectSearch="subjectSearch"/> | ||
|
|
||
| <hr class="mb-0 mt-5"> | ||
|
|
||
| <ListagemConsultaDisciplinaComponent class="demaisDisciplinas" | ||
| :dataSubjects="subjects" | ||
| :subjectSearch="subjectSearch"/> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script> | ||
| import SubjectService from '../../../services/SubjectService'; | ||
| import ListagemConsultaDisciplinaComponent from './ListagemConsultaDisciplinaComponent.vue'; | ||
| export default { | ||
| beforeMount() { | ||
| this.getSubjects(); | ||
| }, | ||
| components: { | ||
| ListagemConsultaDisciplinaComponent, | ||
| }, | ||
| data: () => ({ | ||
| subjectSearch: null, | ||
| isLoading: false, | ||
| wasLoaded: false, | ||
| isDeletingSubject: false, | ||
| subjects: [], | ||
| mySubjects: [], | ||
| subjectService: new SubjectService(), | ||
| }), | ||
| methods: { | ||
| getSubjects() { | ||
| this.$store.commit('OPEN_LOADING_MODAL', { title: 'Carregando...' }); | ||
| this.subjectService.getSubjects().then((response) => { | ||
| this.subjects = response.data; | ||
| this.$store.commit('CLOSE_LOADING_MODAL'); | ||
| this.separateSubjects(); | ||
| }).catch(() => { | ||
| this.$store.commit('CLOSE_LOADING_MODAL'); | ||
| this.makeToast('ERRO', 'Erro ao recuperar disciplinas', 'danger'); | ||
| }); | ||
| }, | ||
| separateSubjects() { | ||
| this.subjects.map((sub) => { | ||
| sub.professors.map((prof) => { | ||
| if (prof.userid === this.$store.getters.user.userId) { | ||
| this.mySubjects.push(sub); | ||
| this.subjects = this.subjects.filter((item) => ( | ||
| item.subjectid !== sub.subjectid)); | ||
| } | ||
| return prof; | ||
| }); | ||
| return null; | ||
| }); | ||
| }, | ||
| makeToast(toastTitle, toastMessage, toastVariant) { | ||
| this.$bvToast.toast(toastMessage, { | ||
| title: toastTitle, variant: toastVariant, solid: true, autoHideDelay: 4000, | ||
| }); | ||
| }, | ||
| }, | ||
| }; | ||
| </script> | ||
|
|
||
| <style src="./consulta-disciplina.css"> | ||
| </style> |
70 changes: 70 additions & 0 deletions
70
puma/src/components/disciplina/consulta-disciplina/ListagemConsultaDisciplinaComponent.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| <template> | ||
| <div class="mt-4"> | ||
| <h2 class="tittle sub-tittle ml-4">{{ title }}</h2> | ||
|
|
||
| <table> | ||
| <thead> | ||
| <tr> | ||
| <td>Nome</td> | ||
| <td>Professores</td> | ||
| <td></td> | ||
| </tr> | ||
| </thead> | ||
|
|
||
| <tr v-for="subject in listSubjects" :key="subject.subjectid"> | ||
| <td>{{subject.name}}</td> | ||
| <td> | ||
| <div v-for="professor in subject.professors" :key="professor.userid"> | ||
| {{professor.fullname}} | ||
| </div> | ||
| </td> | ||
| <td class="botao"> | ||
| <button | ||
| class="btn cd-btn" | ||
| @click="goToSubject(subject.subjectid)"> | ||
| <i class="fa-solid fa-circle-info mr-2 ml-0"></i>Ver Detalhes | ||
| </button> | ||
| </td> | ||
| </tr> | ||
|
|
||
| <div v-if="!listSubjects.length" class="no-results align-content-center mt-3"> | ||
| Sem Resultados Disponíveis | ||
| </div> | ||
| </table> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script> | ||
| export default { | ||
| props: { | ||
| title: String, | ||
| dataSubjects: Array, | ||
| subjectSearch: String, | ||
| }, | ||
| data: () => ({ | ||
| listSubjects: [], | ||
| }), | ||
| watch: { | ||
| dataSubjects() { | ||
| this.listSubjects = this.dataSubjects; | ||
| }, | ||
| subjectSearch() { | ||
| if (this.subjectSearch) { | ||
| this.listSubjects = this.dataSubjects.filter((item) => ( | ||
| item.name.toLowerCase().includes(this.subjectSearch.toLowerCase()))); | ||
| } else { | ||
| this.listSubjects = this.dataSubjects; | ||
| } | ||
| }, | ||
| }, | ||
| methods: { | ||
| goToSubject(id) { | ||
| this.$router.push({ path: `/disciplinas/visualizar/${id}` }); | ||
| }, | ||
| }, | ||
| }; | ||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters