diff --git a/src/app/core/models/process.model.ts b/src/app/core/models/process.model.ts index ee24a2603..86d9c13f7 100644 --- a/src/app/core/models/process.model.ts +++ b/src/app/core/models/process.model.ts @@ -1,4 +1,5 @@ export class Process { id: number; name: string; + selected: boolean; } diff --git a/src/app/layouts/process-header/process-header.component.ts b/src/app/layouts/process-header/process-header.component.ts index 504e21e5f..007065390 100644 --- a/src/app/layouts/process-header/process-header.component.ts +++ b/src/app/layouts/process-header/process-header.component.ts @@ -15,8 +15,15 @@ export class ProcessHeaderComponent implements OnInit { addProcess() { const process: Process = new Process(); - process.id = this.processes.length; - process.name = '# ' + this.processes.length; + const itemNr = this.processes.length + 1; + process.id = itemNr; + process.name = '# ' + itemNr; + // if this is the first process created set it as active + if (this.processes.length === 0) { + process.selected = true; + } else { + process.selected = false; + } this.processes.push(process); } diff --git a/src/app/layouts/process-tab/process-tab.component.html b/src/app/layouts/process-tab/process-tab.component.html index 5e0984141..3e1a10942 100644 --- a/src/app/layouts/process-tab/process-tab.component.html +++ b/src/app/layouts/process-tab/process-tab.component.html @@ -1,9 +1,9 @@
-
-
- +
+
+
-
{{process.name}}
+
{{process.name}}
diff --git a/src/app/layouts/process-tab/process-tab.component.scss b/src/app/layouts/process-tab/process-tab.component.scss index ce13de5a4..6667bf3f8 100644 --- a/src/app/layouts/process-tab/process-tab.component.scss +++ b/src/app/layouts/process-tab/process-tab.component.scss @@ -20,5 +20,13 @@ .grid-item { display: inline-block; - padding-right: 6px; + padding-right: 10px; +} + +.selected-process { + border-bottom: 2px solid $hima-color-red; +} + +.not-selected-process { + border-bottom: 2px solid white; } \ No newline at end of file diff --git a/src/app/layouts/process-tab/process-tab.component.ts b/src/app/layouts/process-tab/process-tab.component.ts index dddc61678..2f3676f55 100644 --- a/src/app/layouts/process-tab/process-tab.component.ts +++ b/src/app/layouts/process-tab/process-tab.component.ts @@ -17,6 +17,17 @@ export class ProcessTabComponent implements OnInit { this.processes.splice(this.processes.indexOf(process), 1); } + selectProcess(process: Process): void { + this.removeCurrentProcessSelection(); + process.selected = true; + } + + removeCurrentProcessSelection(): void { + this.processes.find(function(process): boolean { + return process.selected === true; + }).selected = false; + } + ngOnInit() { } diff --git a/src/assets/images/cat.svg b/src/assets/images/cat.svg new file mode 100644 index 000000000..dbe7ddbcd --- /dev/null +++ b/src/assets/images/cat.svg @@ -0,0 +1,83 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +