From 1254b3cca334add8f7bf60fb8cab780dec20b959 Mon Sep 17 00:00:00 2001
From: Baek SeungMin <als991225@naver.com>
Date: Mon, 4 Jul 2022 16:24:22 +0900
Subject: [PATCH] theme&city really done

---
 frontend/src/Pages/pic.ts     |  9 +++----
 frontend/src/pages/body.tsx   | 44 ++++++++++++++++++-----------------
 frontend/src/pages/header.tsx |  2 +-
 frontend/src/url.ts           | 21 -----------------
 4 files changed, 29 insertions(+), 47 deletions(-)
 delete mode 100644 frontend/src/url.ts

diff --git a/frontend/src/Pages/pic.ts b/frontend/src/Pages/pic.ts
index 1f63e7b..2df22ec 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 60962eb..678b600 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 (
-            <div className="flex flex-col px-1 py-1">
-                <Theme handleClick={themeHandleClick} />
-                <div className="flex flex-col md:flex-row py-10 ">
-                    <Citylist handleClick={cityHandleClick} />
-                    <div className="overflow-y-auto flex mr:10 md:basis-4/5 grid grid-rows-3 grid-cols-5">
-                        {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 (
+        <div className="flex flex-col px-1 py-1">
+            <Theme handleClick={themeHandleClick} />
+            <div className="flex flex-col md:flex-row py-10 ">
+                <Citylist handleClick={cityHandleClick} />
+                <div className="flex md:mr-10 md:basis-4/5 grid grid-rows-3 grid-cols-5">
+                    {Idpics.map((pic, index: number) => (
                         <div className="m-1 shrink-0 bg-gray-200 rounded overflow-hidden shadow-md" key={index}>
-                            <img src={pic.url} className="w-full h-10 md:h-20 object-cover"/>
+                            <img src={pic.url} className="w-full h-10 md:h-20 object-cover" />
                             <p className="text-center text-xs">{pic.name}</p>
                         </div>
-                     ))}
-                    </div>
+                    ))}
                 </div>
-                <Outlet />
             </div>
-            // Body Page
-        );
-    };
+            <Outlet />
+        </div>
+        // Body Page
+    );
+};
diff --git a/frontend/src/pages/header.tsx b/frontend/src/pages/header.tsx
index c858d45..ae83dc4 100644
--- a/frontend/src/pages/header.tsx
+++ b/frontend/src/pages/header.tsx
@@ -9,7 +9,7 @@ export default function Header() {
       <div className="flex flex-col ">
         <div className="flex flex-row px-5 py-20 md:place-content-between">
           <button className="px-5 py-2">
-            <Link to="/" className="hover:bg-gray-200 focus:text-purple-500 ">Travel Report</Link>
+            <Link to="/" className="hover:bg-gray-200 focus:text-purple-500">Travel Report</Link>
           </button>
           <div className="flex flex-row-reverse">
             <button className="px-5 py-2 bg-teal-400 rounded">
diff --git a/frontend/src/url.ts b/frontend/src/url.ts
deleted file mode 100644
index 8e4f01d..0000000
--- a/frontend/src/url.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-let url = [
-    {url : "1"},
-    {url : "2"},
-    {url : "3"},
-    {url : "4"},
-    {url : "5"},
-    {url : "6"},
-    {url : "7"},
-    {url : "8"},
-    {url : "9"},
-    {url : "10"},
-    {url : "11"},
-    {url : "12"},
-    {url : "13"},
-    {url : "14"},
-];
-
-
-export default function getUrl(){
-    return url;
-}
-- 
GitLab