-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'frontend' of https://github.com/boostcampaitech4lv23rec…
…sys1/final-project-level3-recsys-05 into frontend
- Loading branch information
Showing
10 changed files
with
235 additions
and
84 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| import { useState } from "react"; | ||
|
|
||
| function FilterBudgetLeft({ getFilter }) { | ||
| const [ budget, setBudget ] = useState(100000); | ||
| const [ category, setCategory ] = useState([]); | ||
| const categories = ['가구', '주방용품', '수납·정리', '생활용품', '패브릭', '공구·DIY', '데코·식물', '조명']; | ||
|
|
||
| return ( | ||
| <> | ||
| <ul className="list-group list-group-flush rounded"> | ||
| <li className="list-group-item hideMenu"> | ||
| <h5 className="mt-1 mb-2">Your Budget</h5> | ||
| <div className="d-grid d-block mb-3"> | ||
| <div className="form-floating mb-2"> | ||
| <input | ||
| type="number" | ||
| className="form-control budget" | ||
| placeholder="Min" | ||
| defaultValue={ budget } | ||
| onChange= {(event)=> setBudget(event.target.valueAsNumber)} | ||
| /> | ||
| <label htmlFor="floatingInput">Budget</label> | ||
| </div> | ||
| <h5 className="mt-1 mb-2">Category</h5> | ||
| <div className="filterCategory"> | ||
| { categories.map((cat,index) => { | ||
| return ( | ||
| <> | ||
| <button value={ cat } className='deactivate category_item' key={`category${index}`}onClick={ (event) => { | ||
| const ca = event.target.value; | ||
| const click = event.target.className; | ||
| if(click === 'activate category_item') { | ||
| setCategory(category.filter(c => c !== ca)); | ||
| event.target.className = 'deactivate category_item'; | ||
| } else { | ||
| setCategory([...category, ca]); | ||
| event.target.className = 'activate category_item'; | ||
| } | ||
| } }>{ cat }</button> | ||
| </> | ||
| ) | ||
| })} | ||
| </div> | ||
| <br/> | ||
| </div> | ||
| </li> | ||
| <button className="btn btn-dark apply" onClick={ () => getFilter(budget, category) }>Apply</button> | ||
| </ul> | ||
| </> | ||
| ); | ||
| } | ||
|
|
||
| export default FilterBudgetLeft; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; | ||
| import axios from "axios"; | ||
|
|
||
| function Heart({ liked, id }) { | ||
| const handleClick = () => { | ||
| const heart = document.getElementById("like"+id).getElementsByTagName("path")[0]; | ||
| if(liked) { | ||
| axios.get("http://34.64.87.78:8000/unwishing/"+ localStorage.getItem("token") + "/" + id); | ||
| heart.setAttribute("d", "M458.4 64.3C400.6 15.7 311.3 23 256 79.3 200.7 23 111.4 15.6 53.6 64.3-21.6 127.6-10.6 230.8 43 285.5l175.4 178.7c10 10.2 23.4 15.9 37.6 15.9 14.3 0 27.6-5.6 37.6-15.8L469 285.6c53.5-54.7 64.7-157.9-10.6-221.3zm-23.6 187.5L259.4 430.5c-2.4 2.4-4.4 2.4-6.8 0L77.2 251.8c-36.5-37.2-43.9-107.6 7.3-150.7 38.9-32.7 98.9-27.8 136.5 10.5l35 35.7 35-35.7c37.8-38.5 97.8-43.2 136.5-10.6 51.1 43.1 43.5 113.9 7.3 150.8z"); | ||
| liked = false; | ||
| } else { | ||
| axios.get("http://34.64.87.78:8000/wishing/"+ localStorage.getItem("token") + "/" + id); | ||
| heart.setAttribute("d", "M462.3 62.6C407.5 15.9 326 24.3 275.7 76.2L256 96.5l-19.7-20.3C186.1 24.3 104.5 15.9 49.7 62.6c-62.8 53.6-66.1 149.8-9.9 207.9l193.5 199.8c12.5 12.9 32.8 12.9 45.3 0l193.5-199.8c56.3-58.1 53-154.3-9.8-207.9z"); | ||
| liked = true; | ||
| } | ||
| }; | ||
|
|
||
| if(liked) { | ||
| return <FontAwesomeIcon icon={["fas", "heart"]} id={ `like${id}` } className={"like"} onClick={ handleClick }/> | ||
| } else { | ||
| return <FontAwesomeIcon icon={["far", "heart"]} id={ `like${id}` } className={"like"} onClick={ handleClick }/> | ||
| } | ||
| } | ||
|
|
||
| export default Heart; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.