From 04a6ac30c40aac095c9523a2a7caeec238c51a24 Mon Sep 17 00:00:00 2001
From: Hyun Woo Jeong <jhw0714@ajou.ac.kr>
Date: Sun, 3 Dec 2023 15:57:28 +0900
Subject: [PATCH] more info on articles
---
backend/src/models/article.js | 2 +-
backend/src/post.js | 24 +++++++----------------
frontend/src/components/Article.js | 24 +++++++++++++++--------
frontend/src/pages/Main.js | 30 +----------------------------
frontend/src/pages/Search.js | 31 ++++++++++++------------------
5 files changed, 37 insertions(+), 74 deletions(-)
diff --git a/backend/src/models/article.js b/backend/src/models/article.js
index 9ac2e235..a8288efd 100644
--- a/backend/src/models/article.js
+++ b/backend/src/models/article.js
@@ -55,7 +55,7 @@ const ArticleSchema = new mongoose.Schema({
ref: 'User',
}],
createdAt: {
- type: Date,
+ type: String,
default: Date.now,
},
diff --git a/backend/src/post.js b/backend/src/post.js
index 14d6a471..edecec41 100644
--- a/backend/src/post.js
+++ b/backend/src/post.js
@@ -1,10 +1,13 @@
import express from 'express';
import multer from 'multer';
import path from 'path'
+import moment from 'moment'
import userService from './data/userService.js';
import articleService from './data/articleService.js';
+
+
const __dirname = path.resolve();
export const router = express.Router();
@@ -28,7 +31,6 @@ router.post("/upload", upload.array("img"), async function(req, res, next) {
}
console.log("�ъ뒪�� '�댁쨾'");
-
const inputTitle = req.body.title
const inputContent = req.body.content
const inputImage = req.files.map(el => el.path);
@@ -37,6 +39,7 @@ router.post("/upload", upload.array("img"), async function(req, res, next) {
const inputkeyword = req.body.keyword
const inputlat = req.body.latitude
const inputlng = req.body.longitude
+ const currentTime = moment().format('YYYY-MM-DD HH:mm:ss')
await articleService.createArticle({
title: inputTitle,
@@ -47,7 +50,8 @@ router.post("/upload", upload.array("img"), async function(req, res, next) {
latitude: inputlat,
longitude: inputlng,
comments: [],
- likes: []
+ likes: [],
+ createdAt: currentTime
});
console.log('saved.')
@@ -74,23 +78,9 @@ router.get("/loadarticle", async (req, res) => {
catch(err){
console.log(err)
}
-
});
});
- const retval = {
-
-
- }
- // console.log(articles)
- console.log(articles)
res.send(JSON.stringify(articles) );
});
-/*
-router.get('/preview', async (req, res, next)=>{
- const imgUrl = "http://localhost:3000/images/"
- result = imgUrl+"���λ맂 �대�吏�紐�" //imgUrl+"kitty.png"
- res.send(result);
-}
-異쒖쿂: https://avengersrhydon1121.tistory.com/234 [�듬챸�� 媛쒕컻�명듃:�곗뒪�좊━]
-*/
+
export default router;
diff --git a/frontend/src/components/Article.js b/frontend/src/components/Article.js
index 7c34f761..e758c247 100644
--- a/frontend/src/components/Article.js
+++ b/frontend/src/components/Article.js
@@ -1,12 +1,17 @@
import React, {useEffect, useState} from "react";
+
+
import { useParams } from 'react-router-dom';
-function Article(prop) {
+function Article({data}) {
+ const [
+ _id, title, content, images, author,
+ keyword, latitude, longitude,
+ comments, likes, createdAt] = data;
- console.log(prop)
let listItem = []
- listItem = prop.images.map((el)=>{
+ listItem = images.map((el)=>{
// http://localhost:8080/uploads/21701487062905.png
return(
<img
@@ -15,14 +20,17 @@ function Article(prop) {
style={{ width: "100px", height: "100px"}}/>
)});
-
+console.log(typeof createdAt)
return (
<div>
- <h1>{prop.title}</h1>
- <h2>{prop.author}</h2>
- <p>{prop.content}</p>
+ <h1>{title}</h1>
+
+ <h2>{keyword}</h2>
+ <h3>{author.nickname} {createdAt}</h3>
+
+ <p>{content}</p>
<p>{listItem}</p>
- {/* 寃뚯떆湲��� �댁슜�� �뚮뜑留곹빀�덈떎. */}
+ <p>�볤�: {comments.length} // 議곗���: {likes.length}</p>
</div>
);
}
diff --git a/frontend/src/pages/Main.js b/frontend/src/pages/Main.js
index b29a6302..0b45ea7f 100644
--- a/frontend/src/pages/Main.js
+++ b/frontend/src/pages/Main.js
@@ -18,19 +18,14 @@ function Button({history, children}){
}
function Main() {
-
const userContext = useContext(UserContext);
const [articleList, setArticleList] = useState([])
let listItem = [];
listItem = articleList.map((article)=>{
return(
<Article
- title={article.title}
- author = {article.author.nickname}
- content={article.content}
- images={article.imageUrls}
+ data={Object.values(article)}
></Article>
-
)
}
)
@@ -54,7 +49,6 @@ function Main() {
;
}
-
async function requestLoadArticle() {
const response = await axios({
url: 'http://localhost:8080/post/loadarticle', // �듭떊�� �밸Ц��
@@ -64,25 +58,3 @@ async function requestLoadArticle() {
}
export default Main;
-
-/*
- {
- _id: new ObjectId('65675ee46aab64d2ed605e3c'),
- title: '��',
- content: '�뗣뀑',
- imageUrls: [],
- author: {
- _id: new ObjectId('6566403f224df4126bfb3e50'),
- user_id: 'grasscraft0714@gmail.com',
- nickname: '�끷꼨��',
- email: 'grasscraft0714@gmail.com',
- google: [Object],
- __v: 0
- },
- comments: [],
- likes: [],
- createdAt: 2023-11-29T15:55:16.525Z,
- __v: 0
- }
-
-*/
diff --git a/frontend/src/pages/Search.js b/frontend/src/pages/Search.js
index 8a1d2297..43eb6a88 100644
--- a/frontend/src/pages/Search.js
+++ b/frontend/src/pages/Search.js
@@ -1,12 +1,12 @@
import { Map, MapMarker } from "react-kakao-maps-sdk";
import React, { useState, useEffect, useContext } from 'react';
import {Routes, Route, Link, useNavigate, Navigate } from 'react-router-dom';
-
+import SearchMap from '../components/SearchMapByKeyword.js'
import { UserContext } from '../Context.js';
const {kakao} = window;
//移댁뭅�� 吏��� API瑜� �댁슜�� 寃���(�덉젙)
-
+/*
function SearchMap(props){
// �꾩＜���숆탳瑜� 湲곕낯 �꾩튂濡� �ㅼ젙
const [state, setState] = useState({
@@ -34,23 +34,10 @@ function SearchMap(props){
geocoder.addressSearch(`${searchAddress}`, callback);
}
- return (
- <div className="UserInput">
- <input onChange={handleInput}/>
- <button onClick={SearchStart}>寃���!</button>
- <Map // 吏��꾨� �쒖떆�� Container
- center={state.center}
- isPanto={state.isPanto}
- style={{
- // 吏��꾩쓽 �ш린
- width: "100%",
- height: "450px",
- }}
- level={3}>
- </Map>
- </div>
- )
+
}
+*/
+
function Search(props) {
@@ -59,6 +46,12 @@ function Search(props) {
function MoveTo(link){
navigate(link)
}
+
+ const [location, setLocation] = useState({
+ keyword: "",
+ center: { lat: null, lng: null }
+ });
+
useEffect(() => {
const session = userContext.CheckSession()
.then((response) => {
@@ -76,7 +69,7 @@ function Search(props) {
return (
<div className="search">
<h1>寃��됲럹�댁��낅땲��.</h1>
- <SearchMap/>
+ <SearchMap loc={location} setLoc={setLocation}></SearchMap>
</div>
);
}
--
GitLab