FastAdmin入门应用示例

FastAdmin是一款基于ThinkPHP5+Bootstrap的极速后台开发框架。本文介绍如何利用FastAdmin框架快速创建一个简单的入门应用。示例展示如何对一表关联两张表（关联表一个是自建的，一个是框架自带的）一键生成CRUD和一键生成菜单功能。
应用需求
创建不同的相册。
每本相册包括多张照片。
照片需要分类。
实现步骤
1. 安装FastAdmin框架。
参见官方文档。地址：https://doc.fastadmin.net/doc/install.html
2. 安装在线命令管理插件。
登录进入FastAdmin框架后台，点击左侧插件管理菜单。

点击在线命令右侧安装按钮。如果没有登录Fastadmin网站，会弹出一个对话框，要求登录网站。如果在网站没有账号，还需要先注册。

点击立即登录按钮。

填入在FastAdmin网站注册的账号和密码，点击登录。登录成功后点击确定。
再次点击在线命令右侧安装按钮。插件会自动下载安装。安装成功弹出对话框。点击确定。

3. 创建数据库表。
FastAdmin框架对数据库的设计有一些要求，对字段的类型、特殊字段、特殊字符结尾字段都有一些约定。主要是为了方便我们自动生成一些表单控件。

具体说明请参看官方关于数据库字段约定的文档。地址：https://doc.fastadmin.net/doc/database.html
比较贴心的是，官方在源码中提供了一个test数据表，在这个数据表中列示了我们常用的数据库表字段的定义。所以，我们创建数据表可以从test表拷贝，然后修改成我们需要的表结构。
创建相册表
打开数据库管理工具，连接到我们使用的数据库。
找到fa_test表，复制一份，仅复制结构，改名为fa_album。
打开fa_album表，保留id和title字段，删除其他所有字段。
表注释改为相册管理（生成菜单的名称）。
创建照片表
打开数据库管理工具，连接到我们使用的数据库。
找到fa_test表，复制一份，仅复制结构，改名为fa_photos。
打开fa_photos表，保留id、admin_id、category_id、images字段，删除其他所有字段。
将字段admin_id改名为album_id，用来关联相册表。注释改为相册ID。
字段category_id保持不动，用来关联框架自带的分类表。注释改为照片分类ID。
表注释改为照片管理（生成菜单的名称）。

4. 一键生成CRUD代码。
在Fastadmin框架后台管理页面，点击左侧的在线命令管理菜单。
点击添加按钮。弹出一键生成工具对话框。

一键生成相册CRUD代码。
在一键生成CRUD标签页，选择主表为fa_album。
点击生成命令行、立即执行按钮。
如果自动生成失败，需要勾选强制覆盖模式。
自动生成成功后，该CRUD信息会显示在列表中。


一键生成照片（关联相册表）CRUD代码。
在一键生成CRUD标签页，勾选关联模型。
选择主表为fa_photos。
点击追加关联模型按钮。选择关联表为fa_album、关联类型为belongsto、关联外键为album_id、显示字段为title。
再次点击追加关联模型按钮。选择关联表为fa_category、关联类型为belongsto、关联外键为category_id、显示字段为name。

点击生成命令行、立即执行按钮。
如果自动生成失败，需要勾选强制覆盖模式。
自动生成成功后，该CRUD信息会显示在列表中。

5. 一键生成菜单。
在Fastadmin框架后台管理页面，点击左侧的在线命令管理菜单。
点击添加按钮。弹出一键生成工具对话框。
一键生成相册管理菜单。
打开一键生成菜单标签页。
选择控制器设置为album.php。
点击生成命令行、立即执行按钮。

一键生成照片管理菜单。
打开一键生成菜单标签页。
选择控制器设置为photos.php。
点击生成命令行、立即执行按钮。

自动生成菜单成功后，当前列表页会显示相关信息。管理后台左侧的菜单中出现相册管理和照片管理菜单选项。

6.测试。
测试‘相册管理’功能。
点击相册管理菜单链接。出现相册管理页面。
点击添加按钮，出现表单输入弹出框。
输入相册标题，点击确定按钮，增加一条相册信息。

markdown复制代码* 同样方法再创建一个相册。创建完成后，列表页显示刚刚创建的两个相册信息。

markdown复制代码* 再测试其他相关功能。
测试相片管理功能。
点击相册管理菜单链接。出现相册管理页面。
点击添加按钮，出现表单输入弹出框。
点击相册ID下拉选项没有反应，点击照片分类ID显示无查询结果。

测试结果说明我们自动生成的代码有问题，需要排查修改。
7.修改相关代码。
查看官方关于动态下拉列表的文档。文档地址：https://doc.fastadmin.net/doc/178.html
文档明确：FastAdmin的Selectpage列表中显示字段默认读取的是name字段，如果我们返回的列表中不包含name字段，将无法展现下拉列表数据。此时我们需要添加使用data-field="你要显示的字段"即可。
根据文档说明，我们照片表关联相册表的字段名称为title，不是默认的name，需要按文档修改代码。
打开/application/admin/view/photos目录中的add.html文件
ruby复制代码<div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Album_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-album_id" data-rule="required" data-source="album/index" class="form-control selectpage" name="row[album_id]" type="text" value="">
        </div>
    </div>
修改input控件的属性，添加data-field="title"属性。
ruby复制代码<div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Album_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-album_id" data-rule="required" data-source="album/index" data-field="title" class="form-control selectpage" name="row[album_id]" type="text" value="">
        </div>
    </div>
保存后回到网站管理后台。一键清除缓存。
在照片管理页面点击添加按钮。这时候，我们点击相册ID的下拉列表选框时，可以看到关联相册的标题列表了。

用同样的方法修改/application/admin/view/photos目录中的edit.html文件
再来看看/application/admin/view/photos目录中的add.html文件中关于相册分类ID下拉选项框的问题。
ruby复制代码<div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Category_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-category_id" data-rule="required" data-source="category/selectpage" data-params='{"custom[type]":"photos"}' class="form-control selectpage" name="row[category_id]" type="text" value="">
        </div>
    </div>
在input控件中，我们看到属性data-params='{"custom[type]":"photos"}'。实际上，在框架默认的分类中，还没有photos这个类型。
在管理后台常规管理、系统配置、字典配置中添加一个分类类型为photos。

追加后点击确定按钮。
在管理后台分类管理中添加photos下的条目。

点击确定按钮来保存刚刚添加的photos分类。相同方法再添加几个分类条目。
再次来到后台管理页面，点击照片管理，点击添加按钮，在弹出的照片分类ID下拉选项框中，可以看到我们定义的分类条目。

添加所有内容后，点击确定来保存。可以看到页面列表中已经有了刚刚添加的照片信息。

测试其他功能都能正常使用。
小结
本文仅用一个小小的示例展示了FastAdmin框架的强大功能。涉及建表、关联、一键生成CRUD和管理菜单的最基本使用方法，这只是我刚刚研究FastAdmin框架不到3天的成果，可见该框架的强悍和易用性。对于FastAdmin来说，本文只是沧海一粟。将框架变成生产力，还要不断地学习总结。感谢框架的作者付出的艰辛劳动！