memartel_loc/GGMM
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

La recherche fonctionne avec les filtres et le tris dans le ui.

Browse Source
This commit is contained in:
Victor Turgeon 2022-10-30 13:44:57 -07:00
parent 8a5b00624e
commit 81ff4ad4f7
2 changed files with 37 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
GrossesMitaines/grosses-mitaines-ui/src/components/ResearchBar.js
View File

@ -9,15 +9,7 @@ const ResearchBar = () => {
const [value, setValue] = useState(""); const [value, setValue] = useState("");
const search = async (query) => { const search = async (query) => {
const results = await fetchData(query, false); navigate('/morceaux', { state: { query: query} });
console.log(results);
navigate('/morceaux', { state: { searchResults: results } });
}
const fetchData = async (query, preview) => {
const response = await fetch(`https://localhost:7292/api/Search?query=${query}&preview=${preview}&deep=true`);
const json = await response.json();
return { json };
} }
const handleValueChange = async (value) => { const handleValueChange = async (value) => {

50
GrossesMitaines/grosses-mitaines-ui/src/pages/Morceaux.js
View File

@ -14,6 +14,7 @@ const Morceaux = () => {
const [filterPrice, setFilterPrice] = useState(""); const [filterPrice, setFilterPrice] = useState("");
const [filterState, setFilterState] = useState(""); const [filterState, setFilterState] = useState("");
const [isSearch, setIsSearch] = useState(false); const [isSearch, setIsSearch] = useState(false);
const [query, setQuery] = useState("");
const { state } = useLocation(); const { state } = useLocation();
@ -21,18 +22,26 @@ const Morceaux = () => {
document.title = 'Morceaux'; document.title = 'Morceaux';
setIsLoading(true); setIsLoading(true);
if (state != null) {
setProducts([...state.searchResults.json]); async function fetchData(isSearch) {
setIsSearch(true); var url = "";
}
else { url = isSearch ? `https://localhost:7292/api/Search?query=${state.query}` : `https://localhost:7292/api/Inventory`;
async function fetchData() {
const response = await fetch(`https://localhost:7292/api/Inventory`); const response = await fetch(url);
const json = await response.json(); const json = await response.json();
if (json.length > 0) if (json.length > 0)
setProducts([...json]); setProducts([...json]);
} }
fetchData();
if (state != null) {
setQuery(state.query);
setIsSearch(true);
fetchData(true);
}
else {
fetchData(false);
} }
setIsLoading(false); setIsLoading(false);
@ -60,36 +69,31 @@ const Morceaux = () => {
const handleOrder = async (sortBy) => { const handleOrder = async (sortBy) => {
if (isSearch) {
}
else {
setOrder(sortBy);
var url = `https://localhost:7292/api/Inventory?order=${sortBy}&filterPrice=${filterPrice}&filterState=${filterState}`;
setIsLoading(true); setIsLoading(true);
setOrder(sortBy);
var url = isSearch ? `https://localhost:7292/api/Search?query=${query}&filterPrice=${filterPrice}&filterState=${filterState}&order=${sortBy}`
: `https://localhost:7292/api/Inventory?order=${sortBy}&filterPrice=${filterPrice}&filterState=${filterState}`;
const response = await fetch(url); const response = await fetch(url);
const json = await response.json(); const json = await response.json();
if (json.length > 0)
setProducts([...json]); setProducts([...json]);
setIsLoading(false); setIsLoading(false);
} }
}
const handleFilters = async (price, state) => { const handleFilters = async (price, state) => {
setIsLoading(true);
if (isSearch) {
}
{
setFilterPrice(price); setFilterPrice(price);
setFilterState(state); setFilterState(state);
var url = `https://localhost:7292/api/Inventory?order=${order}&filterPrice=${price}&filterState=${state}`;
setIsLoading(true); var url = isSearch ? `https://localhost:7292/api/Search?query=${query}&filterPrice=${price}&filterState=${state}&order=${order}`
: `https://localhost:7292/api/Inventory?order=${order}&filterPrice=${price}&filterState=${state}`;
const response = await fetch(url); const response = await fetch(url);
const json = await response.json(); const json = await response.json();
setProducts([...json]); setProducts([...json]);
setIsLoading(false); setIsLoading(false);
}
} }