• • Override the list of action buttons at the bottom of the Business Flow detail page. * *

Applicable scenarios

Available on * * mobile * *.

Description

Allows you to modify the name, order, or hidden state of the buttons before they are rendered at the bottom of the detail page.

# Example of a typical scenario

• • • Scenario 1 * *: Hide specific buttons based on task type
      Example: Approval type task hides "Not processed" button
• • • Scenario 2 * *: modifying the button copy to make it more business-like
      Example: Change the "Done" button to "Confirm Receipt"
• • • Scene 3 * *: Adjust button order
      Example: Put the "Agree" button before the "Dismiss" button

Applicable Scenario

• Need to dynamically control the display behavior of the bottom button
• Button order or copy needs to be adjusted based on business status
• Need to hide buttons that should not be displayed under certain conditions

# Applicable Pages

• Business Flow Details Page

# Development Ideas

Enhancements can often be broken down into three steps:

1. • • Identify which link to enhance * *

• Determine if you want to modify the button copy, adjust the button order, or control the button to be invisible

2. • • Select the appropriate extension event/hook * *

• Mobile: flow.bpm.detail.parse.bottom.btn.render.before

3. • • Access the extension point in the plugin and verify the behavior * *

• Get current bottom button list bottomBtn and task data taskDetail
• Modify button properties or filter unwanted buttons based on business needs

DEVELOPMENT WORKFLOW

1. • • Analyze button requirements * *

• Identify buttons that need to be modified, hidden or reordered
• Identify button triggers and business rules

2. • • Select an event * *

• Mobile: flow.bpm.detail.parse.bottom.btn.render.before

3. • • Write button logic * *

   module.exports = function (context, pluginService, pluginParam) {
       return {
           apply() {
               return [{
                   event: "flow.bpm.detail.parse.bottom.btn.render.before",
                   functional: async function (context, options) {
                       let bottomBtn = options && options.bottomBtn;
                       let taskDetail = options && options.taskDetail;
                       if (taskDetail.taskType === 'approval') {
                           bottomBtn = bottomBtn.filter(btn => btn.action !== 'suspend');
                       }
                       return Promise.resolve({
                           bottomBtn: bottomBtn
                       });
                   }
               }];
           }
       };
   };

4. • • Configure Plugins * *

• Associate plugins in process advanced configurations

# Recommended entrance

• flow.bpm.detail.parse.bottom.btn.render.before

Caution

1. • • Keep the data structure intact * *: The modified button array must keep the original data structure
2. • • Consider permission factors * *: The final appearance of the button may also be affected by permissions and task status
3. • • Avoid concealment by mistake * *: Ensure that the concealment button does not prevent the business process from continuing