dsm

dnet-app/frontends/is/src/app/app.module.ts

@@ -44,6 +44,7 @@ import { MatStepperModule } from '@angular/material/stepper';
 import { IndexComponent } from './index/index.component';
 import { OaiComponent } from './oai/oai.component';
 import { SwaggerUiComponent } from './swagger/swagger-ui.component';
+import { WfTemplateDialog } from './wf-confs/wf-common.component';
 
 @NgModule({
 	declarations: [
@@ -55,6 +56,7 @@ import { SwaggerUiComponent } from './swagger/swagger-ui.component';
 		ProtocolsComponent,
 		WfHistoryComponent,
 		WfHistoryDialog,
+		WfTemplateDialog,
 		ResourcesComponent,
 		ResContentDialog,
 		ResCreateNewDialog,

dnet-app/frontends/is/src/app/common/is.model.ts

@@ -261,3 +261,14 @@ export interface WfRepoHi {
 	name: string,
 	description?: string
 }
+
+export interface WfTemplate {
+	parameters: any,
+	graph: any
+}
+
+export interface WfTemplateDesc extends WfTemplate {
+	id: string,
+	name: string,
+	description?: string
+}

dnet-app/frontends/is/src/app/dsm/add-wf-dialog.html

@@ -13,6 +13,9 @@
 			<button mat-stroked-button color="primary" mat-dialog-close (click)="startRepoHiWf(wf.id)">
 				<mat-icon fontIcon="build"></mat-icon> generate workflow
 			</button>
+			<button mat-stroked-button (click)="showGraphModal(wf)">
+				<mat-icon fontIcon="polyline"></mat-icon> graph
+			</button>
 		</mat-card-actions>
 	</mat-card>
 </div>

dnet-app/frontends/is/src/app/dsm/dsm.client.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Page, DsmConf, KeyValue, BrowseTerm, SimpleDatasource, WfRepoHi } from '../common/is.model';
+import { Page, DsmConf, KeyValue, BrowseTerm, SimpleDatasource, WfRepoHi, WfTemplate } from '../common/is.model';
 import { ISClient } from '../common/is.client';
 
 @Injectable({
@@ -45,6 +45,10 @@ export class DsmClient extends ISClient {
 		this.httpGet<WfRepoHi>('/proxy/byType/wf_manager/api/repo-his', onSuccess);
 	}
 
+	dsmGetRepoHiTemplate(id: string, onSuccess: Function) {
+		this.httpGet<WfTemplate>('/proxy/byType/wf_manager/api/template/' + encodeURIComponent(id), onSuccess);
+	}
+
 	dsmRepoHiWf(wfId: string, onSuccess: Function) {
 		alert('TODO');
 	}

dnet-app/frontends/is/src/app/dsm/dsm.component.ts

@@ -1,5 +1,5 @@
 import { Component, Inject, Injectable, OnInit, ViewChild } from '@angular/core';
-import { Page, BrowseTerm, SimpleDatasource, KeyValue, DsmConf, ProtocolParam, Api, ApiInsert, WfRepoHi } from '../common/is.model';
+import { Page, BrowseTerm, SimpleDatasource, KeyValue, DsmConf, ProtocolParam, Api, ApiInsert, WfRepoHi, WfTemplate } from '../common/is.model';
 import { ActivatedRoute, Params } from '@angular/router';
 import { MatDialog, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { MatTableDataSource } from '@angular/material/table';
@@ -10,6 +10,7 @@ import { PageEvent } from '@angular/material/paginator';
 import { FormBuilder, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';
 import { MatSelectChange } from '@angular/material/select';
 import { DsmClient } from './dsm.client';
+import { WfTemplateDialog } from '../wf-confs/wf-common.component';
 
 @Component({
 	selector: 'app-dsm-search',
@@ -163,7 +164,7 @@ export class DsmApiComponent implements OnInit {
 					'api': this.api,
 					'repohis': data
 				},
-				width: '80%'
+				width: '60%'
 			});
 
 			dialogRef.afterClosed().subscribe(result => {
@@ -346,7 +347,7 @@ export class DsmAddWorkflowDialog {
 	ds: any = {};
 	repohis: WfRepoHi[] = [];
 
-	constructor(public dialogRef: MatDialogRef<DsmAddWorkflowDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public client: DsmClient) {
+	constructor(public dialogRef: MatDialogRef<DsmAddWorkflowDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public client: DsmClient, public dialog: MatDialog) {
 		this.api = data.api;
 		this.ds = data.ds;
 		this.repohis = data.repohis;
@@ -356,6 +357,21 @@ export class DsmAddWorkflowDialog {
 		alert('TODO REPO HI');
 	}
 
+	showGraphModal(wf: WfRepoHi): void {
+		this.client.dsmGetRepoHiTemplate(wf.id, (tmpl: WfTemplate) => {
+			const dialogRef = this.dialog.open(WfTemplateDialog, {
+				data: {
+					id: wf.id,
+					name: wf.name,
+					description: wf.description,
+					graph: tmpl.graph,
+					parameters: tmpl.parameters
+				},
+				width: '80%'
+			});
+		});
+	}
+
 	onNoClick(): void {
 		this.dialogRef.close();
 	}

dnet-app/frontends/is/src/app/wf-confs/wf-common.component.ts

@@ -0,0 +1,39 @@
+import { JsonPipe } from '@angular/common';
+import { Component, Inject, Input, OnChanges, OnInit, SecurityContext, SimpleChanges } from '@angular/core';
+import { FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatSelectChange } from '@angular/material/select';
+import { MatSnackBar } from '@angular/material/snack-bar';
+import { ActivatedRoute, Router } from '@angular/router';
+import { KeyValue, SimpleResource, WfConf, WfHistoryEntry, WfParam, WfProcessStatus, WfSection, WfTemplateDesc } from '../common/is.model';
+import { ResMetadataDialog } from '../resources/resources.component';
+import { MatTableDataSource } from '@angular/material/table';
+import { WfHistoryDialog } from '../wf-history/wf-history.component';
+import { WfConfsClient } from './wf-confs.client';
+
+
+@Component({
+	selector: 'wf-template-dialog',
+	templateUrl: 'wf-template-dialog.html',
+	styleUrls: []
+})
+export class WfTemplateDialog {
+
+	template: WfTemplateDesc;
+
+	constructor(public dialogRef: MatDialogRef<WfTemplateDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public client: WfConfsClient) {
+		this.template = data;
+	}
+
+	startRepoHiWf(wfId: string): void {
+		alert('TODO REPO HI');
+	}
+
+	showGraphModal(wfId: string): void {
+		alert('TODO REPO HI');
+	}
+
+	onNoClick(): void {
+		this.dialogRef.close();
+	}
+}

dnet-app/frontends/is/src/app/wf-confs/wf-template-dialog.html

@@ -0,0 +1,9 @@
+<h1 mat-dialog-title>Workflow Template: Graph</h1>
+
+<div mat-dialog-content>
+	{{template | json}}
+</div>
+
+<div mat-dialog-actions>
+	<button mat-stroked-button color="primary" mat-dialog-close>Close</button>
+</div>