You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
2.1 KiB
62 lines
2.1 KiB
import { Button, ButtonGroup, Card, FormGroup, InputGroup, Overlay, TextArea } from "@blueprintjs/core"
|
|
import cs from "classnames"
|
|
import React, { useEffect, useState } from "react"
|
|
import style from "./dialog.module.scss"
|
|
|
|
export default function Dialog(props: any) {
|
|
const { isOpen, setIsOpen } = props
|
|
|
|
const [title, setTitle] = useState<string>("")
|
|
const [time, setTime] = useState<string>("")
|
|
const [desc, setDesc] = useState<string>("")
|
|
|
|
function clickConfrim(){
|
|
props.onConfrim&&props.onConfrim(title,time,desc)
|
|
}
|
|
function clickCancel(){
|
|
setIsOpen(false)
|
|
props.onCancel&&props.onCancel()
|
|
}
|
|
useEffect(()=>{
|
|
if(isOpen){
|
|
setTitle("")
|
|
setTime("")
|
|
setDesc("")
|
|
}
|
|
}, [isOpen])
|
|
|
|
return (
|
|
<Overlay
|
|
isOpen={isOpen}
|
|
onClose={() => {
|
|
setIsOpen(false)
|
|
}}
|
|
>
|
|
<div className={cs(style.dialog)}>
|
|
<Card>
|
|
<form className="addClock clearfix">
|
|
<FormGroup label="标题" labelFor="title-input" labelInfo="(required)">
|
|
<InputGroup value={title} onChange={e => setTitle(e.target.value)} id="title-input" placeholder="请输入标题"/>
|
|
</FormGroup>
|
|
<FormGroup helperText="一个通用的时间表示法" label="时间区间" labelFor="time-input" labelInfo="(required)">
|
|
<InputGroup value={time} onChange={e => setTime(e.target.value)} id="time-input" placeholder="请输入时间区间"/>
|
|
</FormGroup>
|
|
<FormGroup label="描述" labelFor="desc-input">
|
|
<TextArea value={desc} onChange={e => setDesc(e.target.value)} id="desc-input" style={{ width: "100%" }}
|
|
growVertically={true} large={true} intent="primary"/>
|
|
</FormGroup>
|
|
<ButtonGroup style={{ float: "right" }}>
|
|
<Button
|
|
intent="primary"
|
|
onClick={()=>clickConfrim()}
|
|
>
|
|
确认
|
|
</Button>
|
|
<Button intent="danger" onClick={()=>clickCancel()}>取消</Button>
|
|
</ButtonGroup>
|
|
</form>
|
|
</Card>
|
|
</div>
|
|
</Overlay>
|
|
)
|
|
}
|
|
|