Fusion 360 Manage - Adding colour to a workspace field

March 22, 2022 By Martin Lee

Fusion 360 Manage is the perfect tool to track and report on business processes. Workspace lists provide a snapshot of current active items; however, the information can feel flat as field colour is not provided by default.

Adding colour to specific fields helps to highlight key information and provides a better user experience.

Colours can be static or dynamic dependent on a value change, these do however make the field non editable. Either type is achieved using the computed field section present in a Single Line text field.

The enclosed example sets the colour and a text value. The CASE statement provides the different text and colour options.

CASE

WHEN(ENQUIRY_PERCENTAGE_COMPLETE = '20%') THEN '<div

style="width:150px;background:red;color:black;border:1px solid red;border-radius:4px;text-align:center;font-size:15px;">20%</div>'

WHEN(ENQUIRY_PERCENTAGE_COMPLETE = '40%') THEN '<div style="width:150px;background:yellow;color:black;border:1px solid red;border-radius:4px;text-align:center;font-size:15px;">40%</div>'

WHEN(ENQUIRY_PERCENTAGE_COMPLETE = '60%') THEN '<div style="width:150px;background:orange;color:black;border:1px solid red;border-radius:4px;text-align:center;font-size:15px;">60%</div>'

WHEN(ENQUIRY_PERCENTAGE_COMPLETE = '80%') THEN '<div style="width:150px;background:blue;color:white;border:1px solid red;border-radius:4px;text-align:center;font-size:15px;">80%</div>'

WHEN(ENQUIRY_PERCENTAGE_COMPLETE = '100%') THEN '<div style="width:150px;background:green;color:white;border:1px solid red;border-radius:4px;text-align:center;font-size:15px;">100%</div>'

END

The field ‘ENQUIRY_PERCENTAGE_COMPLETE’ is a single line text field that is updated with the percentage value when a workflow state change happens.

switch(customTransID){

case 'NEW_ENQUIRY':

item.ENQUIRY_PERCENTAGE_COMPLETE = '20%';

break;

case 'REJECTED_2':

item.ENQUIRY_PERCENTAGE_COMPLETE = '20%';

break;

case 'SUBMIT_FOR_REVIEW':

item.ENQUIRY_PERCENTAGE_COMPLETE = '40%';

break;

}

Using the above technique to enhance a workspace visually will greatly enhance the user experience.