Yang Pei
4 years ago
committed by
GitHub
9 changed files with 163 additions and 100 deletions
@ -0,0 +1,10 @@ |
|||
.editModal { |
|||
|
|||
width: 450px; |
|||
|
|||
:global { |
|||
.ant-form-item:last-child { |
|||
margin-bottom: 0; |
|||
} |
|||
} |
|||
} |
@ -0,0 +1,35 @@ |
|||
import React, { useState, useCallback } from 'react'; |
|||
import { Button } from 'antd'; |
|||
import { SettingOutlined } from '@ant-design/icons'; |
|||
import EditModal from './editModal'; |
|||
|
|||
interface IProps { |
|||
confirmToSync: () => Promise<void>; |
|||
} |
|||
|
|||
const Configuration: React.FC<IProps> = (props: IProps) => { |
|||
const [visible, setVisible] = useState<boolean>(false); |
|||
|
|||
// events
|
|||
const onOpenEditModal = useCallback(() => { |
|||
setVisible(true); |
|||
}, [setVisible]); |
|||
const onCloseEditModal = useCallback(() => { |
|||
setVisible(false); |
|||
}, []); |
|||
const onOk = useCallback(() => { |
|||
onCloseEditModal(); |
|||
props.confirmToSync(); |
|||
}, [onCloseEditModal]); |
|||
|
|||
return ( |
|||
<div> |
|||
<Button size="small" type="text" onClick={onOpenEditModal}> |
|||
<SettingOutlined /> |
|||
</Button> |
|||
<EditModal visible={visible} onOk={onOk} onCancel={onCloseEditModal} /> |
|||
</div> |
|||
); |
|||
}; |
|||
|
|||
export default Configuration; |
@ -1,22 +1,6 @@ |
|||
.container { |
|||
|
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
margin-left: 20px; |
|||
|
|||
.tag { |
|||
cursor: pointer; |
|||
} |
|||
} |
|||
|
|||
.editModal { |
|||
|
|||
width: 450px; |
|||
|
|||
:global { |
|||
.ant-form-item:last-child { |
|||
margin-bottom: 0; |
|||
} |
|||
} |
|||
} |
Loading…
Reference in new issue