在fastadmin中增加各种自定义按钮
在fastadmin,有时候我们需要在列表中增加更多的自定义的按钮,这里记录下,各种按钮的处理情况
1、在记录中增加各种按钮
//操作栏,默认有编辑、删除或排序按钮,可自定义配置buttons来扩展按钮
{
field: 'operate',
width: "150px",
title: __('Operate'),
table: table,
events: Table.api.events.operate,
buttons: [
{
name: 'click',
title: __('点击执行事件'),
classname: 'btn btn-xs btn-info btn-click',
icon: 'fa fa-leaf',
refresh:true
// dropdown: '更多',//如果包含dropdown,将会以下拉列表的形式展示
click: function (data) {
Layer.alert("点击按钮执行的事件");
}
},
{
name: 'check',
text: __('通过'),
title: __('点击执行事件,增加确认弹窗'),
visible: function (row) {
return row.status == 0;
},
classname: 'btn btn-xs btn-success btn-ajax',
icon: 'fa fa-location-arrow',
url: 'user/check',
confirm: '确认要通过该记录吗',
refresh: true
},
{
name: 'click',
text: __('驳回'),
title: __('点击执行事件,增加简单的弹窗输入提交'),
visible: function (row) {
return row.status == 0;
},
classname: 'btn btn-xs btn-danger btn-click',
icon: 'fa fa-suitcase',
click: function(e, row) {
Layer.prompt({
title: "驳回原因",
success: function(layero) {
$("input", layero).prop("placeholder", "填写驳回原因");
}
}, function(value) {
Fast.api.ajax({
url: "user/refuse?ids=" + row.id,
data: {
cause: value
},
}, function(data, ret) {
Layer.closeAll();
$(".btn-refresh").trigger("click");
//return false;
});
});
return false;
}
}
{
name: 'detail',
title: __('弹出窗口打开'),
classname: 'btn btn-xs btn-primary btn-dialog',
icon: 'fa fa-list',
url: 'example/bootstraptable/detail',
callback: function (data) {
Layer.alert("接收到回传数据:" + JSON.stringify(data), {title: "回传数据"});
}
},
{
name: 'ajax',
title: __('发送Ajax'),
classname: 'btn btn-xs btn-success btn-magic btn-ajax',
icon: 'fa fa-magic',
confirm: '确认发送Ajax请求?',
url: 'example/bootstraptable/detail',
success: function (data, ret) {
Layer.alert(ret.msg + ",返回数据:" + JSON.stringify(data));
//如果需要阻止成功提示,则必须使用return false;
//return false;
},
error: function (data, ret) {
console.log(data, ret);
Layer.alert(ret.msg);
return false;
}
},
{
name: 'addtabs',
title: __('新选项卡中打开'),
classname: 'btn btn-xs btn-warning btn-addtabs',
icon: 'fa fa-folder-o',
url: 'example/bootstraptable/detail'
}
],
formatter: Table.api.formatter.operate
},
2、在列表顶部增加按钮
先编辑index.html
<div id="toolbar" class="toolbar">
<a href="javascript:;" class="btn btn-primary btn-refresh" title="{:__('Refresh')}" ><i class="fa fa-refresh"></i> </a>
<a href="javascript:;" class="btn btn-warning btn-loglist {:$auth->check('import/userres/index')?'':'hide'}" title="上传表格" ><i class="fa fa-plus"></i> 上传表格</a>
<a href="javascript:;" class="btn btn-success btn-check btn-disabled disabled"
title="{:__('批量通过')}" ><i class="fa fa-location-arrow"></i> {:__('批量通过')</a>
<a href="javascript:;" class="btn btn-danger btn-refuse btn-disabled disabled"
title="{:__('批量驳回')}" ><i class="fa fa-suitcase"></i> {:__('批量驳回')}</a>
<a href="javascript:;" class="btn btn-warning btn-createvideocourse {:$auth->check('general/attachment/createvideo')?'':'hide'}" title="自动创建视频课程" ><i class="fa fa-plus"></i> 自动创建视频课程</a>
</div>
再处理js文件
//找到这一行
// 为表格绑定事件
Table.api.bindevent(table);
//下面新增代码
function getIdSelections() {
return $.map($("#table").bootstrapTable('getSelections'), function(row) {
return row.id
});
}
$(".btn-check").on('click',function(){
var checkids = [];
checkids = getIdSelections();
console.log(checkids);
Fast.api.ajax({
type: 'POST',
url:'user_order/batchcheck?ids='+checkids
}, function (data, ret) {
console.log(data);
location.reload();
}, function (data, ret) {
console.log(data);
location.reload();
});
});
$(".btn-refuse").on('click',function(){
var checkids = [];
checkids = getIdSelections();
console.log(checkids);
Layer.prompt({
title: "驳回原因",
success: function(layero) {
$("input", layero).prop("placeholder", "填写驳回原因");
}
}, function(value) {
Fast.api.ajax({
url: "userorder/batchrefuse?ids="+checkids,
data: {
cause: value
},
}, function(data, ret) {
Layer.closeAll();
$(".btn-refresh").trigger("click");
//return false;
});
});
return false;
});
$(".btn-loglist").on('click',function(){
Fast.config.openArea = ['80%','80%'];
Fast.api.open('import/userres/index', '导入结果');
});
//也可以这样
$(document).on("click",".btn-createvideo",function() {
var ids = Table.api.selectedids(table);
Fast.api.ajax({
url: "general/attachment/createvideo",
type: "post",
data: {ids: ids.join(',')},
}, function (data, ret) {
table.bootstrapTable('refresh',{silent: true });
}, function (err) {
console.log(err)
});
});
本文链接:
/archives/1705581756664
版权声明:
本站所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自
雕刻时光!
喜欢就支持一下吧