Commit f412cf25 authored by baesangjune's avatar baesangjune
Browse files

Merge remote-tracking branch 'origin/cherry' into BAE

parents e2fc281a 7f193b5a
import React, { useState, useEffect } from 'react'
import { Alert, Col, Card, Container, Form, Row, Button, Nav, Navbar, Image } from "react-bootstrap"
import axios from "axios"
import ohuh from '../ohuh-sm.PNG';
import catchErrors from '../utils/catchErrors.js'
import { isAuthenticated } from '../utils/auth'
import * as Icon from 'react-bootstrap-icons';
import { Link, Redirect } from 'react-router-dom';
const INIT_PAGE = {
bookmark: []
}
function Bookmark() {
const [page, setPage] = useState(INIT_PAGE)
const [index, setIndex] = useState(1);
const [error, setError] = useState('')
const [state, setState] = useState(false);
const [bookmark, setBookmark] = useState([true, true, true, true])
const [pagePlace, setPagePlace] = useState([])
const [showSet, setShowSet] = useState([false, false, false, false]);
const user = isAuthenticated()
async function getBookmark() {
try {
const response = await axios.get(`/api/users/bookmark?ID=${user}`)
setPagePlace(response.data.bookmark)
} catch (error) {
catchErrors(error, setError)
}
}
async function handleBookmark(index) {
if (!bookmark[index]) {
console.log(pagePlace[index])
try {
const response = await axios.put(`/api/users/bookmark?ID=${user}&place=${pagePlace[index]._id}`)
alert(response.data, '북마크가 저장되었습니다.')
const showArr = bookmark
showArr[index] = true
setBookmark(showArr)
console.log("bookmark=", bookmark)
} catch (error) {
catchErrors(error, setError)
}
} else {
try {
const response = await axios.delete(`/api/users/bookmark?ID=${user}&place=${pagePlace[index]._id}`)
alert(response.data, '저장된 북마크가 삭제되었습니다.')
const showArr = bookmark
showArr[index] = false
setBookmark(showArr)
console.log("bookmark=", bookmark)
} catch (error) {
catchErrors(error, setError)
}
}
}
useEffect(() => {
getBookmark()
}, [])
return (
<Container>
<Link to="/" className="d-flex justify-content-center">
<Image style={{ margin: "1%" }} src={ohuh} />
</Link>
<Navbar bg="info" variant="dark">
<Navbar.Brand href="/">북마크</Navbar.Brand>
<Nav className="mr-auto">
<Nav.Link href="/">Home</Nav.Link>
</Nav>
</Navbar>
<Row className="d-flex flex-wrap">
{console.log("#####################33", pagePlace)}
{pagePlace.map((place, index) => {
return (
<Col key={index} md={6} >
<Card align="center" border="info" style={{ margin: "3%" }}>
<Card.Header className="d-flex justify-content-center" style={{ margin: "0", fontSize: '200%', fontWeight: 'bold' }} >{place.name}
{user ?
<Button
variant={bookmark[index] ? "primary" : "light"}
onClick={() => handleBookmark(index, place)}>
<Icon.BookmarkStarFill size={35} />
{console.log("bookmark", bookmark)}
{console.log("bookmark[index]", bookmark[index])}</Button> : null}
</Card.Header>
<Card.Img variant="top" style={{ padding: "5%", width: "100%", height: "340px" }} src={place.img} />
<Card.Body >
<Card.Text style={{ overflow: 'auto', fontSize: '25px', width: '100%', height: "80px" }} >
{place.address} </Card.Text>
<Link to={`/place?id=${1}&place=${place.name}`} >
<Button variant="info"> {place.name} 자세히 살펴보기</Button>
</Link>
</Card.Body>
</Card>
</Col>
)
})}
</Row>
</Container >
)
}
export default Bookmark
// async function handleSubmit(e){
// setState(true); //버튼이 눌려서 handlesubmit이될때 setState값이 true로 바뀐다
// try { //respons 서버에 post로 요청하여 데이터를 받아온다
// const response = await axios.post('/api/users/bookmark', page)
// setSuccess(true)
// } catch (error) {
// console.log(error)
// catchErrors(error, setError)
// }
// }
// useEffect(() => {
// getBookmark(user)
// }, [user])
\ No newline at end of file
/*global kakao*/
import axios from 'axios'; import axios from 'axios';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Container, Row, Image } from 'react-bootstrap'; import { Container, Row, Button, Image, } from 'react-bootstrap';
import queryString from 'query-string' import queryString from 'query-string'
import { Link } from 'react-router-dom'; import { Link } from 'react-bootstrap-icons';
import ohuh from '../ohuh-sm.PNG'; import ohuh from '../ohuh-sm.PNG';
function Place(props) { function Place(props) {
...@@ -30,6 +31,24 @@ function Place(props) { ...@@ -30,6 +31,24 @@ function Place(props) {
} }
useEffect(() => { useEffect(() => {
// const script = document.createElement("script");
// script.async = true;
// script.src =
// "https://dapi.kakao.com/v2/maps/sdk.js?appkey=908d6cabedae3bbac126305e53137d0d&autoload=false";
// document.head.appendChild(script);
// script.onload = () => {
// kakao.maps.load(() => {
// let container = document.getElementById("Mymap");
// let options = {
// center: new kakao.maps.LatLng(37.506502, 127.053617),
// level: 7
// };
// const map = new window.kakao.maps.Map(container, options);
// });
// }
getReview(); getReview();
window.addEventListener("scroll", infiniteScroll); window.addEventListener("scroll", infiniteScroll);
return () => { window.removeEventListener("scroll", infiniteScroll); } return () => { window.removeEventListener("scroll", infiniteScroll); }
...@@ -54,22 +73,82 @@ function Place(props) { ...@@ -54,22 +73,82 @@ function Place(props) {
} }
return ( return (
<Container {...props}> <Container>
<Link to="/" className="d-flex justify-content-center"> <Link to="/" className="d-flex justify-content-center"><Image style={{ margin: "1%" }} src={ohuh} /></Link>
<Image style={{ margin: "1%" }} src={ohuh} /> <div class="d-flex align-items-center p-3 my-3 text-white bg-info rounded shadow-sm">
</Link> <div >
{place} <h1 class="h6 mb-0 text-white">{place}</h1>
</div>
</div>
<div class="my-3 p-3 bg-white rounded shadow-sm">
<h6 class="border-bottom pb-2 mb-0">관광지 정보</h6>
{/* <MapContents id="Mymap"></MapContents> */}
{/* <div class="d-flex text-muted pt-3">
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
</div>
<div class="d-flex text-muted pt-3">
<svg class="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#e83e8c" /><text x="50%" y="50%" fill="#e83e8c" dy=".3em">32x32</text></svg>
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
</div>
<div class="d-flex text-muted pt-3">
<svg class="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#6f42c1" /><text x="50%" y="50%" fill="#6f42c1" dy=".3em">32x32</text></svg>
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
</div> */}
<small class="d-block text-end mt-3">
<a href={`https://www.google.com/search?q=${place}&tbm=isch`}>사진 더보러가기</a>
</small>
</div>
<div class="my-3 p-3 bg-white rounded shadow-sm">
<h6 class="border-bottom pb-2 mb-0">관광지 후기</h6>
{Array.isArray(reviews) ? reviews.map((review, index) => { {Array.isArray(reviews) ? reviews.map((review, index) => {
return ( return (
<Row className="mt-4"> <div class="d-flex text-muted pt-3">
<a href={review.link}>{review.title}</a> <div class="pb-3 mb-0 small lh-sm border-bottom w-100">
<div>{review.summary}</div> <div class="d-flex justify-content-between">
<div>{review.content}</div> <strong class="text-gray-dark">{review.title}</strong>
</Row> <a href={review.link}>블로그로 이동</a>
</div>
<span class="d-block">{review.summary}</span>
</div>
</div>
) )
}) })
: "리뷰가 없습니다."} : "리뷰가 없습니다."}
<small class="d-block text-end mt-3">
<a href="#">리뷰 더보기</a>
</small>
</div>
</Container> </Container>
// <Container {...props}>
// {place}
// {Array.isArray(reviews) ? reviews.map((review, index) => {
// return (
// <Row className="mt-4">
// <a href={review.link}>{review.title}</a>
// <div>{review.summary}</div>
// <div>{review.content}</div>
// </Row>
// )
// })
// : "리뷰가 없습니다."}
// </Container>
); );
} }
......
...@@ -142,7 +142,7 @@ function Search(props) { ...@@ -142,7 +142,7 @@ function Search(props) {
} }
return ( return (
<Container > <Container >
<Link to="/" className="d-flex justify-content-center" ><Image src={ohuh} /></Link> <Link to="/" className="d-flex justify-content-center"><Image src={ohuh} /></Link>
<Row className="mb-2" className="d-flex justify-content-center"> <Row className="mb-2" className="d-flex justify-content-center">
<Form style={{ width: "90vw" }} onSubmit={handleSubmit}> <Form style={{ width: "90vw" }} onSubmit={handleSubmit}>
<InputGroup size="lg"> <InputGroup size="lg">
...@@ -154,7 +154,7 @@ function Search(props) { ...@@ -154,7 +154,7 @@ function Search(props) {
onChange={handleChange} onChange={handleChange}
/> />
<InputGroup.Append> <InputGroup.Append>
<Button type="submit" variant="outline-secondary" >검색</Button> <Button type="submit" variant="info" >검색</Button>
</InputGroup.Append> </InputGroup.Append>
</InputGroup> </InputGroup>
</Form> </Form>
......
...@@ -8,7 +8,7 @@ import reportWebVitals from './reportWebVitals'; ...@@ -8,7 +8,7 @@ import reportWebVitals from './reportWebVitals';
import Signup from './Components/Signup' import Signup from './Components/Signup'
import Login from './Components/Login' import Login from './Components/Login'
import PrivateRoute from "./Components/PrivateRoute"; import PrivateRoute from "./Components/PrivateRoute";
import Bookmark from "./Bookmark" import Bookmark from "./Pages/Bookmark"
import { import {
BrowserRouter as Router, BrowserRouter as Router,
Switch, Switch,
......
...@@ -38,7 +38,7 @@ const searchImg = async (req, res, next) => { ...@@ -38,7 +38,7 @@ const searchImg = async (req, res, next) => {
const newPlaces = await new Places(req.places).save() const newPlaces = await new Places(req.places).save()
next() next()
} else if (req.places.img === "https://t1.daumcdn.net/thumb/R600x0/?fname=http%3A%2F%2Ft1.daumcdn.net%2Fqna%2Fimage%2F4b035cdf8372d67108f7e8d339660479dfb41bbd") { } else if (req.places.img === "https://t1.daumcdn.net/thumb/R600x0/?fname=http%3A%2F%2Ft1.daumcdn.net%2Fqna%2Fimage%2F4b035cdf8372d67108f7e8d339660479dfb41bbd") {
const imgUrl = "https://www.google.com/search?q=" + encodeURI(req.query.keyword) + "+site:tistory.com/&sxsrf=ALeKk023Dv08KQDodRmpB5222lQuzw2Vaw:1610612821100&source=lnms&tbm=isch" const imgUrl = "https://www.google.com/search?q=" + encodeURI(req.query.keyword) + "+site:tistory.com/&tbm=isch"
axios.get(imgUrl) axios.get(imgUrl)
.then(async (response) => { .then(async (response) => {
......
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