深圳全飞鸿

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 7|回复: 0
打印 上一主题 下一主题

fastadmin的table栏排列

[复制链接]

13

主题

29

帖子

165

积分

实习版主

Rank: 7Rank: 7Rank: 7

积分
165
跳转到指定楼层
楼主
发表于 2025-6-13 10:41:52 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
在 FastAdmin 框架中,表格的排列顺序主要依据以下规则和配置决定,结合前端交互与后端逻辑实现动态排序:
一、默认排序规则
  • 字段优先级
    默认按 id 字段降序排列(即最新数据在前)。若需修改默认排序字段,需在前端 JS 配置中指定 sortName 参数,例如:
    javascript

    table.bootstrapTable({

        sortName: 'create_time', // 默认按创建时间排序

        sortOrder: 'asc'         // 升序(asc)或降序(desc)

    });

  • 特殊字段 weigh
    如果数据表包含 weigh 字段(用于权重排序),FastAdmin 会优先以此字段排序。可通过修改 dragsortfield 配置替换默认排序字段:
    javascript

    // 在 require.js 中修改默认排序字段

    Table.config.dragsortfield = 'custom_sort_field';


二、用户交互排序
  • 表头点击排序
    • 列配置需添加 sortable: true 属性以启用排序:javascript

      columns: [[

          { field: 'id', title: 'ID', sortable: true },

          { field: 'name', title: '名称' }

      ]]

    • 用户点击表头时,前端发送排序请求(如 sort=id&order=desc),后端根据参数执行数据库查询:php

      // 控制器中处理排序逻辑

      $sort = $this->request->get('sort', 'id');

      $order = $this->request->get('order', 'desc');

      $list = Db::name('table')->order($sort, $order)->select();


  • 拖拽排序
    通过 Ajax 与后端交互实现实时排序:
    • 前端配置拖拽事件:javascript

      Table.api.init({

          dragsort_url: 'ajax/weigh' // 拖拽排序接口

      });

    • 后端更新排序字段(如 sort):php

      public function sort() {

          $ids = explode(',', $this->request->post('ids'));

          $field = 'sort'; // 自定义排序字段

          foreach ($ids as $k => $id) {

              Db::name('table')->where('id', $id)->update([$field => $k + 1]);

          }

          $this->success();

      }



三、自定义排序逻辑
  • 修改默认排序字段
    在表格初始化时指定 sortName 和 sortOrder:
    javascript

    table.bootstrapTable({

        sortName: 'custom_field',

        sortOrder: 'asc'

    });

  • 后端强制排序
    在控制器中直接定义排序规则,忽略前端参数:
    php

    public function index() {

        $list = Db::name('table')->order('custom_field', 'asc')->paginate();

        $this->view->assign('list', $list);

        return $this->view->fetch();

    }


四、排序规则总结
[td]
场景
依据
配置位置
默认加载
id 降序或 weigh 字段
前端 JS 初始化参数
用户点击表头
列配置的 sortable: true
前端列定义 + 后端查询
拖拽排序
自定义排序字段(如 sort)
前端事件 + 后端 Ajax
特殊需求
手动指定排序字段和顺序
后端控制器强制排序

通过灵活配置前后端逻辑,FastAdmin 可实现从简单表头点击到复杂拖拽排序的多样化需求。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|nagomes  

GMT+8, 2025-6-28 05:01 , Processed in 0.056720 second(s), 29 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表