ant-design/components/confirm/index.jsx
2015-06-11 16:35:36 +08:00

71 lines
1.7 KiB
JavaScript

'use strict';
var React = require('react');
var Dialog = require('rc-dialog');
var div;
module.exports = function (props) {
var d;
props = props || {};
props.iconClassName = props.iconClassName || 'anticon-exclamation-circle';
props.animation = 'zoom';
props.maskAnimation = 'fade';
var width = props.width || 375;
function close() {
d.setState({
visible: false
});
}
function onCancel() {
var cancelFn = props.onCancel;
if (cancelFn) {
if(cancelFn.length){
cancelFn(close);
}else {
cancelFn();
close();
}
} else {
close();
}
}
function onOk() {
var okFn = props.onOk;
if (okFn) {
if(okFn.length){
okFn(close);
}else {
okFn();
close();
}
} else {
close();
}
}
var body = <div className="ant-confirm-body">
<i className={'anticon ' + props.iconClassName}></i>
<span className="ant-confirm-title">{props.title}</span>
<div className="ant-confirm-content">{props.content}</div>
</div>;
var footer = <div className="ant-confirm-btns">
<button type="button" className="ant-btn-default ant-btn ant-btn-lg" onClick={onCancel}> </button>
<button type="button" className="ant-btn-primary ant-btn ant-btn-lg" onClick={onOk}> </button>
</div>;
if (!div) {
div = document.createElement('div');
document.body.appendChild(div);
}
React.render(<Dialog className="ant-confirm" renderToBody={false} visible={true} closable={false} title="" animation="zoom" maskAnimation="fade" width={width}>
<div style={{zoom: 1, overflow: 'hidden'}}>{body} {footer}</div>
</Dialog>, div, function () {
d = this;
});
};