diff --git a/components/confirm/demo/basic.md b/components/confirm/demo/basic.md deleted file mode 100644 index dfeecc54d6..0000000000 --- a/components/confirm/demo/basic.md +++ /dev/null @@ -1,23 +0,0 @@ -# 基本 - -- order: 0 - -使用很简单。 - ---- - -````jsx -var confirm = antd.confirm; - -function showConfirm(){ - confirm({ - title: '第一个 confirm', - content: 'confirm 内容' - }); -} - -React.render( -, document.getElementById('components-confirm-demo-basic')); -```` diff --git a/components/confirm/index.md b/components/confirm/index.md deleted file mode 100644 index a7fe2113ee..0000000000 --- a/components/confirm/index.md +++ /dev/null @@ -1,25 +0,0 @@ -# Confirm - -- order: 2 -- category: Components -- chinese: 确认对话框 - ---- - -## 何时使用 - -当需要用户确认时使用 - - -## api - -为一个方法,参数为 object,具体属性如下 - -| 参数 | 说明 | 类型 | 默认值 | -|------------|----------------|------------------|--------------| -| title | 标题 | React.Element or String | 无 | -| onOk | 点击确定回调,参数为关闭函数 | function | 无 | -| onCancel | 取消回调,参数为关闭函数 | function | 无 | -| width | 宽度 | String or Number | 375 | -| iconClassName | 图标央样式名 | String | anticon-exclamation-circle | - diff --git a/components/confirm/index.jsx b/components/modal/confirm.jsx similarity index 100% rename from components/confirm/index.jsx rename to components/modal/confirm.jsx diff --git a/components/modal/demo/confirm.md b/components/modal/demo/confirm.md new file mode 100644 index 0000000000..f34e42671a --- /dev/null +++ b/components/modal/demo/confirm.md @@ -0,0 +1,27 @@ +# 确认对话框 + +- order: 3 + +使用 `confirm()` 可以快捷地弹出确认框。 + +--- + +````jsx +var confirm = antd.confirm; + +function showConfirm(){ + confirm({ + title: '您是否确认要删除这项内容', + content: '一些解释', + onOk: function() { + alert('确定'); + }, + onCancel: function() {} + }); +} + +React.render( +, document.getElementById('components-modal-demo-confirm')); +```` diff --git a/components/modal/index.md b/components/modal/index.md index 62d2421433..020cad8c9f 100644 --- a/components/modal/index.md +++ b/components/modal/index.md @@ -12,9 +12,11 @@ 需要用户处理事务,又不希望跳转页面以致打断工作流程时,可以使用 `Modal` 在当前页面正中打开一个浮层,承载相应的操作。 +另外当需要一个简洁的确认框询问用户时,可以使用精心封装好的 `ant.confirm()` 。 + + ## API -属性列表 | 参数 | 说明 | 类型 | 默认值 | |------------|----------------|------------------|--------------| @@ -23,3 +25,16 @@ | onCancel | 点击遮罩层或右上角叉或取消按钮的回调 | function | 无 | | width | 宽度 | String or Number | 500 | | footer | 底部内容 | React.Element | 确定取消按钮 | + + +### confirm() + +`confirm` 为一个方法,参数为 object,具体属性如下: + +| 参数 | 说明 | 类型 | 默认值 | +|------------|----------------|------------------|--------------| +| title | 标题 | React.Element or String | 无 | +| onOk | 点击确定回调,参数为关闭函数 | function | 无 | +| onCancel | 取消回调,参数为关闭函数 | function | 无 | +| width | 宽度 | String or Number | 375 | +| iconClassName | 图标样式名 | String | anticon-exclamation-circle | diff --git a/index.js b/index.js index 358ebae53e..e5dd512654 100644 --- a/index.js +++ b/index.js @@ -9,7 +9,7 @@ var antd = { Dropdown: require('./components/dropdown'), Progress: require('./components/progress'), Select: require('./components/select'), - confirm: require('./components/confirm') + confirm: require('./components/modal/confirm') }; module.exports = window.antd = antd; diff --git a/style/components/button.less b/style/components/button.less index 8ec76504c5..c698dc8644 100644 --- a/style/components/button.less +++ b/style/components/button.less @@ -9,7 +9,7 @@ &-primary { .btn-primary; - + .@{btnPrefixClass}-group &:not(:first-child):not(:last-child) { border-right-color: #00abea; border-left-color: #00abea; diff --git a/style/components/confirm.less b/style/components/confirm.less index 3a568f9816..f9fefc6ae6 100644 --- a/style/components/confirm.less +++ b/style/components/confirm.less @@ -12,20 +12,25 @@ .@{confirmPrefixCls}-body { .@{confirmPrefixCls}-content { - margin-left: 33px; + margin-left: 37px; font-size: 12px; color: #999; } .anticon { font-size: 24px; - display: inline-block; - margin-right: 5px; + margin-right: 12px; + position: relative; + top: 2px; } .anticon-exclamation-circle { color: #fac450; } + + .anticon-question-circle { + color: #2CB7ED; + } } .@{confirmPrefixCls}-btns { diff --git a/style/themes/default/custom.less b/style/themes/default/custom.less index 6df42e576b..8030141fbb 100644 --- a/style/themes/default/custom.less +++ b/style/themes/default/custom.less @@ -4,7 +4,7 @@ // color @primary-color : #2db7f5; -// ------ Base & Require ------ +// ------ Base & Require ------ @body-background : #fff; @font-family : "Microsoft Yahei", "Hiragino Sans GB", "Microsoft Sans Serif", "WenQuanYi Micro Hei", Arial, sans-serif;