Skip to content

业务组件

CrudPage

CrudPage 是构建 CRUD 页面的核心组件,集成了数据表格、搜索、工具栏等功能。

基础用法

php
use Lartrix\\Schema\\Components\\Business\\CrudPage;

\$schema = CrudPage::make('用户管理')
    ->apiPrefix('/users')
    ->columns([
        ['key' => 'id', 'title' => 'ID'],
        ['key' => 'name', 'title' => '姓名'],
        ['key' => 'email', 'title' => '邮箱'],
    ]);

return success(\$schema->build());

完整配置

php
CrudPage::make('用户管理')
    // API 配置
    ->apiPrefix('/users')           // API 前缀
    $table->apiParams(['type' => 'admin']) // 默认参数
    
    // 表格列
    ->columns([
        ['key' => 'id', 'title' => 'ID', 'width' => 80],
        ['key' => 'name', 'title' => '姓名'],
        ['key' => 'status', 'title' => '状态', 'slot' => [...]],
    ])
    
    // 搜索
    ->search([
        ['关键词', 'keyword', Input::make()],
        ['状态', 'status', Select::make()->options([...])],
    ])
    
    // 工具栏
    ->toolbarLeft([
        Button::make('新增')->type('primary'),
    ])
    ->toolbarRight([
        Button::make('导出'),
    ])
    
    // 分页
    $table->pagination(true)
    $table->defaultPageSize(20)
    
    // 滚动
    $table->scrollX(1200)
    
    // 树形数据
    $table->tree('children', false)
    
    // 数据和方法
    ->data(['formVisible' => false])
    ->methods(['handleSubmit' => [...]]);

OptForm

OptForm 是操作表单组件,用于新增/编辑表单。

基础用法

php
use Lartrix\\Schema\\Components\\Business\\OptForm;

\$form = OptForm::make('formData')
    $table->fields([
        ['名称', 'name', Input::make()->props(['placeholder' => '请输入名称'])],
        ['邮箱', 'email', Input::make()->props(['type' => 'email'])],
        ['状态', 'status', SwitchC::make(), true], // 默认值
    ])
    $table->buttons([
        Button::make('取消')
            ->on('click', SetAction::make('formVisible', false)),
        Button::make('保存')
            ->type('primary')
            ->on('click', CallAction::make('handleSubmit')),
    ]);

字段配置

php
OptForm::make('formData')
    $table->fields([
        // [标签, 字段名, 组件, 默认值]
        ['名称', 'name', Input::make()],
        ['邮箱', 'email', Input::make(), ''],
        ['年龄', 'age', Input::make()->props(['type' => 'number']), 0],
        ['状态', 'status', SwitchC::make(), true],
    ]);

DataTable

DataTable 是数据表格组件,用于展示数据列表。

php
use Lartrix\\Schema\\Components\\Business\\DataTable;

DataTable::make()
    ->props([
        'data' => '{{ list }}',
        'columns' => [...],
        'pagination' => ['pageSize' => 20],
    ]);

编辑器组件

MarkdownEditor

php
use Lartrix\\Schema\\Components\\Business\\MarkdownEditor;

MarkdownEditor::make()
    ->model('formData.content')
    ->props([
        'height' => 400,
        'placeholder' => '请输入内容',
    ]);

RichEditor

php
use Lartrix\\Schema\\Components\\Business\\RichEditor;

RichEditor::make()
    ->model('formData.content')
    ->props([
        'height' => 400,
    ]);

IconPicker

php
use Lartrix\\Schema\\Components\\Business\\IconPicker;

IconPicker::make()
    ->model('formData.icon')
    ->props([
        'icons' => [...], // 图标列表
    ]);

FlowEditor

php
use Lartrix\\Schema\\Components\\Business\\FlowEditor;

FlowEditor::make()
    ->model('formData.flow')
    ->props([
        'nodes' => [...],
        'edges' => [...],
    ]);

基于 MIT 许可发布