Confirm 确认消息
提示用户确认其已经触发的动作,并询问是否进行此操作时会用到此对话框。
注:此接口未使用帆软官方接口,所以支持FineReport目前所有版本的工程项目。
基础用法
javascript
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!"
});
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!"
});
1
2
3
4
2
3
4
标题
Confirm 组件的标题由title
参数控制,如果不填写title参数会出现默认文本默认title
。
javascript
WEIBW.Feedback.confirm({
title: "自定义标题",
});
WEIBW.Feedback.confirm({
title: "自定义标题",
});
1
2
3
2
3
内容
Confirm 组件的内容描述受message
参数控制。
javascript
WEIBW.Feedback.confirm({
title: "自定义标题",
message: "自定义内容!"
});
WEIBW.Feedback.confirm({
title: "自定义标题",
message: "自定义内容!"
});
1
2
3
4
2
3
4
基本类型
Confirm 组件提供四种基本类型,由type
参数控件,默认值为false
,可选值有:'success'
、'warning'
、'info'
、'error'
。
无类型
当type
参数不设定值或者值为false
时,为无类型。
javascript
WEIBW.Feedback.confirm({
title: "无类型",
message: "confirm消息!"
});
WEIBW.Feedback.confirm({
title: "无类型",
message: "confirm消息!"
});
1
2
3
4
2
3
4
success
javascript
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"success"
});
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"success"
});
1
2
3
4
5
2
3
4
5
warning
javascript
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"warning"
});
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"warning"
});
1
2
3
4
5
2
3
4
5
info
javascript
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"info"
});
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"info"
});
1
2
3
4
5
2
3
4
5
error
javascript
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"error"
});
WEIBW.Feedback.confirm({
title: "success",
message: "confirm消息!",
type:"error"
});
1
2
3
4
5
2
3
4
5
确认按钮
Confirm 组件的确认按钮支持自定义,其由参数confirm
控制。该参数为wei-btn
对象。有关wei-btn
对象的使用在文档末尾。
javascript
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
confirm: {
show: true,
text: "自定义确认按钮",
type: "danger",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closeConfirm();
}
},
});
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
confirm: {
show: true,
text: "自定义确认按钮",
type: "danger",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closeConfirm();
}
},
});
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
取消按钮
Confirm 组件的取消按钮支持自定义,其由参数cancel
控制。该参数为wei-btn
对象。有关wei-btn
对象的使用在文档末尾。
javascript
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
cancel: {
show: true,
text: "自定义取消按钮",
clickfunc: function() {
alert("取消按钮");
WEIBW.Feedback.closeConfirm();
}
},
});
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
cancel: {
show: true,
text: "自定义取消按钮",
clickfunc: function() {
alert("取消按钮");
WEIBW.Feedback.closeConfirm();
}
},
});
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
自定义按钮组
Confirm 组件同时支持用户自定义多个按钮,自定义按钮同样为wei-btn
对象组成的数组,其由参数custombtns
控制。有关wei-btn
对象的使用在文档末尾。
javascript
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
custombtns: [{
text: "自定义按钮1",
type: "warning",
},
{
text: "自定义按钮2",
type: "danger",
}
]
});
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
custombtns: [{
text: "自定义按钮1",
type: "warning",
},
{
text: "自定义按钮2",
type: "danger",
}
]
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
内容居中
Confirm 组件中的内容支持整体居中,其由center
参数控制,其类型为bool
,默认值为false
,可选值为true
与false
。
javascript
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
center: true
});
WEIBW.Feedback.confirm({
title: "confirm标题",
message: "confirm消息!",
center: true
});
1
2
3
4
5
2
3
4
5
关闭弹窗
我们在 Confirm 组件的默认点击事件中已添加了一个方法WEIBW.Feedback.closeConfirm();
。这个方法可以关闭当前的confirm窗口。如果您在使用过程中涉及到了自定义按钮,那么您务必在您的clickfunc
中处理完业务后执行一下该方法,否则您的窗口将无法正常关闭。
Javascript
WEIBW.Feedback.closeConfirm();
WEIBW.Feedback.closeConfirm();
1
参数解释
参数 | 说明 | 类型 | 默认值 | 是否必填 |
---|---|---|---|---|
title | 标题 | string | 无 | 是 |
message | 内容描述 | string | 无 | 是 |
type | 基本类型 | enum ,可选项'success' 、'warning' 、'info' 、'error' 或者false | false | 否 |
confirm | 确认按钮 | wei-btn ,参考 wei-btn 对象使用说明 | 无 | 否 |
cancel | 取消按钮 | wei-btn ,参考 wei-btn 对象使用说明 | 无 | 否 |
custombtns | 自定义按钮组 | wei-btn 组成的数组,参考 wei-btn 对象使用说明 | 无 | 否 |
center | 是否居中 | bool ,可选项true 、false | false | 否 |
wei-btn
对象
wei-btn
是我们为了方便用户针对按钮进行个性化配置而创造出的一个按钮对象。
Javascript
{
show: true,
type: "danger",
text: "自定义取消按钮",
clickfunc: function() {
alert("取消按钮");
WEIBW.Feedback.closeConfirm();
}
}
{
show: true,
type: "danger",
text: "自定义取消按钮",
clickfunc: function() {
alert("取消按钮");
WEIBW.Feedback.closeConfirm();
}
}
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
其各项参数解释如下:
参数 | 说明 | 类型 | 默认值 | 是否必填 |
---|---|---|---|---|
show | 是否显示 | bool ,可选项true 、false | true | 否 |
type | 按钮类型 | enum ,可选项'primary' 、'success' 、'warning' 、'danger' 、 'info' 或者'text' | 无 | 否 |
text | 按钮文字 | string | 根据具体场景有对应的默认值 | 否 |
clickfunc | 点击事件 | function ,如果您使用了该属性,请务必在业务处理末端调用方法WEIBW.Feedback.closeConfirm(); | 无 | 否 |