Commit 4ea76115 authored by Kim, MinGyu's avatar Kim, MinGyu
Browse files

Merge branch 'develop' of https://compmath.korea.ac.kr/gitlab/students/travel into develop

parents 364a26e5 a7056a69
...@@ -11,11 +11,12 @@ export const App = () => { ...@@ -11,11 +11,12 @@ export const App = () => {
return ( return (
<BrowserRouter> <BrowserRouter>
<Routes> <Routes>
<Route path="/login" element={<Login />} /> <Route path="login" element={<Login />} />
<Route path="/signup" element={<Signup />} /> <Route path="signup" element={<Signup />} />
<Route path="/" element={<Header />}> <Route path="/" element={<Header />}>
<Route index element={<Body />} /> <Route index element={<Body />} />
<Route path="/board" element={<Board />} /> <Route path="board" element={<Board />} />
</Route> </Route>
</Routes> </Routes>
</BrowserRouter> </BrowserRouter>
......
import React from "react"; import React, {useState} from "react";
function range(start:number, end:number) { function range(start:number, end:number) {
return (new Array(end - start + 1)).fill(undefined).map((_, i) => i + start); return (new Array(end - start + 1)).fill(undefined).map((_, i) => i + start);
} }
export default function BoardPage() { export default function BoardPage() {
<<<<<<< HEAD
const imgs = range(1,8); //[1,2,3,4,5,6,7] const imgs = range(1,8); //[1,2,3,4,5,6,7]
=======
const ords = range(1,8); //[1,2,3,4,5,6,7];
const [count, setCount] = useState(0);
>>>>>>> a7056a6986765dfc1269fbf0543c54a1e14a9ac7
return ( return (
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<div className="flex flex-col items-center mt-6"> <div className="flex flex-col items-center mt-6">
...@@ -18,18 +22,19 @@ export default function BoardPage() { ...@@ -18,18 +22,19 @@ export default function BoardPage() {
`여행지 후기를 남겨주세요!` `여행지 후기를 남겨주세요!`
</div> </div>
</div> </div>
<div className="flex flex-col w-10/12 mt-16 "> <div className="flex flex-col w-10/12 mt-16 ">
<div> <div>
<div className="bg-gray-500 border-y-2 h-10"> <div className="bg-gray-500 border-y-2 h-10">
Board Board
</div> </div>
<div> <div>
{imgs.map((img,index) => ( {ords.map((ord, index) => (
<div key={index} className="flex flex-row h-16 divide-x-2 border-2 border-solid "> <div key={index} className="flex flex-row h-16 divide-x-2 border-2 border-solid ">
<div className="basis-1/12 bg-gray-100">{img}</div> <div className="basis-1/12 bg-gray-100">{ord}</div>
<div className="basis-full">title</div> <div className="basis-full"><button onClick={() => setCount(count + 1)}>title</button></div> {/*<Link to>title</Link> */}
<div className="basis-3/12">date</div> <div className="basis-3/12">date</div>
<div className="basis-2/12">like</div> <div className="basis-2/12">{count}</div>
</div> </div>
))} ))}
......
import React, { MouseEventHandler, useEffect, MouseEvent } from "react"; import React, { useEffect, MouseEvent } from "react";
import { BrowserRouter, Route, Routes, Link, Outlet, useSearchParams } from "react-router-dom"; import { BrowserRouter, Route, Routes, Link, Outlet, useSearchParams } from "react-router-dom";
import Theme from "./theme"; import Theme from "./theme";
import getUrl from "../url" import getUrl from "../url"
// const initSearchParams = ["theme", "city"]
const initSearchParams = { "theme": "1", "city": "1" } const initSearchParams = { "theme": "1", "city": "1" }
export default function Body() { export default function Body() {
const [searchParams, setSearchParams] = useSearchParams(initSearchParams) const [searchParams, setSearchParams] = useSearchParams(initSearchParams)
...@@ -17,37 +16,34 @@ export default function Body() { ...@@ -17,37 +16,34 @@ export default function Body() {
console.log(`theme id= ${event.currentTarget.id}`) console.log(`theme id= ${event.currentTarget.id}`)
} }
// const imgs = [1, 2, 3, 4, 5] let url = getUrl();
let url=getUrl();
return ( return (
<div>
<div className="flex flex-col px-5 py-5"> <div className="flex flex-col px-5 py-5">
<Theme handleClick={handleClick} /> <Theme handleClick={handleClick} />
<div className="flex flex-col md:flex-row px-5 py-40 "> <div className="flex flex-col md:flex-row px-5 py-40 ">
<div className="flex flex-row md:flex-col md:basis-1/5 bg-gray-400 rounded "> <div className="flex flex-row justify-evenly md:flex-col md:basis-1/5 bg-gray-400 rounded ">
<div>01</div> <button>01</button>
<div>02</div> <button>02</button>
<div>03</div> <button>03</button>
<div>04</div> <button>04</button>
<div>05</div> <button>06</button>
<div>06</div> <button>07</button>
<div>07</div> <button>05</button>
<div>08</div> <button>08</button>
<div>09</div> <button>09</button>
<div>10</div> <button>10</button>
{/* citylist */} {/* citylist */}
</div> </div>
<div className="flex md:basis-4/5 grid grid-rows-3 grid-cols-5 outline"> <div className="flex md:basis-4/5 grid grid-rows-3 grid-cols-5 outline">
{url.map(url => ( {url.map(url => (
<div className="flex justify-items-center">{url.url}</div> <div className="flex justify-items-center" key={url.url}>{url.url}</div>
))} ))}
{/* pic */} {/* pic */}
</div> </div>
</div> </div>
<Outlet /> <Outlet />
</div> </div>
// Body Page
</div> // Body Page
); );
}; };
...@@ -6,7 +6,7 @@ export default function Login () { ...@@ -6,7 +6,7 @@ export default function Login () {
<div> <div>
<div className="flex flex-col grid grid-rows-2 place-items-center"> <div className="flex flex-col grid grid-rows-2 place-items-center">
<div className="w-40 h-40 bg-red-400 place-self-center "> <div className="w-1/2 h-1/2 md:w-40 md:h-40 bg-red-400 place-self-center ">
<Link to="/">Travel Report</Link> <Link to="/">Travel Report</Link>
</div> </div>
......
...@@ -4,22 +4,18 @@ type ThemeProps = { ...@@ -4,22 +4,18 @@ type ThemeProps = {
handleClick: MouseEventHandler; handleClick: MouseEventHandler;
} }
export default function Theme({handleClick}: ThemeProps) { export default function Theme({handleClick}: ThemeProps) {
// const handleClick = (event: MouseEvent<HTMLElement>) => {
// console.log(event.currentTarget.id)
// }
return ( return (
<div className="flex flex-cols-10 justify-evenly w-full bg-emerald-400 rounded "> <div className="flex flex-cols-10 justify-evenly w-full bg-emerald-400 rounded ">
<button id={"01"} onClick={handleClick}>01</button> <button id={"01"} onClick={handleClick}>서핑</button>
<button>02</button> <button>액티비티</button>
<button>03</button> <button>캠핑</button>
<button>04</button> <button>스키</button>
<button>05</button> <button>보트</button>
<button>06</button> <button>사막</button>
<button>07</button> <button>골프</button>
<button>08</button> <button>동굴</button>
<button>09</button> <button>문화재</button>
<button>10</button> <button>동물원</button>
</div> </div>
); );
}; };
\ No newline at end of file
...@@ -19,15 +19,3 @@ let url = [ ...@@ -19,15 +19,3 @@ let url = [
export default function getUrl(){ export default function getUrl(){
return url; return url;
} }
// Url() {
// const imgs = [1, 2, 3, 4, 5];
// return (
// {
// imgs.map(img => (
// <div className="flex justify-items-center">{img}</div>
// ))
// } // Board Page
// );
// };
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment