AAE-35981 Form button customization (#11047)

This commit is contained in:
Fabian Kindgen
2025-07-24 09:37:35 +02:00
committed by GitHub
parent 06a9ddc068
commit d7ec3a1b77
18 changed files with 516 additions and 56 deletions

View File

@@ -27,12 +27,28 @@ import { isOutcomeButtonVisible } from './helpers/buttons-visibility';
export abstract class FormBaseComponent {
protected _form: FormModel;
static SAVE_OUTCOME_ID: string = '$save';
static COMPLETE_OUTCOME_ID: string = '$complete';
static START_PROCESS_OUTCOME_ID: string = '$startProcess';
static CUSTOM_OUTCOME_ID: string = '$custom';
static COMPLETE_BUTTON_COLOR: ThemePalette = 'primary';
static COMPLETE_OUTCOME_NAME: string = 'COMPLETE';
/**
* @deprecated Use {@link FormModel.SAVE_OUTCOME} instead.
*/
static readonly SAVE_OUTCOME_ID: string = FormModel.SAVE_OUTCOME;
/**
* @deprecated Use {@link FormModel.COMPLETE_OUTCOME} instead.
*/
static readonly COMPLETE_OUTCOME_ID: string = FormModel.COMPLETE_OUTCOME;
/**
* @deprecated Use {@link FormModel.START_PROCESS_OUTCOME} instead.
*/
static readonly START_PROCESS_OUTCOME_ID: string = FormModel.START_PROCESS_OUTCOME;
static readonly CUSTOM_OUTCOME_ID: string = '$custom';
static readonly COMPLETE_BUTTON_COLOR: ThemePalette = 'primary';
/**
* @deprecated Use {@link FormOutcomeModel.COMPLETE_ACTION} instead.
*/
static readonly COMPLETE_OUTCOME_NAME: string = FormOutcomeModel.COMPLETE_ACTION;
/** Path of the folder where the metadata will be stored. */
@Input()
@@ -50,7 +66,7 @@ export abstract class FormBaseComponent {
@Input()
showCompleteButton: boolean = true;
/** If true then the `Complete` outcome button is shown but it will be disabled. */
/** If true then the `Complete` outcome button is shown, but it will be disabled. */
@Input()
disableCompleteButton: boolean = false;
@@ -138,7 +154,7 @@ export abstract class FormBaseComponent {
}
getColorForOutcome(outcomeName: string): ThemePalette {
return outcomeName === FormBaseComponent.COMPLETE_OUTCOME_NAME ? FormBaseComponent.COMPLETE_BUTTON_COLOR : null;
return outcomeName === FormOutcomeModel.COMPLETE_ACTION ? FormBaseComponent.COMPLETE_BUTTON_COLOR : null;
}
isOutcomeButtonEnabled(outcome?: FormOutcomeModel): boolean {
@@ -182,20 +198,20 @@ export abstract class FormBaseComponent {
}
if (outcome.isSystem) {
if (outcome.id === FormBaseComponent.SAVE_OUTCOME_ID) {
if (outcome.id === FormModel.SAVE_OUTCOME) {
this.disableSaveButton = true;
this.saveTaskForm();
return true;
}
if (outcome.id === FormBaseComponent.COMPLETE_OUTCOME_ID) {
if (outcome.id === FormModel.COMPLETE_OUTCOME) {
this.disableSaveButton = true;
this.disableCompleteButton = true;
this.completeTaskForm();
return true;
}
if (outcome.id === FormBaseComponent.START_PROCESS_OUTCOME_ID) {
if (outcome.id === FormModel.START_PROCESS_OUTCOME) {
this.completeTaskForm();
return true;
}

View File

@@ -21,9 +21,9 @@ import { FormWidgetModel } from './form-widget.model';
import { WidgetVisibilityModel } from '../../../models/widget-visibility.model';
export class FormOutcomeModel extends FormWidgetModel {
static SAVE_ACTION: string = 'SAVE'; // Activiti 'Save' action name
static COMPLETE_ACTION: string = 'COMPLETE'; // Activiti 'Complete' action name
static START_PROCESS_ACTION: string = 'START PROCESS'; // Activiti 'Start Process' action name
static readonly SAVE_ACTION: string = 'SAVE'; // Activiti 'Save' action name
static readonly COMPLETE_ACTION: string = 'COMPLETE'; // Activiti 'Complete' action name
static readonly START_PROCESS_ACTION: string = 'START PROCESS'; // Activiti 'Start Process' action name
isSystem: boolean = false;
isSelected: boolean = false;

View File

@@ -62,10 +62,10 @@ export interface FormRepresentationModel {
theme?: ThemeModel;
}
export class FormModel implements ProcessFormModel {
static UNSET_TASK_NAME: string = 'Nameless task';
static SAVE_OUTCOME: string = '$save';
static COMPLETE_OUTCOME: string = '$complete';
static START_PROCESS_OUTCOME: string = '$startProcess';
static readonly UNSET_TASK_NAME: string = 'Nameless task';
static readonly SAVE_OUTCOME: string = '$save';
static readonly COMPLETE_OUTCOME: string = '$complete';
static readonly START_PROCESS_OUTCOME: string = '$startProcess';
readonly id: string | number;
readonly name: string;
@@ -410,27 +410,28 @@ export class FormModel implements ProcessFormModel {
}
protected parseOutcomes() {
if (this.json.fields) {
const saveOutcome = new FormOutcomeModel(this, {
id: FormModel.SAVE_OUTCOME,
name: 'SAVE',
isSystem: true
});
const completeOutcome = new FormOutcomeModel(this, {
id: FormModel.COMPLETE_OUTCOME,
name: 'COMPLETE',
isSystem: true
});
const startProcessOutcome = new FormOutcomeModel(this, {
id: FormModel.START_PROCESS_OUTCOME,
name: 'START PROCESS',
isSystem: true
});
if (!this.json.fields) return;
const customOutcomes = (this.json.outcomes || []).map((obj) => new FormOutcomeModel(this, obj));
const saveOutcome = new FormOutcomeModel(this, {
id: FormModel.SAVE_OUTCOME,
name: FormOutcomeModel.SAVE_ACTION,
isSystem: true
});
this.outcomes = [saveOutcome].concat(customOutcomes.length > 0 ? customOutcomes : [completeOutcome, startProcessOutcome]);
}
const completeOutcome = new FormOutcomeModel(this, {
id: FormModel.COMPLETE_OUTCOME,
name: FormOutcomeModel.COMPLETE_ACTION,
isSystem: true
});
const startProcessOutcome = new FormOutcomeModel(this, {
id: FormModel.START_PROCESS_OUTCOME,
name: FormOutcomeModel.START_PROCESS_ACTION,
isSystem: true
});
const customOutcomes = (this.json.outcomes ?? ([] as FormModel[])).map((formModel: FormModel) => new FormOutcomeModel(this, formModel));
this.outcomes = [saveOutcome].concat(customOutcomes.length > 0 ? customOutcomes : [completeOutcome, startProcessOutcome]);
}
addValuesNotPresent(valuesToSetIfNotPresent: FormValues) {

View File

@@ -81,7 +81,7 @@ export class FormService implements FormValidationService {
if (!json.fields) {
form.outcomes = [
new FormOutcomeModel(form, {
id: '$save',
id: FormModel.SAVE_OUTCOME,
name: FormOutcomeModel.SAVE_ACTION,
isSystem: true
})