Feature(403006):review changes

SyncfusionExamples · Dec 17, 2024 · 1ade8a9 · 1ade8a9
1 parent 5c21ed0
commit 1ade8a9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 20 deletions.
diff --git a/src/app/components/workflow-diagram/workflow-diagram.component.html b/src/app/components/workflow-diagram/workflow-diagram.component.html
@@ -15,8 +15,8 @@
       <div> <input id="fileupload" type="file" /></div>
     </div>
   </div>
-
-  <ejs-diagram class="diagram-container" #diagram 
+  <div>
+    <ejs-diagram class="diagram-container" #diagram 
     id="diagram" [width]="'100%'" [height]="649" [nodes]="nodes"
     [connectors]="connectors" [layout]="layout" [getNodeDefaults]="getNodeDefaults"
     [getConnectorDefaults]="getConnectorDefaults" (created)="onDiagramCreated()" [selectedItems]="selectedItems"
@@ -133,9 +133,11 @@
 
   <ejs-listview #listview id='listview' [dataSource]='listdata' cssClass='bc-block-option' [fields]='fields' [showHeader]='true'
     [headerTitle]='headertitle' [animation]='animation' (select)="onSelectListView($event)"></ejs-listview>
+  </div>
+
 </div>
 
-<app-workflow-sidebar #workflowSidebar [nodeEditType]="nodeEditType" [nodeBlockType]="nodeBlockType" [sidebarHeader]="sidebarHeader" [nextOffsetY]="nextOffsetY" [selectedBlockId]="selectedBlockId" [selectedWorkFlowId]="selectedWorkFlowId" [successWorkflowId]="successWorkflowId" (addNodeAndConnect)="onaddNodeAndConnect($event)"></app-workflow-sidebar>
+<app-workflow-sidebar #workflowSidebar [nodeEditType]="nodeEditType" [nodeBlockType]="nodeBlockType" [sidebarHeader]="sidebarHeader" [selectedBlockId]="selectedBlockId" [selectedWorkFlowId]="selectedWorkFlowId" (addNodeAndConnect)="onaddNodeAndConnect($event)"></app-workflow-sidebar>
 
 <!-- <div style="display: none;">
   <ejs-uploader #defaultupload id='fileupload' (success)='onUploadSuccess($event)' [asyncSettings]='asyncSettings'></ejs-uploader>

diff --git a/src/app/components/workflow-diagram/workflow-diagram.component.ts b/src/app/components/workflow-diagram/workflow-diagram.component.ts
@@ -1,5 +1,5 @@
 import { AfterViewInit, Component, EventEmitter, Input, Output, viewChild, ViewChild } from '@angular/core';
-import { ComplexHierarchicalTree, ConnectionPointOrigin, ConnectorConstraints, ConnectorModel, DecoratorModel, Diagram,  DiagramComponent, DiagramModule, HtmlModel, IClickEventArgs, IExportOptions, LayoutModel, LineDistribution, Node, NodeModel, PrintAndExport, SelectorConstraints, SelectorModel, SnapSettingsModel, TextModel, UserHandleEventsArgs, UserHandleModel } from '@syncfusion/ej2-angular-diagrams';
+import { ComplexHierarchicalTree, ConnectionPointOrigin, ConnectorConstraints, ConnectorModel, DecoratorModel, Diagram,  DiagramComponent, DiagramModule, HierarchicalTreeService, HtmlModel, IClickEventArgs, IExportOptions, LayoutModel, LineDistribution, Node, NodeModel, PrintAndExport, SelectorConstraints, SelectorModel, SnapSettingsModel, TextModel, UserHandleEventsArgs, UserHandleModel } from '@syncfusion/ej2-angular-diagrams';
 import { FieldDetails, FieldOptionDetail, FieldValidation, MessageDetails, RuleData, RuleData2 } from '../../models/appModel';
 import { RULE_DATA, RULE_DATA2, RULE_DATA3 } from '../../data/rule-data';
 import { DialogModule } from '@syncfusion/ej2-angular-popups';
@@ -77,8 +77,6 @@ export class WorkflowDiagramComponent implements AfterViewInit{
   public nodeEditType!: number;
   public selectedBlockId!: string;
   public selectedWorkFlowId!: number;
-  public successWorkflowId!: number;
-  public nextOffsetY!: number;
 
   // // Async settings for file upload
   // public asyncSettings: AsyncSettingsModel = {
@@ -118,12 +116,17 @@ export class WorkflowDiagramComponent implements AfterViewInit{
 
   private initializeDiagramElements(): void {
     this.selectedWorkFlowId = 1; // Get from DB
-    this.successWorkflowId = 1; // Get from DB and Need to set when node click
     sampleWorkflowData.forEach(item => {
+      let buttonCount = 0;
+      if(item.chatWorkflowEditorTypeId == 2){
+        buttonCount = item.fieldOptionDetails?.length || 0;
+      }
       // Create nodes based on the data
       this.nodes.push({
         id: `node${item.id}`,
-        // annotations: [{ content: `Node ${item['id']}` }],
+        // annotations: [{ content: `node${item['id']}` }],
+        width: 200,
+        height: 150 + (buttonCount * 25),
         addInfo: item
       });
 
@@ -184,8 +187,6 @@ export class WorkflowDiagramComponent implements AfterViewInit{
       strokeColor: '#0f2c60',
       strokeWidth: 5,
     };
-    obj.width = 200,
-    obj.height = 150,
     obj.borderWidth = 1,
     obj.borderColor = '#0f2c60',
     (obj.shape as HtmlModel).type = 'HTML'
@@ -215,7 +216,6 @@ export class WorkflowDiagramComponent implements AfterViewInit{
         this.diagram.selectedItems.userHandles[0].visible = false;
       }
        this.selectedBlockId = clickedBlock.id;
-       this.nextOffsetY = clickedBlock.offsetY + clickedBlock.height + 40;
     }
   }
 

diff --git a/src/app/components/workflow-sidebar/workflow-sidebar.component.ts b/src/app/components/workflow-sidebar/workflow-sidebar.component.ts
@@ -40,24 +40,22 @@ export class WorkflowSidebarComponent {
   public checkedIsPrivate: boolean = false;
   public customMessage: string = '';
   public newNodeWidth: number = 200;
-  public newNodeHeight: number = 100;
+  public newNodeHeight: number = 150;
   public newNode: NodeModel = {};
 
   @Input() nodeEditType!: number;
   @Input() nodeBlockType!: number;
   @Input() sidebarHeader!: string;
   @Input() selectedBlockId!: string;
   @Input() selectedWorkFlowId!: number;
-  @Input() successWorkflowId!: number;
-  @Input() nextOffsetY!: number;
   @Output() addNodeAndConnect = new EventEmitter<[string, NodeModel]>();
 
   constructor() {
   }
 
   onCloseSideBarClick(): void {
     this.sidebar?.hide();
-    this.addNodeAndUpdate(this.selectedBlockId);
+    this.addBlock(this.selectedBlockId);
     this.buttons = [];
   }
 
@@ -89,7 +87,7 @@ export class WorkflowSidebarComponent {
     this.buttons.splice(index, 1);
   }
 
-  addNodeAndUpdate(sourceNodeId: string) {
+  addBlock(sourceNodeId: string) {
     switch (this.nodeBlockType) {
       case (this.chatWorkflowBlockTypeEnum.SendTextMessage): {
         let messageInfo: MessageDetails = {
@@ -215,7 +213,7 @@ export class WorkflowSidebarComponent {
     return {
       id: WorkflowSidebarComponent.nodeLength++, // Need to set value dynamically
       chatWorkflowId: workflowId,
-      successWorkflowId: this.successWorkflowId,
+      successWorkflowId: null,
       successRuleId: null,
       isActive: true,
       chatWorkflowBlockId: blockId,
@@ -255,9 +253,6 @@ export class WorkflowSidebarComponent {
   public createNode(width: number, height: number, nodeInfo: RuleData2): NodeModel {
     return {
       id: `node${nodeInfo.id}`,
-      annotations: [],
-      offsetX: 100,
-      offsetY: this.nextOffsetY,
       style: { fill: '#FFFFFF', strokeColor: '#0f2c60', strokeWidth: 5 },
       height: height,
       width: width,