import React from "react";
import Dialog from "@material-ui/core/Dialog";
import Draggable from "react-draggable";
import {Paper, styled, withWidth} from "@material-ui/core";
import {MyDialogProps} from "../entity";
import {CloseDialog} from "./CloseDialog";


const EditDialogPaper=styled(Paper)({
    maxWidth:1000
})
/**
 * 我的弹窗
 */
export class MyDialog extends React.Component<MyDialogProps, { undefined?:undefined }>{


    render() {
        return (
            <Dialog
                hideBackdrop={true}
                open={this.props.open}
                PaperComponent={(props)=>
                    <Draggable handle={"#"+this.props.titleId} cancel={'[class*="MuiDialogContent-root"]'}>
                        <EditDialogPaper  {...props} />
                    </Draggable>}
                aria-labelledby={this.props.titleId}
                classes={{paper:"w-100"}}
            >
                <CloseDialog  menuName={this.props.menuName} onClose={()=>this.props.onClose()} titleId={this.props.titleId}/>

                <div className="p-3">
                    {this.props.content}
                </div>
            </Dialog>
        );
    }
}