fastadmin 新手部分功能点

1、时间范围组件

<div class="col-xs-12 col-sm-6 col-md-3" style="width: 300px">
                    <div class="form-group">
                        <label class="control-label">下单时间</label>
                        <input class="operate" type="hidden" data-name="created_at" value="RANGE"/>
                        <div>
                            <input class="form-control datetimerange" type="text" name="created_at" placeholder="开始日期 - 结束日期" autocomplete="off" value="" data-daterangepicker-options='{"locale":{"format":"YYYY-MM-DD"}}'/>
                        </div>
                    </div>
                </div>

2、操作按钮设置弹出窗口大小

{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate,
                            buttons: [
                                {
                                    name: 'show', //唯一标识、权限标识
                                    text: '推荐列表', //按钮显示的文字，支持function
                                    title: '推荐列表', //按钮显示的文字，支持function
                                    classname: 'btn btn-info btn-xs btn-dialog', //按钮的class，支持btn-dialog/btn-ajax/btn-addtabs
                                    url: 'cook/partners?cook_invite_code={cook_code}', //按钮的链接，支持使用{字段名}来占位替换，支持`function`
                                    extend: 'data-area=["1000px","650px"]'
                                }
                            ],
                            formatter: Table.api.formatter.operate}

3、html设置弹出窗口大小

<a href="javascript:;" class="btn btn-success btn-add {:$auth->check('shop_meals/add')?'':'hide'}" data-area='["900px","700px"]' title="{:__('Add')}" ><i class="fa fa-plus"></i> {:__('Add')}</a>

4、bootstrapTabler属性设置

#声明加载一些库
define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'partners/index' + location.search,
                    add_url: 'partners/add',
                    edit_url: 'partners/edit',
                    del_url: 'partners/del',
                    multi_url: 'partners/multi',
                    import_url: 'partners/import',
                    table: 'partners',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,#获取链接
                pk: 'id',
                sortName: 'id',
                search: false,
                showExport: false,
                searchable: false,
                commonSearch: false,
                showToggle : false,
                showColumns: false,
                fixedColumns: true,//控制固定操作的
                fixedRightNumber: 1,//控制右边固定操作列数
                fixedNumber: 1,     //控制左边固定操作列数
                searchFormTemplate: 'customformtpl',//自定义搜索项模板
                columns: [
                    [
                        {checkbox: true},#控制选择的
                        {field: 'mobile', title: __('厨师手机号'), operate: '=', placeholder:'手机/姓名/ID只用其一'},//input的placeholder文字自定义
                        {field: 'franchisee', title: __('城市合伙人名称')},
{field: 'cooperate_start', title: __('Cooperate_start'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},#控制时间范围搜索
                        {field: 'franchise_area', title: __('加盟城市'), operate: 'LIKE'},
                        {field: 'username', title: __('城市合伙人账号')},

{field: 'area', title: __('Area'),operate: 'LIKE', searchable: false,
                            formatter : function(value, row, index, field){
                                return "<span style='display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;' title='" + value + "'>" + value + "</span>";
                            },
                            {field: 'start_at', title: __('Start_at'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, searchable: false},#时间
                            cellStyle : function(value, row, index, field){
                                return {
                                    css: {
                                        "white-space": "nowrap",
                                        "text-overflow": "ellipsis",
                                        "overflow": "hidden",
                                        "max-width":"150px"
                                    }
                                };
                            }},#自定义操作显示，样式
{field: 'banner_status', title: __('Banner_status'), searchList: {"1":__('Banner_status 1'),"2":__('Banner_status 2')}, formatter: Table.api.formatter.status},#控制默认搜索选项
                        {field: 'nickname', title: __('联系人姓名'), operate: false},#operate的值有BETWEEN/LIKE/false/true/=/
                        {field: 'mobile', title: __('联系人手机'), operate: false},
                        {
                            field: 'business_license',
                            title: __('营业执照'),
                            operate: false,
                            events: Table.api.events.image,
                            formatter: Table.api.formatter.image,
                            searchable: false
                        },
{field: 'user_recording', title: __('用户录音'), formatter: function (index,row) {
                                let div = '<div>';
                                if(row.user_recording != null) {
                                    let user_recording = row.user_recording
                                    let arr = user_recording.split(',')
                                    for (let i = 0; i < arr.length; i++) {
                                        div += `<a style="border: 1px solid #cccccc;margin: 2px" href=${arr[i]} target="_blank">录音${i+1}</a>`
                                    }
                                }else{
                                    div += '未上传录音'
                                }
                                div += '</div>'
                                return div;
                            }},
                        {field: 'cook_code', title: __('邀请码'), operate: false},
                        // {
                        //     field: 'qrcode_url',
                        //     title: __('二维码'),
                        //     operate: false,
                        //     events: Table.api.events.image,
                        //     formatter: Table.api.formatter.image,
                        //     searchable: false
                        // },
                        {field: 'invite_num', title: __('邀请人数'), operate: false},
                        {field: 'standard_commission', title: __('标准抽成（%）') , operate: false},
                        {field: 'comments', title: __('备注'), operate: false},
                        {field: 'source', title: __('来源'), operate: false, searchable: false},#searchable控制是否开启默认搜索-false/true
                        {field: 'status', title: __("Status"), searchList: {"normal":__('Normal'),"hidden":__('停用')}, formatter: Table.api.formatter.status},
                        {field: 'createtime_format', title: __('添加时间'), operate: false},
                        {field: 'updatetime_format', title: __('更新时间'), operate: false},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate,
                            buttons: [
                                {
                                    name: 'show', //唯一标识、权限标识
                                    text: '推荐列表', //按钮显示的文字，支持function
                                    title: '推荐列表', //按钮显示的文字，支持function
                                    classname: 'btn btn-info btn-xs btn-dialog', //按钮的class，支持btn-dialog/btn-ajax/btn-addtabs
                                    url: 'cook/partners?cook_invite_code={cook_code}', //按钮的链接，支持使用{字段名}来占位替换，支持`function`
                                    extend: 'data-area=["1000px","650px"]'
                                }
                            ],
                            formatter: Table.api.formatter.operate}
                    ]
                ]
            });
            // 为表格绑定事件
            $(".btn-activateSelected").click(function () {
                var ids = Table.api.selectedids(table); // 获取选中的条目ID集合
                var currentURL = window.location.href;
                var urlParams = new URLSearchParams(currentURL);
                var card_id = urlParams.get("ids");
                if (ids.length === 0) {
                    layer.msg('请选择要操作的数据', { icon: 3 });
                    return;
                }
                layer.confirm('确定要激活选中吗?', { btn: ['是', '否'] },
                    function (index) {
                        layer.close(index);
                        $.post("card_number/activateSelected", {
                            ids: ids,
                            card_id: card_id,
                            action: 'success',
                            reply: ''
                        }, function (response) {
                            if (response.code == 1) {
                                Toastr.success(response.msg);
                                $(".btn-refresh").trigger('click');
                            } else {
                                Toastr.error(response.msg);
                            }
                        }, 'json');
                    },
                    function (index) {
                        layer.close(index);
                    }
                );
            });
            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        //另加一个列表
        list: function () {
        },
        add: function () {
            $('#source0').click(function () {
                $("[type=checkbox]").prop('checked', this.checked)
            })

            Controller.api.bindevent();
        },
        edit: function () {
            $('#source0').click(function () {
                $("[type=checkbox]").prop('checked', this.checked)
            })
            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});

5、bootstrapTable的operate属性所有值：

值	说明
false	禁用通用搜索：该字段将不参与通用搜索。
'='	等于：精确匹配，这也是默认值。
'!='	不等于。
'LIKE'	模糊匹配：通常用于字符串类型的字段搜索。
'NOT LIKE'	不包含。
'>'	大于。
'<'	小于。
'>='	大于等于。
'<='	小于等于。
'IN'	包含于：用于多选值查询。
'NOT IN'	不包含于。
'BETWEEN'	介于：用于查询某个范围的值，常用于数字或时间区间。
'NOT BETWEEN'	不介于。
'RANGE'	区间 ：与 BETWEEN 类似，常与时间选择器配合使用。
'NOT RANGE'	不介于 ：与 NOT BETWEEN 类似。
'FIND_IN_SET'	查找在集合中 ：专门用于处理存储为逗号分隔字符串的字段（如 '1,2,3'）。
'NULL'	为空 ：查询该字段值为 NULL 的记录。
'NOT NULL'	不为空 ：查询该字段值不为 NULL 的记录。