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.
47 lines
1.6 KiB
47 lines
1.6 KiB
import React from "react" ;
|
|
import Dialog from "@material-ui/core/Dialog" ;
|
|
import DialogTitle from "@material-ui/core/DialogTitle" ;
|
|
import DialogContent from "@material-ui/core/DialogContent" ;
|
|
import DialogActions from "@material-ui/core/DialogActions" ;
|
|
import Button from "@material-ui/core/Button" ;
|
|
import "./ModalForm.css" ;
|
|
import { slugify } from "./utils" ;
|
|
|
|
// --------------------------------------------------------------------
|
|
|
|
export default class ModalForm extends React.Component
|
|
{
|
|
|
|
render() {
|
|
|
|
// initialize the buttons
|
|
let buttons = [] ;
|
|
for ( let btn in this.props.buttons ) {
|
|
buttons.push(
|
|
<Button key={btn} color="primary" className={slugify(btn)}
|
|
onClick = { this.props.buttons[btn] }
|
|
> {btn} </Button>
|
|
) ;
|
|
}
|
|
|
|
// show the dialog
|
|
return ( <Dialog id={this.props.formId} className="modal-form" open={true} disableBackdropClick
|
|
onClose = { this.onClose.bind( this ) }
|
|
>
|
|
<DialogTitle style={{background:this.props.titleColor}}> {this.props.title} </DialogTitle>
|
|
<DialogContent dividers>
|
|
{ typeof this.props.content === "function" ? this.props.content() : this.props.content }
|
|
</DialogContent>
|
|
<DialogActions> {buttons} </DialogActions>
|
|
</Dialog> ) ;
|
|
}
|
|
|
|
onClose() {
|
|
// close the dialog
|
|
if ( this.props.buttons.Cancel )
|
|
this.props.buttons.Cancel() ;
|
|
else if ( this.props.buttons.Close )
|
|
this.props.buttons.Close() ;
|
|
}
|
|
|
|
}
|
|
|