iszsw / porter
CURD 页面构建器
Installs: 193
Dependents: 0
Suggesters: 0
Security: 0
Stars: 39
Watchers: 2
Forks: 9
Open Issues: 0
Language:JavaScript
Requires
- php: >=8.0
- iszsw/surface: ^3.1
README
可视化CURD代码生成工具.
源码
gitee地址:https://gitee.com/iszsw/curd
github地址:https://github.com/iszsw/curd
文档
演示
安装
# 运行环境要求 PHP8+
composer require iszsw/curd
在线编辑生成页面
curd作为surface的自定义组件,完全遵循surface的开发规范,因此,你可以直接在surface中调用curd组件,无需任何配置,直接使用即可。
// 演示地址完整代码 <?php use curd\Curd; use surface\components\Input; use surface\components\Number; use surface\components\Upload; use surface\components\TableColumn; // 预定义的列 $tableColumns = [ (new TableColumn())->props(['label' => '用户名', 'prop' => 'username']), (new TableColumn())->props(['label' => '年龄', 'prop' => 'age']), (new TableColumn())->props(['label' => '手机号', 'prop' => 'phone']), (new TableColumn())->props(['label' => '邮箱', 'prop' => 'email']), (new TableColumn())->props(['label' => '头像', 'prop' => 'avatar']), (new TableColumn())->props(['label' => '注册时间', 'prop' => 'create_time']), ]; $formColumns = [ (new Input(["label" => "用户名", "name" => "username"]))->rules(['required' => true, 'message' => '请输入用户名']), (new Number(["label" => "年龄", "name" => "age"])), (new Input(["label" => "手机号", "name" => "phone"])), (new Input(["label" => "邮箱", "name" => "email"])), (new Upload(["label" => "头像", "name" => "avatar"])), ]; // curd组件 $curd = (new Curd())->props([ 'extComponent' => [ [ 'label' => "扩展组件", 'components' => [ [ 'component' => [ (new Input(['label' => 'Input1', 'name' => '第一项'])), (new Input(['label' => 'Input2', 'name' => '第二项'])) ], 'label' => '批量插入', 'icon' => "组件" ], ], ] ], "default-form" => [ 'options' => new \stdClass(), 'columns' => $formColumns, ], "default-table" => [ 'options' => [ "request" => [ "url" => "" ] ], 'columns' => $tableColumns, ] ]); // 渲染页面 echo $curd->view();
根据数据库源生成默认配置
调用
Curd::withDbSource(\PDO $pdo, string $database, string $tableName = '')
方法,指定数据库源,生成默认配置。
下面提供一个ThinkPHP在页面上选择数据库源的示例:
// 从参数中获取表名 $table = $this->request->get('table', ''); $curd = (new \curd\Curd())->props([ 'extComponent' => [ [ 'label' => "扩展组件", 'components' => [ [ 'component' => [ (new Input(['label' => 'Input1', 'name' => 'Input1'])), (new Input(['label' => 'Input2', 'name' => 'Input2'])) ], 'label' => '批量插入', 'icon' => "组件" ], ], ] ], ]) // Tp框架获取Pdo连接:Db::connect()->connect() ->withDbSource(Db::connect()->connect(), '数据库名', $table); $surface = new Surface(); // 下面代码提供一个下拉选择框浮动到页面上,选中表名之后生成默认配置 $surface->addStyle( "<style> .table-list{ position: fixed; top: 10px; right: 510px; z-index: 99; width: 200px; } </style>"); $tableNames = []; foreach (Db::query("SHOW TABLES") as $info) { $name = $info['Tables_in_surface']; $tableNames[$name] = $name; } $surface->append((new Select())->props([ 'class' => "table-list", 'filterable' => true, 'model-value' => new Vmodel("cur_table_name", $table), 'model-value' => $table, // 将选中的表名同步到url刷新页面 'onChange' => Functions::create(<<<JS let url = window.location.href let paramName = 'table' let pattern = new RegExp('(' + paramName + '=).*?(&|$)'); if (url.search(pattern)>=0) { url = url.replace(pattern,'$1' + name + '$2'); } else { url += (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + name; } window.location.href = url; JS, ['name']) ])->options($tableNames)); $surface->append($curd); return $surface->view();