diff --git a/frontend/src/Pages/pic.ts b/frontend/src/Pages/pic.ts index 1f63e7b018fe184f3b737462bf09f6a544d9a19b..2df22ec952d38c04ff25797c118f1a8ed992e20f 100644 --- a/frontend/src/Pages/pic.ts +++ b/frontend/src/Pages/pic.ts @@ -51,7 +51,7 @@ let url = [ { themeid: "activity", cityid: "Busan", - url: "https://cdn.pixabay.com/photo/2022/06/15/23/08/germany-7264701__340.jpg", + url:"https://cdn.pixabay.com/photo/2015/04/07/07/51/railroad-tracks-710614__480.jpg", name: "레일바이크" }, { @@ -63,7 +63,7 @@ let url = [ { themeid: "activity", cityid: "Jeju", - url: "https://cdn.pixabay.com/photo/2022/06/15/23/08/germany-7264701__340.jpg", + url: "https://cdn.pixabay.com/photo/2012/10/10/05/07/combat-diver-60545__340.jpg", name: "스카이다이빙" }, { @@ -87,7 +87,7 @@ let url = [ { themeid: "activity", cityid: "Woolsan", - url: "https://cdn.pixabay.com/photo/2022/06/15/23/08/germany-7264701__340.jpg", + url: "https://cdn.pixabay.com/photo/2019/05/11/20/44/free-climbing-4196577__480.jpg", name: "클라이밍" }, { @@ -108,8 +108,9 @@ let url = [ url: "https://cdn.pixabay.com/photo/2016/08/23/16/34/italy-1614931__340.jpg", name: "서울 동굴" }, + ]; -export default function getpic(){ +export function getPicure(){ return url; }; \ No newline at end of file diff --git a/frontend/src/pages/body.tsx b/frontend/src/pages/body.tsx index 60962eb846f98f0d79abf6edf979e06890affc27..678b60080bf8b2d58465c64e4cf0eeef398dbb11 100644 --- a/frontend/src/pages/body.tsx +++ b/frontend/src/pages/body.tsx @@ -2,14 +2,14 @@ import React, { useEffect, MouseEvent } from "react"; import { Outlet, useSearchParams } from "react-router-dom"; import Theme from "./theme"; import Citylist from "./citylist"; -import getpic from "./pic"; +import {getPicure} from "./pic"; const initSearchParams = { "theme": "", "city": "" } export default function Body() { const [searchParams, setSearchParams] = useSearchParams(initSearchParams) - let getpics = getpic(); + let getPics = getPicure(); useEffect(() => { console.log(searchParams.get('theme'), searchParams.get('city')) @@ -32,27 +32,29 @@ export default function Body() { }) } - const Idpics = getpics.filter(p => - p.themeid == searchParams.get('theme')&& - p.cityid == searchParams.get('city') - ) - - return ( -
- -
- -
- {Idpics.map((pic, index:number) => ( + const Idpics = getPics.filter(p => { + + return (p.themeid == searchParams.get('theme') && p.cityid == searchParams.get('city'))||(p.themeid == searchParams.get('theme') && searchParams.get('city') == "") + ||(searchParams.get('theme') == "" && p.cityid == searchParams.get('city'))||(searchParams.get('theme') == "" && searchParams.get('city') == "") + }) + + + return ( +
+ +
+ +
+ {Idpics.map((pic, index: number) => (
- +

{pic.name}

- ))} -
+ ))}
-
- // Body Page - ); - }; + +
+ // Body Page + ); +}; diff --git a/frontend/src/pages/header.tsx b/frontend/src/pages/header.tsx index c858d45eabca03796170099673d5682a2c309ec6..ae83dc4ae830e6c042f38067a1c950895714dd0c 100644 --- a/frontend/src/pages/header.tsx +++ b/frontend/src/pages/header.tsx @@ -9,7 +9,7 @@ export default function Header() {