You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The editor should be able to configure custom menus, much like x-view-url.
Setting x-menu on a collection should add a set of buttons above the upper-right of the items list table (where the "Add Item" button is now). x-menu should be an array with items matching the following:
{ title: 'Text', url: '...' } - Create a button that goes to the given URL
{ title: 'Text', script: '...' } - Create a button that executes the given JS. The JS context (this) will have an items property corresponding to the items currently shown in the table.
{ title: 'Text', items: [ ... ] } - Create a button with a dropdown menu that can contain the above items. Dropdown menus cannot contain other dropdown menus.
Setting x-menu-item on a collection will add a drop-down menu to each item row. In this case, the script will be given a context of the item itself (so this.id would be the ID of the row whose menu was clicked). Editing the context object edits the item in the table. The context also has delete() and save() methods. The delete() method will prompt the user for confirmation. The save() method takes an optional single argument, an object of fields to update before saving. Item menus cannot contain dropdown menus.
In the future we can add good documentation for the Vue components and other objects and refactor them so that the script enhancements are easier to write. If we ever add a checkbox to the item rows, we can give the selected items to the script as this.selectedItems.
We should document a few ways to make useful enhancements to the editor, including how to add a custom JS file to the editor (which should be as easy as possible) and call a function inside. There should be useful one-liners as well.
Discussion questions:
Should we turn x-item-menu into a series of buttons in the item row, like x-menu?
Should we allow x-menu on item properties, adding a gear icon to the right of the value in the column
The use-case here is a "status" column that has a drop-down menu for quickly changing between different statuses
The text was updated successfully, but these errors were encountered:
The editor should be able to configure custom menus, much like
x-view-url
.Setting
x-menu
on a collection should add a set of buttons above the upper-right of the items list table (where the "Add Item" button is now).x-menu
should be an array with items matching the following:{ title: 'Text', url: '...' }
- Create a button that goes to the given URL{ title: 'Text', script: '...' }
- Create a button that executes the given JS. The JS context (this
) will have anitems
property corresponding to the items currently shown in the table.{ title: 'Text', items: [ ... ] }
- Create a button with a dropdown menu that can contain the above items. Dropdown menus cannot contain other dropdown menus.Setting
x-menu-item
on a collection will add a drop-down menu to each item row. In this case, thescript
will be given a context of the item itself (sothis.id
would be the ID of the row whose menu was clicked). Editing the context object edits the item in the table. The context also hasdelete()
andsave()
methods. Thedelete()
method will prompt the user for confirmation. Thesave()
method takes an optional single argument, an object of fields to update before saving. Item menus cannot contain dropdown menus.In the future we can add good documentation for the Vue components and other objects and refactor them so that the script enhancements are easier to write. If we ever add a checkbox to the item rows, we can give the selected items to the script as
this.selectedItems
.We should document a few ways to make useful enhancements to the editor, including how to add a custom JS file to the editor (which should be as easy as possible) and call a function inside. There should be useful one-liners as well.
Discussion questions:
x-item-menu
into a series of buttons in the item row, likex-menu
?x-menu
on item properties, adding a gear icon to the right of the value in the columnThe text was updated successfully, but these errors were encountered: