Skip to content
Snippets Groups Projects
Commit 4bfd66fb authored by 김 도형's avatar 김 도형
Browse files

Merge branch 'front-sporttype-issue' into 'main'

edit sporttype

See merge request !36
parents 1e15e85f b11ef66e
Branches
No related tags found
1 merge request!36edit sporttype
...@@ -18,6 +18,31 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -18,6 +18,31 @@ function ListItem( {crew, event, updateApplicants} ){
const [crewRegionNames, setCrewRegionNames] = useState({}); //상위지역, 하위지역 이름 저장 const [crewRegionNames, setCrewRegionNames] = useState({}); //상위지역, 하위지역 이름 저장
const [eventRegionNames, setEventRegionNames] = useState({}); const [eventRegionNames, setEventRegionNames] = useState({});
const sportTypes = [
{
sportTypeId: 1,
sportName: "러닝",
metadata: {
distance: ["3~4km", "5~6km", "7~8km", "9km 이상"],
pace: ["4:00~4:30", "4:30~5:00", "5:00~5:30", "5:30~6:00", "6:00~6:30", "6:30 이상"]
}
},
{
sportTypeId: 2,
sportName: "헬스",
metadata: {
experience: ["초보자 (0~1년)", "중급자 (2~3년)", "상급자 (3년 이상)"]
}
},
{
sportTypeId: 3,
sportName: "클라이밍",
metadata: {
difficulty: ["상관 없음", "V1", "V2", "V3", "V4", "V5", "V6", "V7", "V8+"]
}
}
];
const handleCrewRegisterModal = () => { const handleCrewRegisterModal = () => {
setCrewRegisterModal(true); setCrewRegisterModal(true);
...@@ -175,10 +200,10 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -175,10 +200,10 @@ function ListItem( {crew, event, updateApplicants} ){
<div className="listingItem"> <div className="listingItem">
<p className='title'>{crew.name}</p> <p className='title'>{crew.name}</p>
<p className='location'> <p className='location'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/location.png'} alt="listinglocatin" />{crew.region} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/location.png'} alt="listinglocatin" />{crewRegionNames.regionName} {crewRegionNames.parentRegionName}
</p> </p>
<p className='type'> <p className='type'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/sporttype.png'} alt="listingsporttype" />{crew.type} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/sporttype.png'} alt="listingsporttype" />{sportTypes[crew.sportTypeId - 1]}
</p> </p>
<p className='people'> <p className='people'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/people.png'} alt="listingsportpeople" />{crew.capacity} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/people.png'} alt="listingsportpeople" />{crew.capacity}
...@@ -197,11 +222,11 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -197,11 +222,11 @@ function ListItem( {crew, event, updateApplicants} ){
</div> </div>
<div className="crewType"> <div className="crewType">
종목 <span>{crew.type}</span> 종목 <span>{sportTypes[crew.sportTypeId - 1]}</span>
</div> </div>
<div className="crewFee"> <div className="crewFee">
가입 비용 <span>{crew.fee}</span> 가입 비용 <span>{crew.fee_krw}</span>
</div> </div>
<div className="crewCapacity"> <div className="crewCapacity">
...@@ -209,11 +234,11 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -209,11 +234,11 @@ function ListItem( {crew, event, updateApplicants} ){
</div> </div>
<div className="crewBio"> <div className="crewBio">
크루 소개 <span>{crew.bio}</span> 크루 소개 <span>{crew.description}</span>
</div> </div>
</div> </div>
<button className="createRegisterButton" onClick={handleCrewRegister}>가입하기</button> <button className="createRegisterButton" onClick={()=>handleCrewRegister(crew.id)}>가입하기</button>
</div> </div>
</div> </div>
...@@ -224,10 +249,10 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -224,10 +249,10 @@ function ListItem( {crew, event, updateApplicants} ){
<div className="listingItem"> <div className="listingItem">
<p className='title'>{event.name}</p> <p className='title'>{event.name}</p>
<p className='location'> <p className='location'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/location.png'} alt="listinglocatin" />{event.region} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/location.png'} alt="listinglocatin" />{eventRegionNames.regionName} {eventRegionNames.parentRegionName}
</p> </p>
<p className='type'> <p className='type'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/sporttype.png'} alt="listingsporttype" />{event.type} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/sporttype.png'} alt="listingsporttype" />{sportTypes[event.sportTypeId - 1]}
</p> </p>
<p className='people'> <p className='people'>
<img className='listingItemImage' src={process.env.PUBLIC_URL + '/people.png'} alt="listingsportpeople" />{event.capacity} <img className='listingItemImage' src={process.env.PUBLIC_URL + '/people.png'} alt="listingsportpeople" />{event.capacity}
...@@ -246,11 +271,11 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -246,11 +271,11 @@ function ListItem( {crew, event, updateApplicants} ){
</div> </div>
<div className="eventType"> <div className="eventType">
종목 <span>{event.type}</span> 종목 <span>{sportTypes[crew.sportTypeId - 1]}</span>
</div> </div>
<div className="eventDate"> <div className="eventDate">
운동 일시 <span>{event.date}</span> 운동 일시 <span>{event.eventDate}</span>
</div> </div>
<div className="eventCapacity"> <div className="eventCapacity">
...@@ -258,7 +283,7 @@ function ListItem( {crew, event, updateApplicants} ){ ...@@ -258,7 +283,7 @@ function ListItem( {crew, event, updateApplicants} ){
</div> </div>
<div className="eventCondition"> <div className="eventCondition">
조건 <span>{event.condition}</span> 조건 <span>{event.feeCondition}</span>
</div> </div>
</div> </div>
......
...@@ -28,6 +28,31 @@ function Listing(){ ...@@ -28,6 +28,31 @@ function Listing(){
const [regionID, setRegionID] = useState(''); const [regionID, setRegionID] = useState('');
const sportTypes = [
{
sportTypeId: 1,
sportName: "러닝",
metadata: {
distance: ["3~4km", "5~6km", "7~8km", "9km 이상"],
pace: ["4:00~4:30", "4:30~5:00", "5:00~5:30", "5:30~6:00", "6:00~6:30", "6:30 이상"]
}
},
{
sportTypeId: 2,
sportName: "헬스",
metadata: {
experience: ["초보자 (0~1년)", "중급자 (2~3년)", "상급자 (3년 이상)"]
}
},
{
sportTypeId: 3,
sportName: "클라이밍",
metadata: {
difficulty: ["상관 없음", "V1", "V2", "V3", "V4", "V5", "V6", "V7", "V8+"]
}
}
];
useEffect(() => { useEffect(() => {
const fetchCrews = async () => { const fetchCrews = async () => {
try { try {
...@@ -191,9 +216,9 @@ function Listing(){ ...@@ -191,9 +216,9 @@ function Listing(){
<label htmlFor="crewType">종목</label> <label htmlFor="crewType">종목</label>
<select name="type" id="crewType" value={crewFormData.type} onChange={handleCrewChange}> <select name="type" id="crewType" value={crewFormData.type} onChange={handleCrewChange}>
<option className='crewTypeOption' value="">선택 </option> <option className='crewTypeOption' value="">선택 </option>
<option value="running">러닝</option> <option value="1">러닝</option>
<option value="climbing">클라이밍</option> <option value="3">클라이밍</option>
<option value="fitness">헬스</option> <option value="2">헬스</option>
</select> </select>
</div> </div>
...@@ -242,11 +267,11 @@ function Listing(){ ...@@ -242,11 +267,11 @@ function Listing(){
<div className="eventTypeInput"> <div className="eventTypeInput">
<label htmlFor="eventType">종목</label> <label htmlFor="eventType">종목</label>
<select name="type" id="eventType" value={eventFormData.type} onChange={handleEventChange}> <select name="type" id="crewType" value={crewFormData.typeId} onChange={handleCrewChange}>
<option className='eventTypeOption' value="">선택 </option> <option className='crewTypeOption' value="">선택 </option>
<option value="러닝">러닝</option> <option value="1">러닝</option>
<option value="클라이밍">클라이밍</option> <option value="3">클라이밍</option>
<option value="헬스">헬스</option> <option value="2">헬스</option>
</select> </select>
</div> </div>
......
...@@ -55,8 +55,8 @@ function Region( {onRegionSelect} ) { ...@@ -55,8 +55,8 @@ function Region( {onRegionSelect} ) {
}; };
useEffect(()=>{ useEffect(()=>{
onRegionSelect(selectedRegionSubID); onRegionSelect(selectedRegionID);
},[selectedRegionSubID]) },[selectedRegionID])
const handleRegionChange = (e) => { const handleRegionChange = (e) => {
setSelectedRegionID(e.target.value); setSelectedRegionID(e.target.value);
......
...@@ -47,9 +47,9 @@ function Search() { ...@@ -47,9 +47,9 @@ function Search() {
<span className='crewSearchMessage'>크루 검색하기</span> <span className='crewSearchMessage'>크루 검색하기</span>
<select name="crewSportType" id="crewSportType"> <select name="crewSportType" id="crewSportType">
<option value="">종목 </option> <option value="">종목 </option>
<option value="running">러닝</option> <option value="1">러닝</option>
<option value="climbing">클라이밍</option> <option value="3">클라이밍</option>
<option value="fitness">헬스</option> <option value="2">헬스</option>
</select> </select>
<Region onRegionSelect={handleRegionChange}/> <Region onRegionSelect={handleRegionChange}/>
...@@ -61,9 +61,9 @@ function Search() { ...@@ -61,9 +61,9 @@ function Search() {
<span className='meetingSearchMessage'>모임 검색하기</span> <span className='meetingSearchMessage'>모임 검색하기</span>
<select name="meetingSportType" id="meetingSportType"> <select name="meetingSportType" id="meetingSportType">
<option value="">종목 </option> <option value="">종목 </option>
<option value="running">러닝</option> <option value="1">러닝</option>
<option value="climbing">클라이밍</option> <option value="3">클라이밍</option>
<option value="fitness">헬스</option> <option value="2">헬스</option>
</select> </select>
<Region onRegionSelect={handleRegionChange}/> <Region onRegionSelect={handleRegionChange}/>
......
...@@ -41,7 +41,6 @@ export const CrewProvider = ({ children }) => { ...@@ -41,7 +41,6 @@ export const CrewProvider = ({ children }) => {
const onCreateCrew = (newCrew) => { const onCreateCrew = (newCrew) => {
setCrews(prevCrews => [...prevCrews, newCrew]);
fetch(`${apiUrl}/api/crews`, { fetch(`${apiUrl}/api/crews`, {
method: 'POST', method: 'POST',
headers: { headers: {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment