buid

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/login/login-page/login-page.component.ts

@@ -20,24 +20,6 @@ export class LoginPageComponent implements OnInit {
   loginEnvironment = LoginEnvironment;
   showLogin2 = true;
 
-
-  // loginEnvironment: LoginEnvironment = {
-  //   companyName: 'io8.dev',
-  //   imagePath: '../../../../assets/images/new.png',
-  //   fpass: 'forgot password',
-  //   isSignup: true,
-  //   // template:'',
-  // };
-
-
-  // loginEnvironment: ExtendedLoginEnvironment = {
-  //   companyName:  'io8.dev',
-  //   imagePath: '../../../../assets/images/new.png',
-  //   fpass: 'Forgot Password?',
-  //   isSignup: true  // or false based on your requirement
-  // };
-  
-
   email = '';
   password = '';
   isError = false;

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/login/login-page/login_environment.ts

@@ -4,7 +4,7 @@ export const LoginEnvironment = {
 
         "templateNo": "Template 1",
         "loginHeading": "Welcome to",
-        "loginHeading2": "io8.dev",
+        "loginHeading2": "Visa App",
         "isSignup": "true",
         "loginSignup": "Use your ID to sign in OR  ",
         "loginSignup2": "create one now",

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/admin/menumaintance/menumaintance.component.html

@@ -1,4 +1,3 @@
-
 <ol class="breadcrumb breadcrumb-arrow font-trirong">
   <li><a href="javascript://" [routerLink]="['/cns-portal/dashboard/order']"><clr-icon shape="home"></clr-icon></a></li>
   <li><a href="javascript://"><clr-icon shape="lock"></clr-icon>{{ 'SECURITY' | translate }}</a></li>
@@ -16,7 +15,8 @@
 <div class="clr-row" style="margin-top: 15px;">
   <div class="clr-col">
     <h3 style="font-weight: 300;display: inline;">{{ 'MENU_MAINTENANCE' | translate }} </h3>
-    <span class="label label-light-blue" style="display: inline;margin-left: 30px;">{{ 'MAIN_MENU' | translate }}</span><br>
+    <span class="label label-light-blue" style="display: inline;margin-left: 30px;">{{ 'MAIN_MENU' | translate
+      }}</span><br>
 
   </div>
 
@@ -146,7 +146,8 @@
   </table> -->
 <clr-datagrid [clrDgLoading]="loading" [(clrDgSelected)]="selected">
   <clr-dg-placeholder><ng-template #loadingSpinner><clr-spinner>{{'LOADING'|translate}} ... </clr-spinner></ng-template>
-      <div *ngIf="error;else loadingSpinner">{{error}}</div></clr-dg-placeholder>
+    <div *ngIf="error;else loadingSpinner">{{error}}</div>
+  </clr-dg-placeholder>
   <clr-dg-column [clrDgField]="''" style="max-width: 40px;">
     <ng-container *clrDgHideableColumn="{hidden: false}"></ng-container>
   </clr-dg-column>
@@ -209,7 +210,8 @@
 
   <clr-dg-row *clrDgItems="let user of menus;let i = index" [clrDgItem]="user">
     <clr-dg-cell style="max-width: 40px;">
-        <span style="cursor: pointer;"><clr-icon shape="edit" (click)="goToEdit(user)" class="red is-error" style="color:red;"></clr-icon></span>
+      <span style="cursor: pointer;"><clr-icon shape="edit" (click)="goToEdit(user)" class="red is-error"
+          style="color:red;"></clr-icon></span>
     </clr-dg-cell>
     <clr-dg-cell>{{i+1}}</clr-dg-cell>
     <clr-dg-cell>{{user.menuItemDesc}}</clr-dg-cell>
@@ -218,11 +220,14 @@
     <clr-dg-cell> {{user.moduleName}} </clr-dg-cell>
     <clr-dg-cell> {{user.main_menu_action_name}}</clr-dg-cell>
     <clr-dg-cell>{{user.status}} </clr-dg-cell>
-      <clr-dg-cell ><clr-icon shape="bullet-list" (click)="submenu(user.menuItemId)" style="color: rgb(108, 108, 194);"></clr-icon> </clr-dg-cell>
+    <clr-dg-cell><clr-icon shape="bullet-list" (click)="submenu(user.menuItemId)"
+        style="color: rgb(108, 108, 194);"></clr-icon> </clr-dg-cell>
     <clr-dg-cell>
-        <span style="cursor: pointer;padding: 10px; "><clr-icon shape="trash"  (click)="onDelete(user)" class="red is-error" style="color: red;"></clr-icon></span>
+      <span style="cursor: pointer;padding: 10px; "><clr-icon shape="trash" (click)="onDelete(user)"
+          class="red is-error" style="color: red;"></clr-icon></span>
       <clr-signpost>
-          <span style="cursor: pointer;" clrSignpostTrigger><clr-icon shape="help" class="success" style="color: rgb(0, 130, 236);"></clr-icon></span>
+        <span style="cursor: pointer;" clrSignpostTrigger><clr-icon shape="help" class="success"
+            style="color: rgb(0, 130, 236);"></clr-icon></span>
         <clr-signpost-content [clrPosition]="'left-middle'" *clrIfOpen>
           <h5 style="margin-top: 0">{{'WHO_COLUMN'|translate}} </h5>
           <div>{{'ACCOUNT_ID'|translate}} <code class="clr-code">{{user.accountId}}</code></div>
@@ -233,10 +238,7 @@
         </clr-signpost-content>
       </clr-signpost>
     </clr-dg-cell>
-      <!-- <clr-dg-action-overflow>
+
-        <button class="action-item" *ngIf="medit == 'true'"  (click)="goToEdit(user)">Edit <clr-icon shape="edit" class="is-error"></clr-icon></button>
-        <button class="action-item" *ngIf="mdelete == 'true'"  (click)="onDelete(user)">Delete<clr-icon shape="trash" class="is-error"></clr-icon></button>
-      </clr-dg-action-overflow> -->
 
     <clr-dg-row-detail *clrIfExpanded>
       <table class="table">
@@ -262,10 +264,7 @@
   <div class="modal-body">
     <form [formGroup]="entryForm" (ngSubmit)="onSubmit()">
       <div class="clr-row">
-           <!-- <div class="clr-col-sm-12">
+
-            <label for="name">Menu Item ID<span class="required-field">*</span></label>
-           <input type="text" class="clr-input" formControlName="menuItemId">
-          </div> -->
         <div class="clr-col-sm-12">
           <label for="name">Menu ID<span class="required-field">*</span></label>
           <input type="text" class="clr-input" formControlName="menuId" name="menuId" [(ngModel)]="mainid" readonly>
@@ -274,24 +273,28 @@
           <label for="name">Menu Item Name<span class="required-field">*</span></label>
           <input type="text" class="clr-input" formControlName="menuItemDesc">
           <div *ngIf="submitted && entryForm.controls.menuItemDesc.errors" class="error_mess">
-            <div *ngIf="submitted && entryForm.controls.menuItemDesc.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.menuItemDesc.errors.required" class="error_mess">*This field is
+              Required</div>
           </div>
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Sequence</label>
           <input type="text" class="clr-input" formControlName="itemSeq">
           <div *ngIf="submitted && entryForm.controls.itemSeq.errors" class="error_mess">
-              <div *ngIf="submitted && entryForm.controls.itemSeq.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.itemSeq.errors.required" class="error_mess">*This field is
+              Required</div>
           </div>
           <div *ngIf="submitted && entryForm.controls.itemSeq.errors" class="error_mess">
-            <div *ngIf="submitted && entryForm.controls.itemSeq.errors.pattern" class="error_mess">*Required Only Number</div>
+            <div *ngIf="submitted && entryForm.controls.itemSeq.errors.pattern" class="error_mess">*Required Only Number
+            </div>
           </div>
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Module Name</label>
           <input type="text" class="clr-input" formControlName="moduleName">
           <div *ngIf="submitted && entryForm.controls.moduleName.errors" class="error_mess">
-                <div *ngIf="submitted && entryForm.controls.moduleName.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.moduleName.errors.required" class="error_mess">*This field is
+              Required</div>
           </div>
         </div>
         <div class="clr-col-sm-12">
@@ -301,59 +304,25 @@
             <option value="Disable">Disable</option>
           </select>
           <div *ngIf="submitted && entryForm.controls.status.errors" class="error_mess">
-                  <div *ngIf="submitted && entryForm.controls.status.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.status.errors.required" class="error_mess">*This field is
+              Required</div>
           </div>
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Menu Action Link</label>
           <input type="text" class="clr-input" formControlName="main_menu_action_name">
           <div *ngIf="submitted && entryForm.controls.main_menu_action_name.errors" class="error_mess">
-                  <div *ngIf="submitted && entryForm.controls.main_menu_action_name.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.main_menu_action_name.errors.required" class="error_mess">*This
+              field is Required</div>
           </div>
-                <!-- <select NAME="menu_id" >
-                  <option SELECTED >Home Menu
-                          <OPTION >Home
-      <OPTION >Job
 
-      <OPTION >&nbsp;&nbsp;&nbsp;Job logs
-      <OPTION >&nbsp;&nbsp;&nbsp;Pending Jobs
-      <OPTION >&nbsp;&nbsp;&nbsp;Defined Jobs
-      <OPTION >&nbsp;&nbsp;&nbsp;Surewebsocket
-
-      <OPTION >Security
-      <OPTION >&nbsp;&nbsp;&nbsp;User Maintance
-      <OPTION >&nbsp;&nbsp;&nbsp;User Group Maintance
-      <OPTION >&nbsp;&nbsp;&nbsp;System parametrs
-      <OPTION >&nbsp;&nbsp;&nbsp;Menu access control
-      <OPTION >&nbsp;&nbsp;&nbsp;Menu Maintance
-
-      <OPTION >SureBoard
-      <OPTION >&nbsp;&nbsp;&nbsp;Road Map
-      <OPTION >&nbsp;&nbsp;&nbsp;Iteration Release
-      <OPTION >&nbsp;&nbsp;&nbsp;Milestone
-      <OPTION >&nbsp;&nbsp;&nbsp;Goal
-      <OPTION >&nbsp;&nbsp;&nbsp;Wbs Task Board
-
-
-      <OPTION >Projects
-      <OPTION >&nbsp;&nbsp;&nbsp;My projects
-      <OPTION >&nbsp;&nbsp;&nbsp;All Projects
-      <OPTION >&nbsp;&nbsp;&nbsp;Templates
-      <OPTION >&nbsp;&nbsp;&nbsp;Repositories
-      <OPTION >&nbsp;&nbsp;&nbsp;Recently Modify
-      <OPTION >&nbsp;&nbsp;&nbsp;Recently Archived
-      <OPTION >&nbsp;&nbsp;&nbsp;Shared with Me
-      <OPTION >&nbsp;&nbsp;&nbsp;My Fav
-
-
-
-      </select> -->
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Menu Icon Name</label>
           <input type="text" class="clr-input" formControlName="main_menu_icon_name">
           <div *ngIf="submitted && entryForm.controls.main_menu_icon_name.errors" class="error_mess">
-                    <div *ngIf="submitted && entryForm.controls.main_menu_icon_name.errors.required" class="error_mess">*This field is Required</div>
+            <div *ngIf="submitted && entryForm.controls.main_menu_icon_name.errors.required" class="error_mess">*This
+              field is Required</div>
           </div>
         </div>
       </div>
@@ -412,7 +381,8 @@
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Menu Action Link</label>
-                <input type="text" class="clr-input" name="main_menu_action_name" [(ngModel)]="rowSelected.main_menu_action_name">
+          <input type="text" class="clr-input" name="main_menu_action_name"
+            [(ngModel)]="rowSelected.main_menu_action_name">
         </div>
         <div class="clr-col-sm-12">
           <label for="tags">Menu Icon Name </label>
@@ -433,7 +403,8 @@
 <clr-modal [(clrModalOpen)]="modalCsv" [clrModalSize]="'sm'" [clrModalStaticBackdrop]="false">
   <h3 class="modal-title">Import File</h3>
   <div class="modal-body">
-        <input type="file" name="file" class="file" (change)="selectFile($event)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
+    <input type="file" name="file" class="file" (change)="selectFile($event)"
+      accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
   </div>
   <div class="modal-footer">
     <button class="btn btn-primary" type="button" [disabled]="!selectedFiles" (click)="saveCsv()">Import</button>

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/admin/menumaintance/menumaintance.component.ts

@@ -136,8 +136,7 @@ this.menuservice.sink(id,this.rowSelected).subscribe((data)=>{
     this.modaldelete = true;
   }
 
-    delete(id)
+  delete(id) {
-    {
     this.modaldelete = false;
     console.log("in delete  " + id);
     this.menuservice.delete1(id).subscribe((data) => {

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/admin/submenu/submenu.component.ts

@@ -102,8 +102,7 @@ this.mainid=this.id
     this.modaldelete = true;
   }
 
-        delete(id)
+  delete(id) {
-        {
     this.modaldelete = false;
     console.log("in delete  " + id);
     this.menuservice.delete1(id).subscribe((data) => {

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Design_lbrary/Design_lbrary.component.html

@@ -42,9 +42,7 @@
         </ng-container></clr-dg-column>
 
 
-      <clr-dg-column [clrDgField]="'Technology'"> <ng-container *clrDgHideableColumn="{hidden: false}">
+
-          Technolgy Stack
-        </ng-container></clr-dg-column>
       <clr-dg-column [clrDgField]="'Type Render'"> <ng-container *clrDgHideableColumn="{hidden: false}"> Type Render
 
         </ng-container></clr-dg-column>
@@ -88,12 +86,9 @@
 
         <clr-dg-cell>{{user.uitype }}</clr-dg-cell>
 
-        <clr-dg-cell>{{user.techstack }}</clr-dg-cell>
         <clr-dg-cell>{{user.typerender }}</clr-dg-cell>
 
 
-
-
         <clr-dg-cell (click)="goToReplaceStringhtmljson (user.html)"
           style="cursor: pointer; align-items: center;"><clr-icon shape="details"></clr-icon>
         </clr-dg-cell>
@@ -358,10 +353,7 @@
           <label>Type Render</label>
           <input class="clr-input" type="text" [(ngModel)]="rowSelected.typerender" name="typerender" />
         </div>
-        <div class="clr-col-sm-12">
+
-          <label>Technolgy Stack</label>
-          <input class="clr-input" type="text" [(ngModel)]="rowSelected.techstack" name="techstack" />
-        </div>
 
 
         <div class="clr-col-sm-12">
@@ -481,11 +473,6 @@
           <input class="clr-input" type="text" formControlName="typerender" />
         </div>
 
-        <div class="clr-col-sm-12">
-          <label> Technolgy Stack</label>
-          <input class="clr-input" type="text" formControlName="techstack" />
-        </div>
-
         <div class="clr-col-sm-12">
           <label> Active</label>
           <input type="checkbox" formControlName="active" clrToggle />

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Design_lbrary/Design_lbrary.component.ts

@@ -10,6 +10,7 @@ import { UserInfoService } from 'src/app/services/user-info.service';
 import { SiteTreeservice } from '../SiteBuilderGrid/SiteTree.service';
 import { COMMON_CSS } from '../WireframesUi/common-css';
 import { Download_Css } from '../WireframesUi/download-css';
+import { ActivatedRoute } from '@angular/router';
 // import { Download_Css } from '../WireframesUi/download-css';
 declare var JsBarcode: any;
 @Component({
@@ -52,6 +53,7 @@ export class Design_lbraryComponent implements OnInit {
   newLine: any;
   additionalFieldsFromBackend: any[] = [];
   formcode = 'Design_lbrary_formCode'
+  headerId;
   tableName = 'Design_lbrary'; checkFormCode; selected: any[] = []; constructor(
     private extensionService: ExtensionService,
     private userInfoService: UserInfoService,
@@ -60,10 +62,13 @@ export class Design_lbraryComponent implements OnInit {
     private toastr: ToastrService,
     private _fb: FormBuilder,
     private siteTreeService: SiteTreeservice,
+    private route: ActivatedRoute,
 
   ) { }
   // component button 
   ngOnInit(): void {
+    this.headerId = this.route.snapshot.params["id"];
+    console.log("headerId : = ", this.headerId);
     if (this.cardmodeldata !== '') {
       this.cardmodal = JSON.parse(this.cardmodeldata);
       this.dashboardArray = this.cardmodal.dashboard.slice();
@@ -85,11 +90,9 @@ export class Design_lbraryComponent implements OnInit {
       uitype: [null],
       javacode: [null],
       typerender: [null],
-      techstack: [null],
+      // techstack: [null],
       html: [null],
-
+      hedaer_id: [this.headerId],
-
-
 
     }); // component_button200
     // form code start
@@ -111,39 +114,16 @@ export class Design_lbraryComponent implements OnInit {
         });
       }
     });
-    console.log(this.entryForm.value);
+    console.log('form code ', this.entryForm.value);
     // form code end 
-
-
-
-
-
-
-
-
-
-
-
-
-
   }
-
-
-
-
-
-
-
-
-
-
-
-
   error;
   getData() {
-    this.mainService.getAll().subscribe((data) => {
+    this.mainService.getAll(this.headerId).subscribe((data) => {
-      console.log(data);
+      console.log('get all ', data);
-      this.product = data;
+      // this.product = data;
+      this.product = Array.isArray(data) ? data : [];
+
       if (this.product.length == 0) {
         this.error = "No Data Available"
       }
@@ -156,19 +136,6 @@ export class Design_lbraryComponent implements OnInit {
   }
   onEdit(row) {
     this.rowSelected = row;
-
-
-
-
-
-
-
-
-
-
-
-
-
     this.modalEdit = true;
   }
   onDelete(row) {
@@ -187,18 +154,6 @@ export class Design_lbraryComponent implements OnInit {
   }
   onUpdate(id) {
     this.modalEdit = false;
-
-
-
-
-
-
-
-
-
-
-
-
     //console.log("in update");
     console.log("id  " + id);
     console.log(this.rowSelected);
@@ -213,17 +168,6 @@ export class Design_lbraryComponent implements OnInit {
           this.ngOnInit();
         }, 500);
 
-
-
-
-
-
-
-
-
-
-
-
       }, (error) => {
         console.log(error);
         if (error.status >= 200 && error.status <= 299) {
@@ -242,18 +186,6 @@ export class Design_lbraryComponent implements OnInit {
   }
   onCreate() {
     this.modalAdd = false;
-
-
-
-
-
-
-
-
-
-
-
-
     this.mainService.create(this.entryForm.value).subscribe(
       (data) => {
         console.log(data);
@@ -264,17 +196,6 @@ export class Design_lbraryComponent implements OnInit {
           this.ngOnInit();
         }, 500);
 
-
-
-
-
-
-
-
-
-
-
-
       }, (error) => {
         console.log(error);
         if (error.status >= 200 && error.status <= 299) {
@@ -294,17 +215,6 @@ export class Design_lbraryComponent implements OnInit {
   goToAdd(row) {
     this.modalAdd = true; this.submitted = false;
 
-
-
-
-
-
-
-
-
-
-
-
   }
   submitted = false;
   onSubmit() {
@@ -312,11 +222,11 @@ export class Design_lbraryComponent implements OnInit {
     this.submitted = true;
     if (this.entryForm.invalid) {
       return;
-    } this.onCreate();
+    }
+    this.onCreate();
 
   }
 
-
   rsModaldescription = false;
   goToReplaceStringdescription(row) {
     this.rowSelected = row; this.rsModaldescription = true;

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Design_lbrary/Design_lbrary.service.ts

@@ -11,8 +11,8 @@ export class Design_lbraryservice{
     private http: HttpClient,
     private apiRequest: ApiRequestService,
   ) { }
-  getAll(page?: number, size?: number): Observable<any> {
+  getAll(id: number, page?: number, size?: number): Observable<any> {
-    return this.apiRequest.get(this.baseURL);
+    return this.apiRequest.get(this.baseURL + "/line/" + id);
   }
   getById(id: number): Observable<any> {
     const _http = this.baseURL + "/" + id;

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Dlf_header/Dlf_header.component.html

@@ -0,0 +1,447 @@
+<ol class="breadcrumb breadcrumb-arrow font-trirong">
+  <li><a href="javascript://"> DlfHeader</a></li>
+</ol>
+<div class="dg-wrapper">
+  <div class="clr-row">
+    <div class="clr-col-8">
+      <h3>DlfHeader </h3>
+    </div>
+    <div class="clr-col-4" style="text-align: right;">
+      <button *ngIf="cardButton" id="add" class="btn btn-primary btn-icon" (click)="changeView()">
+        <clr-icon *ngIf="!isCardview" shape="grid-view"></clr-icon> <clr-icon *ngIf="isCardview"
+          shape="bars"></clr-icon>
+      </button>
+      <!-- button -->
+      <button id="add" class="btn btn-primary" (click)="goToAdd(product)">
+        <clr-icon shape="plus"></clr-icon>ADD
+      </button>
+    </div>
+  </div>
+  <ng-container *ngIf="!isCardview"> <!-- GET ALL --> <clr-datagrid [clrDgLoading]="loading"
+      [(clrDgSelected)]="selected">
+      <clr-dg-placeholder>
+        <ng-template #loadingSpinner>
+          <clr-spinner>Loading ... </clr-spinner>
+        </ng-template>
+        <div *ngIf="error;else loadingSpinner">{{error}}</div>
+      </clr-dg-placeholder>
+
+      <clr-dg-column [clrDgField]="' name'"> <ng-container *clrDgHideableColumn="{hidden: false}"> Name
+        </ng-container></clr-dg-column>
+
+
+      <clr-dg-column [clrDgField]="' description'"> <ng-container *clrDgHideableColumn="{hidden: false}"> Description
+        </ng-container></clr-dg-column>
+
+
+      <clr-dg-column [clrDgField]="'Technology'"> <ng-container *clrDgHideableColumn="{hidden: false}">
+          Technolgy Stack
+        </ng-container></clr-dg-column>
+
+      <clr-dg-column [clrDgField]="' type'"> <ng-container *clrDgHideableColumn="{hidden: false}"> type
+        </ng-container></clr-dg-column>
+
+      <clr-dg-column [clrDgField]="' active'"> <ng-container *clrDgHideableColumn="{hidden: false}"> Active
+        </ng-container></clr-dg-column>
+
+      <clr-dg-column>
+        <ng-container *clrDgHideableColumn="{hidden: false}">
+          Line
+        </ng-container>
+      </clr-dg-column>
+
+      <!-- who column -->
+      <clr-dg-column> <ng-container *clrDgHideableColumn="{hidden: false}">
+          <clr-icon shape="bars"></clr-icon> Action
+        </ng-container></clr-dg-column>
+      <!-- end -->
+
+      <clr-dg-row *clrDgItems="let user of product" [clrDgItem]="user">
+
+        <clr-dg-cell>{{user. name }}</clr-dg-cell>
+
+
+        <clr-dg-cell (click)="goToReplaceStringdescription (user.description)"
+          style="cursor: pointer; align-items: center;"><clr-icon shape="details"></clr-icon>
+        </clr-dg-cell>
+
+        <clr-dg-cell>{{user.techstack }}</clr-dg-cell>
+
+
+
+        <clr-dg-cell>{{user. type }}</clr-dg-cell>
+        <clr-dg-cell>{{user. active }}</clr-dg-cell>
+
+        <clr-dg-cell><clr-icon shape="bullet-list" (click)="goToDlfLine(user.id)"
+            style="color: rgb(108, 108, 194);"></clr-icon> </clr-dg-cell>
+
+        <!-- who column -->
+        <clr-dg-cell>
+          <clr-signpost>
+            <span style="cursor: pointer;" clrSignpostTrigger><clr-icon shape="help" class="success"
+                style="color: rgb(0, 130, 236);"></clr-icon></span>
+            <clr-signpost-content [clrPosition]="'left-middle'" *clrIfOpen>
+              <h5 style="margin-top: 0">Who Column</h5>
+              <div>Account ID: <code class="clr-code">{{user.accountId}}</code></div>
+              <div>Created At: <code class="clr-code">{{user.createdAt| date}}</code></div>
+              <div>Created By: <code class="clr-code">{{user.createdBy}}</code></div>
+              <div>Updated At: <code class="clr-code">{{user.updatedAt | date}}</code></div>
+              <div>Updated By: <code class="clr-code">{{user.updatedBy}}</code></div>
+            </clr-signpost-content>
+          </clr-signpost>
+        </clr-dg-cell>
+
+        <!-- who colmn -->
+
+        <clr-dg-action-overflow>
+          <button class="action-item" (click)="onEdit(user)">Edit</button>
+          <button class="action-item" (click)="onDelete(user)">Delete</button>
+        </clr-dg-action-overflow>
+      </clr-dg-row>
+      <clr-dg-footer>
+        <clr-dg-pagination #pagination [clrDgPageSize]="10">
+          <clr-dg-page-size [clrPageSizeOptions]="[10,20,50,100]">Users per page</clr-dg-page-size>
+          {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}}
+          of {{pagination.totalItems}} users
+        </clr-dg-pagination>
+      </clr-dg-footer>
+    </clr-datagrid> </ng-container>
+  <ng-template #showInfo>
+    <div class="alert alert-info" role="alert">
+      <div class="alert-items">
+        <div class="alert-item static">
+          <span class="alert-text">
+            <clr-icon class="alert-icon" shape="info-circle"></clr-icon>
+            Data could be found. Loading..
+            <clr-spinner [clrMedium]="true">Loading ...</clr-spinner>
+          </span>
+        </div>
+      </div>
+    </div>
+  </ng-template><ng-container *ngIf="isCardview">
+    <div *ngIf="product; else showInfo" class="clr-row clr-align-items-start clr-justify-content-start">
+      <div *ngFor="let app of product| filter:search; let index = i" class="clr-col-auto">
+        <div class="clr-row">
+          <div class="clr-col-lg-12 clr-col-md-4 clr-col-sm-4 clr-col-12" style="width: 410px;">
+            <div class="card" style="padding: 10px; "
+              [style.background-color]="cardmodal.cardColor !== '' ? cardmodal.cardColor : 'white'">
+              <div class="card-body"
+                style="display: grid; grid-template-columns: repeat(13, 1fr); grid-template-rows: repeat(7, 1fr); gap: 5px;">
+                <ng-container *ngFor="let item of dashboardArray">
+                  <div [style.gridColumn]="item.x + 1" [style.gridRow]="item.y + 1"
+                    [style.gridColumnEnd]="item.x + item.cols + 1" [style.gridRowEnd]="item.y + item.rows + 1">
+                    <div *ngIf="item.name === 'textField'" class="title-card card-title"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'"
+                      [style.background-color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditionbackgroundcolor : item.backgroundcolor"
+                      [style.color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditiontextcolor : item.textcolor">
+                      {{beforeText(item.fieldtext)}}
+                      {{ app[transform(item.fieldtext) ] }}
+                      {{afterText(item.fieldtext)}}
+                    </div>
+
+                    <div *ngIf="item.name === 'dateField'" class="title-card card-title"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'"
+                      [style.background-color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditionbackgroundcolor : item.backgroundcolor"
+                      [style.color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditiontextcolor : item.textcolor">
+                      {{beforeText(item.fieldtext)}}
+                      {{ app[transform(item.fieldtext) ] | date}}
+                      {{afterText(item.fieldtext)}}
+                    </div>
+                    <div *ngIf="item.name === 'numberField'" class="title-card card-title"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'"
+                      [style.background-color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditionbackgroundcolor : item.backgroundcolor"
+                      [style.color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditiontextcolor : item.textcolor">
+                      {{beforeText(item.fieldtext)}}
+                      {{ app[transform(item.fieldtext) ]}}
+                      {{afterText(item.fieldtext)}}
+                    </div>
+
+                    <div *ngIf="item.name === 'Line'" class="title-card card-title"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'">
+                      <hr>
+                    </div>
+
+
+                    <div *ngIf="item.name === 'Icon'" class="icon-card"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'">
+                      <clr-icon [attr.shape]="item.iconName"></clr-icon>
+                    </div>
+
+                    <div *ngIf="item.name == 'Image'"
+                      [style.text-align]="item.alignment !== '' ? item.alignment : 'left'"
+                      [style.line-height]="item.textlineheight !== '' ? item.textlineheight : '1'"
+                      [style.font-family]="item.fontName !== '' ? item.fontName : 'Metropolis'"
+                      [style.font-size]="item.fontSize !== '' ? item.fontSize : '100%'"
+                      [style.font-style]="item.italic == true ? 'Italic' : 'normal'"
+                      [style.font-weight]="item.bold == true ? 'bold' : 'normal'" [style.text-decoration]="(item.underline && item.strikethough) ? 'underline line-through' : 
+          (item.underline ? 'underline' : (item.strikethough ? 'line-through' : 'none'))"
+                      [style.background-color]="item.backgroundcolor !== '' ? item.backgroundcolor : 'white'"
+                      [style.color]="item.textcolor !== '' ? item.textcolor : 'black'"
+                      [style.background-color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditionbackgroundcolor : item.backgroundcolor"
+                      [style.color]="item.conditionValue ==  app[transform(item.fieldtext) ] ? item.conditiontextcolor : item.textcolor">
+                      <img id="filePreview" [src]="item.imageURL" alt="File Preview"
+                        [style.width]="item.imagewidth !== '' ? item.imagewidth + 'px' : '100px'"
+                        [style.height]="item.imagewidth !== '' ? item.imagewidth + 'px' : '100px'">
+                    </div>
+                  </div>
+                </ng-container>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </ng-container>
+</div>
+
+
+
+<clr-modal [(clrModalOpen)]="rsModaldescription" [clrModalSize]="'xl'" [clrModalStaticBackdrop]="true">
+  <div class="modal-body">
+    <textarea class="form-control" style="width:100%; height: 400px;" readonly>{{rowSelected}}</textarea>
+  </div>
+</clr-modal>
+
+
+
+
+
+<!-- //		EDIT DATA......... -->
+<clr-modal [(clrModalOpen)]="modalEdit" [clrModalSize]="'lg'" [clrModalStaticBackdrop]="true">
+  <h3 class="modal-title">Update DlfHeader
+    <!--update button -->
+
+
+  </h3>
+  <div class="modal-body" *ngIf="rowSelected.id">
+    <h2 class="heading">{{rowSelected.id}}</h2>
+    <!-- button -->
+    <form>
+      <div class="clr-row">
+        <div class="clr-col-sm-12">
+          <label>Name</label>
+          <input class="clr-input" type="text" [(ngModel)]="rowSelected.name" name="name" />
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label> Description</label>
+          <textarea cols="10" rows="2" [(ngModel)]="rowSelected.description" name="description "
+            placeholder="Textarea">  </textarea>
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label> Active</label>
+          <input type="checkbox" name="active" clrToggle [(ngModel)]="rowSelected.active" />
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label>Technolgy Stack</label>
+          <input class="clr-input" type="text" [(ngModel)]="rowSelected.techstack" name="techstack" />
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label>type</label>
+          <input class="clr-input" type="text" [(ngModel)]="rowSelected.type" name="type" />
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label> Active</label>
+          <input type="checkbox" name="active" clrToggle [(ngModel)]="rowSelected.active" />
+        </div>
+      </div>
+
+
+
+
+
+
+
+
+      <!-- form code start -->
+      <div *ngIf="checkFormCode">
+        <h4 style="font-weight: 300;display: inline;">Extension</h4>
+        <br>
+        <hr>
+        <div class="clr-row">
+          <div class="clr-col-4" *ngFor="let field of additionalFieldsFromBackend">
+            <ng-container *ngIf="field.formCode === formcode" [ngSwitch]="field.fieldType">
+              <!-- Text Input --> <label *ngSwitchCase="'text'">{{ field.fieldName }}</label>
+              <input *ngSwitchCase="'text'" [type]="field.fieldType" name="{{ field.extValue }}"
+                [(ngModel)]="rowSelected[field.extValue]" class="clr-input" />
+
+              <!-- Date Input --> <label *ngSwitchCase="'date'">{{ field.fieldName }}</label>
+              <input *ngSwitchCase="'date'" [type]="field.fieldType" name="{{ field.extValue }}"
+                [(ngModel)]="rowSelected[field.extValue]" class="clr-input" />
+
+              <!-- Textarea --> <label *ngSwitchCase="'textarea'">{{ field.fieldName }}</label>
+              <textarea *ngSwitchCase="'textarea'" name="{{ field.extValue }}" [(ngModel)]="rowSelected[field.extValue]"
+                col="10" row="2"></textarea>
+
+              <!-- Checkbox --> <label *ngSwitchCase="'checkbox'">{{ field.fieldName }}</label><br>
+              <input *ngSwitchCase="'checkbox'" [type]="field.fieldType" name="{{ field.extValue }}"
+                [(ngModel)]="rowSelected[field.extValue]" class="clr-checkbox" />
+            </ng-container>
+          </div>
+        </div>
+      </div>
+
+      <!-- form code end -->
+      <div class="modal-footer">
+        <button type="button" class="btn btn-outline" (click)="modalEdit = false">Cancel</button>
+        <button type="submit" class="btn btn-primary" (click)="onUpdate(rowSelected.id)">Update</button>
+      </div>
+    </form>
+  </div>
+</clr-modal>
+<clr-modal [(clrModalOpen)]="modaldelete" [clrModalSize]="'lg'" [clrModalStaticBackdrop]="true">
+  <div class="modal-body" *ngIf="rowSelected.id">
+    <h1 class="delete">Are You Sure Want to delete?</h1>
+    <h2 class="heading">{{rowSelected.id}}</h2>
+    <div class="modal-footer">
+      <button type="button" class="btn btn-outline" (click)="modaldelete = false">Cancel</button>
+      <button type="button" (click)="delete(rowSelected.id)" class="btn btn-primary">Delete</button>
+    </div>
+  </div>
+</clr-modal>
+<!-- ADD FORM ..... -->
+<clr-modal [(clrModalOpen)]="modalAdd" [clrModalSize]="'lg'" [clrModalStaticBackdrop]="true">
+  <h3 class="modal-title">Add DlfHeader
+
+
+
+
+
+
+
+
+    <!-- aeroplane icon -->
+    &nbsp; &nbsp; &nbsp; &nbsp;
+    <a *ngIf="userrole.includes('ADMIN')" style="float: right;" href="javascript:void(0)" role="tooltip"
+      aria-haspopup="true" class="tooltip tooltip-sm tooltip-bottom-left">
+      <a id="build_extension" [routerLink]="['../extension/all']" [queryParams]="{ formCode: 'Dlf_header_formCode' }">
+        <clr-icon shape="airplane" size="32"></clr-icon>
+      </a>
+      <span class="tooltip-content">Form Extension</span>
+    </a>
+  </h3>
+  <div class="modal-body">
+    <form [formGroup]="entryForm">
+      <div class="clr-row" style="height: fit-content;">
+
+        <div class="clr-col-sm-12">
+          <label> Name</label>
+          <input class="clr-input" type="text" formControlName="name" />
+        </div>
+
+        <div class="clr-col-sm-12">
+          <label> Description</label>
+          <textarea cols="10" rows="2" formControlName="description" placeholder="Textarea">  </textarea>
+        </div>
+
+
+
+
+        <div class="clr-col-sm-12">
+          <label> Technolgy Stack</label>
+          <input class="clr-input" type="text" formControlName="techstack" />
+        </div>
+        <div class="clr-col-sm-12">
+          <label> type</label>
+          <input class="clr-input" type="text" formControlName="type" />
+        </div>
+        <div class="clr-col-sm-12">
+          <label> Active</label>
+          <input type="checkbox" formControlName="active" clrToggle />
+        </div>
+
+      </div>
+
+
+
+
+
+
+
+
+
+
+      <!-- form code start -->
+      <div *ngIf="checkFormCode">
+        <h4 style="font-weight: 300;display: inline;">Extension</h4>
+        <br>
+        <hr>
+        <div class="clr-row">
+          <div class="clr-col-4" *ngFor="let field of additionalFieldsFromBackend">
+            <ng-container *ngIf="field.formCode === formcode" [ngSwitch]="field.fieldType">
+              <!-- Text Input --> <label *ngSwitchCase="'text'">{{ field.fieldName }}</label>
+              <input *ngSwitchCase="'text'" [type]="field.fieldType" [formControlName]="field.extValue"
+                class="clr-input" />
+              <!-- Date Input --> <label *ngSwitchCase="'date'">{{ field.fieldName }}</label>
+              <input *ngSwitchCase="'date'" [type]="field.fieldType" [formControlName]="field.extValue"
+                class="clr-input" />
+              <!-- Textarea --> <label *ngSwitchCase="'textarea'">{{ field.fieldName }}</label>
+              <textarea *ngSwitchCase="'textarea'" [formControlName]="field.extValue" col="10" row="2"></textarea>
+              <!-- Checkbox --> <label *ngSwitchCase="'checkbox'">{{ field.fieldName }}</label><br>
+              <input *ngSwitchCase="'checkbox'" [type]="field.fieldType" [formControlName]="field.extValue"
+                class="clr-checkbox" />
+            </ng-container>
+          </div>
+        </div>
+      </div>
+      <!-- form code end -->
+      <div class="modal-footer">
+        <button type="button" class="btn btn-outline" (click)="modalAdd = false">Cancel</button>
+        <button type="submit" class="btn btn-primary" (click)="onSubmit()">ADD</button>
+      </div>
+    </form>
+  </div>
+</clr-modal>
+
+
+
+
+
+
+
+
+<!-- htmlpopup -->

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Dlf_header/Dlf_header.component.scss

@@ -0,0 +1,78 @@
+//@import "../../../../assets/scss/var";
+.s-info-bar {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  button {
+    outline: none;
+  }
+}
+.delete,.heading{
+  text-align: center;
+  color: red;
+}
+.entry-pg {
+  width: 750px;
+}
+
+.button1::after {
+  content: none;
+}
+.button1:hover::after {
+  content: "ADD ROWS";
+}
+
+.section {
+  background-color: #dddddd;
+  height: 40px;
+}
+
+.section p {
+  //color: white;
+  padding: 10px;
+  font-size: 18px;
+}
+
+.clr-input {
+  color: #212529;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+  padding: 0.75rem 0.75rem;
+  margin-top: 3px;
+  width: 100%;
+  margin-bottom: 10px;
+}
+
+.clr-file {
+  color: #212529;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+  //padding: 0.6rem 0.75rem;
+  margin-top: 3px;
+  width: 100%;
+  margin-bottom: 10px;
+}
+
+.center {
+  text-align: center;
+}
+select{
+  width: 100%;
+  margin-top: 3px;
+  padding: 5px 5px;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+input[type=text],[type=date],[type=number],textarea {
+  width: 100%;
+  padding: 15px 15px;
+  background-color:rgb(255, 255, 255);
+ // margin: 8px 0;
+  display: inline-block;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  box-sizing: border-box;
+}
+.error_mess {
+  color: red;
+}

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Dlf_header/Dlf_header.component.ts

@@ -0,0 +1,232 @@
+import { Component, OnInit } from '@angular/core';
+import { ToastrService } from 'ngx-toastr';
+import { AlertService } from 'src/app/services/alert.service';
+import { Dlf_headerservice } from './Dlf_header.service';
+import { AbstractControl, FormArray, FormBuilder, FormGroup, Validators, ValidationErrors } from '@angular/forms';
+import { ExtensionService } from 'src/app/services/fnd/extension.service';
+import { DashboardContentModel2 } from 'src/app/models/builder/dashboard';
+import { Dlf_headercardvariable } from './Dlf_header_cardvariable';
+import { UserInfoService } from 'src/app/services/user-info.service';
+import { ActivatedRoute, Router } from '@angular/router';
+declare var JsBarcode: any;
+@Component({
+  selector: 'app-Dlf_header',
+  templateUrl: './Dlf_header.component.html',
+  styleUrls: ['./Dlf_header.component.scss']
+})
+export class Dlf_headerComponent implements OnInit {
+  cardButton = Dlf_headercardvariable.cardButton;
+  cardmodeldata = Dlf_headercardvariable.cardmodeldata;
+  public dashboardArray: DashboardContentModel2[];
+  isCardview = Dlf_headercardvariable.cardButton;
+  cardmodal; changeView() {
+    this.isCardview = !this.isCardview;
+  }
+  beforeText(fieldtext: string): string { // Extract the text before the first '<'
+    const index = fieldtext.indexOf('<');
+    return index !== -1 ? fieldtext.substring(0, index) : fieldtext;
+  }
+  afterText(fieldtext: string): string { // Extract the text after the last '>'
+    const index = fieldtext.lastIndexOf('>');
+    return index !== -1 ? fieldtext.substring(index + 1) : '';
+  }
+  transform(fieldtext: string): string {
+    const match = fieldtext.match(/<([^>]*)>/);
+    return match ? match[1] : ''; // Extract the text between '<' and '>'
+  }
+  userrole;
+  rowSelected: any = {};
+  modaldelete = false;
+  modalEdit = false;
+  modalAdd = false;
+  public entryForm: FormGroup;
+  loading = false;
+  product;
+  modalOpenedforNewLine = false;
+  newLine: any;
+  additionalFieldsFromBackend: any[] = [];
+  formcode = 'Dlf_header_formCode'
+  tableName = 'Dlf_header'; checkFormCode; selected: any[] = []; constructor(
+    private extensionService: ExtensionService,
+    private userInfoService: UserInfoService,
+    private mainService: Dlf_headerservice,
+    private alertService: AlertService,
+    private toastr: ToastrService,
+    private _fb: FormBuilder,
+    private router: Router,
+    private route: ActivatedRoute,
+  ) { }
+  // component button 
+  ngOnInit(): void {
+    if (this.cardmodeldata !== '') {
+      this.cardmodal = JSON.parse(this.cardmodeldata);
+      this.dashboardArray = this.cardmodal.dashboard.slice();
+      console.log(this.dashboardArray)
+    }
+    this.userrole = this.userInfoService.getRoles();
+    this.getData();
+    this.entryForm = this._fb.group({
+      name: [null],
+
+      description: [null],
+
+      active: [false],
+
+      type: [null],
+
+    }); // component_button200
+    // form code start
+    this.extensionService.getJsonObjectsByFormCodeList(this.formcode).subscribe(data => {
+      console.log(data);
+      const jsonArray = data.map((str) => JSON.parse(str));
+      this.additionalFieldsFromBackend = jsonArray;
+      this.checkFormCode = this.additionalFieldsFromBackend.some(field => field.formCode === "Dlf_header_formCode");
+      console.log(this.checkFormCode);
+      console.log(this.additionalFieldsFromBackend);
+      if (this.additionalFieldsFromBackend && this.additionalFieldsFromBackend.length > 0) {
+        this.additionalFieldsFromBackend.forEach(field => {
+          if (field.formCode === this.formcode) {
+            if (!this.entryForm.contains(field.extValue)) {
+              // Add the control only if it doesn't exist in the form
+              this.entryForm.addControl(field.extValue, this._fb.control(field.fieldValue));
+            }
+          }
+        });
+      }
+    });
+    console.log(this.entryForm.value);
+    // form code end 
+
+  }
+
+  error;
+  getData() {
+    this.mainService.getAll().subscribe((data) => {
+      console.log(data);
+      this.product = data;
+      if (this.product.length == 0) {
+        this.error = "No Data Available"
+      }
+    }, (error) => {
+      console.log(error);
+      if (error) {
+        this.error = "Server Error";
+      }
+    });
+  }
+  onEdit(row) {
+    this.rowSelected = row;
+
+    this.modalEdit = true;
+  }
+  onDelete(row) {
+    this.rowSelected = row;
+    this.modaldelete = true;
+  }
+  delete(id) {
+    this.modaldelete = false;
+    console.log("in delete  " + id);
+    this.mainService.delete(id).subscribe(
+      (data) => {
+        console.log(data);
+        this.ngOnInit();
+        if (data) { this.toastr.success('Deleted successfully'); }
+      });
+  }
+  onUpdate(id) {
+    this.modalEdit = false;
+
+    //console.log("in update");
+    console.log("id  " + id);
+    console.log(this.rowSelected);
+    //console.log("out update");
+    this.mainService.update(id, this.rowSelected).subscribe(
+      (data) => {
+        console.log(data);
+        if (data || data.status >= 200 && data.status <= 299) {
+          this.toastr.success("Update Successfully");
+        }
+        setTimeout(() => {
+          this.ngOnInit();
+        }, 500);
+
+      }, (error) => {
+        console.log(error);
+        if (error.status >= 200 && error.status <= 299) {
+          // this.toastr.success("update Succesfully");
+        }
+        if (error.status >= 400 && error.status <= 499) {
+          this.toastr.error("Not Updated");
+        }
+        if (error.status >= 500 && error.status <= 599) {
+          this.toastr.error("Not Updated");
+        }
+      });
+    setTimeout(() => {
+      this.ngOnInit();
+    }, 500);
+  }
+  onCreate() {
+    this.modalAdd = false;
+
+    this.mainService.create(this.entryForm.value).subscribe(
+      (data) => {
+        console.log(data);
+        if (data || data.status >= 200 && data.status <= 299) {
+          this.toastr.success("Added Successfully");
+        }
+        setTimeout(() => {
+          this.ngOnInit();
+        }, 500);
+
+      }, (error) => {
+        console.log(error);
+        if (error.status >= 200 && error.status <= 299) {
+          // this.toastr.success("Added Succesfully");
+        }
+        if (error.status >= 400 && error.status <= 499) {
+          this.toastr.error("Not Added");
+        }
+        if (error.status >= 500 && error.status <= 599) {
+          this.toastr.error("Not Added");
+        }
+      });
+    setTimeout(() => {
+      this.ngOnInit();
+    }, 500);
+  }
+  goToAdd(row) {
+    this.modalAdd = true; this.submitted = false;
+
+  }
+  submitted = false;
+  onSubmit() {
+    console.log(this.entryForm.value);
+    this.submitted = true;
+    if (this.entryForm.invalid) {
+      return;
+    } this.onCreate();
+
+  }
+
+
+  rsModaldescription = false;
+  goToReplaceStringdescription(row) {
+    this.rowSelected = row; this.rsModaldescription = true;
+  }
+
+
+
+  // updateaction
+
+  goToDlfLine(id: any) {
+    this.router.navigate(["../Design_lbrary/" + id], { relativeTo: this.route })
+  }
+}
+
+
+
+
+
+
+

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Dlf_header/Dlf_header.service.ts

@@ -0,0 +1,41 @@
+import { Injectable } from '@angular/core';
+import { Observable } from "rxjs";
+import { HttpClient, HttpHeaders, HttpParams, } from "@angular/common/http";
+import { ApiRequestService } from "src/app/services/api/api-request.service";
+import { environment } from 'src/environments/environment';
+@Injectable({
+  providedIn: 'root'
+})
+export class Dlf_headerservice{
+  private baseURL = "Dlf_header/Dlf_header" ;  constructor(
+    private http: HttpClient,
+    private apiRequest: ApiRequestService,
+  ) { }
+  getAll(page?: number, size?: number): Observable<any> {
+    return this.apiRequest.get(this.baseURL);
+  }
+  getById(id: number): Observable<any> {
+    const _http = this.baseURL + "/" + id;
+    return this.apiRequest.get(_http);
+  }
+  create(data: any): Observable<any> {
+    return this.apiRequest.post(this.baseURL, data);
+  }
+  update(id: number, data: any): Observable<any> {
+    const _http = this.baseURL + "/" + id;
+    return this.apiRequest.put(_http, data);
+  }
+  delete(id: number): Observable<any> {
+    const _http = this.baseURL + "/" + id;
+    return this.apiRequest.delete(_http);
+  }
+
+
+
+
+
+
+
+
+// updateaction
+}

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/Dlf_header/Dlf_header_cardvariable.ts

@@ -0,0 +1,4 @@
+export const Dlf_headercardvariable = {
+    "cardButton": false,
+    "cardmodeldata": ``
+}

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/SiteBuilderGrid/SiteTree.service.ts

@@ -47,6 +47,11 @@ export class SiteTreeservice {
     return this.apiRequest.get(_http);
   }
 
+  getDesignLibraryByheader(headerId: number, operationType: string, fieldtype: string): Observable<any> {
+    const _http = "Design_lbrary/Design_lbrary/line/unique?headerId=" + headerId + "&operationType=" + operationType + "&fieldType=" + fieldtype;
+    return this.apiRequest.get(_http);
+  }
+
   callLlm(data: any): Observable<any> {
     return this.http.post(`${this.nodeURL}/chatMemory`, data);
   }
@@ -60,7 +65,7 @@ export class SiteTreeservice {
     return this.apiRequest.get(`api/html/generate/html/id/` + id);
   }
 
-  deployProj(data: any, projId: number): Observable<any> {
+  deployProj(projId: number, data: any): Observable<any> {
     return this.apiRequest.post(`sureops/deploy?projId=` + projId, data);
   }
 

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.html

@@ -121,7 +121,6 @@
     </button>
     <!-- <button (click)="uploadHtmlFiles(11096)" class="action-btn save-btn"> -->
     <button (click)="createHtmlFiles()" class="action-btn save-btn">
-
       💾 Save All HTML Files
     </button>
 

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.ts

@@ -385,10 +385,13 @@ HTML Only. No CSS.
                             return resolve(this.promptHashCache[hash]);
                         }
 
-                        // const enhanced = await this.callLlm(enhancedPrompt);
+                        const enhanced = await this.callLlm(enhancedPrompt);
-                        // this.promptHashCache[hash] = enhanced;
 
-                        resolve(baseJsonString);
+                        console.log('enhanced prmpt ',enhanced);
+                        this.promptHashCache[hash] = enhanced;
+
+                        // resolve(baseJsonString);
+                        resolve(this.promptHashCache[hash]);
                     } catch (err) {
                         console.error('❌ JSON parse error:', err);
                         resolve('{}');
@@ -562,7 +565,7 @@ HTML Only. No CSS.
             pageHtmlMap[pageName] = html;
         }
 
-        this.siteTreeService.deployProj(pageHtmlMap, projId).subscribe(
+        this.siteTreeService.deployProj(projId,pageHtmlMap).subscribe(
             (data) => {
                 console.log(data);
                 if (data || data.status >= 200 && data.status <= 299) {

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/tree-visualizer.component.ts

@@ -91,6 +91,35 @@ export class TreeVisualizerComponent {
         "Feature Section": "Choose a template to replace with uploaded data"
     }
 }`;
+
+
+  suffix1: string = `
+    🔁   You are a JSON structure generator for website page hierarchies. 
+    You will return only a JSON object in a strictly hierarchical tree structure. Do not include any explanation, text, or markdown formatting like \`\`\`json — just return pure JSON only.
+    Each page should be a key. For subpages like "Login", "Projects", or "New Project", nest them under a "Children" key of their parent page.
+    Each page must include specific sections as keys (like "Navbar", "Header Section", "Feature Section" etc.) with either an empty object {} or a short description as the value.
+    Do not return any explanation, text, or markdown formatting — only return the raw JSON object exactly in this format.
+    
+    ❌ Do not include:
+    - Any explanation before or after the JSON
+    - Any markdown formatting like \`\`\` or json
+    - Any text like "Here is..." or "Please note..."
+    
+    ✅ Output must look like this:
+    
+    {
+      "Home": {
+        "Navbar": {},
+        "Header Section": "Intro...",
+        "Children": {
+          "Login": {
+            "Navbar": {},
+            "Header Section": "Login form...",
+            "Footer": {}
+          }
+        }
+      }
+    }`;
   treeData: any = null;
   rawInputText: string = `make a website , where we can login , sign up.
 inside that there is a menu of icard where we can add a icard detail iacardname, description
@@ -194,35 +223,6 @@ after click this icard inside we upload excel of student data, icard template, a
   generateJson() {
     console.log('genearte json start  ')
 
-    const suffix1 = `
-    🔁   You are a JSON structure generator for website page hierarchies. 
-    You will return only a JSON object in a strictly hierarchical tree structure. Do not include any explanation, text, or markdown formatting like \`\`\`json — just return pure JSON only.
-    Each page should be a key. For subpages like "Login", "Projects", or "New Project", nest them under a "Children" key of their parent page.
-    Each page must include specific sections as keys (like "Navbar", "Header Section", "Feature Section" etc.) with either an empty object {} or a short description as the value.
-    Do not return any explanation, text, or markdown formatting — only return the raw JSON object exactly in this format.
-    
-    ❌ Do not include:
-    - Any explanation before or after the JSON
-    - Any markdown formatting like \`\`\` or json
-    - Any text like "Here is..." or "Please note..."
-    
-    ✅ Output must look like this:
-    
-    {
-      "Home": {
-        "Navbar": {},
-        "Header Section": "Intro...",
-        "Children": {
-          "Login": {
-            "Navbar": {},
-            "Header Section": "Login form...",
-            "Footer": {}
-          }
-        }
-      }
-    }`;
-
-
     const suffix = ` You are a JSON structure generator for website page hierarchies.
 
     You are a JSON structure generator for website UI and sitemap hierarchy.
@@ -302,20 +302,102 @@ Analyze the flow implied in the prompt:
     this.siteTreeService.callLlm(payload).subscribe({
       next: (res) => {
 
-        console.log('response ', res)
+        console.log('llm response ', res)
 
         if (res && res.responseContent) {
-          this.inputJson = res.responseContent;
+          // this.inputJson = res.responseContent;
-          console.log('input json ', this.inputJson)
+          // console.log('input json ', this.inputJson)
-
-
           // 🔁 Now call update API
-          const updatePayload = {
+          // const updatePayload = {
-            prompt: this.rawInputText + ' ',
+          //   prompt: this.rawInputText + ' ',
-            model: this.inputJson  // model format expected by backend
+          //   model: this.inputJson  // model format expected by backend
+          // console.log('payload : ', updatePayload);
+
+
+          try {
+            let parsedJson = JSON.parse(res.responseContent); // Parse LLM JSON
+            const topLevelPages = Object.keys(parsedJson);
+            let pendingCalls = topLevelPages.length;
+
+            topLevelPages.forEach(pageName => {
+              this.siteTreeService.getDesignLibraryByheader(2, 'template 1', pageName).subscribe({
+                next: (designResponse) => {
+                  if (designResponse && Object.keys(designResponse).length > 0) {
+                    console.log(`✅ Replacing "${pageName}" with design library JSON that is : `, designResponse.htmljson);
+
+
+                    // try {
+                    //   // Parse the stringified JSON if necessary
+                    //   let raw = designResponse.htmljson;
+
+                    //   // If it's a string, parse it
+                    //   const parsed = typeof raw === 'string' ? JSON.parse(`{${raw}}`) : raw;
+
+                    //   // Automatically extract the first key’s value (usually same as pageName)
+                    //   const firstKey = Object.keys(parsed)[0];
+                    //   const extractedValue = parsed[firstKey];
+
+                    //   console.log(`✅ Extracted value for "${pageName}":`, extractedValue);
+
+                    //   // Replace just the content, not the outer key
+                    //   parsedJson[pageName] = extractedValue;
+
+                    //   console.log(`✅ after  Replaced "${pageName}" jso is  : `, parsedJson);
+
+                    // } catch (parseErr) {
+                    //   console.warn(`⚠️ Could not parse design library JSON for "${pageName}". Keeping original.`);
+                    // }
+
+
+                    try {
+                      let raw = designResponse.htmljson;
+
+                      // Parse the raw string into object if necessary
+                      const parsed = typeof raw === 'string' ? JSON.parse(`{${raw}}`) : raw;
+
+                      // Extract the first key’s value (actual page content)
+                      const firstKey = Object.keys(parsed)[0];
+                      const extractedValue = parsed[firstKey];
+
+                      // Get existing Children (if any) before replacing
+                      const existingPageData = parsedJson[pageName] || {};
+                      const preservedChildren = existingPageData['Children'];
+
+                      // Merge: use extractedValue + put Children back
+                      parsedJson[pageName] = {
+                        ...extractedValue,
+                        ...(preservedChildren ? { Children: preservedChildren } : {})
                       };
 
-          console.log('payload : ', updatePayload);
+                      console.log(`✅ Merged design + preserved Children for "${pageName}"`, parsedJson[pageName]);
+
+                    } catch (parseErr) {
+                      console.warn(`⚠️ Could not parse design library JSON for "${pageName}". Keeping original.`, parseErr);
+                    }
+
+                  } else {
+                    console.log(`ℹ️ No design library found for "${pageName}", keeping original`);
+                  }
+                  checkAndUpload();
+                },
+                error: (err) => {
+                  console.error(`❌ Error fetching design library for "${pageName}":`, err);
+                  checkAndUpload(); // Still proceed
+                }
+              });
+            });
+
+            const checkAndUpload = () => {
+              pendingCalls--;
+              if (pendingCalls === 0) {
+                this.inputJson = JSON.stringify(parsedJson);
+                const updatePayload = {
+                  prompt: this.rawInputText + ' ',
+                  model: this.inputJson
+                };
+
+                console.log('✅ Final merged JSON ready:', updatePayload);
+
                 this.siteTreeService.update(this.id, updatePayload).subscribe({
                   next: (resp) => {
                     console.log('✅ JSON updated on server:', resp);
@@ -326,6 +408,12 @@ Analyze the flow implied in the prompt:
                   }
                 });
               }
+            };
+          } catch (err) {
+            console.error('❌ Failed to parse LLM JSON:', err);
+            alert('Invalid JSON received from LLM');
+          }
+        }
       },
       error: (err) => {
         console.error('API Error:', err);
@@ -334,7 +422,6 @@ Analyze the flow implied in the prompt:
     });
   }
 
-
   fetchTreeById(id: number) {
     this.siteTreeService.getById(id).subscribe({
       next: (res) => {

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/main-routing.module.ts

@@ -99,6 +99,7 @@ import { TreeVisualizerComponent } from './fnd/SiteTreeBuilder/tree-visualizer.c
 import { SiteTreeComponent } from './fnd/SiteTreeBuilder/SiteBuilderGrid/SiteTree.component';
 import { EditstepperComponent } from './BuilderComponents/vpspack/Visa_application/VisaOrderWorkflow/editstepper.component';
 import { Design_lbraryComponent } from './fnd/SiteTreeBuilder/Design_lbrary/Design_lbrary.component';
+import { Dlf_headerComponent } from './fnd/SiteTreeBuilder/Dlf_header/Dlf_header.component';
 
 
 
@@ -270,8 +271,11 @@ const routes: Routes = [
 
 
       // buildercomponents
+      { path: 'Dlf_header', component: Dlf_headerComponent },
+
+      // { path: 'Design_lbrary', component: Design_lbraryComponent },
+      { path: 'Design_lbrary/:id', component: Design_lbraryComponent },
 
-      {path:'Design_lbrary',component:Design_lbraryComponent},
 
       { path: 'sitetree', component: SiteTreeComponent, },
 

visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/main.module.ts

@@ -126,6 +126,7 @@ import { SiteTreeComponent } from './fnd/SiteTreeBuilder/SiteBuilderGrid/SiteTre
 import { TreeNodeComponent } from './fnd/SiteTreeBuilder/TreeNode/tree-node.component';
 import { EditstepperComponent } from './BuilderComponents/vpspack/Visa_application/VisaOrderWorkflow/editstepper.component';
 import { Design_lbraryComponent } from './fnd/SiteTreeBuilder/Design_lbrary/Design_lbrary.component';
+import { Dlf_headerComponent } from './fnd/SiteTreeBuilder/Dlf_header/Dlf_header.component';
 
 
 @NgModule({
@@ -146,7 +147,7 @@ import { Design_lbraryComponent } from './fnd/SiteTreeBuilder/Design_lbrary/Desi
 
 
     // buildercomponents
-
+    Dlf_headerComponent,
     Design_lbraryComponent,
     SiteTreeComponent,
     EditstepperComponent,