filter and abstraction of researchList
This commit is contained in:
@ -1,28 +1,45 @@
|
||||
<script setup>
|
||||
import { ref} from "vue";
|
||||
import {ref, watch} from "vue";
|
||||
import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
|
||||
import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";
|
||||
import { fetchAllResearches, addView} from "@/rest/ScientificPublications/ManageResearch.js";
|
||||
import {fetchAllResearches} from "@/rest/ScientificPublications/ManageResearch.js";
|
||||
const input = ref("")
|
||||
const isFilterOpened = ref(false);
|
||||
const isResearchOpened = ref(false);
|
||||
const articleToDisplay = ref(Object)
|
||||
|
||||
const researchList = ref(await fetchAllResearches());
|
||||
const isResearcher = ref(false)
|
||||
const filters = ref(null)
|
||||
const researchList = ref(await fetchAllResearches())
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
filters: ref([""]),
|
||||
researchList:ref(),
|
||||
manage:Boolean
|
||||
});
|
||||
|
||||
if (typeof props.researchList !== 'undefined'){
|
||||
researchList.value = props.researchList
|
||||
}
|
||||
watch(
|
||||
() => props.researchList,
|
||||
(newValue) => {
|
||||
researchList.value = newValue
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
const openFilter = () => {
|
||||
isFilterOpened.value = true;
|
||||
};
|
||||
const closeFilter = () => {
|
||||
isFilterOpened.value = false;
|
||||
};
|
||||
const submitFilters = ()=>{
|
||||
const submitFilters = (receivedFilters)=>{
|
||||
filters.value = receivedFilters
|
||||
console.log(filters.value)
|
||||
}
|
||||
|
||||
|
||||
const openResearch = (article) => {
|
||||
isResearchOpened.value = true;
|
||||
articleToDisplay.value = article;
|
||||
@ -42,7 +59,20 @@ function searchInList(list, searchInput) {
|
||||
retList.push(list[i])
|
||||
}
|
||||
if (!isResearcher.value && (lDistance(list[i].title, searchInput) < 10 || list[i].title.toUpperCase().indexOf(searchInput.toUpperCase()) > -1)){
|
||||
retList.push(list[i])
|
||||
|
||||
if (filters.value === null) {
|
||||
retList.push(list[i])
|
||||
continue;
|
||||
}
|
||||
if ( (filters.value.access.length === 0 || filters.value.access.includes(list[i].access))
|
||||
&& ( filters.value.domain.length === 0|| filters.value.domain.includes(list[i].domain))
|
||||
&& ( filters.value.paperType.length === 0 || filters.value.paperType.includes(list[i].paperType))
|
||||
&& ( filters.value.year.length === 0|| filters.value.year.includes(list[i].releaseDate.split("-")[0]))
|
||||
&& ( filters.value.month.length === 0|| filters.value.month.includes(list[i].releaseDate.split("-")[1]))
|
||||
&& ( filters.value.language.length === 0|| filters.value.language.includes(list[i].language)))
|
||||
{
|
||||
retList.push(list[i])
|
||||
}
|
||||
}
|
||||
}
|
||||
return retList
|
||||
@ -68,17 +98,19 @@ function lDistance(s,t){
|
||||
return arr[t.length][s.length];
|
||||
}
|
||||
|
||||
const emit = defineEmits(["modified"]);
|
||||
|
||||
</script>
|
||||
|
||||
<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" ></ArticleComponent>
|
||||
<div id="researches">
|
||||
<FilterComponent :isOpen="isFilterOpened" :allArticles="researchList" @modal-close="closeFilter" @submit="submitFilters"></FilterComponent>
|
||||
<ArticleComponent :article="articleToDisplay" :isOpen="isResearchOpened" :manage="props.manage" @modal-close="closeResearch" @modified="emit('modified')"></ArticleComponent>
|
||||
<div id="researches">
|
||||
<div id="search">
|
||||
<input v-if="!isResearcher" type="text" id="search-input" placeholder="search for researches" v-model="input"/>
|
||||
<input v-else type="text" id="search-input" placeholder="search for researcher" v-model="input"/>
|
||||
<button id="filterButton" @click="openFilter"> Filters </button>
|
||||
<button v-if="!isResearcher" id="filterButton" @click="openFilter"> Filters </button>
|
||||
<button v-if="!isResearcher" id="unToggledResearchButton" @click="isResearcher = !isResearcher"> Toggle Researcher Search</button>
|
||||
<button v-if="isResearcher" id="toggledResearchButton" @click="isResearcher = !isResearcher"> UnToggle Researcher Search</button>
|
||||
</div>
|
||||
@ -87,7 +119,8 @@ function lDistance(s,t){
|
||||
<div class="vl"> {{n.title}}</div>
|
||||
<div class="vl"> <a :href="'#/researcher-profile?id=' + n.researcher.id"> {{ n.researcher.user.firstName +" "+ n.researcher.user.lastName }}</a>
|
||||
</div>
|
||||
<a @click="openResearch(n)"> MoreInfo </a></li>
|
||||
<a v-if="!manage" @click="openResearch(n)"> MoreInfo </a>
|
||||
<a v-else @click="openResearch(n)"> Modify Research</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -95,11 +128,6 @@ function lDistance(s,t){
|
||||
|
||||
<style scoped>
|
||||
|
||||
#main {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#search{
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
@ -161,7 +189,7 @@ a{
|
||||
#unToggledResearchButton{
|
||||
align-self: center;
|
||||
margin-left: 2px;
|
||||
font-size: large;
|
||||
font-size:16px ;
|
||||
color: white;
|
||||
background: #2a1981;
|
||||
border:2px solid black;
|
||||
|
||||
Reference in New Issue
Block a user