阅读时间:1 分钟
0 字

模块开发完整实战

下面用一个完整例子走通 菜单 + 接口 + 页面 的开发流程。

1. 创建模块目录

app/Demo/
  App.php
  app.json
  Admin/
  Models/

2. 模块入口

php
<?php

declare(strict_types=1);

namespace App\Demo;

use Core\App\AppExtend;
use Core\Bootstrap;

class App extends AppExtend
{
    public function register(Bootstrap $app): void
    {
        // 可在此注册事件/服务
    }
}

3. 菜单配置

app/Demo/app.json

json
{
  "name": "duxweb/demo",
  "description": "Demo Application",
  "version": "0.1.0",
  "adminMenu": [
    {
      "type": "menu",
      "label": "示例页面",
      "name": "demo.index",
      "path": "demo/index",
      "icon": "i-tabler:star",
      "loader": "Demo/Index/index",
      "hidden": false
    }
  ]
}

4. 创建资源接口

app/Demo/Admin/Post.php

php
<?php

declare(strict_types=1);

namespace App\Demo\Admin;

use App\Demo\Models\DemoPost;
use Core\Resources\Action\Resources;
use Core\Resources\Attribute\Resource;
use Core\Validator\Data;
use Psr\Http\Message\ServerRequestInterface;

#[Resource(app: 'admin', route: '/demo/post', name: 'demo.post')]
class Post extends Resources
{
    protected string $model = DemoPost::class;

    public function transform(object $item): array
    {
        return [
            'id' => $item->id,
            'title' => $item->title,
        ];
    }

    public function format(Data $data, ServerRequestInterface $request, array $args): array
    {
        return [
            'title' => $data->title,
        ];
    }
}

5. 创建页面

app/Demo/Admin/Index/index.vue

vue
<script setup lang="ts">
</script>

<template>
  <DuxPage>
    <DuxPageHeader title="示例页面" />
    <DuxPageBody>
      <div class="p-4">Hello Dux PHP Admin</div>
    </DuxPageBody>
  </DuxPage>
</template>

6. 注册模块并同步

config/app.toml 中加上:

toml
registers = [ "App\\System\\App", "App\\Data\\App", "App\\Demo\\App" ]

同步菜单与数据库:

bash
php dux db:sync
php dux menu:sync

刷新 /manage/ 即可看到新页面。