@ -1,4 +1,4 @@
import { Box , Button , Flex , useColorMode , useColorModeValue , useDisclosure , useRadioGroup , useToast , chakra , Input , HStack , IconButton , Heading , Divider } from '@chakra-ui/react' ;
import { Box , Button , Flex , useColorMode , useColorModeValue , useDisclosure , useRadioGroup , useToast , chakra , Input , HStack , IconButton , Heading , Divider , AlertDialog , AlertDialogOverlay , AlertDialogContent , AlertDialogHeader , AlertDialogBody , AlertDialogFooter , Text } from '@chakra-ui/react' ;
import React , { useEffect , useState } from 'react' ;
import React , { useEffect , useState } from 'react' ;
import { MarkdownEditor } from 'components/markdown-editor/editor' ;
import { MarkdownEditor } from 'components/markdown-editor/editor' ;
import PageContainer from 'layouts/page-container' ;
import PageContainer from 'layouts/page-container' ;
@ -16,6 +16,7 @@ import RadioCard from 'components/radio-card';
import { useViewportScroll } from 'framer-motion' ;
import { useViewportScroll } from 'framer-motion' ;
import Card from 'components/card' ;
import Card from 'components/card' ;
import { Tag } from 'src/types/tag' ;
import { Tag } from 'src/types/tag' ;
import { ReserveUrls } from 'src/data/reserve-urls' ;
function PostEditPage() {
function PostEditPage() {
@ -113,10 +114,12 @@ function PostEditPage() {
export default PostEditPage
export default PostEditPage
function HeaderContent ( props : any ) {
function HeaderContent ( props : any ) {
const [ delOpen , setDelOpen ] = React . useState ( false )
const cancelRef = React . useRef ( )
const { toggleColorMode : toggleMode } = useColorMode ( )
const { toggleColorMode : toggleMode } = useColorMode ( )
const text = useColorModeValue ( "dark" , "light" )
const text = useColorModeValue ( "dark" , "light" )
const SwitchIcon = useColorModeValue ( FaMoon , FaSun )
const SwitchIcon = useColorModeValue ( FaMoon , FaSun )
const router = useRouter ( )
const editOptions = [ EditMode . Edit , EditMode . Preview ]
const editOptions = [ EditMode . Edit , EditMode . Preview ]
const { getRootProps , getRadioProps } = useRadioGroup ( {
const { getRootProps , getRadioProps } = useRadioGroup ( {
name : "framework" ,
name : "framework" ,
@ -128,6 +131,8 @@ function HeaderContent(props: any) {
const group = getRootProps ( )
const group = getRootProps ( )
const onDelete = async ( ) = > {
const onDelete = async ( ) = > {
await requestApi . delete ( ` /tag/ ${ props . tagID } ` )
await requestApi . delete ( ` /tag/ ${ props . tagID } ` )
setDelOpen ( false )
router . push ( ` ${ ReserveUrls . Admin } /tags ` )
}
}
return (
return (
@ -171,9 +176,35 @@ function HeaderContent(props: any) {
icon = { < SwitchIcon / > }
icon = { < SwitchIcon / > }
/ >
/ >
< Button layerStyle = "colorButton" ml = "2" onClick = { props . publish } > 发 布 < / Button >
< Button layerStyle = "colorButton" ml = "2" onClick = { props . publish } > 发 布 < / Button >
< Button colorScheme = "red" ml = "2" onClick = { onDelete } > 删 除 < / Button >
< Button colorScheme = "red" ml = "2" onClick = { ( ) = > setDelOpen ( true ) } > 删 除 < / Button >
< / Box >
< / Box >
< / Flex >
< / Flex >
< AlertDialog
isOpen = { delOpen }
leastDestructiveRef = { cancelRef }
onClose = { ( ) = > setDelOpen ( false ) }
>
< AlertDialogOverlay >
< AlertDialogContent >
< AlertDialogHeader fontSize = "lg" fontWeight = "bold" >
Delete Tag
< / AlertDialogHeader >
< AlertDialogBody >
< Text color = "red" > 删 除 Tag 将 删 除 所 有 相 关 的 信 息 , 同 时 该 操 作 不 可 逆 , 请 慎 重 < / Text >
< / AlertDialogBody >
< AlertDialogFooter >
< Button ref = { cancelRef } onClick = { ( ) = > setDelOpen ( false ) } >
Cancel
< / Button >
< Button colorScheme = "red" onClick = { onDelete } ml = { 3 } >
Delete
< / Button >
< / AlertDialogFooter >
< / AlertDialogContent >
< / AlertDialogOverlay >
< / AlertDialog >
< / >
< / >
)
)
}
}