import React from 'react'
import { Modal } from 'antd'


/**
 * 通用的删除对话框，需传入：
 * type类型用于展示删除目标
 * visibleDeleteBox用于关联其父级容器中管理显示与否的state
 * hideBox方法用于隐藏对话框
 * selectedRecord用于传入被选中的条目
 * onOk方法用于执行删除操作
 * 
 * @class DeleteBox
 * @extends {React.Component}
 * 
 *
 */
class DeleteBox extends React.Component {
    render() {
        const { visibleDeleteBox, hideBox, selectedRecord, type, onOk } = this.props
        const typeMapper = {
            'datasource': '数据源',
            'chart': '图表',
            'dashboard': '看板'
        }
        return (
            <Modal 
                visible={visibleDeleteBox}
                onCancel={hideBox}
                onOk={() => {onOk();hideBox();}}
                destroyOnClose={true}
            >
                <span>确定要删除{typeMapper[type]}：{selectedRecord ? selectedRecord.name : ''} 吗？</span>
            </Modal>
        )
    }
}

export default DeleteBox