安装初始化
一、环境准备
官网要的
我安装的
二、下载安装
- 安装laravel
composer create-project --prefer-dist laravel/laravel 项目名称 10.*
- 导入 filament
composer require filament/filament
- 注册 filament 管理面板
php artisan filament:install --panels
初始化
- 设置.env 文件
- 执行数据库文件迁移
php artisan migrate
- 创建首个用户用于登录
php artisan make:filament-user
- 运行启动项目
php artisan serve
资源使用与发布
发布资源（添加菜单项）
默认只有一个Dashboard 的仪表板页面
其余资源需要自行发布
- 创建模型
php artisan make:model Posts -m
会新增两个文件一个是模型文件，一个是对应模型数据库表的迁移文件，如需定义可以。可以在模型以及数据库迁移文件中设置不同模型或不同的数据表之前的关联关系。
下面是执行
php artisan make:model TestModal -m
这个命令之后的产物
- 引入资源
php artisan make:filament-resource SomeName
此命令会产生四个文件
下面是执行
php artisan make:filament-resource TestModal
该命令的产物
此时我们的左侧侧边栏中出现了资源的导航菜单，但需要注意的是，上述命令不会在数据库中创建表，所以需要自己执行数据库迁移文件，不然访问这个资源时会报没有找到这个数据表的SQL错误
数据table的展示相关内容
找到在app/Filament/Resources/这个目录下的xxxResource.php 资源文件的table方法
table 显示字段
public static function table(Table $table): Table
{
return $table
->columns([
// ...
Tables\Columns\TextColumn::make('name')
->searchable()
->label('姓名')
,
Tables\Columns\TextColumn::make('email')
->label('邮箱')
,
// ...
])
}
table 数据过滤筛选 filters
以posts 表为例
对其中的文章发布状态 、文章所属频道进行筛选过滤
->filters([
//
Tables\Filters\SelectFilter::make('status')
->label('状态')
->options([
'draft' => '草稿',
'publish' => '发布',
]), Tables\Filters\SelectFilter::make('article_channel_id')
->relationship('articleChannel', 'name')
->searchable()
->preload()
->label('文章频道')
,
])
效果如截图所示
操作栏目按钮设置 在 actions中
->actions([
Tables\Actions\ActionGroup::make([
Tables\Actions\ViewAction::make()->label('查看'),
Tables\Actions\EditAction::make()->label('编辑'),
Tables\Actions\DeleteAction::make()->label('删除'),
])
])
按钮可以分组或拆分 例子演示的时划分组的例子集合了查看编辑删除按钮效果如截图所示
选中后的批量操作在 bulkActions
->bulkActions([
Tables\Actions\BulkActionGroup::make([
Tables\Actions\DeleteBulkAction::make(),
]),
])
默认例子是演示批量删除功能效果如截图所示
表单的定义
表单组件库
参考例子
public static function form(Form $form): Form
{
return $form
->schema([
// 正常文本输入框
Forms\Components\TextInput::make('title')
->label('文章标题')
->required()
->maxLength(255)
// 占满一行宽度 默认是一半的宽度
->columnSpanFull()
,
// 录入tag标签 存入数据库时以,分隔
Forms\Components\TagsInput::make('keywords')
->label('关键字')
->separator(',')
->required()
,
// 文本输入域
Forms\Components\Textarea::make('describe')
->label('文章简介')
->required()
->maxLength(255)
,
// 文件上传
Forms\Components\FileUpload::make('cover_img')
->label('文章封面')
->image()
,
//posts article_channel_id关联查询articleChannel表的name属性供选择，返回对应name的id 属性
Forms\Components\Select::make('article_channel_id')
->relationship('articleChannel', 'name')
->searchable()
->preload()
->required()
->label('文章频道')
// 新建频道表数据的弹窗
->createOptionForm([
Forms\Components\TextInput::make('name')
->required(),
])
,
// 富文本
Forms\Components\RichEditor::make('content')
->label('正文内容')
->required()
->columnSpanFull()
->toolbarButtons([
'attachFiles',
'blockquote',
'bold',
'bulletList',
'codeBlock',
'h1',
'h2',
'h3',
'table',
'italic',
'link',
'orderedList',
'redo',
'strike',
'underline',
'undo',
])
,
// 确定固定配置的的下拉框选择器
Forms\Components\Select::make('status')
->label('文章状态')
->options([
'draft' => '草稿',
'publish' => '发布',
])
->default('draft') // 默认已选项
]);
}
权限控制面板的插件使用
youtube视频教程
文档 bezhansalleh/filament-shield
安装
composer require bezhansalleh/filament-shield
为需要的模型添加 use HasRoles;
以User模型为例子
use Illuminate\Foundation\Auth\User as Authenticatable;
use Spatie\Permission\Traits\HasRoles;
class User extends Authenticatable
{
use HasRoles;
// ...
}
发布配置文件，然后在配置文件中设置你的配置项
php artisan vendor:publish --tag=filament-shield-config
执行后在你的config 文件目录下新增 filament-shield.php文件
为你需要的面板新增插件例如文件
app/Providers/Filament/AdminPanelProvider.php
use BezhanSalleh\FilamentShield\FilamentShieldPlugin;
->plugins([
FilamentShieldPlugin::make()
->gridColumns([
'default' => 1,
'sm' => 2,
'lg' => 1
])
->sectionColumnSpan(1)
->checkboxListColumns([
'default' => 1,
'sm' => 2,
'lg' => 6,
])
->resourceCheckboxListColumns([
'default' => 1,
'sm' => 2,
]),
])
最后执行指令进行安装整个权限到项目中
php artisan shield:install
关闭任意角色用户可见roles菜单的权限
在之前
php artisan vendor:publish --tag=filament-shield-config
这个命令执行后生成的config/filament-shield.php文件中找到 register_role_policy配置项 配置 enabled 为 true
'register_role_policy' => [
'enabled' => true,
],
