# 数据展示

# 快速入门

ModStart\Detail\Detail 类用于快速生成详情页面,参照例子 数据表格→快速入门

可以通过如下代码快速定义个数据表单

return Detail::make('blog', function (Detail $detail) {
    // 定义显示ID列
    $detail->id('id', 'ID');
    // 定义标题字段,格式为单行文本
    $detail->text('title', '标题');
    // 定义封面字段,格式为单张图片
    $detail->image('cover', '封面');
    // 定义摘要字段,格式为多行文本
    $detail->textarea('summary', '摘要');
    // 定义内容字段,格式为富文本
    $detail->richHtml('content', '内容');
    // 定义创建时间字段,格式为简单显示
    $detail->display('created_at', '创建时间');
    // 定义更新时间字段,格式为简单显示
    $detail->display('updated_at', '更新时间');
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

# 获取当前模型数据

在闭包内可以获取到当前模型的数据

return Detail::make('blog', function (Detail $detail) {
    dd($detail->item());
});
1
2
3

# 字段组件库

# 中国地区 areaChina

$detail->areaChina('field', '字段名');
1

# 音频 audio

$detail->audio('field', '字段名');
1

# 验证码 captcha

$detail->captcha('field', '字段名');
1

# 多选 checkbox

$detail->checkbox('field', '名称');
1

# 代码 code

$detail->code('field', '名称');
1

# 颜色 color

$detail->color('field', '字段名');
1

# 货币 currency

$detail->currency('field', '字段名');
1

# 日期 date

$detail->date('field', '字段名');
1

# 日期时间 datetime

$detail->datetime('field', '字段名');
1

# 小数 decimal

$field = $detail->decimal('field', '字段名');

// 是否显示颜色(正数绿色,负数红色)
$field->autoColor(true);
// 是否总是显示正负号
$field->signShow(true);
1
2
3
4
5
6

# 显示 display

$detail->display('field','名称');
1

# 文件 file

$detail->file('field', '字段名');
1

# 临时文件 fileTemp

临时路径指上传到临时表 data_temp 中的图片,正式保存时会将临时图片移动到正式表 data 中。

$detail->fileTemp('field', '字段名');
1

# 多文件 files

$detail->files('field', '字段名');
1

# 隐藏域 hidden

$detail->hidden('field', '字段名');
1

# HTML html

$detail->html('field', '字段名');
1

# 图标 icon

$detail->icon('field', '字段名');
1

# ID id

$detail->id('field', '字段名');
1

# 单张图片 image

$detail->image('field', '字段名');
1

# 多张图片 images

$detail->images('field', '字段名');
1

# 多张图片(临时路径) imagesTemp

临时路径指上传到临时表 data_temp 中的图片,正式保存时会将临时图片移动到正式表 data 中。

$detail->imagesTemp('field', '字段名');
1

# 键值对列表 keyValueList

$detail->keyValueList('field', '字段名');
1
$detail->link('field', '字段名');
1

# Markdown markdown

$detail->markdown('field', '字段名');
1

# 下拉多选 multiSelect

$detail->multiSelect('field', '字段名')->options([
    'a' => '选项1',
    'b' => '选项2',
    'c' => '选项3',
]);
1
2
3
4
5

# 数字 number

$field = $detail->number('field', '字段名');

// 是否显示颜色(正数绿色,负数红色)
$field->autoColor(true);
// 是否总是显示正负号
$field->signShow(true);
1
2
3
4
5
6

# 密码 password

$detail->password('field', '字段名');
1

# 百分比 percent

$detail->percent('field', '字段名');
1

# 单选 radio

$detail->radio('field', '字段名');
1

# 富文本 richHtml

$detail->richHtml('field', '字段名');
1

# 下拉 select

// 基本使用
$field = $detail->select('field', '字段名');

// 使用Type作为备选项,XxxType是继承BaseType的类
$field->optionType(XxxType::class);
// 使用数组作为备选项
$field->options(['1' => '选项1', '2' => '选项2']);
// 使用数组作为备选项
$field->optionArray([['id' => 1, 'name' => '选项1'], ['id' => 2, 'name' => '选项2']],'id','name');
// 使用模型作为备选项
$field->optionModel('forum_category','id','title');
// 使用模型作为备选项(简单条件筛选)
$field->optionModel('forum_category','id','title',['xxx'=>'xxx']);
// 使用模型作为备选项,并渲染为树状结构
$detail->select('position', '位置')->optionModelTree('forum_category','id','title');
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 开关 switch

$detail->switch('field', '字段名');
1

# 标签 tags

$detail->tags('field', '名称');
1

# 单行文本 text

$detail->text('field', '名称');
1

# 多行文本 textarea

$detail->textarea('field', '字段名');
1

# 时间 time

$detail->time('field', '字段名');
1

# 树状组件 tree

$detail->tree('field', '名称');
1

# 类型 type

// 基础使用
$field = $grid->type('field', '字段名');

// 在表格中快速编辑
$field->gridEditable(true);
// 定义BaseType,同时指定类型颜色
$field->type(XxxStatus::class, [
    XxxStatus::SUCCESS => 'success',
    XxxStatus::FAIL => 'danger',
])
1
2
3
4
5
6
7
8
9
10

# 多值 values

$detail->values('field', '字段名');
1

# 视频 video

$detail->video('field', '字段名');
1

更多内置组件请参照 ModStart\Support\Manager\FieldManager 中的定义

Last Updated: 2 months ago