fastadmin常见操作

最新推荐文章于 2024-03-05 15:53:18 发布
最新推荐文章于 2024-03-05 15:53:18 发布
阅读量3.5k 收藏 5
点赞数 1
分类专栏： fastadmin php 文章标签： php javascript html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44432032/article/details/119667181
版权

1.动态下拉组件

排序参数： data-order-by='id desc'
必填： data-rule="required"

<input id="c-classify_id" data-rule="required" data-order-by='id desc' data-source="navigation/classify/selectpage" class="form-control selectpage" name="row[classify_id]" type="text" value="{$row.classify_id|htmlentities}">

2.点击修改内容

添加：,editable:true,

{field: 'title', title: __('Title'),editable:true, operate: 'like'},

3.表格点击下拉修改

{
	field: 'service_id',
	title: '业务类型',
	editable: {
	    type: 'select',
	    pk: 1,
	    source: Config.services,
	},
	operate:'=', addclass: 'selectpage',
	extend:"data-source='base/type/selectpage' data-params='{\"custom[status]\":1}' data-order-by='weigh desc' data-pagination='false' "
},

在控制器初始化的时候需要添加：

$services=$this->getService();
$this->assignconfig('services', $services);

public function _initialize()
    {
        parent::_initialize();
        $this->model = new \app\admin\model\config\Group;
        $this->modelValidate=false;
        $services=$this->getService();
        $this->assignconfig('services', $services);

    }

4.点击箭头排序

{field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
                        {field: 'updatetime', title: __('Updatetime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},

5.图片显示
{field: ‘fileimage’, title: __(‘Fileimage’), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image},

6.拖动排序
添加（这里的参数是表名）：table: ‘navigation_list’,
Table.api.init({
extend: {
index_url: ‘navigation/listing/index’,
add_url: ‘navigation/listing/add’,
edit_url: ‘navigation/listing/edit’,
del_url: ‘navigation/listing/del’,
multi_url: ‘navigation/listing/multi’,
table: ‘navigation_list’,
}
});
7.树形显示

<input id="c-information_sources" data-rule="required" data-source="base/Source/selectpage3" data-params='{"custom[status]":1,"isTree":1}' data-order-by="weigh desc"
                   class="form-control selectpage" name="row[information_sources]" type="text" placeholder="单选，如果没有符合的来源，请联系管理员新增。">

{field: 'type', title: '业务类型',searchable:true,visible:false,
                            operate:'=', addclass: 'selectpage', placeholder: '单选搜索',
                            extend:"data-source='base/type/selectpage' data-params='{\"custom[status]\":1}' data-order-by='weigh desc'"},

8.拖动排序
第一步：数据库中添加
数据库 weigh 权重 int 后台的排序字段，如果存在该字段将出现排序按钮，可上下拖动进行排序

第二步：模型中添加

protected static function init()
    {
        self::afterInsert(function ($row) {
            $row->save(['weigh' => $row['id']]);
        });
    }

第三步：js的初始化表格中添加
table: ‘navigation_list’,//参数为数据库名称
// 初始化表格参数配置

Table.api.init({
            extend: {
                index_url: 'navigation/listing/index',
                add_url: 'navigation/listing/add',
                edit_url: 'navigation/listing/edit',
                del_url: 'navigation/listing/del',
                multi_url: 'navigation/listing/multi',
                table: 'navigation_list',
            }
        });

第四步：按钮显示

{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}

9.联动查询

<div class="form-group">
        <label class="control-label col-xs-12 col-sm-2 ">业务类型:</label>
        <div class="col-xs-12 col-sm-8">
            <!--{:build_select('row[type]', $typedata,$typeid, ['class'=>'form-control selectpicker', 'data-rule'=>'required'])}-->
            <input id="c-type" data-rule="required" data-source="base/type/selectpage" data-field="name" data-page-size="5"
                   class="form-control selectpage" name="row[type]" value="{$row.type}" type="text" placeholder="点击下拉可选择业务类型">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2 ">数据来源:</label>
        <div class="col-xs-12 col-sm-8">
            <!--{:build_select('row[type]', $typedata,$typeid, ['class'=>'form-control selectpicker', 'data-rule'=>'required'])}-->
            <input id="c-source_three" data-rule="required" data-source="base/Source_Three/selectpage" data-field="name" data-page-size="10"
                   class="form-control selectpage" name="row[source_three]" value="{$row.source_three}" type="text" placeholder="点击下拉可选择数据来源">
        </div>
    </div>

add: function () {
            Form.api.bindevent($("form[role=form]"));
            $('#c-source_three').data("params", function (obj) {
                if($('#c-type').val() == ""){
                    return {
                        isTree:1,
                    };
                }else{
                    return {
                        custom: {
                            service_id: $('#c-type').val()
                        },
                        isTree:1,
                    };
                }
            });
            $('#c-type').change(function () {
                //根据服务类型显示是否显示数据
                $('#c-source_three').selectPageClear();

            });
        },

        edit: function () {
            Form.api.bindevent($("form[role=form]"));
            $('#c-source_three').data("params", function (obj) {
                if($('#c-type').val() == ""){
                    return {
                        isTree:1,
                    };
                }else{
                    return {
                        custom: {
                            service_id: $('#c-type').val()
                        },
                        isTree:1,
                    };
                }
            });
            $('#c-type').change(function () {
                //根据服务类型显示是否显示数据
                $('#c-source_three').selectPageClear();

            });
        },

10.定义方法

columns: [
   [
        {field: 'color', title: __('颜色'), operate: false, formatter: Controller.api.formatter.base, cellStyle:function(value,row,index){
                return {css:{"color":value}};
            }},
        // {field: 'color', title: __('颜色'),operate:false, formatter: Controller.api.formatter.base},
        {field: 'belonging', title: __('数据所属'),formatter:Table.api.formatter.status,extend:'autocomplete="off"',searchList: {"0":__('公司'),"1":__('个人'),"2":__('部门')}},
        {field: 'api', title: __('接口'),extend:'autocomplete="off"'},
        {field: 'createtime', title: __('创建时间'),sortable:true,formatter: Table.api.formatter.datetime,operate:false, addclass: 'createtime',extend:'autocomplete="off" '},
    ]
]

api: {
    bindevent: function () {
        Form.api.bindevent($("form[role=form]"));
    },
    formatter:{
        base: function (value, row, index) {
            return '<span style=background:'+value+'> ' + value + '</span>'
        },
    }

}

11.定义属性

columns: [
[
   {field: 'state', checkbox: true,},
   {field: 'id', title: __('Id'),operate:false,visible:false},
   {field: 'call', title: __('基础信息'), width:'120px',operate: false,visible: true, formatter: Controller.api.formatter.base},

   {field: 'call',title: __('称呼'),visible:false,editable:true,operate: 'LIKE %...%', placeholder: '模糊搜索',extend:'autocomplete="off"'},
   {field: 'phone_number', title: __('手机号'),visible:false,operate: 'LIKE %...%', placeholder: '模糊搜索',extend:'autocomplete="off"'},
   {field: 'phone_str', title: __('手机号'),visible:true,width:'100px',operate: false},
   {field: 'customerstatus.status_name', title: __('客户状态'), operate: false,visible: true,width:'100px', cellStyle:Controller.api.formatter.css_span,formatter: Controller.api.formatter.customer},

   ]
]

api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            },
            formatter:{
                css_span:function () {
                    return {
                        css:{
                            "white-space ":"normal",
                            "text-align ":"left",
                        }
                    };
                },
                css_span2:function () {
                    return {
                        css:{
                            "white-space ":"normal",
                            "text-align ":"left",
                            "line-height ":"30px",
                            "letter-spacing ":"1px",

                        }
                    };
                },
                base: function (value, row, index) {
                    var sex='';
                    if(row.sex =='2'){
                        sex='女';
                    }else if(row.sex =='1'){
                        sex='男';
                    }else{
                        sex='未知';
                    }
                    return '<span> ' + value + '</span><br/>' +
                        '<span>' + sex + '</span><br/>'
                },
                add: function (value, row, index) {
                    return '<span> ' + value + '</span><br/>' +
                        '<span>' + row.create_time + '</span>';
                },
                customer: function (value, row, index) {
                    return '<span> ' + value + '</span><br/><br/>' +
                        '<span>' + row.stat_str + '</span><br/>'
                },
                interview: function (value, row, index) {
                    return '<span> ' + value + '</span><br/><br/>' +
                        '<span>' + row.estimate_visiting_time + '</span><br/>'
                },
            }
        }

12.表单点击下拉修改
在这里插入图片描述
控制器代码：

public function _initialize()
{
    parent::_initialize();
    $this->model = new \app\admin\model\config\Group;
    $this->modelValidate=false;
    //getIcon   getChart
    $getIcon=$this->getIcon();
    $getChart=$this->getChart();
    $services=$this->getService();
    $this->assignconfig('geticon', $getIcon);
    $this->assignconfig('getchart', $getChart);

    $this->assignconfig('services', $services);

}
public function getService(){
        $map['status']=1;
        if($this->auth->type >0){
            $map['id']=$this->auth->type;
        }
        $list = Type::where($map)->order('weigh desc')->select();
        $data[]=[
            'value'=>0,
            'text'=>'默认',
        ];
        foreach ($list as $li){
            $data[]=[
                'value'=>$li->id,
                'text'=>$li->name,
            ];
        }

        return $data;
    }
    public function getIcon(){
        $list = Icon::order('id desc')->select();
        foreach ($list as $li){
            $data[]=[
                'value'=>$li->id,
                'text'=>$li->title,
            ];
        }

        return $data;
    }
    public function getChart(){

        $list = Chart::order('id desc')->select();
        foreach ($list as $li){
            $data[]=[
                'value'=>$li->id,
                'text'=>$li->title,
            ];
        }

        return $data;
    }

js代码

{
    field: 'service_id',
    title: '业务类型',
    editable: {
        type: 'select',
        pk: 1,
        source: Config.services,
    },
    operate:'=', addclass: 'selectpage',
    extend:"data-source='base/type/selectpage' data-params='{\"custom[status]\":1}' data-order-by='weigh desc' data-pagination='false' "
},
{
    field: 'icon',
    title: '首页头部图标',
    editable: {
        type: 'select',
        pk: 1,
        source: Config.geticon,
    },
    operate:'=', addclass: 'selectpage',
    extend:"data-source='totals/icon/selectpage' data-params='{\"custom[status]\":1}' data-order-by='weigh desc' data-pagination='false' "
},
{
    field: 'chart',
    title: '首页统计图',
    editable: {
        type: 'select',
        pk: 1,
        source: Config.getchart,
    },
    operate:'=', addclass: 'selectpage',
    extend:"data-source='totals/chart/selectpage' data-params='{\"custom[status]\":1}' data-order-by='weigh desc' data-pagination='false' "
},
原克技术
关注
  • 1
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
fastadmin alioss上传
12-28
fastadmin 阿里oss上传组件
Fastadmin中，控制器如何给动态下拉(SelectPage)的data-source参数传值？
写写代码
04-16 1870
控制器中定义的jsonOptions变量通过模板引擎传递到前端页面中，然后在SelectPage控件的data-source参数中引用。在FastAdmin中，控制器可以通过渲染模板时，为SelectPage控件的data-source参数提供动态的JSON数据源，从而实现动态下拉菜单选项的传递和渲染。2.在前端页面中，传递控制器中的JSON格式数据源到SelectPage控件的data-source参数中。1.在控制器中定义一个变量，用于存储SelectPage控件需要显示的下拉菜单选项数据。
fastadmin fieldlist里面使用selectpage联动 动态修改data-params
最新发布
luhaiping1993的博客
03-05 323
【代码】fastadmin fieldlist里面使用selectpage联动 动态修改data-params。
fastadmin事务管理系统
05-27
fastadmin事务管理系统
fastadmin 七牛云
12-28
fastadmin 七牛云组件
fastadmin上传文件回调和实现自定义批量上传
01-30
本资源通过使用fastadmin自带的上传插件，来实现开发工作中常见的上传回调场景，资源包含详细的实现代码，含html代码，js代码，和php代码。第二个是在前述的基础之上实现了如何在fastadmin中实现自定义的批量上传。
javascript实现表格的单元格拖动排序
09-15
javascript实现表格的单元格拖动排序，对实现图片的拖动排序有启发
Fastadmin中，当动态下拉(SelectPage)的data-source=“zheng/count/selectpage“时，对应的控制器的selectpage应该怎么写？
写写代码
04-16 672
在上述代码中，通过data-source="zheng/count/selectpage"设置SelectPage控件的数据源为zheng/count控制器中的selectpage方法，即上述实现中的返回值。对于SelectPage控件的data-source=“zheng/count/selectpage”，对应的控制器的selectpage方法应该返回JSON格式的数据，包含要显示在下拉框中的选项数据。在控制器中，通过查询zz_count和zz_category表中的数据，返回要显示的下拉框选项数据。
fastadmin自定义拖拽排序
zjs112233的博客
07-09 2457
fastadmin自定义拖拽排序
fastadmin实现selectpage下拉列表拼接两个数据库字段数据
weixin_46001736的博客
12-30 1476
fastadmin实现selectpage下拉列表拼接两个数据库字段数据
fastadmin selectpage动态改变data-source
BoYou233的博客
05-20 4696
data-source这个值没法动态修改哦。selectpage如果需要动态传参，请使用data-params=function 如果需要动态修改selectpage的url值，则可以采用下面的方法来实现 $("#xxx_text").data("selectPageObject").option.data = "user/user/index"; 其中user/user/index为你新的URL地址。 ...
fastadmin图标与code浏览
09-01
fastadmin fa图标无全部浏览页面，整理了一个html可以查看所有icon
fastadmin 后台view data-source关联报500错误问题
dejz8829的专栏
03-20 517
data-source 关联模型通过id关联被关联表的name字段，没有name字段就报500 转载于:https://www.cnblogs.com/daochong/p/10562540.html
fastadmin 中添加自定义动态下拉框，并在前端展示出来
yqh的博客
05-20 3836
官方文档： https://doc.fastadmin.net/doc/178.html 我写的某个下拉: 前端： <div class="form-group"> <label class="control-label col-xs-12 col-sm-2">{:__('Unit')}:</label> <div class="col-xs-12 col-sm-8"> <input id="c-unit" da
FastAdmin 动态下拉(SelectPage)的使用
巴啦啦臭魔仙的博客
01-07 3767
其中，data-source 为数据源 URL。
fastadmin常见问题 开发心得
向年薪进发!
11-30 1万+
木有好看的后台模板,后台还要自己写.之前也用过不少后台模板，各有千秋，总是感觉不够便捷。重复着大量代码。   FASTADMIN开发一些常见问题整理 1.控制器生成在二级目录下时,下拉列表没有数据 =&gt;页面下拉列表位置data-source属性的值前面加上你二级目录名字  例如正常是controller/a  而你生成的是controller/test/a         此时da...
原生Mysql的基本使用(二)
yang000007的博客
11-04 263
1）显示数据库 SHOW DATABASES;2）创建数据库：需要指定字符集，这里以python_mysql为例，DEFAULT CHARSET utf8 COLLATE utf8_general_ci;设置默认的字符集，可以自己修改 3）使用数据库 USE python_mysql(数据库名称) 4) 显示当前数据库时间 SELECT NOW();5）显示当前数据库版本 SELECT VERSION();6）显示创建数据库时候的语句 show create database python_mysql;
fastadmin组件之selectpage使用方法
热门推荐
郝云博客
07-12 1万+
常规用法 下面介绍一个最基础的动态下拉列表示例，如下 <input id="c-name" data-rule="required" data-source="category/selectpage" class="form-control selectpage" name="row[name]" type="text" value=""> 其中需要给元素class添加一个selectpage，其次需要增加一个data-source="category/selectpage"这个属性，c
Fastadmin中 表单form 绑定和提交后自定义处理方法
xxs18326183038的博客
09-15 2659
Fastadmin中 表单form 绑定和提交后自定义处理方法
fastadmin mongodb
09-05
FastAdmin提供了对MongoDB的支持，使开发者可以通过FastAdmin对MongoDB进行管理和操作。 使用FastAdmin进行MongoDB的操作非常简便。首先，需要在FastAdmin的系统设置中配置好MongoDB的连接信息，包括主机地址、端口...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

原克技术

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值