SemianiakaVY/elsa-core
1
0
Fork 0
Code Issues Pull requests Actions 1 Packages Projects Releases Wiki Activity

Incremental work on workflow structure navigation

Browse source
This commit is contained in:
Sipke Schoorstra 2022-06-18 16:06:38 +02:00
parent 36c589c062
commit d1795ffb9d
3 changed files with 43 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/designer/elsa-workflows-designer/src/components/designer/workflow-definition-editor/activity-properties-editor.tsx
View file

@ -92,13 +92,13 @@ export class ActivityPropertiesEditor {
const {activity, activityDescriptor} = this.renderContext;
const commonTab: TabDefinition = {
displayText: 'Common',
order: 50,
displayText: 'General',
order: 0,
content: () => this.renderCommonTab()
};
const inputTab: TabDefinition = {
displayText: 'Input',
displayText: 'Settings',
order: 10,
content: () => this.renderInputTab()
};

1
src/designer/elsa-workflows-designer/src/components/designer/workflow-definition-editor/workflow-definition-editor.scss
View file

@ -27,6 +27,7 @@ elsa-panel.panel-state-expanded.elsa-activity-editor-container {
elsa-workflow-navigator {
top: 70px;
position: absolute;
z-index: 50;
left: var(--activity-picker-width);
right: var(--activity-editor-width);
}

40
src/designer/elsa-workflows-designer/src/components/designer/workflow-navigator/workflow-navigator.tsx
View file

@ -1,4 +1,5 @@
import {Component, h} from "@stencil/core";
import {FlowchartIcon, IfIcon} from "../../icons/activities";
@Component({
tag: 'elsa-workflow-navigator',
@ -6,6 +7,43 @@ import {Component, h} from "@stencil/core";
})
export class WorkflowNavigator {
render() {
return <div class="text-gray-500">Breadcrumbs</div>
return <div class="ml-8">
<nav class="flex" aria-label="Breadcrumb">
<ol role="list" class="flex items-center space-x-4">
<li>
<div>
<a href="#" class="block flex items-center text-gray-400 hover:text-gray-500">
<div class="bg-blue-500 rounded">
<FlowchartIcon/>
</div>
<span class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700">Workflow 1</span>
</a>
</div>
</li>
<li>
<div class="flex items-center">
<svg class="flex-shrink-0 h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"/>
</svg>
<div class="bg-blue-500 rounded">
<IfIcon/>
</div>
<a href="#" class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700">If 1</a>
</div>
</li>
<li>
<div class="flex items-center">
<svg class="flex-shrink-0 h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"/>
</svg>
<span class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700" aria-current="page">True</span>
</div>
</li>
</ol>
</nav>
</div>
}
}