diff --git a/Testgenerator/src/main/java/de/fhmuenster/masterthesis/Testgenerator/rest/service/change/ChangeController.java b/Testgenerator/src/main/java/de/fhmuenster/masterthesis/Testgenerator/rest/service/change/ChangeController.java
index aa64b46679e57e5b5ab8323af9901e1185e6085b..3aad7bde20e7a0f196eec8d9804efdd934b83d7d 100644
--- a/Testgenerator/src/main/java/de/fhmuenster/masterthesis/Testgenerator/rest/service/change/ChangeController.java
+++ b/Testgenerator/src/main/java/de/fhmuenster/masterthesis/Testgenerator/rest/service/change/ChangeController.java
@@ -244,14 +244,6 @@ public class ChangeController {
//
// }
//
-
-
- /*
- * Till Ende: Ab hier einmal durchgehen, Flo. Auch bei detectChanges, addActivity, delete usw.
- * in migrationService gucken. Habe noch nicht den Array matchingFlows als Ãœbergabeparameter an deine
- * Methoden weitergegeben. Also matchingFlows[x][0] sind Flow neu, und matchingFlows[x][1] der
- * dazugehörige Flow alt
- */
//Alte DSL kopieren und neu generieren
diff --git a/testgenerator-web/testgenerator-web/angular.json b/testgenerator-web/testgenerator-web/angular.json
index 3162a3df861f0bfd0a7adb7b13dffb7838c7989a..e0bd96f0870aae3f6c301eaa0889e84bfe87489a 100644
--- a/testgenerator-web/testgenerator-web/angular.json
+++ b/testgenerator-web/testgenerator-web/angular.json
@@ -36,6 +36,7 @@
"src/assets"
],
"styles": [
+ "./node_modules/@angular/material/prebuilt-themes/pink-bluegrey.css",
"node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss",
"node_modules/@fortawesome/fontawesome-free/scss/solid.scss",
"node_modules/@fortawesome/fontawesome-free/scss/regular.scss",
@@ -116,6 +117,7 @@
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": [
+ "./node_modules/@angular/material/prebuilt-themes/pink-bluegrey.css",
"src/styles.css"
],
"scripts": [],
diff --git a/testgenerator-web/testgenerator-web/package-lock.json b/testgenerator-web/testgenerator-web/package-lock.json
index 2d7bdb50b228b33b6bf0d1c81538b5b92b4d20a0..6b5d40604730b27972c3c1f64226cb56da8177d8 100644
--- a/testgenerator-web/testgenerator-web/package-lock.json
+++ b/testgenerator-web/testgenerator-web/package-lock.json
@@ -780,6 +780,11 @@
}
}
},
+ "@angular/material": {
+ "version": "9.2.4",
+ "resolved": "https://registry.npmjs.org/@angular/material/-/material-9.2.4.tgz",
+ "integrity": "sha512-LkoTXE6B0slvMhvfZDdPWaz4yaYLkaAp5VSPunI9pxGsPxzqEV9e210wC1/sjG/76Nk8Ep7/2z9XKac8Q9bMwA=="
+ },
"@angular/platform-browser": {
"version": "9.1.12",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-9.1.12.tgz",
diff --git a/testgenerator-web/testgenerator-web/package.json b/testgenerator-web/testgenerator-web/package.json
index 28ab8e984965b9fd6a091a26d12abf8583dfbf40..b92f20a8817dd4d24bf52dad0dad956e2e260a25 100644
--- a/testgenerator-web/testgenerator-web/package.json
+++ b/testgenerator-web/testgenerator-web/package.json
@@ -20,6 +20,7 @@
"@angular/core": "^9.1.12",
"@angular/forms": "^9.1.12",
"@angular/localize": "^9.1.12",
+ "@angular/material": "^9.2.4",
"@angular/platform-browser": "^9.1.12",
"@angular/platform-browser-dynamic": "^9.1.12",
"@angular/router": "^9.1.12",
diff --git a/testgenerator-web/testgenerator-web/src/app/app.module.ts b/testgenerator-web/testgenerator-web/src/app/app.module.ts
index 7f4dd82f6dce3521426e80f0aa429eb6f781a27b..ff4f2803a2e7d547918db3b6927b7af64434c5a5 100644
--- a/testgenerator-web/testgenerator-web/src/app/app.module.ts
+++ b/testgenerator-web/testgenerator-web/src/app/app.module.ts
@@ -36,6 +36,9 @@ import { MatchingFlowsComponent } from './components/matching-flows/matching-flo
import { DragDropModule } from '@angular/cdk/drag-drop';
import { FlagComponent } from './components/flag/flag.component';
import { VariableConstraintsPipe } from './pipes/variable-constraints.pipe';
+import {CdkAccordionModule} from '@angular/cdk/accordion';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {MatExpansionModule} from '@angular/material/expansion';
@NgModule({
declarations: [
@@ -66,7 +69,6 @@ import { VariableConstraintsPipe } from './pipes/variable-constraints.pipe';
MigrationOverviewComponent,
PrioritizationOverviewComponent,
MatchingFlowsComponent,
-
FlagComponent,
VariableConstraintsPipe
@@ -75,7 +77,9 @@ import { VariableConstraintsPipe } from './pipes/variable-constraints.pipe';
BrowserModule,
AppRoutingModule,
HttpClientModule,
-
+ CdkAccordionModule,
+ MatExpansionModule,
+ BrowserAnimationsModule,
FormsModule,
ReactiveFormsModule,
DragDropModule,
diff --git a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.css b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.css
index dc74bc242de22280691f4c648b8ade3a69b4a2f8..0199c026addef2e83582a50a532e1446729ec4ac 100644
--- a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.css
+++ b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.css
@@ -60,4 +60,38 @@
border: dotted 3px rgb(230, 230, 230);
min-height: 60px;
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
- }
\ No newline at end of file
+ }
+
+
+
+ .example-accordion-item-header {
+ display: flex;
+ align-content: center;
+ justify-content: space-between;
+ }
+
+ .example-accordion-item-description {
+ font-size: 0.85em;
+ color: #999;
+ }
+
+ .example-accordion-item-header,
+ .example-accordion-item-body {
+ padding: 16px;
+ }
+
+ .example-accordion-item-header:hover {
+ cursor: pointer;
+ background-color: #eee;
+ }
+
+ .example-accordion-item:first-child {
+ border-top-left-radius: 4px;
+ border-top-right-radius: 4px;
+ }
+
+ .example-accordion-item:last-child {
+ border-bottom-left-radius: 4px;
+ border-bottom-right-radius: 4px;
+ }
+
\ No newline at end of file
diff --git a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.html b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.html
index 0f279eaaeff97bfac50c9bca4b337a5f8087a34a..b9c24919b3f254651b82f7b8954c8f6fbdb60eed 100644
--- a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.html
+++ b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.html
@@ -7,38 +7,86 @@
<div class="col">
<p class="title" *ngIf="!isProjectLoading && actualProjectConfig" i18n="project header">Project "{{actualProjectConfig.projectName}}"</p>
</div>
- <div class="col">
- <div class="row ms-auto float-end">
- <div class="custom-control custom-switch">
- <input checked type="checkbox" class="custom-control-input" id="customSwitches" (change)="onFlowVisibility()">
- <label class="custom-control-label" for="customSwitches" i18n="hide flows">Hide flows</label>
- </div>
- </div>
- </div>
+
</div>
<div class="btn-group w-100">
<button class="btn btn-primary" type="button" (click)="startMigration()" i18n="migrate bpmn" >Start migration of matching flows</button>
<button class="btn btn-secondary" type="button" (click)="revertMatchingFlows()" i18n="revert matching flows">revert selected matching flows</button>
</div>
-
- <div class="row">
+
+ <!-- Accordions -->
+ <div class="row">
+ <div class="col">
+ <span class="badge bg-success diagramTitle">New BPMN Flows</span>
+
+ <mat-accordion multi>
+ <mat-expansion-panel *ngFor="let flow of flowSetNew.flows" >
+ <mat-expansion-panel-header>
+ <mat-panel-titel>
+
+ </mat-panel-titel>
+ <mat-panel-description>
+ {{flow.name}}
+ </mat-panel-description>
+ </mat-expansion-panel-header>
+ <app-bpmn-diagram *ngIf="diagramsLoaded" [diagram]="diagram" [flow]="flow"></app-bpmn-diagram>
+ </mat-expansion-panel>
+
+ </mat-accordion>
+ </div>
+
+ <div class="col">
+ <span class="badge bg-warning diagramTitle">Old BPMN Flows</span>
+
+<mat-accordion multi cdkDropList [cdkDropListData]="flowSetOld" *ngIf="flowSetOld" (cdkDropListDropped)="drop($event)">
+<mat-expansion-panel cdkDrag *ngFor="let flow of flowSetOld" class="drag-box">
+<mat-expansion-panel-header>
+ <mat-panel-titel>
+
+ </mat-panel-titel>
+ <mat-panel-description *ngIf="flow?.name; else flowEmptyTitel">
+ {{flow.name}}
+ </mat-panel-description>
+ <ng-template #flowEmptyTitel>
+ no matching flow old
+ </ng-template>
+
+</mat-expansion-panel-header>
+
+<div *ngIf="flow?.name; else flowEmptyBody">
+ <div class="example-custom-placeholder" *cdkDragPlaceholder></div>
+ <app-bpmn-diagram *ngIf="diagramsLoaded" [diagram]="diagramOld" [flow]="flow"></app-bpmn-diagram>
+</div>
+<ng-template #flowEmptyBody>
+ <div>
+ <div class="example-custom-placeholder" *cdkDragPlaceholder></div>
+ </div>
+</ng-template>
+</mat-expansion-panel>
+
+</mat-accordion>
+ </div>
+ </div>
+
+
+ <!--<div class="row">
<div class="col">
<span class="badge bg-success diagramTitle">New BPMN Flows</span>
<div *ngIf="flowSetNew.flows">
<div *ngFor="let flow of flowSetNew.flows; let i=index">
<div class="testgen-flow">
- <h4 class="testgen-flow-name" i18n="flow name">{{flow.name}}</h4>
+ <h4 class="testgen-flow-name" i18n="flow name">{{flow.name}}</h4> -->
<!-- <p *ngIf="detailFlowVisible" class="testgen-flow-flowlist">{{flow | flow}}</p> -->
- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagram" [flow]="flow"></app-bpmn-diagram>
+ <!-- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagram" [flow]="flow"></app-bpmn-diagram>
</div>
</div>
</div>
-</div>
+</div> -->
-<div class="col">
+<!-- <div class="col">
<span class="badge bg-warning diagramTitle">Old BPMN Flows</span>
<div cdkDropList [cdkDropListData]="flowSetOld" *ngIf="flowSetOld" (cdkDropListDropped)="drop($event)">
@@ -47,25 +95,25 @@
<div class="testgen-flow" *ngIf="flow?.name; else flowEmpty">
<div class="example-custom-placeholder" *cdkDragPlaceholder></div>
- <h4 class="testgen-flow-name" i18n="flow name">{{flow.name}}</h4>
+ <h4 class="testgen-flow-name" i18n="flow name">{{flow.name}}</h4> -->
<!-- <p *ngIf="detailFlowVisible" class="testgen-flow-flowlist">{{flow | flow}}</p> -->
- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagramOld" [flow]="flow"></app-bpmn-diagram>
+ <!-- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagramOld" [flow]="flow"></app-bpmn-diagram>
</div>
<ng-template #flowEmpty>
<div class="testgen-flow">
<div class="example-custom-placeholder" *cdkDragPlaceholder></div>
- <h4 class="testgen-flow-name" i18n="flow name">no matching flow old</h4>
+ <h4 class="testgen-flow-name" i18n="flow name">no matching flow old</h4> -->
<!-- <p *ngIf="detailFlowVisible" class="testgen-flow-flowlist">{{flow | flow}}</p> -->
- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagram"></app-bpmn-diagram>
+ <!-- <app-bpmn-diagram *ngIf="detailFlowVisible && diagramsLoaded" [diagram]="diagram"></app-bpmn-diagram>
</div>
</ng-template>
</div>
</div>
-</div>
+</div> -->
-
-</div>
+ <!-- </div> -->
</div>
+<!-- </div> -->
<app-loading *ngIf="isProjectLoading || isMatchingLoading || !actualProjectConfig || !flowSetNew || !flowSetOld"></app-loading>
\ No newline at end of file
diff --git a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.ts b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.ts
index a2a99a586c564bf932024f99ceb5647500270574..f44ada5ec94c3d7254fe70a345a6bc6e5d648132 100644
--- a/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.ts
+++ b/testgenerator-web/testgenerator-web/src/app/components/matching-flows/matching-flows.component.ts
@@ -73,11 +73,6 @@ export class MatchingFlowsComponent implements OnInit {
moveItemInArray(this.flowSetOld, event.previousIndex, event.currentIndex);
}
-
- async onFlowVisibility() {
- this.detailFlowVisible = !this.detailFlowVisible;
- }
-
revertMatchingFlows(){
this.flowSetOld = [...this.flowSetOldCopy];
}
diff --git a/testgenerator-web/testgenerator-web/src/index.html b/testgenerator-web/testgenerator-web/src/index.html
index cd2e4209f7f524936ac6934c3522b4bd175c5a0a..84e7ee33130816723f3135c90eac338e7fa45e1b 100644
--- a/testgenerator-web/testgenerator-web/src/index.html
+++ b/testgenerator-web/testgenerator-web/src/index.html
@@ -8,6 +8,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
+ <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<style>
.testgen-highlight:not(.djs-connection) .djs-visual> :nth-child(1) {
diff --git a/testgenerator-web/testgenerator-web/src/styles.css b/testgenerator-web/testgenerator-web/src/styles.css
index fff4ef173a517e892ebf84fcb3c9d32faf9770dc..1dfa561d3bcca4bf511c1f54a6115c60a2c4160e 100644
--- a/testgenerator-web/testgenerator-web/src/styles.css
+++ b/testgenerator-web/testgenerator-web/src/styles.css
@@ -38,4 +38,6 @@ footer {
.nav-link {
font-weight: bold;
font-size: 16px;
-}
\ No newline at end of file
+}
+html, body { height: 100%; }
+body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }