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
e7e8eef0
Commit
e7e8eef0
authored
Jul 21, 2022
by
백승민
Browse files
delete working
parent
316b6e6d
Changes
7
Hide whitespace changes
Inline
Side-by-side
frontend/src/apis/mainimg.api.ts
View file @
e7e8eef0
...
...
@@ -7,13 +7,12 @@ export const mainimg = async (mainimg: MainimgType) => {
return
data
;
};
export
const
delmainimg
=
async
(
id
:
string
)
=>
{
export
const
delmainimg
=
async
(
_
id
:
string
)
=>
{
const
{
data
}
=
await
axios
.
delete
(
`
${
baseUrl
}
/mainimg`
);
return
data
;
};
export
const
getmainimg
=
async
()
=>
{
const
{
data
}
=
await
axios
.
get
(
`
${
baseUrl
}
/mainimg`
);
console
.
log
(
"
test
"
,
data
)
return
data
;
};
frontend/src/auth/admin.tsx
View file @
e7e8eef0
import
React
,
{
FormEvent
,
useEffect
,
useState
}
from
"
react
"
;
import
React
,
{
FormEvent
,
useEffect
,
useState
,
MouseEvent
}
from
"
react
"
;
import
{
mainimgApi
}
from
"
../apis
"
;
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
MainimgType
}
from
"
../types
"
;
import
{
MySlide
}
from
"
./adminslide
"
;
import
{
MySlide
}
from
"
./adminslide
"
;
export
default
function
Admin
()
{
...
...
@@ -19,6 +19,7 @@ export default function Admin() {
},
[]);
const
[
addimg
,
setAddimg
]
=
useState
<
MainimgType
>
({
_id
:
""
,
theme
:
""
,
city
:
""
,
url
:
""
,
...
...
@@ -48,6 +49,7 @@ export default function Admin() {
console
.
log
(
"
서버연결됬나요
"
,
res
);
setSuccess
(
true
);
setError
(
""
);
alert
(
"
img 추가되었습니다
"
);
}
catch
(
error
)
{
console
.
log
(
"
에러발생
"
);
catchErrors
(
error
,
setError
);
...
...
@@ -56,10 +58,18 @@ export default function Admin() {
}
}
if
(
success
)
{
alert
(
"
img 추가되었습니다
"
);
}
// if (success) {
// alert("img 추가되었습니다");
// }
async
function
handleDeleteClick
(
event
:
MouseEvent
<
HTMLButtonElement
>
)
{
const
picId
=
event
.
currentTarget
.
id
;
console
.
log
(
picId
)
const
res
=
await
mainimgApi
.
delmainimg
(
picId
);
console
.
log
(
"
delete img
"
,
res
);
alert
(
"
img 삭제되었습니다.
"
)
};
let
limit
=
15
;
const
numPages
=
Math
.
ceil
(
getimgs
.
length
/
15
);
...
...
@@ -67,14 +77,17 @@ export default function Admin() {
for
(
let
i
=
0
;
i
<
numPages
;
i
++
)
{
const
k
=
[
getimgs
.
slice
(
i
*
limit
,
i
*
limit
+
limit
).
map
((
pic
,
index
:
number
)
=>
(
<
div
className
=
{
`m-1 shrink-0 bg-gray-200 rounded shadow-md `
}
key
=
{
index
}
>
<
img
src
=
{
pic
.
url
}
className
=
"w-full h-10 md:h-20 object-center"
/>
<
p
className
=
"text-center text-xs"
>
{
pic
.
title
}
</
p
>
<
div
key
=
{
index
}
>
<
div
className
=
{
`m-1 shrink-0 bg-gray-200 rounded shadow-md `
}
>
<
img
src
=
{
pic
.
url
}
className
=
"w-full h-10 md:h-20 object-center"
/>
<
p
className
=
"text-center text-xs"
>
{
pic
.
title
}
</
p
>
</
div
>
<
button
id
=
{
pic
.
_id
}
onClick
=
{
handleDeleteClick
}
>
삭제
</
button
>
</
div
>
))]
slides
.
push
(
k
);
...
...
@@ -84,67 +97,70 @@ export default function Admin() {
<
div
>
<
form
onSubmit
=
{
handleSubmit
}
>
<
div
className
=
"flex justify-center gap-3"
>
<
select
name
=
"city"
id
=
"Questions"
className
=
"border border-3 border-black w-20 my-5"
defaultValue
=
"질문종류"
onChange
=
{
handleSelectChange
}
>
<
option
value
=
"질문종류"
>
도시
</
option
>
<
option
value
=
"Seoul"
>
서울
</
option
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
<
option
value
=
"Daegoo"
>
대구
</
option
>
<
option
value
=
"Kwangjoo"
>
광주
</
option
>
<
option
value
=
"Daejeon"
>
대전
</
option
>
<
option
value
=
"Woolsan"
>
울산
</
option
>
<
option
value
=
"Sejong"
>
세종
</
option
>
<
option
value
=
"Dokdo"
>
독도
</
option
>
<
option
value
=
"Jeju"
>
제주
</
option
>
</
select
>
<
select
name
=
"theme"
id
=
"Questions"
className
=
"border border-3 border-black w-20 my-5"
defaultValue
=
"질문종류"
onChange
=
{
handleSelectChange
}
>
<
option
value
=
"질문종류"
>
테마
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
<
option
value
=
"camping"
>
캠핑
</
option
>
<
option
value
=
"sking"
>
스키
</
option
>
<
option
value
=
"boat"
>
보트
</
option
>
<
option
value
=
"desert"
>
사막
</
option
>
<
option
value
=
"golf"
>
골프
</
option
>
<
option
value
=
"cave"
>
동굴
</
option
>
<
option
value
=
"history"
>
문화재
</
option
>
<
option
value
=
"zoo"
>
동물원
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
</
select
>
<
div
>
<
p
>
url
</
p
>
<
input
name
=
"url"
className
=
"border-2 border-sky-500"
onChange
=
{
handleInputeChange
}
/>
{
/* type="file"/> */
}
</
div
>
<
div
>
<
p
>
title
</
p
>
<
input
name
=
"title"
className
=
"border-2 border-sky-500"
onChange
=
{
handleInputeChange
}
/>
<
div
className
=
"flex flex-wrap justify-center gap-3"
>
<
div
className
=
"gap-3 md:flex "
>
<
select
name
=
"city"
id
=
"Questions"
className
=
"border border-3 border-black w-20 my-5"
defaultValue
=
"질문종류"
onChange
=
{
handleSelectChange
}
>
<
option
value
=
"질문종류"
>
도시
</
option
>
<
option
value
=
"Seoul"
>
서울
</
option
>
<
option
value
=
"Busan"
>
부산
</
option
>
<
option
value
=
"Incheon"
>
인천
</
option
>
<
option
value
=
"Daegoo"
>
대구
</
option
>
<
option
value
=
"Kwangjoo"
>
광주
</
option
>
<
option
value
=
"Daejeon"
>
대전
</
option
>
<
option
value
=
"Woolsan"
>
울산
</
option
>
<
option
value
=
"Sejong"
>
세종
</
option
>
<
option
value
=
"Dokdo"
>
독도
</
option
>
<
option
value
=
"Jeju"
>
제주
</
option
>
</
select
>
<
select
name
=
"theme"
id
=
"Questions"
className
=
"border border-3 border-black w-20 my-5"
defaultValue
=
"질문종류"
onChange
=
{
handleSelectChange
}
>
<
option
value
=
"질문종류"
>
테마
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
<
option
value
=
"surfing"
>
서핑
</
option
>
<
option
value
=
"activity"
>
액티비티
</
option
>
<
option
value
=
"camping"
>
캠핑
</
option
>
<
option
value
=
"sking"
>
스키
</
option
>
<
option
value
=
"boat"
>
보트
</
option
>
<
option
value
=
"desert"
>
사막
</
option
>
<
option
value
=
"golf"
>
골프
</
option
>
<
option
value
=
"cave"
>
동굴
</
option
>
<
option
value
=
"history"
>
문화재
</
option
>
<
option
value
=
"zoo"
>
동물원
</
option
>
<
option
value
=
"cycling"
>
사이클링
</
option
>
</
select
>
<
div
className
=
"flex items-center justify-end gap-3"
>
<
p
>
url :
</
p
>
<
input
name
=
"url"
className
=
"border-2 border-sky-500"
onChange
=
{
handleInputeChange
}
/>
{
/* type="file"/> */
}
</
div
>
<
div
className
=
"flex items-center justify-end gap-3 mt-2 md:mt-0"
>
<
p
>
title :
</
p
>
<
input
name
=
"title"
className
=
"border-2 border-sky-500"
onChange
=
{
handleInputeChange
}
/>
</
div
>
</
div
>
<
div
className
=
"my-5 "
>
<
button
className
=
"border-2 border-gray-500 rounded"
>
추가
</
button
>
<
div
className
=
"my-5
flex items-center
"
>
<
button
className
=
"border-2 border-gray-500 rounded
"
>
추가
</
button
>
</
div
>
</
div
>
</
form
>
<
div
className
=
"flex
flex-col
"
>
<
div
className
=
"flex
justify-center
"
>
<
MySlide
key
=
{
Math
.
random
()
}
slides
=
{
slides
}
/>
</
div
>
</
div
>
);
...
...
frontend/src/auth/adminslide.tsx
View file @
e7e8eef0
...
...
@@ -10,7 +10,6 @@ export function MySlide({ slides}: num) {
const
firstRightClick
=
useRef
(
true
);
const
[
page
,
setPage
]
=
useState
(
1
);
const
[
slide
,
setSlide
]
=
useState
(
1
);
// const slide = useRef(1);
const
[
style
,
setStyle
]
=
useState
(
""
);
const
leftClick
=
()
=>
{
...
...
@@ -20,7 +19,6 @@ export function MySlide({ slides}: num) {
}
else
{
setPage
(
page
-
1
)
}
// slide.current -= 1;
setSlide
(
slide
-
1
)
setStyle
(
"
-translate-x-full animate-slidetoright
"
);
};
...
...
@@ -32,16 +30,14 @@ export function MySlide({ slides}: num) {
}
else
{
setPage
(
page
+
1
)
}
// slide.current += 1;
setSlide
(
slide
+
1
)
setStyle
(
"
animate-slidetoleft
"
);
};
return
(
<
div
className
=
"flex flex-row
justify-center
items-center "
>
<
div
className
=
"flex flex-row items-center "
>
<
button
className
=
"mx-3 w-6 h-6 rounded-full hover:bg-sky-100 hover:text-gray-400"
onClick
=
{
leftClick
}
disabled
=
{
slide
===
1
}
>
<
{
/* {slide.current} */
}
</
button
>
<
div
className
=
{
`m-3 md:m-5 md:basis-4/5 flex flex-row relative w-full overflow-hidden`
}
...
...
frontend/src/types/index.tsx
View file @
e7e8eef0
...
...
@@ -40,7 +40,7 @@ export interface Profile {
}
export
interface
MainimgType
{
_id
:
string
;
theme
:
string
;
city
:
string
;
url
:
string
;
...
...
src/controllers/mainimg.controller.ts
View file @
e7e8eef0
import
{
NextFunction
,
Request
,
Response
}
from
"
express
"
;
import
isLength
from
"
validator/lib/isLength
"
;
import
{
TypedRequestAuth
}
from
"
./auth.controller
"
;
import
{
asyncWrap
}
from
"
../helpers
"
;
import
{
mainimgDb
}
from
"
../db
"
;
import
{
TypedRequest
}
from
"
../types
"
;
export
const
createMainimg
=
asyncWrap
(
async
(
reqExp
,
res
,
next
)
=>
{
const
req
=
reqExp
as
TypedRequestAuth
<
{
userId
:
string
}
>
;
const
{
theme
,
city
,
url
,
title
}
=
req
.
body
as
{
const
{
theme
,
city
,
url
,
title
}
=
req
.
body
as
{
theme
:
string
;
city
:
string
;
url
:
string
;
...
...
@@ -15,10 +17,10 @@ export const createMainimg = asyncWrap(async (reqExp, res, next) => {
console
.
log
(
"
body
"
,
req
.
body
);
if
(
!
isLength
(
url
??
""
,
{
min
:
1
}))
{
return
res
.
status
(
422
).
send
(
"
이미지 url을 입력해주세요
"
);
}
if
(
!
isLength
(
url
??
""
,
{
min
:
1
}))
{
return
res
.
status
(
422
).
send
(
"
이미지 url을 입력해주세요
"
);
}
if
(
!
isLength
(
title
??
""
,
{
min
:
1
}))
{
return
res
.
status
(
422
).
send
(
"
이미지 제목을 입력해주세요
"
);
}
...
...
@@ -34,10 +36,18 @@ export const createMainimg = asyncWrap(async (reqExp, res, next) => {
});
export
const
getMainimg
=
asyncWrap
(
async
(
req
,
res
)
=>
{
const
mainimgs
=
await
mainimgDb
.
getMainimg
();
return
res
.
json
(
mainimgs
);
});
const
mainimgs
=
await
mainimgDb
.
getMainimg
();
return
res
.
json
(
mainimgs
);
});
export
const
deleteMainimg
=
asyncWrap
(
async
(
req
,
res
)
=>
{
const
{
imgId
}
=
req
.
params
;
console
.
log
(
imgId
);
const
deleteCount
=
await
mainimgDb
.
deleteOneMainimg
(
imgId
);
return
res
.
json
(
deleteCount
);
});
src/db/mainimg.db.ts
View file @
e7e8eef0
...
...
@@ -14,3 +14,8 @@ export const getMainimg = async () => {
const
users
=
await
Mainimg
.
find
({});
return
users
;
};
export
const
deleteOneMainimg
=
async
(
_id
:
string
)
=>
{
const
res
=
await
Mainimg
.
deleteOne
({
_id
:
_id
});
return
res
;
};
src/routes/mainimg.route.ts
View file @
e7e8eef0
...
...
@@ -6,6 +6,8 @@ const router = express.Router();
router
.
route
(
"
/
"
)
.
get
(
authCtrl
.
requireLogin
,
mainimgCtrl
.
getMainimg
)
.
post
(
authCtrl
.
requireLogin
,
mainimgCtrl
.
createMainimg
);
.
post
(
authCtrl
.
requireLogin
,
mainimgCtrl
.
createMainimg
)
.
delete
(
authCtrl
.
requireLogin
,
mainimgCtrl
.
deleteMainimg
)
export
default
router
;
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