Weibw's FR
Popconfirm 气泡确认框
点击某个元素弹出一个简单的气泡确认框。
注：此接口未使用帆软官方接口，所以支持FineReport目前所有版本的工程项目。
需要注意的是，目前该接口仅支持填报预览模式，因为气泡组件会根据我们点击的按钮位置进行动态弹出，所以我们在调用时需要将当前按钮的位置及尺寸发给端口。当然，您也不需要担心如何获取到当前控件的位置和尺寸，我们都已经帮您写好了。
在使用该接口的时候，请务必将下方代码加入到您的参数中。
javascript
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],基础用法
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "确定要删除此条数据？",
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "确定要删除此条数据？",
});标题
Popconfirm 组件的标题由title参数控制，如果不填写title参数会出现默认文本默认title。
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "自定义标题",
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "自定义标题",
});宽度
Popconfirm 组件的宽度由width参数控制，该参数有两种赋值类型，您可以输入百分比，如'20%'，也可以输入固定尺寸，如'200px'。
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "自定义宽度为200px",
width:"200px"
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
title: "自定义宽度为200px",
width:"200px"
});方向
Popconfirm 组件的弹出位置可以自定义，由direction参数控件，默认值为'bottom'，可选值有：'bottom'、'top'、'left'、'right'。
向下
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "bottom"
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "bottom"
});向上
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "top"
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "top"
});向左
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "left"
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "left"
});向右
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "right"
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
direction: "right"
});提交按钮
Popconfirm 组件的提交按钮支持自定义，其由参数submit控制。该参数为wei-btn对象。有关wei-btn对象的使用在文档末尾。
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
submit: {
show: true,
text: "提交",
type: "danger",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closePopconfirm();
}
}
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
submit: {
show: true,
text: "提交",
type: "danger",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closePopconfirm();
}
}
});取消按钮
Popconfirm 组件的取消按钮支持自定义，其由参数cancel控制。该参数为wei-btn对象。有关wei-btn对象的使用在文档末尾。
javascript
WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
cancel: {
show: true,
text: "关闭",
type: "warning",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closePopconfirm();
}
}
});WEIBW.Feedback.popconfirm({
fposition: [this.element.offset().left, this.element.offset().top],
fsize: [this.options.width, this.options.height],
cancel: {
show: true,
text: "关闭",
type: "warning",
clickfunc: function() {
alert(123);
WEIBW.Feedback.closePopconfirm();
}
}
});关闭弹窗
我们在 Popconfirm 组件的默认点击事件中已添加了一个方法WEIBW.Feedback.closePopconfirm();。这个方法可以关闭当前的popconfirm窗口。如果您在使用过程中涉及到了自定义按钮，那么您务必在您的clickfunc中处理完业务后执行一下该方法，否则您的窗口将无法正常关闭。
Javascript
WEIBW.Feedback.closePopconfirm();WEIBW.Feedback.closePopconfirm();参数解释
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| fposition | 点击按钮所在位置 | 位置数组 | [this.element.offset().left, this.element.offset().top] | 是 |
| fsize | 点击按钮的尺寸 | 尺寸数组 | [this.options.width, this.options.height] | 是 |
| title | 标题 | string | 无 | 是 |
| direction | 内容描述 | enum 可选值有：'bottom'、'top'、'left'、'right' | 'bottom' | 否 |
| width | 宽度 | string，可以输入百分比，如'20%'，也可以输入固定尺寸，如'200px' | 150px | 否 |
| submit | 确认按钮 | wei-btn，参考 wei-btn对象使用说明 | 无 | 否 |
| cancel | 取消按钮 | wei-btn，参考 wei-btn对象使用说明 | 无 | 否 |
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();
}
}其各项参数解释如下：
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| show | 是否显示 | bool，可选项true、false | true | 否 |
| type | 按钮类型 | enum，可选项'primary'、'success'、'warning'、'danger'、 'info'或者'text' | 无 | 否 |
| text | 按钮文字 | string | 根据具体场景有对应的默认值 | 否 |
| clickfunc | 点击事件 | function，如果您使用了该属性，请务必在业务处理末端调用方法WEIBW.Feedback.closePopconfirm(); | 无 | 否 |