Skip to content
Snippets Groups Projects
Commit 86d4feb1 authored by lfr20's avatar lfr20
Browse files

fixed search

parent b3c2530e
Branches
Tags
3 merge requests!73Develop,!69Fixed upload page: recaptcha not implemented, lack of blocking (part one, two,...,!68Fix search production
Show whitespace changes
Inline Side-by-side
src/Components/SearchExpansionPanel/SearchExpansionPanel.js
+ 1
− 1
View file @ 86d4feb1
......@@ -86,7 +86,7 @@ export default function SearchExpansionPanel(props) {
})
}
else
props.onChange("tag", keyWords)
props.setTag(keyWords)
}
}
......
src/Components/SearchPageComponents/FilterSummary.js
+ 62
− 128
View file @ 86d4feb1
......@@ -13,8 +13,6 @@ export default function FilterSummary
Resumo dos filtros colocados
</h3>
<Grid container direction='column' spacing={2}>
{
curriculumComponents.length >= 1 ?
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
......@@ -23,29 +21,16 @@ export default function FilterSummary
<Grid item>
{
curriculumComponents.map((item) => {
if (item.isChecked)
return (
item.isChecked &&
<StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
);
})
}
</Grid>
</Grid>
</Grid>
:
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Componentes curriculares:
</Grid>
<Grid item>
<StyledChip size="small" label="Nenhum selecionado" />
</Grid>
</Grid>
</Grid>
}
{
typeOfResources.length >= 1 ?
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
......@@ -54,29 +39,15 @@ export default function FilterSummary
<Grid item>
{
typeOfResources.map((item) => {
if (item.isChecked)
return (
item.isChecked &&
<StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
)
);
})
}
</Grid>
</Grid>
</Grid>
:
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Tipos de recursos:
</Grid>
<Grid item>
<StyledChip size="small" label="Nenhum selecionado" />
</Grid>
</Grid>
</Grid>
}
{
teachingStage.length >= 1 ?
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
......@@ -85,29 +56,15 @@ export default function FilterSummary
<Grid item>
{
teachingStage.map((item) => {
if (item.isChecked)
return (
item.isChecked &&
<StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
)
);
})
}
</Grid>
</Grid>
</Grid>
:
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Etapas de ensino:
</Grid>
<Grid item>
<StyledChip size="small" label="Nenhum selecionado" />
</Grid>
</Grid>
</Grid>
}
{
languages.length >= 1 ?
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
......@@ -116,51 +73,28 @@ export default function FilterSummary
<Grid item>
{
languages.map((item) => {
if (item.isChecked)
return (
item.isChecked &&
<StyledChip key={new Date().toISOString() + item.value} size="small" label={item.exemplo} />
)
);
})
}
</Grid>
</Grid>
</Grid>
:
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Idiomas:
</Grid>
<Grid item>
<StyledChip size="small" label="Nenhum selecionado" />
</Grid>
</Grid>
</Grid>
}
{
tag.length >= 1 ?
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Palavra chave:
</Grid>
<Grid item>
{
tag &&
<StyledChip size="small" label={tag} />
}
</Grid>
</Grid>
</Grid>
:
<Grid item>
<Grid container direction='row' spacing={1} alignItems='center'>
<Grid item>
Palavra chave:
</Grid>
<Grid item>
<StyledChip size="small" label="Nenhum selecionado" />
</Grid>
</Grid>
</Grid>
}
<Grid item>
<StyledButton variant="contained" onClick={onButtonClicked}>
<span className="text">
......
src/Pages/Search.js
+ 48
− 490
View file @ 86d4feb1
......@@ -29,7 +29,12 @@ import { getRequest } from '../Components/HelperFunctions/getAxiosConfig';
import { useHistory } from 'react-router-dom';
import SearchExpansionPanel from '../Components/SearchExpansionPanel/SearchExpansionPanel';
import FilterSummary from '../Components/SearchPageComponents/FilterSummary';
import { filtersCurriculum, filtersTypes, filtersStages, filtersLanguages } from '../Components/SearchPageComponents/filters';
import {
filtersCurriculum,
filtersTypes,
filtersStages,
filtersLanguages,
} from '../Components/SearchPageComponents/filters';
export default function Search() {
const history = useHistory();
......@@ -45,7 +50,6 @@ export default function Search() {
const [currTag, setCurrTag] = useState('');
const [isLoading, setIsLoading] = useState(false);
const [curriculumComponents, setCurriculumComponents] = useState([]);
const [typeOfResources, setTypeOfResources] = useState([]);
const [teachingStage, setTeachingStage] = useState([]);
......@@ -81,7 +85,6 @@ export default function Search() {
const typeOfResourcesValues = [];
const teachingStageValues = [];
const languagesValues = [];
const tagsValue = [];
for (let index = 0; index < curriculumComponents.length; index++) {
const element = curriculumComponents[index];
......@@ -107,32 +110,49 @@ export default function Search() {
languagesValues.push(element.value);
}
tagsValue.push(tag)
let url = `/busca?page=0&results_per_page=12&query=${currQuery}&search_class=${currOption}`
if (currOption !== 'User') {
url = url + `&order=${currOrder}`
if (currOption === 'LearningObject') {
if (curriculumValues.length >= 1) {
url = url + `&subjects=${curriculumValues}`
}
if (typeOfResourcesValues.length >= 1) {
url = url + `&object_types=${typeOfResourcesValues}`
}
if (teachingStageValues.length >= 1) {
url = url + `&educational_stages=${teachingStageValues}`
}
if (languagesValues.length >= 1) {
url = url + `&languages=${languagesValues}`
}
if (tag.length >= 1)
url = url + `&tags=${tag}`
}
}
const url = `/busca?page=0&results_per_page=12&order=${currOrder}&query=${currQuery}&search_class=${currOption}&subjects=${curriculumValues}&object_types=${typeOfResourcesValues}&educational_stages=${teachingStageValues}&languages=${languagesValues}&tags=${tagsValue}`
history.push(url)
history.push(url);
}
function onChangeFilter(type, content) {
switch (type) {
case "curriculum":
setCurriculumComponents(content)
break;
case "languages":
setLanguages(content)
break;
case "stages":
setTeachingStage(content)
break;
case "types":
setTypeOfResources(content)
break;
case "tag":
setTag(content)
break;
default:
break;
function resetFilters() {
for (let index = 0; index < filtersCurriculum.length; index++) {
if (filtersCurriculum[index].isChecked)
filtersCurriculum[index].isChecked = false;
}
for (let index = 0; index < filtersLanguages.length; index++) {
if (filtersLanguages[index].isChecked)
filtersLanguages[index].isChecked = false;
}
for (let index = 0; index < filtersStages.length; index++) {
if (filtersStages[index].isChecked)
filtersStages[index].isChecked = false;
}
for (let index = 0; index < filtersTypes.length; index++) {
if (filtersTypes[index].isChecked)
filtersTypes[index].isChecked = false;
}
setTag('')
}
function handleChangeOption(e) {
......@@ -144,6 +164,7 @@ export default function Search() {
else
url = `/busca?page=0&results_per_page=12&query=*&search_class=${value}`
resetFilters()
history.push(url);
}
......@@ -202,7 +223,7 @@ export default function Search() {
function handlePreviousPage() {
const previousPage = currPage - 1;
let url = `/search?page=${previousPage}&results_per_page=12&query=${currQuery}&search_class=${currOption}`
let url = `/busca?page=${previousPage}&results_per_page=12&query=${currQuery}&search_class=${currOption}`
if (currOption !== 'User') {
url = url + `&order=${currOrder}`
......@@ -255,7 +276,6 @@ export default function Search() {
function handleSubjects(subjectsString) {
if (subjectsString) {
const selectedSubjects = subjectsString.split(',');
for (let i = 0; i < selectedSubjects.length; i++) {
const elementOfSelectedSubs = selectedSubjects[i];
for (let j = 0; j < filtersCurriculum.length; j++) {
......@@ -270,7 +290,6 @@ export default function Search() {
function handleObjectTypes(objectTypesString) {
if (objectTypesString) {
const selectedObjectTypes = objectTypesString.split(',');
for (let i = 0; i < selectedObjectTypes.length; i++) {
const elementOfSelectedObjectTypes = selectedObjectTypes[i];
for (let j = 0; j < filtersTypes.length; j++) {
......@@ -389,7 +408,7 @@ export default function Search() {
currOption === 'LearningObject' &&
<Fragment>
<SearchExpansionPanel
onChange={onChangeFilter}
setTag={(tag) => setTag(tag)}
curriculumComponents={curriculumComponents}
setCurriculum={(array) => { setCurriculumComponents(array) }}
typeOfResources={typeOfResources}
......@@ -461,464 +480,3 @@ const StyledBreadCrumbs = styled(Breadcrumbs)`
text-decoration: none;
}
`;
// import React, { useEffect, useState, useContext } from "react";
// import { apiDomain } from '../env';
// import { Link, useHistory } from "react-router-dom";
// import styled from "styled-components";
// import Paper from "@material-ui/core/Paper";
// import LoadingSpinner from '../Components/LoadingSpinner';
// import Breadcrumbs from "@material-ui/core/Breadcrumbs";
// import "./Styles/Home.css";
// import { Store } from "../Store";
// import { Grid } from "@material-ui/core";
// import Dropdown from "react-dropdown";
// import "react-dropdown/style.css";
// import SearchExpansionPanel from "../Components/SearchExpansionPanel/SearchExpansionPanel";
// import ResourceCardFunction from "../Components/ResourceCardFunction";
// import CollectionCardFunction from "../Components/CollectionCardFunction";
// import ContactCard from "../Components/ContactCard";
// import CircularProgress from '@material-ui/core/CircularProgress';
// import { getRequest } from '../Components/HelperFunctions/getAxiosConfig'
// import ColecaoVazia from '../img/Pagina_vazia_colecao.png'
// import RecursoVazio from '../img/Pagina_vazia_Sem_publicar.png'
// let order = "review_average";
// let currFilter = "";
// let currOption;
// export default function Search(props) {
// const history = useHistory()
// const { state, dispatch } = useContext(Store);
// const [resultsResource, setResultsResource] = useState([]);
// const [resultsCollection, setResultsCollection] = useState([]);
// const [resultsUser, setResultsUser] = useState([]);
// const [currOrder, setCurrOrder] = useState(order);
// const [page, setPage] = useState(0);
// const [isloading, setIsLoading] = useState(false);
// const [loadingMoreData, setLoadingMoreData] = useState(false);
// const [isFiltering, setIsFiltering] = useState(false);
// const [resultsPerPage] = useState(12);
// const [showingResults, setShowingResults] = useState(0);
// const [totalResults, setTotalResults] = useState(0);
// const [options] = React.useState([
// { label: "Recursos", value: "LearningObject" },
// { label: "Coleções", value: "Collection" },
// { label: "Usuários", value: "User" },
// ]);
// const [ordenar] = useState([
// { label: "Mais Estrelas", value: "review_average" },
// { label: "Mais Relevante", value: "score" },
// { label: "Mais Baixados", value: "downloads" },
// { label: "Mais Favoritados", value: "likes" },
// { label: "Mais Recentes", value: "publicationdesc" },
// { label: "Ordem Alfabética", value: "title" },
// ]);
// const [option, setOption] = useState(
// new URLSearchParams(window.location.search).get("search_class")
// );
// const [optionResult, setOptionResult] = useState(option);
// currOption = option;
// function handleSuccessfulGet(data, headers) {
// if (currOption === "LearningObject" && page > 0) {
// setResultsResource((previousData) => previousData.concat(data));
// }
// else {
// setResultsResource(data);
// }
// if (currOption === "Collection" && page > 0) {
// setResultsCollection((previousData) => previousData.concat(data));
// }
// else {
// setResultsCollection(data);
// }
// if (currOption === "User" && page > 0) {
// setResultsUser((previousData) => previousData.concat(data));
// }
// else {
// setResultsUser(data);
// }
// dispatch({
// type: "SAVE_SEARCH",
// newSearch: {
// query: state.search.query,
// class: currOption,
// },
// });
// if (headers.has('X-Total-Count')) {
// setTotalResults(headers.get('X-Total-Count'));
// }
// if (page > 0)
// setShowingResults((previousSize) => data.length + previousSize)
// else
// setShowingResults(data.length)
// setIsLoading(false);
// setIsFiltering(false);
// setLoadingMoreData(false);
// }
// const collectStuff = (tipoBusca, filtro) => {
// const urlParams = new URLSearchParams(window.location.search);
// const query = urlParams.get("query");
// const searchClass = urlParams.get("search_class");
// if (!loadingMoreData) // this line prevents resetting filter when loading more data
// currFilter = filtro;
// if (filtro)
// setIsFiltering(true);
// const url = `/search?page=${page}&results_per_page=${resultsPerPage}&order=${order}&query=${query}${currFilter ? currFilter : ""}&search_class=${searchClass}`
// getRequest(url, handleSuccessfulGet, (error) => { console.log(error) })
// };
// useEffect(() => {
// setIsLoading(true)
// const urlParams = new URLSearchParams(window.location.search);
// const query = urlParams.get("query");
// const searchClass = urlParams.get("search_class");
// if (state.search.query !== query || state.search.class !== searchClass) {
// dispatch({
// type: "SAVE_SEARCH",
// newSearch: {
// query: query,
// class: searchClass,
// },
// });
// state.search.query = query
// state.search.class = searchClass
// }
// currOption = searchClass
// setOption(searchClass)
// setOptionResult(searchClass)
// collectStuff(searchClass)
// return () =>
// dispatch({
// type: "HANDLE_SEARCH_BAR",
// opened: false,
// });
// }, [state.currentUser.id, window.history.state === null ? true : window.history.state.key])
// useEffect(() => {
// if (page > 0) {
// setIsLoading(true);
// collectStuff(option);
// }
// }, [page]);
// return (
// <div style={{ backgroundColor: "#f4f4f4" }}>
// <Principal>
// <BreadCrumbsDiv style={{ margin: "15px 2%", }}>
// <StyledBreadCrumbs>
// <Link to="/">Página Inicial</Link>
// <span>Busca</span>
// </StyledBreadCrumbs>
// </BreadCrumbsDiv>
// <div style={{ margin: "15px 2%", }}>
// <HeaderFilters elevation={4} square>
// <Grid container spacing={0} style={{ height: "100%" }}>
// <Grid item xs style={{ display: "flex", flexDirection: "column", justifyContent: "center", paddingLeft: 20 }}>
// <div style={{ marginRight: 5, marginTop: 15 }}>
// <div className="textInfo">
// <span style={{ fontWeight: "bold" }}>
// MOSTRAR
// </span>
// </div>
// <Dropdown options={options} value={optionResult}
// onChange={(e) => {
// setResultsCollection([]);
// setResultsResource([]);
// setResultsUser([]);
// setShowingResults(0);
// setPage(0);
// setIsLoading(true);
// currOption = e.value;
// history.push(`/busca?query=${state.search.query}&search_class=${currOption}`)
// setOption(currOption);
// // collectStuff(currOption, "");
// }}
// placeholder="Selecione um tipo"
// />
// </div>
// </Grid>
// {
// optionResult === "User" ? null :
// <Grid item xs style={{ display: "flex", flexDirection: "column", justifyContent: "center", paddingRight: 20, }}>
// <div style={{ marginLeft: 5, marginTop: 15 }}>
// <div className="textInfo">
// <span style={{ fontWeight: "bold" }}>
// ORDENAR POR
// </span>
// </div>
// <Dropdown options={ordenar} value={currOrder} onChange={(e) => {
// order = e.value;
// setCurrOrder(e.label)
// collectStuff(optionResult, currFilter);
// }}
// placeholder="Selecione uma opção"
// />
// </div>
// </Grid>
// }
// <Grid item xs={12}>
// <div style={{ display: "flex", flexDirection: "column", justifyContent: "center" }}>
// <div style={{ textAlign: "center", paddingTop: 10, fontWeight: "bolder" }}>
// Exibindo {showingResults === 0 ? 0 : showingResults} resultados de {totalResults} encontrados
// </div>
// </div>
// </Grid>
// </Grid>
// </HeaderFilters>
// {
// isloading ? <LoadingSpinner text="Carregando..." /> :
// optionResult === "Collection" ? (
// resultsCollection.length >= 1 ?
// <GridBuscaCollection container direction="row" spacing={2}>
// <Grid item xs>
// <Grid container justify="center" alignItems="center" spacing={2}>
// {resultsCollection.map((card) => (
// <Grid container item xs justify="center" alignItems="center" key={card.id}>
// <CollectionCardFunction
// name={card.name}
// tags={card.tags}
// rating={card.review_average}
// id={card.id}
// author={card.owner ? card.owner.name : ""}
// description={card.description}
// thumbnails={card.items_thumbnails}
// avatar={card.owner ? card.owner.avatar : ""}
// likeCount={card.likes_count}
// followed={card.followed}
// liked={card.liked}
// collections={card.collection_items}
// authorID={card.owner.id}
// />
// </Grid>
// ))}
// </Grid>
// <div style={{ display: "flex", flexDirection: "row", justifyContent: "center", }}>
// <button
// style={{
// height: 36, backgroundColor: "#ff7f00", marginBottom: 50, marginTop: 50, fontSize: 14,
// color: "white", borderRadius: 4, border: "none",
// }}
// onClick={() => {
// setLoadingMoreData(true);
// setPage(page + 1)
// }}
// >
// {
// loadingMoreData ? <CircularProgress size={24} color="inherit" /> : "Carregar mais 12"
// }
// </button>
// </div>
// </Grid>
// </GridBuscaCollection> :
// <Grid container direction="row" justify="center" alignItems="center">
// <Grid item>
// <img src={ColecaoVazia} alt="coleção vazia" />
// </Grid>
// </Grid>
// ) :
// optionResult === "LearningObject" ? (
// resultsResource.length >= 1 ?
// <GridBuscaResource container spacing={2}>
// <Grid item xs={12} md={2}>
// <Grid container >
// <Grid item xs={12}>
// <Paper elevation={4} square>
// <SearchExpansionPanel onChange={collectStuff} onFiltering={isFiltering} />
// </Paper>
// </Grid>
// </Grid>
// </Grid>
// <Grid item xs>
// <Grid container justify="center" spacing={3} alignItems="center" >
// {resultsResource.map((card) => (
// <Grid container justify="center" alignItems="center" item xs={12} sm={6} md={4} lg={3} key={card.id}>
// <ResourceCardFunction
// avatar={card.publisher ? card.publisher.avatar : ""}
// id={card.id}
// thumbnail={card.thumbnail}
// type={card.object_type ? card.object_type : "Outros"}
// title={card.name}
// published={card.state === "published" ? true : false}
// likeCount={card.likes_count}
// liked={card.liked}
// rating={card.review_average}
// author={card.author}
// tags={card.educational_stages}
// href={"/recurso/" + card.id}
// downloadableLink={card.default_attachment_location}
// />
// </Grid>
// ))}
// </Grid>
// <div
// style={{
// display: "flex",
// flexDirection: "row",
// justifyContent: "center",
// }}
// >
// <button
// style={{
// height: 36,
// backgroundColor: "#ff7f00",
// marginBottom: 50,
// marginTop: 50,
// fontSize: 14,
// color: "white",
// borderRadius: 4,
// border: "none",
// }}
// onClick={() => {
// setLoadingMoreData(true);
// setPage(page + 1)
// // collectStuff("LearningObject", "");
// }}
// >
// {
// loadingMoreData ? <CircularProgress size={24} color="inherit" /> : "Carregar mais 12"
// }
// </button>
// </div>
// </Grid>
// </GridBuscaResource>
// :
// <GridBuscaResource container spacing={2}>
// <Grid item xs={12} md={2}>
// <Grid container >
// <Grid item xs={12}>
// <Paper elevation={4} square>
// <SearchExpansionPanel onChange={collectStuff} onFiltering={isFiltering} />
// </Paper>
// </Grid>
// </Grid>
// </Grid>
// <Grid item xs={12} md={10}>
// <Grid container direction="row" justify="center" alignItems="center" style={{ height: "100%", width: "100%" }}>
// <Grid>
// <img src={RecursoVazio} alt="coleção vazia" />
// </Grid>
// </Grid>
// </Grid>
// </GridBuscaResource>
// ) :
// optionResult === "User" && (
// <GridBuscaUser container spacing={2}>
// <Grid item xs >
// <Grid container spacing={2} justify="center" alignItems="center">
// {resultsUser.map((card) => (
// <Grid container justify="center" alignItems="center" item xs key={card.id}>
// <ContactCard
// name={card.name}
// avatar={card.avatar ? apiDomain + card.avatar : null}
// cover={card.cover ? apiDomain + card.cover : null}
// numCollections={card.collections_count}
// numLearningObjects={card.learning_objects_count}
// follow_count={card.follows_count}
// followed={card.followed || null}
// followerID={card.id}
// href={'/usuario-publico/' + card.id}
// />
// </Grid>
// ))}
// </Grid>
// <div
// style={{
// display: "flex",
// flexDirection: "row",
// justifyContent: "center",
// }}
// >
// <button
// style={{
// height: 36,
// backgroundColor: "#ff7f00",
// marginBottom: 50,
// marginTop: 50,
// fontSize: 14,
// color: "white",
// borderRadius: 4,
// border: "none",
// }}
// onClick={() => {
// setLoadingMoreData(true);
// setPage(page + 1)
// // collectStuff("User", "");
// }}
// >
// {
// loadingMoreData ? <CircularProgress color="inherit" size={24} /> : "Carregar mais 12"
// }
// </button>
// </div>
// </Grid>
// </GridBuscaUser>
// )
// }
// </div>
// </Principal>
// </div>
// );
// }
// const GridBuscaCollection = styled(Grid)`
// color: #666;
// ${'' /* background-color: green; */}
// h4 {
// padding: 0 15px;
// font-size: 18px;
// margin-block: 10px;
// text-transform: uppercase;
// }
// `;
// const GridBuscaResource = styled(Grid)`
// color: #666;
// ${'' /* background-color: red; */}
// h4 {
// padding: 0 15px;
// font-size: 18px;
// margin-block: 10px;
// text-transform: uppercase;
// }
// `;
// const GridBuscaUser = styled(Grid)`
// color: #666;
// ${'' /* background-color: blue; */}
// h4 {
// padding: 0 15px;
// font-size: 18px;
// margin-block: 10px;
// text-transform: uppercase;
// }
// `
// const BreadCrumbsDiv = styled.div`
// padding: 10px;
// display: flex;
// `;
// const Principal = styled.div`
// margin-inline: auto;
// `;
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment