<script setup>

import FilterComponent from "@/Apps/ScientificPublications/FilterComponent.vue";
import ArticleComponent from "@/Apps/ScientificPublications/ResearchComponent.vue";


</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" @downloadPdf="downloadArticle(articleToDisplay)" @downloadBibTex="downloadBibTex(articleToDisplay)"></ArticleComponent>
  <div id="researches">
    <div id="search">
      <input type="text" id="search-input" placeholder="search for researches" v-model="input"/>
      <button id="filterButton" @click="openFilter">  Filters </button>
    </div>
    <ul id="researchUL">
      <li id="researchLi" v-for="n in searchInList(researchList,input)">
        <div class="vl"> {{n.title}}</div>
        <div class="vl"> {{ n.researcher.user.firstName +" "+ n.researcher.user.lastName }}</div>
        <a @click="openResearch(n)"> MoreInfo  </a></li>
    </ul>
  </div>
</div>
</template>

<style scoped>

</style>