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) => {

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