From 601a46a7831131f165fda088c411f5e2a20e77b0 Mon Sep 17 00:00:00 2001 From: Janus-W <2373025856w@gmail.com> Date: Tue, 27 Aug 2024 12:34:38 -0700 Subject: [PATCH 1/8] json --- .../report-generation.service.ts | 215 +++++++++--------- 1 file changed, 110 insertions(+), 105 deletions(-) diff --git a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts index 8331ab288ed..941a038df42 100644 --- a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts +++ b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts @@ -13,7 +13,8 @@ export class ReportGenerationService { public workflowActionService: WorkflowActionService, private workflowResultService: WorkflowResultService, private notificationService: NotificationService - ) {} + ) { + } /** * Captures a snapshot of the workflow editor and returns it as a base64-encoded PNG image URL. @@ -119,128 +120,125 @@ export class ReportGenerationService { const resultService = this.workflowResultService.getResultService(operatorId); const paginatedResultService = this.workflowResultService.getPaginatedResultService(operatorId); - // Generate the HTML content for operator details, which will be included in the report - const operatorDetailsHtml = `
-

Operator Details

-
- -
`; + const workflowContent = this.workflowActionService.getWorkflowContent(); + const operatorDetails = workflowContent.operators.find(op => op.operatorID === operatorId); + + const operatorDetailsHtml = ` +
+

Operator Details

+
+ +
+ `; - // Check if the paginated result service is available if (paginatedResultService) { - paginatedResultService.selectPage(1, 10).subscribe({ - next: pageData => { - try { - // Handle the paginated results - const table = pageData.table; - let htmlContent = `

Operator ID: ${operatorId}

`; + paginatedResultService.selectPage(1, 10).subscribe( + pageData => { + const table = pageData.table; + if (!table.length) { + allResults.push({ + operatorId, + html: ` +

Operator ID: ${operatorId}

+

No results found for operator

+ + +
Add your comments here...
+ ` + }); + resolve(); + return; + } - if (!table.length) { - // If no results are found, display a message - htmlContent += "

No results found for operator

"; - } else { - // Generate an HTML table to display the results - const columns: string[] = Object.keys(table[0]); - const rows: any[][] = table.map(row => columns.map(col => row[col])); + const columns: string[] = Object.keys(table[0]); + const rows: any[][] = table.map(row => columns.map(col => row[col])); - htmlContent += `
- - - ${columns.map(col => ``).join("")} - - - ${rows.map(row => `${row.map(cell => ``).join("")}`).join("")} - -
${col}
${String(cell)}
-
`; - } + const tableHtml: string = ` +
+

Operator ID: ${operatorId}

+ + + ${columns.map(col => ``).join("")} + + + ${rows.map(row => `${row.map(cell => ``).join("")}`).join("")} + +
${col}
${String(cell)}
+ + +
Add your comments here...
+
+ `; - // Add the generated HTML content to the allResults array - allResults.push({ operatorId, html: htmlContent }); - resolve(); - } catch (error: unknown) { - // Handle any errors during the result processing - const errorMessage = (error as Error).message || "Unknown error"; - this.notificationService.error(`Error processing results for operator ${operatorId}: ${errorMessage}`); - reject(error); - } + allResults.push({operatorId, html: tableHtml}); + resolve(); }, - error: (error: unknown) => { - // Handle errors that occur during the retrieval of paginated results - const errorMessage = (error as Error).message || "Unknown error"; - this.notificationService.error( - `Error retrieving paginated results for operator ${operatorId}: ${errorMessage}` - ); + error => { + console.error(`Error displaying paginated results for operator ${operatorId}:`, error); reject(error); - }, - }); + } + ); } else if (resultService) { - try { - // Retrieve the current snapshot of results - const data = resultService.getCurrentResultSnapshot(); - let htmlContent = `

Operator ID: ${operatorId}

`; - - if (data) { - // Parse the HTML content from the snapshot data - const parser = new DOMParser(); - const lastData = data[data.length - 1]; - const doc = parser.parseFromString(Object(lastData)["html-content"], "text/html"); + const data = resultService.getCurrentResultSnapshot(); + if (data) { + const parser = new DOMParser(); + const lastData = data[data.length - 1]; + const doc = parser.parseFromString(Object(lastData)["html-content"], "text/html"); - // Ensure the document's height is set correctly - doc.documentElement.style.height = "50%"; - doc.body.style.height = "50%"; + doc.documentElement.style.height = "50%"; + doc.body.style.height = "50%"; - const firstDiv = doc.body.querySelector("div"); - if (firstDiv) firstDiv.style.height = "100%"; + const firstDiv = doc.body.querySelector("div"); + if (firstDiv) firstDiv.style.height = "100%"; - const serializer = new XMLSerializer(); - const newHtmlString = serializer.serializeToString(doc); + const serializer = new XMLSerializer(); + const newHtmlString = serializer.serializeToString(doc); - htmlContent += newHtmlString; - } else { - // If no data is found, display a message - htmlContent += "

No data found for operator

"; - } + const visualizationHtml = ` +

Operator ID: ${operatorId}

+ ${newHtmlString} + + +
Add your comments here...
+ `; - // Add the generated HTML content to the allResults array - allResults.push({ operatorId, html: htmlContent }); + allResults.push({operatorId, html: visualizationHtml}); resolve(); - } catch (error: unknown) { - // Handle any errors during snapshot result processing - const errorMessage = (error as Error).message || "Unknown error"; - this.notificationService.error( - `Error processing snapshot results for operator ${operatorId}: ${errorMessage}` - ); - reject(error); - } - } else { - try { - // If no result services are available, provide a default message + } else { allResults.push({ operatorId, - html: `

Operator ID: ${operatorId}

-

No results found for operator

`, + html: ` +

Operator ID: ${operatorId}

+

No data found for operator

+ + +
Add your comments here...
+ ` }); resolve(); - } catch (error: unknown) { - // Handle any errors when pushing the default result - const errorMessage = (error as Error).message || "Unknown error"; - this.notificationService.error(`Error pushing default result for operator ${operatorId}: ${errorMessage}`); - reject(error); } + } else { + allResults.push({ + operatorId, + html: ` +

Operator ID: ${operatorId}

+

No results found for operator

+ + +
Add your comments here...
+ ` + }); + resolve(); } - } catch (error: unknown) { - // Handle any unexpected errors that occur in the main logic - const errorMessage = (error as Error).message || "Unknown error"; - this.notificationService.error( - `Unexpected error in retrieveOperatorInfoReport for operator ${operatorId}: ${errorMessage}` - ); + } catch (error) { + console.error(`Error retrieving operator info for operator ${operatorId}:`, error); reject(error); } }); @@ -288,7 +286,14 @@ export class ReportGenerationService { } @@ -301,7 +306,7 @@ export class ReportGenerationService { `; - const blob = new Blob([htmlContent], { type: "text/html" }); + const blob = new Blob([htmlContent], {type: "text/html"}); const url = URL.createObjectURL(blob); const fileName = `${workflowName}-report.html`; // Use workflowName to generate the file name const a = document.createElement("a"); From dd5d9205225bda46de59fea661891eaff15a3a5c Mon Sep 17 00:00:00 2001 From: Janus-W <2373025856w@gmail.com> Date: Tue, 27 Aug 2024 13:00:01 -0700 Subject: [PATCH 2/8] each json successful; add json download --- .../report-generation.service.ts | 37 ++++++++++++------- 1 file changed, 23 insertions(+), 14 deletions(-) diff --git a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts index 941a038df42..b952df95226 100644 --- a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts +++ b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts @@ -12,7 +12,6 @@ export class ReportGenerationService { constructor( public workflowActionService: WorkflowActionService, private workflowResultService: WorkflowResultService, - private notificationService: NotificationService ) { } @@ -123,20 +122,16 @@ export class ReportGenerationService { const workflowContent = this.workflowActionService.getWorkflowContent(); const operatorDetails = workflowContent.operators.find(op => op.operatorID === operatorId); + // 将 operatorData 转为 JSON 字符串 + const operatorDataJson = JSON.stringify(operatorDetails, null, 2); + const operatorDetailsHtml = ` -
-

Operator Details

-
- -
- `; +
+

Operator Details

+
+      ${operatorDataJson}
+    
+
`; if (paginatedResultService) { paginatedResultService.selectPage(1, 10).subscribe( @@ -294,6 +289,17 @@ export class ReportGenerationService { detailsElement.style.display = "none"; } } + + function downloadJson() { + const workflowContent = ${JSON.stringify(this.workflowActionService.getWorkflowContent())}; // Get the workflow content + const jsonBlob = new Blob([JSON.stringify(workflowContent, null, 2)], {type: "application/json"}); + const url = URL.createObjectURL(jsonBlob); + const a = document.createElement("a"); + a.href = url; + a.download = "${workflowName}-workflow.json"; + a.click(); + URL.revokeObjectURL(url); + } @@ -302,6 +308,9 @@ export class ReportGenerationService { Workflow Snapshot ${allResults.join("")} +
+ +
`; From c6ede8100559bc2c61ef01fb6ff819e0491ad52c Mon Sep 17 00:00:00 2001 From: Janus-W <2373025856w@gmail.com> Date: Tue, 27 Aug 2024 15:12:55 -0700 Subject: [PATCH 3/8] json viewer successful --- .../report-generation.service.ts | 32 ++++++++++++------- core/gui/src/index.html | 8 +++++ 2 files changed, 28 insertions(+), 12 deletions(-) diff --git a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts index b952df95226..3328e2c8796 100644 --- a/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts +++ b/core/gui/src/app/workspace/service/report-generation/report-generation.service.ts @@ -122,20 +122,25 @@ export class ReportGenerationService { const workflowContent = this.workflowActionService.getWorkflowContent(); const operatorDetails = workflowContent.operators.find(op => op.operatorID === operatorId); - // 将 operatorData 转为 JSON 字符串 - const operatorDataJson = JSON.stringify(operatorDetails, null, 2); - const operatorDetailsHtml = ` -
-

Operator Details

-
-      ${operatorDataJson}
-    
-
`; +
+

Operator Details

+
+ +
+ `; if (paginatedResultService) { paginatedResultService.selectPage(1, 10).subscribe( pageData => { + // Handle the paginated results const table = pageData.table; if (!table.length) { allResults.push({ @@ -151,7 +156,7 @@ export class ReportGenerationService { resolve(); return; } - + // Generate an HTML table to display the results const columns: string[] = Object.keys(table[0]); const rows: any[][] = table.map(row => columns.map(col => row[col])); @@ -172,6 +177,7 @@ export class ReportGenerationService { `; + // Add the generated HTML content to the allResults array allResults.push({operatorId, html: tableHtml}); resolve(); }, @@ -253,6 +259,8 @@ export class ReportGenerationService { Operator Results + +