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>