1
0
forked from PGL/Clyde

cleaning frontend

This commit is contained in:
2024-04-20 19:56:07 +02:00
parent 54d19eb888
commit f081b7206f
4 changed files with 22 additions and 151 deletions

View File

@ -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>