nocobase/docs/en-US/user-manual/advanced-guide/blocks.md
chenos 6410bc8a75
feat: build, cli, devtools, sdk, docs...
* feat: nocobase build

* chore: update build scripts

* chore: update build scripts

* chore(versions): 😊 publish v0.7.0-alpha.33

* chore: independent version

* chore: nocobase build

* chore(versions): 😊 publish v0.7.0-alpha.34

* feat: nocobase-cli

* feat: nocobase-cli

* chore: update dependencies

* feat: improve code

* refactor: create-nocobase-app

* chore(versions): 😊 publish v0.7.0-alpha.35

* feat: @nocobase/devtools

* chore(versions): 😊 publish v0.7.0-alpha.36

* chore: update dependencies

* chore(versions): 😊 publish v0.7.0-alpha.37

* feat: improve code

* chore(versions): 😊 publish v0.7.0-alpha.38

* feat: improve code

* chore(versions): 😊 publish v0.7.0-alpha.39

* feat: update deps

* chore(versions): 😊 publish v0.7.0-alpha.40

* chore: update devDependencies

* chore(versions): 😊 publish v0.7.0-alpha.41

* fix: postinstall

* chore(versions): 😊 publish v0.7.0-alpha.42

* chore: improve code

* chore(versions): 😊 publish v0.7.0-alpha.43

* chore: execa

* chore(versions): 😊 publish v0.7.0-alpha.44

* chore(cli): allow unknown option

* chore(versions): 😊 publish v0.7.0-alpha.45

* fix: default envs

* chore(versions): 😊 publish v0.7.0-alpha.45

* fix: package argument for build command

* chore(versions): 😊 publish v0.7.0-alpha.46

* fix: improve code

* chore(versions): 😊 publish v0.7.0-alpha.48

* feat: clean & doc

* chore(versions): 😊 publish v0.7.0-alpha.49

* feat: compilation tips

* feat: upgrade command

* chore(versions): 😊 publish v0.7.0-alpha.50

* fix: unexpected token ] in JSON

* chore(versions): 😊 publish v0.7.0-alpha.51

* fix: upgrade command

* chore(versions): 😊 publish v0.7.0-alpha.52

* fix: remove export action from available action

* fix: db sync after upgrade

* chore(versions): 😊 publish v0.7.0-alpha.53

* feat: upgrade log

* chore(versions): 😊 publish v0.7.0-alpha.54

* docs: updates

* feat: updates

* docs(cli): update usage description

* feat: updates

* docs: updates

* docs: updates

* docs: toc

* feat: sdk

* docs: updates

* docs: updates

* docs: updates

* Update index.md

* docs: updates

* Update release-notes.md

* Update roadmap.md

* Update index.md

* Update contributing.md

* Update contributing.md

* Update index.md

* Update index.md

* Update nocobase-cli.md

* Update nocobase-cli.md

* fix: user plugin initialization data

* Update env.md

* Update env.md

* Update directory-structure.md

* Update index.md

* Update action-api.md

* Update filter-operators.md

* docs: update thanks.md

* Update index.md

* Update javascript-sdk.md

* Update rest-api.md

* Update installation.md

* Update installation.md

* Update upgrading.md

* Update upgrading.md

* Update upgrading.md

* Update installation.md

* Update installation.md

* Create release-notes.md

* Update release-notes.md

* feat: updates

* feat: update docs

* feat: update release-notes.md

* feat: switch language

* feat: updates

* Add files via upload

* Add files via upload

* Update important-features.md

* Update thanks.md

* feat: nocobase postinstall

* Update index.md

* Create why-different.md

* Update why-different.md

* Create who-is-for.md

* Rename who-is-for.md to who.md

* feat: update docs

* Rename why-different.md to why.md

* Update why.md

* Update menus.ts

* Update why-nocobase.md

* Create who.md

* Create why.md

* feat: updates

* chore(versions): 😊 publish v0.7.0-alpha.55

* feat: tips

* Update who.md

* Update who.md

* feat: update docs

* feat: update doc menus

* fix: plugin client dist

* docs: update contributing.md

* docs: update readme.md

* docs: update readme.md

* docs: update readme.md

* Update functional-zoning.md

* fix: br

Co-authored-by: Zhou <zhou.working@gmail.com>
2022-05-19 00:40:55 +08:00

2.2 KiB

Blocks

Blocks are views that are used to display and manipulate data. Blocks can be placed in pages and popups. A block consists of three parts.

  1. content area: the body of the block
  2. action area: various action buttons can be placed to manipulate the block data
  3. configuration area: buttons for operating the block configuration

6.block.jpg

Add block

Enter the UI Editor mode and click the Add block button on the page and in the pop-up window to add the block. The options are divided into 4 steps.

  1. Select block type: Currently available block types include Table, Form, Details, Calendar, Kanban, Markdown
  2. Select Collection: All collections will be listed here
  3. Choose the creation method: create a blank block, or duplicate a block template , or reference a block template
  4. Select Template: If you selected Create from Template in step 3, select the template in step 4

6.block-add.jpg

Configure Blocks

The configuration of blocks consists of three elements.

  • Configure block content
  • Configure block actions
  • Configure block properties

Configure block content

Take the table block as an example, the content of the block is the columns to be displayed in the table. Click Configure columns to configure the columns to be displayed.

6.block-content.gif

Configure block actions

Take table block as an example, there are filter, add, delete, view, edit, customize and other actions available. Click the Configure actions button to configure the actions. Each of the action buttons can be configured for their own properties.

6.block-content.gif

Configure block properties

Move the cursor to the upper right corner of the block and you will see the block configuration button. Using the table block as an example, the following properties can be configured.

  • Drag & drop sorting
  • Set the data scope
  • Set default sorting rules
  • Records per page

6.collection-setting.gif

Block Types

Currently NocoBase supports the following types of blocks.

  • Table
  • Form
  • Details
  • Kanban
  • Calendar
  • Related Data
  • Markdown