Introduction #

CRUD action buttons are used to batch-execute operations in tables, such as batch status updates, opening dialogs, or executing custom logic. Three modes are supported: single function dataset (default batch update of status field), function dataset mapping (custom SQL execution), and row button mode (trigger action on specific row click).

Use Cases #

• Select data rows and execute batch actions, such as batch status modification, opening new function items
• Custom function buttons on the side of the table

Single Function Dataset Mode #

Configuration #

• Configure button display name and color in the “Add/Edit” panel’s “Batch Actions”:

{"complete": ["Button Name", "black"], ...}

• After user selects rows, two parameters are automatically submitted:

action: e.g., "complete"
updatelist: String of selected row primary keys, as defined in read-only fields, e.g., 'key1','key2' (single quotes included)

Default Execution #

• When no function dataset is configured, automatically updates the table’s status field to the action parameter value
• If the status field is not status, add "status": "field_name" to the dataset config

Direct SQL Execution #

• For custom execution, create a lazy-load dataset, e.g., #6:

update action_log set status='$action' where id in ({$updatelist})

• Configure the batch action’s ds as 6 in “Data Management” to batch update status
• Execute different statements based on action value:

/* update action_log1 set status='$action' where id in ({$updatelist})  -- $action__action1 */
/* update action_log2 set status='$action' where id in ({$updatelist})  -- $action__action2 */

Custom Functionality with Python #

action='$action'
updatelist="$updatelist"
sql=''
if action=='arrive':
    sql=f"update action_log set remark='Arrived' where code in ({updatelist})"

if sql:
    ds=ds_sql('local', sql)
    ds={"status": 200, "msg": ds}
else:
    ds={"status": 400, "msg": "Invalid parameter"}

Function Dataset Mapping Mode #

• Configure function ds mapping in the “Data Management” panel:

el-icon-goods:5, inventory:3, el-icon-food:6!

• Clicking the button passes action and updatelist to the dataset
• Adding ! opens a popup window showing the dataset’s graphic output:

let dataset = __dataset__
let series = []
for (let i = 1; i < dataset.length; i++) {
    series.push({ name: dataset[i][0], value: dataset[i][1] })
}
setTimeout(function() {
    ds_chart({
        series: [{
            name: dataset[0][1],
            type: 'pie',
            itemStyle: { borderRadius: 6 },
            data: series
        }]
    })
}, 100)

Note: Replace option with the ds_chart() function.

Vue components also work:

let dataset = __dataset__
let table = `<div id="v__name__" style="height:100%">
<el-table :data="ds_createMap_all(ds)">
<el-table-column v-for="item of ds[0]" :label="item" :property="item"></el-table-column>
</el-table></div>`
setTimeout(function() {
    ds_chart(table)
    ds_vue('#v__name__', dataset)
}, 100)

Row Button Mode #

• Configure “View ds mapping” in “Data Management”:

el-icon-goods:5, inventory:3, el-icon-food:6! action:7!!

• On click, the entire row data is passed to the dataset as parameters
• Without !: auto-displays cards, tables, or graphics based on dataset data
• With one !: see “Function Dataset Mapping Mode” above
• With two !: executes dataset only, no popup