fastadmin的二次开发教程【简单搭建、多表格问题，API开发】

2020年搭建：

1、简单搭建模块，不推荐用官方的一键搭建新模块，看不懂还容易出错

圈圈是重点，搭建新模块五点缺一不可，少了就得打屁屁了。

2、简单教程

（1）关于页面有上角生成的导出,切换,列.搜索.

如果不需要的话可以在对应的js文件中添加如下代码.即可屏蔽

//切换卡片视图和表格视图两种模式
showToggle:false,
//显示隐藏列可以快速切换字段列的显示和隐藏
showColumns:false,
//导出整个表的所有行导出整个表的所有行
showExport:false,
//搜索
search: false,
//搜索功能，
commonSearch: false,
//表格上方的搜索搜索指表格上方的搜索
searchFormVisible: false,

（2）.对于令人窒息的缓存问题.

很多时候发现更改页面之后没有效果.刷新,清理缓存也无效.让人又爱又恨.

在Confiig.php中将app_debug打开即可

// 应用调试模式'app_debug'              => Env::get('app.debug', true),

（3）.搜索框默认ID搜索.如果需要搜其他字段,在相应控制器添加以下即可后面为你需要搜索的字段

 protected $searchFields = 'id,name,age';

（4）.如果需要对搜索框默认内容进行修改在对应的js里面初始化表格参数配置之前添加

$.fn.bootstrapTable.locales[Table.defaults.locale]['formatSearch'] = function(){return "试试搜索吧";};

（5）.点击搜素不想要那个字段的话可以在对应的js中columns中添加operate:false即可不展示该字段的搜索

{field: 'name', title: __('Name'),operate:false},

（6）.复选框的隐藏

直接注释掉就好了

（7）.关闭多条件搜索

operate: false

（8）.去掉时间区间的记忆

table.on('post-body.bs.table',function (e,settings,json,xhr) {$('.datetimerange').each(function () {$(this).attr('autocomplete','off');})
});

3、这是多表格的js、HTML代码，跟官方默认的一个页面多个表格不同，这里是页面有表创，弹窗也有表格

define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {var Controller = {index: function () {// 初始化表格参数配置Table.api.init();Controller.table['first'].call(this);$(".btn-add").data("area",["60%","82%"]);var table1;var table2;},table: {first: function () {// 表格1table1 = $("#table1");table1.bootstrapTable({url: 'user/validlog/index',extend: {index_url: 'user/validlog/index',add_url: 'user/validlog/add',del_url: 'user/validlog/del',},columns: [[{field: 'state', checkbox: true, },{field: 'id', title: 'ID', operate: false},{field: 'log_id', title: __('Log_id'), operate: false},{field: 'username', title: __('Username'), formatter: Table.api.formatter.search},{field: 'title', title: __('Title'), operate: 'LIKE %...%', placeholder: '模糊搜索'},{field: 'url', title: __('Url'), formatter: Table.api.formatter.url},{field: 'ip', title: __('IP'), events: Table.api.events.ip, formatter: Table.api.formatter.search},{field: 'browser', title: __('Useragent'), operate: false, formatter: Controller.api.formatter.browser},{field: 'createtime', title: __('Create time'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},{field: 'operate', title: __('Operate'), table: table1,events: Table.api.events.operate,buttons: [{name: 'detail',text: __('Detail'),icon: 'fa fa-list',classname: 'btn btn-info btn-xs btn-detail btn-dialog',url: 'user/validlog/detail'}],formatter: Table.api.formatter.operate}]]});// 为表格1绑定事件Table.api.bindevent(table1);},second: function () {// 表格1table2 = $("#table2");table2.bootstrapTable({url: 'auth/adminlog/index',extend: {index_url: 'auth/adminlog/index',add_url: 'auth/adminlog/index',},columns: [[{field: 'state', checkbox: true, },{field: 'id', title: 'ID', operate: false},{field: 'username', title: __('Username'), formatter: Table.api.formatter.search},{field: 'title', title: __('Title'), operate: 'LIKE %...%', placeholder: '模糊搜索'},{field: 'url', title: __('Url'), formatter: Table.api.formatter.url}]]});// 为表格2绑定事件Table.api.bindevent(table2);//标记为全部通过$(document).on('click','.btn-all-pass',function () {var ids = Table.api.selectedids(table2);Layer.open({title: __('Warning'),content:__('Content'),btn: [__('OK'),__('Cancel')],yes: function (index,layero) {Fast.api.ajax({url: "user/validlog/add",type: "post",data: {ids: ids},}, function (data) {//刷新父级表格parent.$("a.btn-refresh").trigger("click");Layer.close(index);parent.Toastr.success(data);Fast.api.close();//关闭弹窗});},success: function (layero, index) {}});});}},add: function () {Controller.api.bindevent();// 开启新页面表格需要重新初始化Table.api.init();Controller.table['second'].call(this);},edit: function () {Controller.api.bindevent();},api: {bindevent: function () {Form.api.bindevent($("form[role=form]"));},formatter: {browser: function (value, row, index) {return '<a class="btn btn-xs btn-browser">' + row.useragent.split(" ")[0] + '</a>';},},}};return Controller;
});

//index.html
<div class="panel panel-default panel-intro">{:build_heading()}<div class="panel-body"><div id="myTabContent" class="tab-content"><div class="tab-pane fade active in" id="one"><div class="widget-body no-padding"><div id="toolbar" class="toolbar">{:build_toolbar('refresh,del,add')}</div><table id="table1" class="table table-striped table-bordered table-hover" data-operate-detail="{:$auth->check('user/validlog/index')}" data-operate-detail="{:$auth->check('user/validlog/add')}" data-operate-del="{:$auth->check('user/validlog/del')}" width="100%"></table></div></div></div></div>
</div>

//弹窗页面
<div class="panel panel-default panel-intro">{:build_heading()}<div class="panel-body"><div id="myTabContent" class="tab-content"><div class="tab-pane fade active in" id="one"><div class="widget-body no-padding"><div id="toolbar" class="toolbar">{:build_toolbar('refresh')} &nbsp;<a href="javascript:;" class="btn btn-all-pass btn-success btn-disabled disabled " title="{:__('Addvalid')}" >{:__('Addvalid')}</a></div><table id="table2" class="table table-striped table-bordered table-hover" data-operate-detail="{:$auth->check('auth/adminlog/index')}"width="100%"></table></div></div></div></div></div>

怎么？看不懂啊？看不懂滑到底部来问我呗？但是，能用官方文档和例子解决的就算了哈，我也不会

回答，完美！

4、接下来是API接口开发

两张图片实现API的开发，不过会有个问题，访问该咋访问，这样？

用XXX.php访问的是后台，咱们现在访问的是接口，所以得用index.php，也就是

2022年更新续：

官方的一键搭建新模块已炉火纯青，不过新手还是考虑先按上边走一遍

另外， fastadmin多表关联时容易导致表id冲突，以前是需要使用$sort=['表名.id']，现在也不需要了，只需要将控制器里的 $this->relationSearch = false中的false改为true即可

在此附上一键搭建新模块方法：

选择和填上四个箭头所指向的地方，记得表结构加上注释，这样表头的中文名字就是你字段的注释名称，然后点击生成命令，点击立即执行即可，好了，更新结束，更多复杂的请自己看文档。

看啥？进来扫码，一起玩代码石墨文档是一款轻便、简洁的在线协作文档工具，PC端和移动端全覆盖，支持多人同时对文档编辑和评论，让你与他人轻松完成协作撰稿、方案讨论、会议记录和资料共享等工作。https://shimo.im/docs/8PGqp3cHtwVxcTPp

好了，今天的分享就到这里，有问题的留个言，别忘了一键三连，下次我们还会再见！

我是黄啊码，码字的码，退。。。退。。。退。。。朝！

fastadmin的二次开发教程【简单搭建、多表格问题，API开发】相关推荐

HarmonyOS（鸿蒙系统）物联网开发教程——环境搭建
HarmonyOS(鸿蒙系统)物联网开发教程--环境搭建目录 HarmonyOS(鸿蒙系统)物联网开发教程--环境搭建前言 1 HarmonyOS简介 2 开发环境搭建 2.1 简洁版环境搭建(使 ...
SAP UI5 应用开发教程之三十五 - 如何把本地开发的 SAP UI5 应用部署到 ABAP 服务器上试读版
一套适合 SAP UI5 初学者循序渐进的学习教程教程目录 SAP UI5 本地开发环境的搭建 SAP UI5 应用开发教程之一:Hello World SAP UI5 应用开发教程之二:SAP U ...
【开发教程1】AI语音人脸识别-开发环境搭建
CC3200AI 实验教程 --疯壳·开发板系列开发环境的搭建 CC3200 的开发涉及到多种开发环境及工具,例如集成开发环境IAR 或者Code Composer Studio(CCS).固件下 ...
hugo搭建博客教程-简单搭建
title: Hugo简单搭建博客 tags: Hugo 博客教程 categories: Hugo keywords: 'Hugo,博客教程' description: 简单的Hugo搭建博客教程, ...
Android开发学习总结——搭建最新版本的Android开发环境
最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是一直没有搭建开发环境去学习,Android的更新速度比较快了,Android1. ...
微信网页开发教程 php,PHP实现微信网页授权开发教程，php授权教程_PHP教程
PHP实现微信网页授权开发教程,php授权教程微信网页授权是服务号才有的高级功能,开发者可以通过授权后获取用户的基本信息:在此之前,想要获取消息信息只能在用户和公众号交互时根据openid获取用户信 ...
android 多界面开发,安卓开发教程（Android多界面应用程序开发）
安卓开发教程(Android多界面应用程序开发) 开篇本文阅读需10分钟,简单易上手,属于安卓开发教程的基础部分. 建议精读,深刻理解大意.多做实践.多写代码. 本文章由做全栈攻城狮原创首发. 同名 ...
做简单的android 软件推荐,Android_适用于Android开发的简单聊天软件，适用于android 开发。是一个简 - phpStudy...
适用于Android开发的简单聊天软件适用于android 开发.是一个简单的聊天软件,包括知识点,各个控件的运用(ExpandableListView,ViewPager,Spinner,Line ...
Python量化交易平台开发教程系列3-vn.py项目中API封装的编译
原创文章,转载请注明出处:用Python的交易员前言经历了两篇的理论折磨后,本篇教程开始进入实际操作的环节,这里作者假设读者是毫无C++经验的用户,操作一步步配图,还有问题的来vn.py项目的gi ...
安卓底层linux开发教程,Android手机平台移植与底层开发 PDF
支持Android的热门ARM硬件平台简介 ARMv7架构SOC l TI OMAP系列,2009年OMAP3和OMAP4关注度较高 l Freescale i.MX51系列 l Qualcomm 8 ...

fastadmin的二次开发教程【简单搭建、多表格问题，API开发】

2022年更新续：

fastadmin的二次开发教程【简单搭建、多表格问题，API开发】相关推荐

最新文章

热门文章