• Bahasa Indonesia

      • Ekstensi Action

      Di NocoBase, Action adalah tombol di Block, digunakan untuk memicu logika bisnis — seperti "Tambah Baru", "Edit", "Delete", dll. Dengan extends class dasar ActionModel, Anda dapat menambahkan tombol Action kustom.

      Skenario Action

      Setiap Action perlu mendeklarasikan skenario kemunculannya, ditentukan melalui property static scene:

      SkenarioNilaiPenjelasan
      collectionActionSceneEnum.collectionBerlaku untuk tabel data, seperti tombol "Tambah Baru"
      recordActionSceneEnum.recordBerlaku untuk record tunggal, seperti tombol "Edit", "Delete"
      bothActionSceneEnum.bothKedua skenario tersedia
      allActionSceneEnum.allSemua skenario tersedia (termasuk konteks khusus seperti modal, dll.)

      Contoh

      Action Level Tabel Data

      Berlaku untuk seluruh tabel data, muncul di action bar atas Block:

      // models/SimpleCollectionActionModel.tsx
import { ActionModel, ActionSceneEnum } from '@nocobase/client-v2';
import { ButtonProps } from 'antd';
import { tExpr } from '@nocobase/flow-engine';

export class SimpleCollectionActionModel extends ActionModel {
  static scene = ActionSceneEnum.collection;

  defaultProps: ButtonProps = {
    children: tExpr('Simple collection action'),
  };
}

SimpleCollectionActionModel.define({
  label: tExpr('Simple collection action'),
});

      Action Level Record

      Berlaku untuk record tunggal, muncul di kolom Action setiap baris tabel:

      // models/SimpleRecordActionModel.tsx
import { ActionModel, ActionSceneEnum } from '@nocobase/client-v2';
import { ButtonProps } from 'antd';
import { tExpr } from '@nocobase/flow-engine';

export class SimpleRecordActionModel extends ActionModel {
  static scene = ActionSceneEnum.record;

  defaultProps: ButtonProps = {
    children: tExpr('Simple record action'),
  };
}

SimpleRecordActionModel.define({
  label: tExpr('Simple record action'),
});

      Kedua Skenario Berlaku

      Jika Action tidak membedakan skenario, gunakan ActionSceneEnum.both:

      // models/SimpleBothActionModel.tsx
import { ActionModel, ActionSceneEnum } from '@nocobase/client-v2';
import { ButtonProps } from 'antd';
import { tExpr } from '@nocobase/flow-engine';

export class SimpleBothActionModel extends ActionModel {
  static scene = ActionSceneEnum.both;

  defaultProps: ButtonProps = {
    children: tExpr('Simple both action'),
  };
}

SimpleBothActionModel.define({
  label: tExpr('Simple both action'),
});

      Struktur tiga cara penulisan sama — perbedaan hanya pada nilai static scene dan teks tombol di defaultProps.

      Mendaftarkan Action

      Di load() Plugin gunakan registerModelLoaders untuk loading dan registrasi sesuai kebutuhan:

      // plugin.tsx
import { Plugin } from '@nocobase/client-v2';

export class PluginSimpleActionClient extends Plugin {
  async load() {
    this.flowEngine.registerModelLoaders({
      SimpleCollectionActionModel: {
        loader: () => import('./models/SimpleCollectionActionModel'),
      },
      SimpleRecordActionModel: {
        loader: () => import('./models/SimpleRecordActionModel'),
      },
      SimpleBothActionModel: {
        loader: () => import('./models/SimpleBothActionModel'),
      },
    });
  }
}

      Setelah registrasi selesai, di "Konfigurasi Action" Block dapat menambahkan tombol Action kustom Anda.

      Source Code Lengkap

      Tautan Terkait