From f081b7206fc7fc2ced2174796cd7536bcdd1593a Mon Sep 17 00:00:00 2001
From: Bartha Maxime <231026@umons.ac.be>
Date: Sat, 20 Apr 2024 19:56:07 +0200
Subject: [PATCH] cleaning frontend

---
 .../FilterComponent.vue                       |  25 +++-
 .../ScientificPublications/ListResearches.vue |   1 -
 .../ManageResearcherProfile.vue               | 114 +-----------------
 .../ResearcherProfile.vue                     |  33 +----
 4 files changed, 22 insertions(+), 151 deletions(-)

diff --git a/frontend/src/Apps/ScientificPublications/FilterComponent.vue b/frontend/src/Apps/ScientificPublications/FilterComponent.vue
index 2bba29b..3916001 100644
--- a/frontend/src/Apps/ScientificPublications/FilterComponent.vue
+++ b/frontend/src/Apps/ScientificPublications/FilterComponent.vue
@@ -8,11 +8,17 @@
 import { ref } from "vue";
 import {onClickOutside} from '@vueuse/core'
 const yearList = ref([])
+const yearCheckedList = ref([])
 const monthList = ref([])
+const monthCheckedList = ref([])
 const accessList = ref([])
+const accessCheckedList = ref([])
 const languageList = ref([])
+const languageCheckedList = ref([])
 const domainList = ref([])
+const domainCheckedList = ref([])
 const paperTypeList = ref([])
+const paperTypCheckedList = ref([])
 
 const filters = Object.assign({},{
   year:[],
@@ -23,6 +29,7 @@ const filters = Object.assign({},{
   paperType:[],
 })
 
+
 const props = defineProps({
   isOpen: Boolean,
   allArticles: ref([Object])
@@ -30,6 +37,12 @@ const props = defineProps({
 
 
 function submit(){
+  filters.paperType = paperTypCheckedList.value
+  filters.year = yearCheckedList.value
+  filters.month = monthCheckedList.value
+  filters.access = accessCheckedList.value
+  filters.language = languageCheckedList.value
+  filters.domain = domainCheckedList.value
   emit("modal-close")
   emit("submit", filters)
 }
@@ -96,12 +109,12 @@ onClickOutside(target, ()=>emit('modal-close'))
     <div class="modal-wrapper">
       <div class="modal-container" ref="target">
         <div id="filterGrid">
-          <div> Year :<ul class="checkers"> <li v-for="n in yearList"> <input type="checkbox" :value=n v-model="filters.year"> {{n}} </li> </ul> </div>
-          <div class="vl"> Access :<ul class="checkers"> <li v-for="n in accessList"> <input type="checkbox" :value=n v-model="filters.access"> {{n}} </li> </ul> </div>
-          <div class="vl"> Language :<ul class="checkers"> <li v-for="n in languageList"> <input type="checkbox" :value=n v-model="filters.language"> {{n}} </li> </ul> </div>
-          <div> Month :<ul class="checkers"> <li v-for="n in monthList"> <input type="checkbox" :value=n v-model="filters.month"> {{monthToString(n)}} </li> </ul> </div>
-          <div class="vl"> Domain :<ul class="checkers"> <li v-for="n in domainList"> <input type="checkbox" :value=n v-model="filters.domain"> {{n}} </li> </ul> </div>
-          <div class="vl"> PaperType :<ul class="checkers"> <li v-for="n in paperTypeList"> <input type="checkbox" :value=n v-model="filters.paperType"> {{n}} </li> </ul> </div>
+          <div> Year :<ul class="checkers"> <li v-for="n in yearList"> <input type="checkbox" :value=n v-model="yearCheckedList"> {{n}} </li> </ul> </div>
+          <div class="vl"> Access :<ul class="checkers"> <li v-for="n in accessList"> <input type="checkbox" :value=n v-model="accessCheckedList"> {{n}} </li> </ul> </div>
+          <div class="vl"> Language :<ul class="checkers"> <li v-for="n in languageList"> <input type="checkbox" :value=n v-model="languageCheckedList"> {{n}} </li> </ul> </div>
+          <div> Month :<ul class="checkers"> <li v-for="n in monthList"> <input type="checkbox" :value=n v-model="monthCheckedList"> {{monthToString(n)}} </li> </ul> </div>
+          <div class="vl"> Domain :<ul class="checkers"> <li v-for="n in domainList"> <input type="checkbox" :value=n v-model="domainCheckedList"> {{n}} </li> </ul> </div>
+          <div class="vl"> PaperType :<ul class="checkers"> <li v-for="n in paperTypeList"> <input type="checkbox" :value=n v-model="paperTypCheckedList"> {{n}} </li> </ul> </div>
       </div>
         <div id="submit">
           <button @click.stop="submit">Submit</button>
diff --git a/frontend/src/Apps/ScientificPublications/ListResearches.vue b/frontend/src/Apps/ScientificPublications/ListResearches.vue
index 0997383..ecae20c 100644
--- a/frontend/src/Apps/ScientificPublications/ListResearches.vue
+++ b/frontend/src/Apps/ScientificPublications/ListResearches.vue
@@ -36,7 +36,6 @@ const closeFilter = () => {
 };
 const submitFilters = (receivedFilters)=>{
   filters.value = receivedFilters
-  console.log(filters.value)
 }
 
 
diff --git a/frontend/src/Apps/ScientificPublications/ManageResearcherProfile.vue b/frontend/src/Apps/ScientificPublications/ManageResearcherProfile.vue
index 41dc3c9..c476423 100644
--- a/frontend/src/Apps/ScientificPublications/ManageResearcherProfile.vue
+++ b/frontend/src/Apps/ScientificPublications/ManageResearcherProfile.vue
@@ -1,77 +1,20 @@
 <script setup>
 import { ref} from "vue";
-import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
-import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";
 import {fetchResearches, } from "@/rest/ScientificPublications/ResearcherProfile.js";
 import {getSelf, patchProfile} from "@/rest/ScientificPublications/ManageResearcherProfile.js";
 import ResearchPostComponent from "@/Apps/ScientificPublications/ResearchPostComponent.vue";
 import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
 const input = ref("");
-const isFilterOpened = ref(false);
-const isResearchOpened = ref(false);
 const isPostResearchOpened = ref(false);
-const articleToDisplay = ref()
 const changing = ref(false);
 
 let toModify= Object.assign({}, {});
 
 const researcher = ref(await getSelf());
 const researchList = ref(await fetchResearches(researcher.value.id));
-//todo get the filters
-
-const openFilter = () => {
-  isFilterOpened.value = true;
-};
-const closeFilter = () => {
-  isFilterOpened.value = false;
-};
-const submitFilters = ()=>{
-}
-const openResearch = (article) => {
-  isResearchOpened.value = true;
-  articleToDisplay.value = article;
-}
-
-const closeResearch = () => {
-  isResearchOpened.value =false;
-  articleToDisplay.value = null;
-}
-
 function openPostResearch(){
   isPostResearchOpened.value = true
 }
-
-
-function searchInList(list, searchInput) {
-  let retList = []
-  for (let i = 0; i < list.length; i++) {
-    if (lDistance(list[i].title, searchInput) < 10 || list[i].title.toUpperCase().indexOf(searchInput.toUpperCase()) > -1){
-      retList.push(list[i])
-    }
-  }
-  return retList
-}
-
-function lDistance(s,t){
-  if (!s.length) return t.length;
-  if (!t.length) return s.length;
-  const arr = [];
-  for (let i = 0; i <= t.length; i++) {
-    arr[i] = [i];
-    for (let j = 1; j <= s.length; j++) {
-      arr[i][j] =
-          i === 0
-              ? j
-              : Math.min(
-                  arr[i - 1][j] + 1,
-                  arr[i][j - 1] + 1,
-                  arr[i - 1][j - 1] + (s[j - 1] === t[i - 1] ? 0 : 1)
-              );
-    }
-  }
-  return arr[t.length][s.length];
-}
-
 function cancelChanges(){
   changing.value = false
   toModify= Object.assign({}, {});
@@ -91,8 +34,6 @@ async function modifiedResearch(){
 </script>
 
 <template> <div class="body"><div id="main">
-    <FilterComponent :isOpen="isFilterOpened" :allArticles="researchList" @modal-close="closeFilter" @submit="submitFilters()"></FilterComponent>
-    <ArticleComponent :article="articleToDisplay" :isOpen="isResearchOpened" :manage="true" @modal-close="closeResearch" @modified="modifiedResearch" ></ArticleComponent>
     <ResearchPostComponent :researcher="researcher" :isOpen="isPostResearchOpened" @modal-close="isPostResearchOpened = false" @posted="modifiedResearch"></ResearchPostComponent>
     <div id="profilePicture">
       <img src="/Clyde.png" />
@@ -126,7 +67,7 @@ async function modifiedResearch(){
 
 
     </div>
-    <div id="researches"> <ListResearches :research-list="researchList" :manage="true" @modified="modifiedResearch"></ListResearches> </div>
+    <div> <ListResearches :research-list="researchList" :manage="true" @modified="modifiedResearch"></ListResearches> </div>
   </div>
 </div>
 </template>
@@ -187,6 +128,7 @@ async function modifiedResearch(){
   font-size: xx-large;
   background-color:rgba(191, 64, 191,0.5);
   border-radius: 20px;
+  margin-bottom: 20px;
 }
 
 .modifyButton:hover{
@@ -219,61 +161,9 @@ async function modifiedResearch(){
   background: #4cd964;
 }
 
-#search{
-  width: 100%;
-  height: 10%;
-  display: inline-flex;
-}
-#search-input {
-  margin-left: 25px;
-  width: 75%;
-  font-size: 16px;
-  padding: 12px 20px 12px 40px;
-  border: 1px solid #ddd;
-  height: 20px;
-  align-self: center;
-}
-
-#filterButton {
-  align-self: center;
-  margin-left: 2px;
-  font-size: xx-large;
-  color: white;
-  background: rgba(191, 64, 191,0.5);
-  border:2px solid black;
-}
-#filterButton:hover{
-  background: rgba(191, 64, 191);
-}
-
-
-#researchUL {
-  list-style-type: none;
-  color: white;
-  padding: 12px;
-  margin: 5px;
-  height: 400px;
-  overflow: scroll;
-}
-#researchLi{
-  display: grid;
-  grid-template-columns: auto auto auto;
-  border: 2px solid black;
-  color: white;
-  font-size: x-large;
-  text-align: center;
-  text-indent: 7px;
-  background-color: rgba(255, 255, 255, 0.09);
-  border-radius: 18px;
-  margin-bottom: 15px;
-}
 a{
   color:#007aff;
   text-decoration: underline;
   cursor: pointer;
 }
-
-.vl {
-  border-right: 2px solid black;
-}
 </style>
\ No newline at end of file
diff --git a/frontend/src/Apps/ScientificPublications/ResearcherProfile.vue b/frontend/src/Apps/ScientificPublications/ResearcherProfile.vue
index 91a015b..d91000c 100644
--- a/frontend/src/Apps/ScientificPublications/ResearcherProfile.vue
+++ b/frontend/src/Apps/ScientificPublications/ResearcherProfile.vue
@@ -7,17 +7,11 @@
 
 <script setup>
 import { ref, reactive } from "vue";
-import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
-import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";
-import {fetchResearcher, fetchResearches, fetchStats, fetchResearch} from "@/rest/ScientificPublications/ResearcherProfile.js";
-import {getFile, addView} from "@/rest/ScientificPublications/ManageResearch.js";
+import {fetchResearcher, fetchResearches, fetchStats} from "@/rest/ScientificPublications/ResearcherProfile.js";
 import ListResearches from "@/Apps/ScientificPublications/ListResearches.vue";
 const input = ref("");
 const statsOf = ref("");
 const statsBy = ref("");
-const isFilterOpened = ref(false);
-const isResearchOpened = ref(false);
-const articleToDisplay = ref(Object)
 let chart;
 
 const researcherId = window.location.href.split("=")[1]
@@ -27,29 +21,6 @@ const researchList = ref(await fetchResearches(researcherId));
 const researcher = ref(await fetchResearcher(researcherId));
 const stats = ref(await fetchStats(researcherId))
 
-const closeFilter = () => {
-  isFilterOpened.value = false;
-};
-const submitFilters = ()=>{
-}
-
-const closeResearch = () => {
-  isResearchOpened.value =false;
-  articleToDisplay.value = null;
-}
-
-const downloadBibTex = (research) => {
-  getFile(research.bibTexLocation)
-}
-
-async function downloadArticle (research) {
-  await addView(research.pdfLocation)
-  await getFile(research.pdfLocation)
-  articleToDisplay.value = await fetchResearch(articleToDisplay.value.id)
-  stats.value = await fetchStats(researcher.value.id)
-  update()
-}
-
 function downloadCoAuthors(){
   let coAuthors = []
   for (let i in researchList.value) {
@@ -100,8 +71,6 @@ function update(){
 
 <template>
   <div id="main">
-    <FilterComponent :isOpen="isFilterOpened" :allArticles="researchList" @modal-close="closeFilter" @submit="submitFilters()"></FilterComponent>
-    <ArticleComponent :article="articleToDisplay" :isOpen="isResearchOpened" :manage="false" @modal-close="closeResearch" @downloadPdf="downloadArticle(articleToDisplay)" @downloadBibTex="downloadBibTex(articleToDisplay)"></ArticleComponent>
     <div id="profilePicture">
       <img src="/Clyde.png" />
     </div>