一、JS自定义按钮 + 按钮隐藏
1、FastAdmin JS自定义按钮
效果图:
自定义video视频按钮
{ field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons: [ { name: 'video', text: __('视频'), icon: 'fa fa-list', classname: 'btn btn-xs btn-primary btn-addtabs', url: 'major/chapter/index/subject_id/{ids}', } ], formatter: Table.api.formatter.operate }
2、隐藏video视频按钮
效果图:
隐藏自定义按钮
{ field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons: [ { name: 'video', text: __('视频'), icon: 'fa fa-list', classname: 'btn btn-xs btn-primary btn-addtabs', url: 'major/chapter/index/subject_id/{ids}', } ], formatter: function (value, row, index) { //隐藏自定义的视频按钮 var that = $.extend({}, this); var table = $(that.table).clone(true); $(table).data("operate-video", null); //隐藏按钮操作 video为自定义按钮的name that.table = table; return Table.api.formatter.operate.call(that, value, row, index); } }
这样自定义按钮的显示和隐藏就可以控制了,当然也可以通过这种方式来隐藏FastAdmin生成的按钮,但是不推荐这样做,FastAdmin生成的按钮可以通过权限控制来隐藏。
二、根据自定义按钮的权限,控制显示与隐藏
1、首先后台判断对应权限
在后台初始化方法中,判断是否有按钮的权限,并通过assignconfig()来保存,然后在JS中判断权限。
$this->auth->check(''); 判断是否具有对应路径的权限
public function _initialize() { parent::_initialize(); $this->assignconfig('chapter', $this->auth->check('major/chapter/index')); //为了JS能获取到,同时判读权限 判断是否有major/chapter/index权限 }
2、对应JS中
通过Config.chapter 来获取后台的权限状态,然后根据状态显示与隐藏按钮。
{ field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons: [ { name: 'video', text: __('视频'), icon: 'fa fa-list', classname: 'btn btn-xs btn-primary btn-addtabs', url: 'major/chapter/index/subject_id/{ids}', } ], formatter: function (value, row, index) { //隐藏自定义的视频按钮 var that = $.extend({}, this); var table = $(that.table).clone(true); //权限判断 if(Config.chapter != true){ //通过Config.chapter 获取后台存的chapter console.log('没有视频权限'); $(table).data("operate-video", null); that.table = table; }else{ console.log('有视频权限'); } return Table.api.formatter.operate.call(that, value, row, index); } }
最终效果图:
分类:
FastAdmin
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
2020-04-23 CSS文本超出2行就隐藏并且显示省略号
2020-04-23 css 文本两行显示,超出省略号表示
2020-04-23 如何让多文本内容只显示一行,其余用省略号来显示
2019-04-23 消除浏览器对input输入框的自动填充