Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
travel
Commits
2b496d1c
Commit
2b496d1c
authored
Jul 28, 2022
by
Lee Soobeom
Browse files
css 수정
parent
89ceb5ae
Changes
19
Hide whitespace changes
Inline
Side-by-side
frontend/src/App.tsx
View file @
2b496d1c
...
@@ -37,7 +37,14 @@ export const App = () => {
...
@@ -37,7 +37,14 @@ export const App = () => {
</
RequireAuth
>
</
RequireAuth
>
}
}
/>
/>
<
Route
path
=
"admin"
element
=
{
<
RequireAuth
><
Admin
/></
RequireAuth
>
}
/>
<
Route
path
=
"admin"
element
=
{
<
RequireAuth
>
<
Admin
/>
</
RequireAuth
>
}
/>
<
Route
path
=
"admin/:imgId"
element
=
{
<
ImgRewrite
/>
}
/>
<
Route
path
=
"admin/:imgId"
element
=
{
<
ImgRewrite
/>
}
/>
<
Route
path
=
"rewrite"
element
=
{
<
ImgRewrite
/>
}
/>
<
Route
path
=
"rewrite"
element
=
{
<
ImgRewrite
/>
}
/>
</
Route
>
</
Route
>
...
...
frontend/src/Pages/myslide.tsx
View file @
2b496d1c
...
@@ -46,7 +46,7 @@ export function MySlide({ slides }: num) {
...
@@ -46,7 +46,7 @@ export function MySlide({ slides }: num) {
<
<
</
button
>
</
button
>
<
div
<
div
className
=
{
`m-3 md:m-5 md:basis-4/5 flex flex-row
relative
w-full overflow-hidden`
}
className
=
{
`m-3 md:m-5 md:basis-4/5 flex flex-row w-full overflow-hidden`
}
>
>
{
slides
.
slice
(
page
-
1
,
page
+
2
).
map
((
slide
)
=>
(
{
slides
.
slice
(
page
-
1
,
page
+
2
).
map
((
slide
)
=>
(
<
div
key
=
{
Math
.
random
()
}
className
=
"min-w-full"
>
<
div
key
=
{
Math
.
random
()
}
className
=
"min-w-full"
>
...
...
frontend/src/auth/admin.tsx
View file @
2b496d1c
...
@@ -113,7 +113,7 @@ export default function Admin() {
...
@@ -113,7 +113,7 @@ export default function Admin() {
.
slice
(
i
*
limit
,
i
*
limit
+
limit
)
.
slice
(
i
*
limit
,
i
*
limit
+
limit
)
.
map
((
picture
,
index
:
number
)
=>
(
.
map
((
picture
,
index
:
number
)
=>
(
<
div
key
=
{
index
}
>
<
div
key
=
{
index
}
>
<
div
className
=
{
`m-1 shrink-0 bg-
gray-200
rounded shadow-md `
}
>
<
div
className
=
{
`m-1 shrink-0 bg-
white
rounded shadow-md `
}
>
<
img
<
img
src
=
{
src
=
{
"
http://localhost:3000/images/
"
+
picture
.
fileInfo
.
newfilename
"
http://localhost:3000/images/
"
+
picture
.
fileInfo
.
newfilename
...
@@ -122,8 +122,8 @@ export default function Admin() {
...
@@ -122,8 +122,8 @@ export default function Admin() {
/>
/>
<
p
className
=
"text-center text-xs"
>
{
picture
.
title
}
</
p
>
<
p
className
=
"text-center text-xs"
>
{
picture
.
title
}
</
p
>
</
div
>
</
div
>
<
div
className
=
"text-en
d
"
>
<
div
className
=
"text-
c
en
ter
"
>
<
button
className
=
"border-r-2 border-r-indigo-500 text-xs"
>
<
button
className
=
"border-r-2 border-r-indigo-500
px-3
text-xs
md:text-m
"
>
<
Link
to
=
{
`/admin/
${
picture
.
_id
}
`
}
state
=
{
picture
}
>
<
Link
to
=
{
`/admin/
${
picture
.
_id
}
`
}
state
=
{
picture
}
>
수정
수정
</
Link
>
</
Link
>
...
@@ -131,7 +131,7 @@ export default function Admin() {
...
@@ -131,7 +131,7 @@ export default function Admin() {
<
button
<
button
id
=
{
picture
.
_id
}
id
=
{
picture
.
_id
}
onClick
=
{
handleDeleteClick
}
onClick
=
{
handleDeleteClick
}
className
=
"text-xs"
className
=
"text-xs
md:text-m px-3
"
>
>
삭제
삭제
</
button
>
</
button
>
...
@@ -145,7 +145,7 @@ export default function Admin() {
...
@@ -145,7 +145,7 @@ export default function Admin() {
return
(
return
(
<
div
>
<
div
>
<
form
onSubmit
=
{
handleSubmit
}
>
<
form
onSubmit
=
{
handleSubmit
}
>
<
div
className
=
"flex flex-wrap justify-center gap-3"
>
<
div
className
=
"flex flex-wrap justify-center gap-3
bg-white md:shadow-lg rounded
"
>
<
div
className
=
"gap-3 md:flex "
>
<
div
className
=
"gap-3 md:flex "
>
<
select
<
select
name
=
"city"
name
=
"city"
...
@@ -187,18 +187,18 @@ export default function Admin() {
...
@@ -187,18 +187,18 @@ export default function Admin() {
<
option
value
=
"zoo"
>
동물원
</
option
>
<
option
value
=
"zoo"
>
동물원
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
</
select
>
</
select
>
<
div
className
=
"flex items-center justify-end gap-3"
>
<
div
className
=
"flex items-center
md:
justify-end gap-3"
>
<
input
<
input
type
=
"file"
type
=
"file"
id
=
"files"
id
=
"files"
className
=
"hidden"
className
=
"hidden"
onChange
=
{
handleFileChange
}
onChange
=
{
handleFileChange
}
></
input
>
></
input
>
<
label
htmlFor
=
"files"
className
=
"border-2 m-5"
>
<
label
htmlFor
=
"files"
className
=
"border-2
md:
m-5"
>
이미지 선택
이미지 선택
</
label
>
</
label
>
</
div
>
</
div
>
<
div
className
=
"flex items-center justify-end gap-3 mt-2 md:mt-0"
>
<
div
className
=
"flex items-center
md:
justify-end gap-3 mt-2 md:mt-0"
>
<
p
>
title :
</
p
>
<
p
>
title :
</
p
>
<
input
<
input
name
=
"title"
name
=
"title"
...
@@ -215,6 +215,7 @@ export default function Admin() {
...
@@ -215,6 +215,7 @@ export default function Admin() {
<
div
className
=
"flex justify-center"
>
<
div
className
=
"flex justify-center"
>
<
MySlide
key
=
{
Math
.
random
()
}
slides
=
{
slides
}
/>
<
MySlide
key
=
{
Math
.
random
()
}
slides
=
{
slides
}
/>
</
div
>
</
div
>
<
div
className
=
"bg-lime-100 h-48"
/>
</
div
>
</
div
>
);
);
}
}
frontend/src/auth/imgrewrite.tsx
View file @
2b496d1c
...
@@ -6,264 +6,253 @@ import equals from "validator/lib/equals";
...
@@ -6,264 +6,253 @@ import equals from "validator/lib/equals";
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
MainimgType
}
from
"
../types
"
;
import
{
MainimgType
}
from
"
../types
"
;
export
interface
ImgState
{
export
interface
ImgState
{
state
:
MainimgType
;
state
:
MainimgType
;
}
}
export
default
function
ImgRewrite
()
{
export
default
function
ImgRewrite
()
{
// 이미지 수정
// 이미지 수정
const
[
theme
,
setTheme
]
=
useState
<
string
>
(
"
질문종류
"
);
const
[
theme
,
setTheme
]
=
useState
<
string
>
(
"
질문종류
"
);
const
[
city
,
setCity
]
=
useState
<
string
>
(
"
질문종류
"
);
const
[
city
,
setCity
]
=
useState
<
string
>
(
"
질문종류
"
);
const
[
url
,
setUrl
]
=
useState
<
string
>
(
""
);
const
[
url
,
setUrl
]
=
useState
<
string
>
(
""
);
const
[
title
,
setTitle
]
=
useState
<
string
>
(
""
);
const
[
title
,
setTitle
]
=
useState
<
string
>
(
""
);
const
navigate
=
useNavigate
();
const
navigate
=
useNavigate
();
const
location
=
useLocation
()
as
ImgState
;
const
location
=
useLocation
()
as
ImgState
;
const
img
=
location
.
state
;
const
img
=
location
.
state
;
const
[
imgdata
,
setImgData
]
=
useState
<
MainimgType
>
({
const
[
imgdata
,
setImgData
]
=
useState
<
MainimgType
>
({
_id
:
img
.
_id
,
_id
:
img
.
_id
,
theme
:
img
.
theme
,
theme
:
img
.
theme
,
city
:
img
.
city
,
city
:
img
.
city
,
title
:
img
.
title
,
title
:
img
.
title
,
fileInfo
:
{
originalfilename
:
""
,
newfilename
:
""
},
fileInfo
:
{
originalfilename
:
""
,
newfilename
:
""
},
});
});
useEffect
(()
=>
{
useEffect
(()
=>
{
console
.
log
(
"
수정 전 :
"
,
imgdata
);
console
.
log
(
"
수정 전 :
"
,
imgdata
);
},
[]);
},
[]);
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
error
,
setError
]
=
useState
(
""
);
const
[
error
,
setError
]
=
useState
(
""
);
const
[
success
,
setSuccess
]
=
useState
(
false
);
const
[
success
,
setSuccess
]
=
useState
(
false
);
const
[
file
,
setFile
]
=
useState
<
File
>
();
const
[
file
,
setFile
]
=
useState
<
File
>
();
const
[
imageSrc
,
setImageSrc
]
=
useState
(
""
);
const
[
imageSrc
,
setImageSrc
]
=
useState
(
""
);
const
PictureSrc
=
(
fileBlob
:
Blob
)
=>
{
const
PictureSrc
=
(
fileBlob
:
Blob
)
=>
{
const
reader
=
new
FileReader
();
const
reader
=
new
FileReader
();
reader
.
readAsDataURL
(
fileBlob
);
reader
.
readAsDataURL
(
fileBlob
);
reader
.
onload
=
(
data
)
=>
{
reader
.
onload
=
(
data
)
=>
{
if
(
typeof
data
.
target
?.
result
===
"
string
"
)
{
if
(
typeof
data
.
target
?.
result
===
"
string
"
)
{
console
.
log
(
data
.
target
?.
result
);
console
.
log
(
data
.
target
?.
result
);
setImageSrc
(
data
.
target
?.
result
);
setImageSrc
(
data
.
target
?.
result
);
}
}
};
};
};
};
const
onUploadFile
=
(
e
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
onUploadFile
=
(
e
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
file
=
e
.
target
.
files
?.[
0
];
const
file
=
e
.
target
.
files
?.[
0
];
if
(
!
(
file
===
undefined
))
{
if
(
!
(
file
===
undefined
))
{
setFile
(
file
);
setFile
(
file
);
PictureSrc
(
file
);
PictureSrc
(
file
);
}
}
};
};
async
function
reWriteSubmit
(
event
:
FormEvent
)
{
async
function
reWriteSubmit
(
event
:
FormEvent
)
{
event
.
preventDefault
();
event
.
preventDefault
();
if
(
confirm
(
"
수정하시겠습니까?
"
)
==
true
)
{
if
(
confirm
(
"
수정하시겠습니까?
"
)
==
true
)
{
// try {
setError
(
""
);
setError
(
""
);
console
.
log
(
"
user data
"
,
imgdata
);
console
.
log
(
"
user data
"
,
imgdata
);
const
formdata
=
new
FormData
();
// if (infoFormMatch(imgdata) === true) {
formdata
.
append
(
"
id
"
,
imgdata
.
_id
);
// setLoading(true);
console
.
log
(
imgdata
.
_id
);
// const res = await mainimgApi.updating(imgdata);
formdata
.
append
(
"
city
"
,
imgdata
.
city
);
// console.log("clear", res);
formdata
.
append
(
"
theme
"
,
imgdata
.
theme
);
// navigate("/admin", { replace: true });
formdata
.
append
(
"
title
"
,
imgdata
.
title
);
// setSuccess(true);
console
.
log
(
formdata
);
// setError("");
if
(
!
(
file
===
undefined
))
{
const
formdata
=
new
FormData
();
formdata
.
append
(
"
updatemainimg
"
,
file
);
formdata
.
append
(
"
id
"
,
imgdata
.
_id
)
console
.
log
(
"
formdata
"
,
formdata
);
console
.
log
(
imgdata
.
_id
)
const
res
=
await
mainimgApi
.
updateimg
(
formdata
,
imgdata
.
_id
);
formdata
.
append
(
"
city
"
,
imgdata
.
city
);
navigate
(
"
/admin
"
,
{
replace
:
true
});
formdata
.
append
(
"
theme
"
,
imgdata
.
theme
);
console
.
log
(
"
확인 중
"
,
res
);
formdata
.
append
(
"
title
"
,
imgdata
.
title
);
}
else
{
console
.
log
(
formdata
)
formdata
.
append
(
"
updatemainimg
"
,
""
);
if
(
!
(
file
===
undefined
))
{
console
.
log
(
"
formdata
"
,
formdata
);
formdata
.
append
(
"
updatemainimg
"
,
file
);
const
res
=
await
mainimgApi
.
updateimg
(
formdata
,
imgdata
.
_id
);
console
.
log
(
"
formdata
"
,
formdata
);
navigate
(
"
/admin
"
,
{
replace
:
true
});
const
res
=
await
mainimgApi
.
updateimg
(
formdata
,
imgdata
.
_id
);
console
.
log
(
"
확인 중
"
,
res
);
navigate
(
"
/admin
"
,
{
replace
:
true
});
}
console
.
log
(
"
확인 중
"
,
res
);
}
else
{
}
return
false
;
else
{
formdata
.
append
(
"
updatemainimg
"
,
""
);
console
.
log
(
"
formdata
"
,
formdata
);
const
res
=
await
mainimgApi
.
updateimg
(
formdata
,
imgdata
.
_id
);
navigate
(
"
/admin
"
,
{
replace
:
true
});
console
.
log
(
"
확인 중
"
,
res
);
}
// }
// } catch (error) {
// console.log("에러발생");
// catchErrors(error, setError);
// } finally {
// setLoading(false);
// }
}
else
{
return
false
;
}
}
}
// console.log(user._id)
}
function
infoFormMatch
(
pic
:
MainimgType
)
{
// console.log(user._id)
if
(
!
isLength
(
pic
.
title
??
""
,
{
min
:
1
})
)
{
function
infoFormMatch
(
pic
:
MainimgType
)
{
setError
(
"
제목을 입력해 주세요.
"
);
if
(
!
isLength
(
pic
.
title
??
""
,
{
min
:
1
}))
{
return
false
;
setError
(
"
제목을 입력해 주세요.
"
)
;
}
else
if
(
!
isLength
(
pic
.
fileInfo
.
newfilename
??
""
,
{
min
:
1
}))
{
return
false
;
setError
(
"
파일을 선택해 주세요.
"
);
}
else
if
(
!
isLength
(
pic
.
fileInfo
.
newfilename
??
""
,
{
min
:
1
}))
{
return
false
;
setError
(
"
파일을 선택해 주세요.
"
)
;
}
else
if
(
equals
(
pic
.
city
,
"
city
"
))
{
return
false
;
setError
(
"
도시를 선택해 주세요.
"
);
}
else
if
(
equals
(
pic
.
city
,
"
city
"
))
{
return
false
;
setError
(
"
도시를 선택해 주세요.
"
)
;
}
else
if
(
equals
(
pic
.
theme
,
"
theme
"
))
{
return
false
;
setError
(
"
테마를 선택해 주세요.
"
);
}
else
if
(
equals
(
pic
.
theme
,
"
theme
"
))
{
return
false
;
setError
(
"
테마를 선택해 주세요.
"
)
;
}
e
lse
{
return
fa
lse
;
return
true
;
}
else
{
}
return
true
;
}
}
}
const
cityChange
=
(
event
:
React
.
ChangeEvent
<
HTMLSelectElement
>
)
=>
{
const
city
=
event
.
currentTarget
.
value
;
const
newUser
=
{
...
imgdata
,
city
:
city
};
console
.
log
(
event
.
currentTarget
.
value
);
setCity
(
event
.
currentTarget
.
value
);
setImgData
(
newUser
);
};
const
cityChange
=
(
event
:
React
.
ChangeEvent
<
HTMLSelectElement
>
)
=>
{
const
themeChange
=
(
event
:
React
.
ChangeEvent
<
HTMLSelectElement
>
)
=>
{
const
city
=
event
.
currentTarget
.
value
;
const
theme
=
event
.
currentTarget
.
value
;
const
newUser
=
{
...
imgdata
,
city
:
city
};
const
newUser
=
{
...
imgdata
,
theme
:
theme
};
console
.
log
(
event
.
currentTarget
.
value
);
console
.
log
(
event
.
currentTarget
.
value
);
setCity
(
event
.
currentTarget
.
value
);
setTheme
(
event
.
currentTarget
.
value
);
setImgData
(
newUser
);
setImgData
(
newUser
);
};
};
const
themeChange
=
(
event
:
React
.
ChangeEvent
<
HTMLSelectElement
>
)
=>
{
const
theme
=
event
.
currentTarget
.
value
;
const
newUser
=
{
...
imgdata
,
theme
:
theme
};
console
.
log
(
event
.
currentTarget
.
value
);
setTheme
(
event
.
currentTarget
.
value
);
setImgData
(
newUser
);
};
const
titleChange
=
(
event
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
titleChange
=
(
event
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
title
=
event
.
currentTarget
.
value
;
const
title
=
event
.
currentTarget
.
value
;
const
newUser
=
{
...
imgdata
,
title
:
title
};
const
newUser
=
{
...
imgdata
,
title
:
title
};
setTitle
(
event
.
currentTarget
.
value
);
setTitle
(
event
.
currentTarget
.
value
);
setImgData
(
newUser
);
setImgData
(
newUser
);
};
};
const
fileChange
=
(
event
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
fileChange
=
(
event
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
{
const
url
=
event
.
currentTarget
.
value
;
const
url
=
event
.
currentTarget
.
value
;
const
newUser
=
{
...
imgdata
,
pic
:
{
originalfilename
:
""
,
newfilename
:
url
}
};
const
newUser
=
{
setUrl
(
event
.
currentTarget
.
value
);
...
imgdata
,
setImgData
(
newUser
);
pic
:
{
originalfilename
:
""
,
newfilename
:
url
},
};
};
return
(
setUrl
(
event
.
currentTarget
.
value
);
<
div
>
setImgData
(
newUser
);
<
form
onSubmit
=
{
reWriteSubmit
}
className
=
"px-10 md:px-40"
>
};
<
table
className
=
"w-full "
>
return
(
<
thead
></
thead
>
<
div
>
<
tbody
className
=
" border-separate border border-slate-400 "
>
<
div
className
=
"bg-white md:shadow-lg rounded py-24"
>
<
tr
>
<
form
onSubmit
=
{
reWriteSubmit
}
className
=
"px-3 md:px-25"
>
<
td
className
=
"border border-slate-300 min-w-max"
>
<
table
className
=
"m-auto"
>
도시이름
<
thead
></
thead
>
</
td
>
<
tbody
>
<
td
>
<
tr
>
<
select
<
td
className
=
"border border-slate-300 px-5"
>
도시이름
</
td
>
name
=
"city"
<
td
>
className
=
"border border-3 border-black"
<
select
onChange
=
{
cityChange
}
name
=
"city"
defaultValue
=
{
img
.
city
}
className
=
"border border-3 border-black"
>
onChange
=
{
cityChange
}
<
option
value
=
"city"
>
도시
</
option
>
defaultValue
=
{
img
.
city
}
<
option
value
=
"Seoul"
>
서울
</
option
>
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"city"
>
도시
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
<
option
value
=
"Seoul"
>
서울
</
option
>
<
option
value
=
"Daegoo"
>
대구
</
option
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"Kwangjoo"
>
광주
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
<
option
value
=
"Daejeon"
>
대전
</
option
>
<
option
value
=
"Daegoo"
>
대구
</
option
>
<
option
value
=
"Woolsan"
>
울산
</
option
>
<
option
value
=
"Kwangjoo"
>
광주
</
option
>
<
option
value
=
"Sejong"
>
세종
</
option
>
<
option
value
=
"Daejeon"
>
대전
</
option
>
<
option
value
=
"Dokdo"
>
독도
</
option
>
<
option
value
=
"Woolsan"
>
울산
</
option
>
<
option
value
=
"Jeju"
>
제주
</
option
>
<
option
value
=
"Sejong"
>
세종
</
option
>
</
select
>
<
option
value
=
"Dokdo"
>
독도
</
option
>
</
td
>
<
option
value
=
"Jeju"
>
제주
</
option
>
</
tr
>
</
select
>
<
tr
>
</
td
>
<
td
className
=
"border border-slate-300 min-w-max"
>
</
tr
>
테마이름
<
tr
>
</
td
>
<
td
className
=
"border border-slate-300 min-w-max px-5"
>
<
td
>
테마이름
<
select
</
td
>
name
=
"theme"
<
td
>
className
=
"border border-3 border-black"
<
select
onChange
=
{
themeChange
}
name
=
"theme"
defaultValue
=
{
img
.
theme
}
className
=
"border border-3 border-black"
>
onChange
=
{
themeChange
}
<
option
value
=
"theme"
>
테마
</
option
>
defaultValue
=
{
img
.
theme
}
<
option
value
=
"cycling"
>
사이클링
</
option
>
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"theme"
>
테마
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"camping"
>
캠핑
</
option
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"sking"
>
스키
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
<
option
value
=
"boat"
>
보트
</
option
>
<
option
value
=
"camping"
>
캠핑
</
option
>
<
option
value
=
"desert"
>
사막
</
option
>
<
option
value
=
"sking"
>
스키
</
option
>
<
option
value
=
"golf"
>
골프
</
option
>
<
option
value
=
"boat"
>
보트
</
option
>
<
option
value
=
"cave"
>
동굴
</
option
>
<
option
value
=
"desert"
>
사막
</
option
>
<
option
value
=
"history"
>
문화재
</
option
>
<
option
value
=
"golf"
>
골프
</
option
>
<
option
value
=
"zoo"
>
동물원
</
option
>
<
option
value
=
"cave"
>
동굴
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"history"
>
문화재
</
option
>
</
select
>
<
option
value
=
"zoo"
>
동물원
</
option
>
</
td
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
</
tr
>
</
select
>
<
tr
>
</
td
>
<
td
className
=
"border border-slate-300"
>
</
tr
>
url
<
tr
className
=
"items-center border border-slate-300"
>
</
td
>
<
td
className
=
"min-w-max px-7"
>
이미지
</
td
>
<
td
>
<
td
>
<
input
<
input
type
=
"file"
type
=
"file"
id
=
"files"
id
=
"files"
className
=
"hidden"
className
=
"hidden"
onChange
=
{
onUploadFile
}
onChange
=
{
onUploadFile
}
></
input
>
></
input
>
<
label
htmlFor
=
"files"
className
=
"border-2 m-5"
>
<
label
htmlFor
=
"files"
className
=
"border-2"
>
이미지 선택
이미지 선택
</
label
>
</
label
>
{
imageSrc
?
(
{
imageSrc
?
(
<
img
<
img
src
=
{
imageSrc
}
src
=
{
imageSrc
}
className
=
"object-cover object-center h-full"
className
=
"object-cover object-center h-full"
/>
/>
)
:
(
)
:
(
<
img
<
img
src
=
{
"
http://localhost:3000/images/
"
+
img
.
fileInfo
.
newfilename
}
src
=
{
className
=
"object-cover object-center h-full"
"
http://localhost:3000/images/
"
+
/>
img
.
fileInfo
.
newfilename
)
}
}
</
td
>
className
=
"object-cover object-center max-w-lg max-h-36"
</
tr
>
/>
<
tr
>
)
}
<
td
className
=
"border border-slate-300"
>
</
td
>
title
</
tr
>
</
td
>
<
tr
>
<
td
>
<
td
className
=
"border border-slate-300 min-w-max px-9"
>
<
input
className
=
"border-2 border-sky-500 rounded w-full"
title
onChange
=
{
titleChange
}
</
td
>
defaultValue
=
{
img
.
title
}
<
td
>
/>
<
input
</
td
>
className
=
"border-2 border-sky-500 rounded w-full"
</
tr
>
onChange
=
{
titleChange
}
</
tbody
>
defaultValue
=
{
img
.
title
}
</
table
>
/>
<
div
className
=
"text-end"
>
</
td
>
<
button
type
=
"submit"
className
=
"border-2"
>
</
tr
>
수정
</
tbody
>
</
button
>
</
table
>
<
button
className
=
"border-2"
>
<
div
className
=
"text-center pt-10 whitespace-nowrap"
>
<
Link
to
=
{
`/admin`
}
>
<
button
취소
type
=
"submit"
</
Link
>
className
=
"border-2 sm:mr-3 md:mr-10 md:text-lg"
</
button
>
>
</
div
>
수정
</
form
>
</
button
>
<
Outlet
/>
<
button
className
=
"border-2 sm:mr-3 md:mr-10 md:text-lg"
>
</
div
>
<
Link
to
=
{
`/admin`
}
>
취소
</
Link
>
);
</
button
>
};
</
div
>
</
form
>
{
/* <Outlet /> */
}
</
div
>
<
div
className
=
"bg-lime-100 h-12"
/>
</
div
>
);
}
frontend/src/auth/login.tsx
View file @
2b496d1c
...
@@ -49,13 +49,13 @@ export default function Login() {
...
@@ -49,13 +49,13 @@ export default function Login() {
return
(
return
(
<
div
className
=
"flex flex-col items-center my-10"
>
<
div
className
=
"flex flex-col items-center my-10"
>
<
div
className
=
"
bg-white
w-1/2 md:w-1/3 my-8 text-center text-2xl"
>
<
div
className
=
"w-1/2 md:w-1/3 my-8 text-center text-2xl
font-semibold
"
>
<
Link
to
=
"/"
>
로그인
</
Link
>
<
Link
to
=
"/"
>
로그인
</
Link
>
</
div
>
</
div
>
<
div
className
=
"flex flex-col w-full md:w-3/5 p-8 md:p-4"
>
<
div
className
=
"flex flex-col w-full md:w-3/5 p-8 md:p-4"
>
<
form
<
form
onSubmit
=
{
handleSubmit
}
onSubmit
=
{
handleSubmit
}
className
=
"flex flex-col md:flex-row md:justify-around border-2 border-black rounded-xl p-8 gap-y-4"
className
=
"flex flex-col
bg-white
md:flex-row md:justify-around border-2 border-black rounded-xl p-8 gap-y-4"
>
>
<
div
className
=
"flex flex-col md:w-2/3 gap-2"
>
<
div
className
=
"flex flex-col md:w-2/3 gap-2"
>
<
input
<
input
...
@@ -101,12 +101,13 @@ export default function Login() {
...
@@ -101,12 +101,13 @@ export default function Login() {
</
div
>
</
div
>
)
}
)
}
<
div
className
=
"flex justify-around m-4"
>
<
div
className
=
"flex justify-around m-4"
>
<
button
className
=
"bg-white "
>
<
button
>
<
Link
to
=
"/signup"
>
회원가입
</
Link
>
<
Link
to
=
"/signup"
>
회원가입
</
Link
>
</
button
>
</
button
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
<
div
className
=
"bg-lime-100 h-36"
/>
</
div
>
</
div
>
);
);
}
}
frontend/src/auth/profile.tsx
View file @
2b496d1c
...
@@ -68,91 +68,94 @@ export default function Profile() {
...
@@ -68,91 +68,94 @@ export default function Profile() {
},
[]);
},
[]);
return
(
return
(
<
div
className
=
"grid bg-white rounded shadow-lg mb-5"
>
<
div
>
<
form
className
=
"mx-24 "
onSubmit
=
{
handleSubmit
}
>
<
div
className
=
"grid bg-white rounded shadow-lg mb-5"
>
<
div
className
=
" mt-7 text-2xl"
>
프로필 수정
</
div
>
<
form
className
=
"mx-24 "
onSubmit
=
{
handleSubmit
}
>
<
div
className
=
" mt-10 border-0 border-y-2 border-gray-400"
>
<
div
className
=
" mt-7 text-2xl"
>
프로필 수정
</
div
>
<
div
className
=
"flex h-20"
>
<
div
className
=
" mt-10 border-0 border-y-2 border-gray-400"
>
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
<
div
className
=
"flex h-20"
>
Email
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
</
div
>
Email
<
div
className
=
" grid place-items-center px-4 whitespace-nowrap"
>
</
div
>
{
email
}
<
div
className
=
" grid place-items-center px-4 whitespace-nowrap"
>
</
div
>
{
email
}
</
div
>
</
div
>
<
div
className
=
"flex border-0 border-t-2"
>
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
사진
</
div
>
</
div
>
<
div
className
=
"flex py-4 "
>
<
div
className
=
"flex border-0 border-t-2"
>
<
div
className
=
""
>
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
<
div
className
=
"overflow-hidden w-28 h-28 rounded-full border-2 mx-3 mb-3"
>
사진
{
imageSrc
?
(
</
div
>
<
img
<
div
className
=
"flex py-4 "
>
src
=
{
imageSrc
}
<
div
className
=
""
>
className
=
"object-cover object-center h-full"
<
div
className
=
"overflow-hidden w-28 h-28 rounded-full border-2 mx-3 mb-3"
>
/>
{
imageSrc
?
(
)
:
(
avatarUrl
&&
(
<
img
<
img
src
=
{
"
http://localhost:3000/images/
"
+
avatarUrl
}
src
=
{
imageSrc
}
className
=
"object-cover object-center h-full"
className
=
"object-cover object-center h-full"
/>
/>
)
)
:
(
)
}
avatarUrl
&&
(
<
img
src
=
{
"
http://localhost:3000/images/
"
+
avatarUrl
}
className
=
"object-cover object-center h-full"
/>
)
)
}
</
div
>
<
input
type
=
"file"
name
=
"avatar"
id
=
"avatar"
className
=
"hidden"
onChange
=
{
handleChange
}
></
input
>
<
label
htmlFor
=
"avatar"
className
=
"border-2 m-5 whitespace-nowrap "
>
이미지 선택
</
label
>
</
div
>
<
div
className
=
"pl-10 flex place-self-center text-gray-400 text-sm whitespace-nowrap"
>
{
"
<새로운 이미지를 넣어보세요!>
"
}
</
div
>
</
div
>
<
input
type
=
"file"
name
=
"avatar"
id
=
"avatar"
className
=
"hidden"
onChange
=
{
handleChange
}
></
input
>
<
label
htmlFor
=
"avatar"
className
=
"border-2 m-5 whitespace-nowrap "
>
이미지 선택
</
label
>
</
div
>
<
div
className
=
"pl-10 flex place-self-center text-gray-400 text-sm whitespace-nowrap"
>
{
"
<새로운 이미지를 넣어보세요!>
"
}
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
<
div
className
=
"flex border-0 border-t-2 h-20"
>
<
div
className
=
"flex border-0 border-t-2 h-20"
>
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
<
div
className
=
"w-24 border-0 border-r-2 bg-gray-100 grid place-items-center whitespace-nowrap"
>
이름
이름
</
div
>
<
input
name
=
"name"
placeholder
=
{
profile
.
name
}
className
=
" placeholder:text-black my-6 ml-5 border-2 "
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
<
input
name
=
"name"
placeholder
=
{
profile
.
name
}
className
=
" placeholder:text-black my-6 ml-5 border-2 "
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
</
div
>
<
div
className
=
"flex mb-5 justify-center gap-x-3"
>
<
div
className
=
"flex mb-5 justify-center gap-x-3"
>
<
button
<
button
onClick
=
{
handleSubmit
}
onClick
=
{
handleSubmit
}
className
=
" mt-5 h-12 w-1/5 border-2 border-blue-400 text-lg place-self-center whitespace-nowrap"
className
=
" mt-5 h-12 w-1/5 border-2 border-blue-400 text-lg place-self-center whitespace-nowrap"
>
>
저장하기
저장하기
</
button
>
</
button
>
<
button
className
=
" mt-5 h-12 w-1/5 text-lg border-2 border-orange-400 place-self-center whitespace-nowrap"
>
<
button
className
=
" mt-5 h-12 w-1/5 text-lg border-2 border-orange-400 place-self-center whitespace-nowrap"
>
<
Link
to
=
"/"
>
취소
</
Link
>
<
Link
to
=
"/"
>
취소
</
Link
>
</
button
>
</
button
>
<
button
<
button
type
=
"button"
type
=
"button"
onClick
=
{
onDelete
}
onClick
=
{
onDelete
}
className
=
" mt-5 h-12 w-1/5 text-lg border-2 border-red-400 place-self-center whitespace-nowrap"
className
=
" mt-5 h-12 w-1/5 text-lg border-2 border-red-400 place-self-center whitespace-nowrap"
>
>
계정 삭제
계정 삭제
</
button
>
</
button
>
</
div
>
</
div
>
</
form
>
</
form
>
</
div
>
<
div
className
=
"bg-lime-100 h-4"
/>
</
div
>
</
div
>
);
);
}
}
frontend/src/auth/signup.tsx
View file @
2b496d1c
...
@@ -68,86 +68,89 @@ export default function Signup() {
...
@@ -68,86 +68,89 @@ export default function Signup() {
}
}
return
(
return
(
<
div
className
=
"flex flex-col"
>
<
div
>
<
div
className
=
"flex place-items-strat ml-2 mt-8 text-center text-2xl "
>
<
div
className
=
"flex flex-col shadow-lg bg-white rounded"
>
<
Link
to
=
"/"
>
회원가입
</
Link
>
<
div
className
=
"grid place-items-center ml-2 mt-8 text-center text-2xl "
>
</
div
>
<
Link
to
=
"/"
>
회원가입
</
Link
>
</
div
>
<
form
onSubmit
=
{
handleSubmit
}
className
=
"flex flex-col mt-16 gap-y-4"
>
<
form
onSubmit
=
{
handleSubmit
}
className
=
"flex flex-col mt-16 gap-y-4"
>
<
div
className
=
"flex flex-col "
>
<
div
className
=
"flex flex-col px-32 pb-5"
>
<
div
className
=
"border-0 border-y-2 border-black"
>
<
div
className
=
"border-0 border-y-2 border-black"
>
<
div
className
=
"h-16 flex "
>
<
div
className
=
"h-16 flex"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
이름
이름
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
input
className
=
"h-10 w-4/5 lg:w-60 border-2 focus:border-black"
type
=
"text"
name
=
"name"
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
input
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
className
=
"h-10 w-4/5 lg:w-60 border-2 focus:border-black"
이메일
type
=
"text"
</
div
>
name
=
"name"
<
div
className
=
"flex items-center mx-5"
>
onChange
=
{
handleChange
}
<
input
/>
className
=
" w-4/5 h-10 lg:w-60 border-2 focus:border-black"
type
=
"email"
name
=
"email"
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
</
div
>
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
비밀번호
이메일
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
input
className
=
"w-4/5 h-10 lg:w-60 border-2 focus:border-black"
type
=
"password"
name
=
"password"
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
input
className
=
" w-4/5 h-10 lg:w-60 border-2 focus:border-black"
type
=
"email"
name
=
"email"
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
비밀번호
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
input
className
=
"w-4/5 h-10 lg:w-60 border-2 focus:border-black"
type
=
"password"
name
=
"password"
onChange
=
{
handleChange
}
/>
</
div
>
</
div
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"h-16 flex border-0 border-t-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
<
div
className
=
"whitespace-nowrap grid place-items-center w-32 lg:basis-1/5 shrink-0 border-0 border-r-2"
>
비밀번호 확인
비밀번호 확인
</
div
>
</
div
>
<
div
className
=
"flex items-center mx-5"
>
<
div
className
=
"flex items-center mx-5"
>
<
input
<
input
className
=
"w-4/5 h-10 lg:w-60 border-2 focus:border-black"
className
=
"w-4/5 h-10 lg:w-60 border-2 focus:border-black"
type
=
"password"
type
=
"password"
name
=
"password2"
name
=
"password2"
onChange
=
{
handleChange
}
onChange
=
{
handleChange
}
/>
/>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
{
error
&&
(
{
error
&&
(
<
div
className
=
"text-red-500 text-sm"
>
<
div
className
=
"text-red-500 text-sm"
>
<
p
>
{
error
}
</
p
>
<
p
>
{
error
}
</
p
>
</
div
>
</
div
>
)
}
<
button
disabled
=
{
disabled
}
className
=
"border-b border-white mt-5 h-12 w-52 text-white text-lg bg-amber-400 place-self-center"
>
{
loading
&&
(
<
SpinnerIcon
className
=
"animate-spin h-5 w-5 mr-1 text-slate"
/>
)
}
)
}
회원가입
</
button
>
<
button
</
div
>
disabled
=
{
disabled
}
</
form
>
className
=
"border-b border-white mt-5 h-12 w-52 text-white text-lg bg-amber-400 place-self-center"
>
{
loading
&&
(
<
SpinnerIcon
className
=
"animate-spin h-5 w-5 mr-1 text-slate"
/>
)
}
회원가입
</
button
>
</
div
>
</
form
>
</
div
>
<
div
className
=
"bg-lime-100 h-36"
/>
</
div
>
</
div
>
);
);
}
}
frontend/src/board/board.tsx
View file @
2b496d1c
...
@@ -41,17 +41,22 @@ export default function BoardPage() {
...
@@ -41,17 +41,22 @@ export default function BoardPage() {
};
};
const
titleHandleClick
=
async
(
event
:
MouseEvent
<
HTMLButtonElement
>
)
=>
{
const
titleHandleClick
=
async
(
event
:
MouseEvent
<
HTMLButtonElement
>
)
=>
{
const
postId
=
event
.
currentTarget
.
id
;
if
(
!
user
.
isLoggedIn
)
{
const
newpost
=
posts
?.
find
((
element
)
=>
{
alert
(
"
로그인이 필요합니다.
"
);
if
(
element
.
_id
===
postId
)
{
navigate
(
"
/login
"
,
{
replace
:
true
});
return
element
;
}
else
{
const
postId
=
event
.
currentTarget
.
id
;
const
newpost
=
posts
?.
find
((
element
)
=>
{
if
(
element
.
_id
===
postId
)
{
return
element
;
}
});
if
(
!
(
newpost
?.
_id
===
undefined
))
{
const
post
=
newpost
;
const
res
=
await
postApi
.
addCounts
(
post
.
_id
,
post
.
counts
);
// console.log(res);
setPosts
(
res
);
}
}
});
if
(
!
(
newpost
?.
_id
===
undefined
))
{
const
post
=
newpost
;
const
res
=
await
postApi
.
addCounts
(
post
.
_id
,
post
.
counts
);
// console.log(res);
setPosts
(
res
);
}
}
};
};
...
...
frontend/src/home/body.tsx
View file @
2b496d1c
...
@@ -96,6 +96,7 @@ export default function Body() {
...
@@ -96,6 +96,7 @@ export default function Body() {
</
div
>
</
div
>
</
div
>
</
div
>
<
Outlet
/>
<
Outlet
/>
<
div
className
=
"bg-lime-100 h-16"
/>
</
div
>
</
div
>
// Body Page
// Body Page
);
);
...
...
frontend/src/home/header.tsx
View file @
2b496d1c
...
@@ -14,7 +14,7 @@ export default function Header() {
...
@@ -14,7 +14,7 @@ export default function Header() {
};
};
// bg-gradient-to-t from-sky-200
// bg-gradient-to-t from-sky-200
return
(
return
(
<
div
className
=
"flex flex-col bg-lime-100"
>
<
div
className
=
"flex flex-col bg-lime-100
"
>
<
div
className
=
"flex flex-col md:px-14 lg:px-52 z-10 "
>
<
div
className
=
"flex flex-col md:px-14 lg:px-52 z-10 "
>
<
div
className
=
"flex flex-col-reverse pt-3 pb-12 "
>
<
div
className
=
"flex flex-col-reverse pt-3 pb-12 "
>
<
div
className
=
"flex mt-5 justify-between pr-3"
>
<
div
className
=
"flex mt-5 justify-between pr-3"
>
...
@@ -85,6 +85,7 @@ export default function Header() {
...
@@ -85,6 +85,7 @@ export default function Header() {
<
Outlet
/>
<
Outlet
/>
</
div
>
</
div
>
<
div
className
=
"bg-right bg-cover z-0 absolute w-full h-44 overflow-hidden object-cover object-center bg-[url('https://a-static.besthdwallpaper.com/seom-punggyeong-ilreoseuteu-byeogji-3840x1200-81006_62.jpg')]"
></
div
>
<
div
className
=
"bg-right bg-cover z-0 absolute w-full h-44 overflow-hidden object-cover object-center bg-[url('https://a-static.besthdwallpaper.com/seom-punggyeong-ilreoseuteu-byeogji-3840x1200-81006_62.jpg')]"
></
div
>
<
div
className
=
"bg-lime-100 h-12"
/>
</
div
>
</
div
>
);
);
}
}
frontend/src/home/theme.tsx
View file @
2b496d1c
...
@@ -7,7 +7,7 @@ type ThemeProps = {
...
@@ -7,7 +7,7 @@ type ThemeProps = {
export
default
function
Theme
({
handleClick
}:
ThemeProps
)
{
export
default
function
Theme
({
handleClick
}:
ThemeProps
)
{
const
[
active
,
setActive
]
=
useState
(
0
);
const
[
active
,
setActive
]
=
useState
(
0
);
const
onactive
=
"
whitespace-nowrap px-5 text-
sky-3
00
"
;
const
onactive
=
"
whitespace-nowrap px-5 text-
lime-5
00
"
;
const
offactive
=
"
whitespace-nowrap px-5
"
;
const
offactive
=
"
whitespace-nowrap px-5
"
;
const
clickActive
=
(
a
:
number
)
=>
{
const
clickActive
=
(
a
:
number
)
=>
{
...
@@ -16,7 +16,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -16,7 +16,7 @@ export default function Theme({ handleClick }: ThemeProps) {
return
(
return
(
<
div
className
=
" overflow-x-auto flex rounded py-2 md:py-4 md:pl-3 shadow-lg divide-x-2 bg-white"
>
<
div
className
=
" overflow-x-auto flex rounded py-2 md:py-4 md:pl-3 shadow-lg divide-x-2 bg-white"
>
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
surfing
"
}
id
=
{
"
surfing
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -25,7 +25,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -25,7 +25,7 @@ export default function Theme({ handleClick }: ThemeProps) {
서핑
서핑
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
2
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
2
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
activity
"
}
id
=
{
"
activity
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -34,7 +34,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -34,7 +34,7 @@ export default function Theme({ handleClick }: ThemeProps) {
액티비티
액티비티
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
3
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
3
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
camping
"
}
id
=
{
"
camping
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -43,7 +43,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -43,7 +43,7 @@ export default function Theme({ handleClick }: ThemeProps) {
캠핑
캠핑
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
4
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
4
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
skiing
"
}
id
=
{
"
skiing
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -52,7 +52,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -52,7 +52,7 @@ export default function Theme({ handleClick }: ThemeProps) {
스키
스키
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
5
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
5
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
boat
"
}
id
=
{
"
boat
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -61,7 +61,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -61,7 +61,7 @@ export default function Theme({ handleClick }: ThemeProps) {
보트
보트
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
6
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
6
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
desert
"
}
id
=
{
"
desert
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -70,7 +70,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -70,7 +70,7 @@ export default function Theme({ handleClick }: ThemeProps) {
사막
사막
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
7
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
7
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
golf
"
}
id
=
{
"
golf
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -79,7 +79,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -79,7 +79,7 @@ export default function Theme({ handleClick }: ThemeProps) {
골프
골프
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
8
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
8
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
cave
"
}
id
=
{
"
cave
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -88,7 +88,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -88,7 +88,7 @@ export default function Theme({ handleClick }: ThemeProps) {
동굴
동굴
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
9
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
9
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
history
"
}
id
=
{
"
history
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -97,7 +97,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -97,7 +97,7 @@ export default function Theme({ handleClick }: ThemeProps) {
문화재
문화재
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
10
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
10
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
zoo
"
}
id
=
{
"
zoo
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
@@ -106,7 +106,7 @@ export default function Theme({ handleClick }: ThemeProps) {
...
@@ -106,7 +106,7 @@ export default function Theme({ handleClick }: ThemeProps) {
동물원
동물원
</
button
>
</
button
>
</
div
>
</
div
>
<
div
onClick
=
{
()
=>
clickActive
(
11
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
11
)
}
className
=
"px-0 md:px-2"
>
<
button
<
button
id
=
{
"
cycling
"
}
id
=
{
"
cycling
"
}
onClick
=
{
handleClick
}
onClick
=
{
handleClick
}
...
...
frontend/src/pages/citylist.tsx
View file @
2b496d1c
...
@@ -16,7 +16,7 @@ export default function Citylist({ handleClick }: CityProps) {
...
@@ -16,7 +16,7 @@ export default function Citylist({ handleClick }: CityProps) {
};
};
return
(
return
(
<
div
className
=
"overflow-auto w-full md:w-36 bg-white
flex flex-row md:flex-col md:mr-24 shadow-lg"
>
<
div
className
=
"overflow-auto w-full md:w-36 bg-white flex flex-row md:flex-col md:mr-24 shadow-lg"
>
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
>
<
div
onClick
=
{
()
=>
clickActive
(
1
)
}
>
<
button
<
button
id
=
{
"
Seoul
"
}
id
=
{
"
Seoul
"
}
...
...
frontend/src/post/intopost.tsx
View file @
2b496d1c
...
@@ -72,11 +72,11 @@ export function IntoPost() {
...
@@ -72,11 +72,11 @@ export function IntoPost() {
<
div
className
=
"flex basis-1/2 whitespace-nowrap px-0.5 md:px-2"
>
<
div
className
=
"flex basis-1/2 whitespace-nowrap px-0.5 md:px-2"
>
작성일 :
{
posts
?.
date
.
slice
(
0
,
10
)
}
작성일 :
{
posts
?.
date
.
slice
(
0
,
10
)
}
</
div
>
</
div
>
<
div
className
=
"flex hidden md:whitespace-nowrap md:px-2 "
>
<
div
className
=
"
md:
flex hidden md:whitespace-nowrap md:px-2 "
>
{
"
"
}
{
"
"
}
{
posts
?.
city
}
{
posts
?.
city
}
</
div
>
</
div
>
<
div
className
=
"flex hidden md:whitespace-nowrap md:px-2"
>
<
div
className
=
"
md:
flex hidden md:whitespace-nowrap md:px-2"
>
{
"
"
}
{
"
"
}
{
posts
?.
theme
}
{
posts
?.
theme
}
</
div
>
</
div
>
...
...
frontend/src/post/post.tsx
View file @
2b496d1c
...
@@ -12,11 +12,11 @@ export default function Post({ handleClick, post }: Props) {
...
@@ -12,11 +12,11 @@ export default function Post({ handleClick, post }: Props) {
return
(
return
(
<
div
className
=
"flex flex-row h-16 divide-x-2 border-2 border-solid"
>
<
div
className
=
"flex flex-row h-16 divide-x-2 border-2 border-solid"
>
<
div
className
=
"basis-full"
>
<
div
className
=
"basis-full"
>
<
Link
to
=
{
`/post/
${
post
.
_id
}
`
}
state
=
{
post
}
>
<
button
id
=
{
post
.
_id
}
onClick
=
{
handleClick
}
>
<
button
id
=
{
post
.
_id
}
onClick
=
{
handleClick
}
>
<
Link
to
=
{
`/post/
${
post
.
_id
}
`
}
state
=
{
post
}
>
{
post
.
title
}
{
post
.
title
}
</
button
>
</
Link
>
</
Link
>
</
button
>
</
div
>
</
div
>
<
div
className
=
"basis-3/12"
>
{
post
.
date
.
slice
(
0
,
10
)
}
</
div
>
<
div
className
=
"basis-3/12"
>
{
post
.
date
.
slice
(
0
,
10
)
}
</
div
>
<
div
className
=
"basis-2/12"
>
{
post
.
counts
}
</
div
>
<
div
className
=
"basis-2/12"
>
{
post
.
counts
}
</
div
>
...
...
frontend/src/post/posting.tsx
View file @
2b496d1c
...
@@ -18,8 +18,8 @@ export default function Posting() {
...
@@ -18,8 +18,8 @@ export default function Posting() {
const
[
user
,
setUser
]
=
useState
<
PostType
>
({
const
[
user
,
setUser
]
=
useState
<
PostType
>
({
title
:
""
,
title
:
""
,
text
:
""
,
text
:
""
,
theme
:
""
,
theme
:
"
theme
"
,
city
:
""
,
city
:
"
city
"
,
date
:
""
,
date
:
""
,
user
:
{
user
:
{
_id
:
""
,
_id
:
""
,
...
@@ -107,11 +107,11 @@ export default function Posting() {
...
@@ -107,11 +107,11 @@ export default function Posting() {
alert
(
"
사진을 첨부해 주세요.
"
);
alert
(
"
사진을 첨부해 주세요.
"
);
setError
(
"
사진을 첨부해 주세요.
"
);
setError
(
"
사진을 첨부해 주세요.
"
);
return
false
;
return
false
;
}
else
if
(
equals
(
city
,
"
city
"
))
{
}
else
if
(
equals
(
user
.
city
,
"
city
"
))
{
alert
(
"
도시를 선택해 주세요.
"
);
alert
(
"
도시를 선택해 주세요.
"
);
setError
(
"
도시를 선택해 주세요.
"
);
setError
(
"
도시를 선택해 주세요.
"
);
return
false
;
return
false
;
}
else
if
(
equals
(
theme
,
"
theme
"
))
{
}
else
if
(
equals
(
user
.
theme
,
"
theme
"
))
{
alert
(
"
테마를 선택해 주세요.
"
);
alert
(
"
테마를 선택해 주세요.
"
);
setError
(
"
테마를 선택해 주세요.
"
);
setError
(
"
테마를 선택해 주세요.
"
);
return
false
;
return
false
;
...
@@ -205,11 +205,11 @@ export default function Posting() {
...
@@ -205,11 +205,11 @@ export default function Posting() {
<
select
<
select
name
=
"city"
name
=
"city"
className
=
"border-2 border-sky-400
text-xs h-6 place-self-center"
className
=
"border-2 border-sky-400 text-xs h-6 place-self-center"
onChange
=
{
cityChange
}
onChange
=
{
cityChange
}
defaultValue
=
"
질문종류
"
defaultValue
=
"
city
"
>
>
<
option
value
=
"
질문종류
"
>
도시
</
option
>
<
option
value
=
"
city
"
>
도시
</
option
>
<
option
value
=
"Seoul"
>
서울
</
option
>
<
option
value
=
"Seoul"
>
서울
</
option
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
...
@@ -226,9 +226,9 @@ export default function Posting() {
...
@@ -226,9 +226,9 @@ export default function Posting() {
name
=
"theme"
name
=
"theme"
className
=
"border-2 border-sky-400 text-xs h-6 place-self-center"
className
=
"border-2 border-sky-400 text-xs h-6 place-self-center"
onChange
=
{
themeChange
}
onChange
=
{
themeChange
}
defaultValue
=
"
질문종류
"
defaultValue
=
"
theme
"
>
>
<
option
value
=
"
질문종류
"
>
테마
</
option
>
<
option
value
=
"
theme
"
>
테마
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
...
...
src/controllers/auth.controller.ts
View file @
2b496d1c
...
@@ -22,6 +22,10 @@ export const authenticate = asyncWrap(
...
@@ -22,6 +22,10 @@ export const authenticate = asyncWrap(
if
(
req
.
auth
)
{
if
(
req
.
auth
)
{
const
{
userId
}
=
req
.
auth
;
const
{
userId
}
=
req
.
auth
;
const
user
=
req
.
user
;
const
user
=
req
.
user
;
console
.
log
(
"
req.user
"
,
req
.
user
);
console
.
log
(
"
user.id
"
,
user
.
id
);
console
.
log
(
"
userId
"
,
userId
);
if
(
user
&&
user
.
id
===
userId
)
{
if
(
user
&&
user
.
id
===
userId
)
{
return
next
();
return
next
();
}
else
{
}
else
{
...
...
src/controllers/mainimg.controller.ts
View file @
2b496d1c
...
@@ -70,11 +70,23 @@ export const updateMainimg = asyncWrap(async (reqExp, res) => {
...
@@ -70,11 +70,23 @@ export const updateMainimg = asyncWrap(async (reqExp, res) => {
// const { id } = reqExp.params;
// const { id } = reqExp.params;
const
{
id
,
theme
,
city
,
title
}
=
req
.
body
;
const
{
id
,
theme
,
city
,
title
}
=
req
.
body
;
const
{
updatemainimg
}:
{
updatemainimg
:
formidable
.
File
}
=
req
.
files
;
const
{
updatemainimg
}:
{
updatemainimg
:
formidable
.
File
}
=
req
.
files
;
console
.
log
(
"
전부 제대로
"
,
id
,
theme
,
city
,
title
,
updatemainimg
)
console
.
log
(
"
전부 제대로
"
,
id
,
theme
,
city
,
title
,
updatemainimg
);
const
img
=
await
mainimgDb
.
updateOneMainimg
(
id
,
theme
,
city
,
title
,
updatemainimg
);
if
(
updateMainimg
===
undefined
)
{
const
img
=
await
mainimgDb
.
updateOneMainimg
(
id
,
theme
,
city
,
title
);
res
.
json
(
img
);
return
res
.
json
(
img
);
})
}
else
{
const
img
=
await
mainimgDb
.
updateOneMainimg
(
id
,
theme
,
city
,
title
,
updatemainimg
);
return
res
.
json
(
img
);
}
});
// const form = formidable({
// const form = formidable({
// uploadDir: "uploads",
// uploadDir: "uploads",
// keepExtensions: true,
// keepExtensions: true,
...
...
src/controllers/post.controller.ts
View file @
2b496d1c
import
{
NextFunction
,
Request
,
Response
}
from
"
express
"
;
import
{
NextFunction
,
Request
,
Response
}
from
"
express
"
;
import
formidable
,
{
Fields
,
Files
}
from
"
formidable
"
;
import
formidable
,
{
Fields
,
Files
}
from
"
formidable
"
;
import
{
TypedRequestAuth
}
from
"
./auth.controller
"
;
import
{
TypedRequestAuth
}
from
"
./auth.controller
"
;
import
equals
from
"
validator/lib/equals
"
;
import
{
asyncWrap
}
from
"
../helpers
"
;
import
{
asyncWrap
}
from
"
../helpers
"
;
import
{
postDb
,
userDb
}
from
"
../db
"
;
import
{
postDb
,
userDb
}
from
"
../db
"
;
import
{
TypedRequest
}
from
"
../types
"
;
import
{
TypedRequest
}
from
"
../types
"
;
import
{
Types
}
from
"
mongoose
"
;
import
{
Types
}
from
"
mongoose
"
;
export
const
userByPostId
=
(
export
const
userByPostId
=
async
(
reqExp
:
Request
,
reqExp
:
Request
,
res
:
Response
,
res
:
Response
,
next
:
NextFunction
,
next
:
NextFunction
,
postId
:
string
postId
:
string
)
=>
{
)
=>
{
const
req
=
reqExp
as
TypedRequest
;
const
req
=
reqExp
as
TypedRequest
;
req
.
user
=
userDb
.
findUserByPostId
(
postId
);
req
.
user
=
await
userDb
.
findUserByPostId
(
postId
);
next
();
next
();
};
};
...
...
src/db/mainimg.db.ts
View file @
2b496d1c
...
@@ -44,26 +44,22 @@ export const updateOneMainimg = async (
...
@@ -44,26 +44,22 @@ export const updateOneMainimg = async (
theme
:
string
,
theme
:
string
,
city
:
string
,
city
:
string
,
title
:
string
,
title
:
string
,
fileInfo
:
formidable
.
File
fileInfo
?:
formidable
.
File
// originalfilename?: string | null,
// newfilename?: string
)
=>
{
)
=>
{
// const newMainimg = await Mainimg.findById(_Id)
const
newMainimg
=
await
Mainimg
.
findById
(
_Id
).
populate
<
{
const
newMainimg
=
await
Mainimg
.
findById
(
_Id
).
populate
<
{
fileInfo
:
IFileInfo
}
>
(
fileInfo
:
IFileInfo
;
"
fileInfo
"
}
>
(
"
fileInfo
"
);
);
// console.log("error2", newMainimg);
console
.
log
(
"
error2
"
,
newMainimg
);
if
(
!
newMainimg
)
{
if
(
!
newMainimg
)
{
throw
new
Error
(
"
mainimg가 존재하지 않습니다
"
)
throw
new
Error
(
"
mainimg가 존재하지 않습니다
"
)
;
}
}
if
(
if
(
fileInfo
.
originalFilename
&&
fileInfo
?
.
originalFilename
&&
newMainimg
?.
fileInfo
.
originalfilename
!==
fileInfo
.
originalFilename
newMainimg
?.
fileInfo
.
originalfilename
!==
fileInfo
?
.
originalFilename
)
{
)
{
// 같지 않으면 기존의 파일을 디스크에서 삭제한 후
// 같지 않으면 기존의 파일을 디스크에서 삭제한 후
try
{
try
{
console
.
log
(
"
picturepath
"
,
newMainimg
.
fileInfo
.
picturepath
)
//
console.log("picturepath", newMainimg.fileInfo.picturepath)
await
fs
.
unlink
(
newMainimg
.
fileInfo
.
picturepath
);
await
fs
.
unlink
(
newMainimg
.
fileInfo
.
picturepath
);
}
catch
(
error
)
{
}
catch
(
error
)
{
console
.
log
(
"
error
"
,
error
);
console
.
log
(
"
error
"
,
error
);
...
@@ -76,44 +72,10 @@ export const updateOneMainimg = async (
...
@@ -76,44 +72,10 @@ export const updateOneMainimg = async (
await
mainimgAvatar
.
save
();
await
mainimgAvatar
.
save
();
}
}
newMainimg
.
theme
=
theme
;
newMainimg
.
theme
=
theme
;
newMainimg
.
city
=
city
;
newMainimg
.
city
=
city
;
newMainimg
.
title
=
title
;
newMainimg
.
title
=
title
;
await
newMainimg
.
save
();
await
newMainimg
.
save
();
console
.
log
(
"
mainimg updated
"
,
newMainimg
);
console
.
log
(
"
mainimg updated
"
,
newMainimg
);
return
newMainimg
;
return
newMainimg
;
}
};
// if (!(newMainimg?.fileInfo === undefined)) {
// if (originalfilename === undefined) {
// await Mainimg.findByIdAndUpdate(newMainimg._id, {
// theme: theme,
// city: city,
// title: title,
// });
// console.log("errrror4");
// } else if (
// !(originalfilename === undefined) &&
// (!(theme === undefined) ||
// !(city === undefined) ||
// !(title === undefined))
// ) {
// await Mainimg.findByIdAndUpdate(newMainimg._id, {
// theme: theme,
// city: city,
// title: title,
// });
// await FileInfo.findByIdAndUpdate(newMainimg.fileInfo._id, {
// originalfilename: originalfilename,
// newfilename: newfilename,
// });
// console.log("error6");
// } else {
// await FileInfo.findByIdAndUpdate(newMainimg.fileInfo._id, {
// originalfilename: originalfilename,
// newfilename: newfilename,
// });
// console.log("error5", newfilename, originalfilename, theme, city, title);
// }
// } else console.log("error3", newMainimg);
// };
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment