build_app
This commit is contained in:
		
							parent
							
								
									5e1d86a7ad
								
							
						
					
					
						commit
						a4ae04f2db
					
				| @ -69,6 +69,9 @@ public class BuilderService { | |||||||
| 		executeDump(true); | 		executeDump(true); | ||||||
| 
 | 
 | ||||||
| 		// ADD OTHER SERVICE | 		// ADD OTHER SERVICE | ||||||
|  | addCustomMenu( "Testa","Testa",  "Transcations");  | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| 
 | 
 | ||||||
| 		System.out.println("dashboard and menu inserted..."); | 		System.out.println("dashboard and menu inserted..."); | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -0,0 +1,91 @@ | |||||||
|  | package com.realnet.basicp1.Controllers; | ||||||
|  | import java.util.List; | ||||||
|  | import org.springframework.beans.factory.annotation.Autowired; | ||||||
|  |  import org.springframework.web.bind.annotation.*; | ||||||
|  | import org.springframework.web.multipart.MultipartFile; | ||||||
|  | import com.fasterxml.jackson.core.JsonProcessingException; | ||||||
|  | import org.springframework.web.bind.annotation.CrossOrigin; | ||||||
|  | import com.fasterxml.jackson.databind.JsonMappingException; | ||||||
|  | import com.realnet.config.EmailService; | ||||||
|  | import com.realnet.users.entity1.AppUser; | ||||||
|  | import com.realnet.users.service1.AppUserServiceImpl; | ||||||
|  | import com.fasterxml.jackson.databind.ObjectMapper; | ||||||
|  | import org.springframework.data.domain.*; | ||||||
|  | import com.realnet.fnd.response.EntityResponse; | ||||||
|  | import org.springframework.http.*; | ||||||
|  | import org.springframework.beans.factory.annotation.*; | ||||||
|  | import com.realnet.basicp1.Entity.Testa; | ||||||
|  | import com.realnet.basicp1.Services.TestaService ; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | @RequestMapping(value = "/Testa") | ||||||
|  |  @CrossOrigin("*")  | ||||||
|  | @RestController | ||||||
|  | public class TestaController { | ||||||
|  | 	@Autowired | ||||||
|  | 	private TestaService Service; | ||||||
|  | 
 | ||||||
|  | @Value("${projectPath}") | ||||||
|  | 	private String projectPath; | ||||||
|  |   | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 	@PostMapping("/Testa") | ||||||
|  | 		  public Testa Savedata(@RequestBody Testa data) { | ||||||
|  | 		Testa save = Service.Savedata(data)	; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 		System.out.println("data saved..." + save); | ||||||
|  | 
 | ||||||
|  |  return save; | ||||||
|  | 	  } | ||||||
|  | @PutMapping("/Testa/{id}") | ||||||
|  | 	public  Testa update(@RequestBody Testa data,@PathVariable Integer id ) { | ||||||
|  | 		Testa update = Service.update(data,id); | ||||||
|  | 		System.out.println("data update..." + update); | ||||||
|  | 		return update; | ||||||
|  | 	}	  | ||||||
|  | //	get all with pagination | ||||||
|  | 	@GetMapping("/Testa/getall/page") | ||||||
|  | 	public Page<Testa> getall(@RequestParam(value = "page", required = false) Integer page, | ||||||
|  | 			@RequestParam(value = "size", required = false) Integer size) { | ||||||
|  | 		Pageable paging = PageRequest.of(page, size); | ||||||
|  | 		Page<Testa> get = Service.getAllWithPagination(paging); | ||||||
|  | 
 | ||||||
|  | 		return get; | ||||||
|  | 
 | ||||||
|  | 	}	 | ||||||
|  | 	@GetMapping("/Testa") | ||||||
|  | 	public List<Testa> getdetails() { | ||||||
|  | 		 List<Testa> get = Service.getdetails();		 | ||||||
|  | 		return get; | ||||||
|  | } | ||||||
|  | // get all without authentication  | ||||||
|  | 
 | ||||||
|  | 	@GetMapping("/token/Testa") | ||||||
|  | 	public List<Testa> getallwioutsec() { | ||||||
|  | 		 List<Testa> get = Service.getdetails();		 | ||||||
|  | 		return get; | ||||||
|  | } | ||||||
|  | @GetMapping("/Testa/{id}") | ||||||
|  | 	public  Testa  getdetailsbyId(@PathVariable Integer id ) { | ||||||
|  | 		Testa  get = Service.getdetailsbyId(id); | ||||||
|  | 		return get; | ||||||
|  | 	} | ||||||
|  | @DeleteMapping("/Testa/{id}") | ||||||
|  | 	public  ResponseEntity<?> delete_by_id(@PathVariable Integer id ) { | ||||||
|  | 	Service.delete_by_id(id); | ||||||
|  | 			return new ResponseEntity<>(new EntityResponse("Deleted"), HttpStatus.OK); | ||||||
|  | 	 | ||||||
|  | 	} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | } | ||||||
| @ -0,0 +1,91 @@ | |||||||
|  | package com.realnet.basicp1.Controllers; | ||||||
|  | import java.util.List; | ||||||
|  | import org.springframework.beans.factory.annotation.Autowired; | ||||||
|  |  import org.springframework.web.bind.annotation.*; | ||||||
|  | import org.springframework.web.multipart.MultipartFile; | ||||||
|  | import com.fasterxml.jackson.core.JsonProcessingException; | ||||||
|  | import org.springframework.web.bind.annotation.CrossOrigin; | ||||||
|  | import com.fasterxml.jackson.databind.JsonMappingException; | ||||||
|  | import com.realnet.config.EmailService; | ||||||
|  | import com.realnet.users.entity1.AppUser; | ||||||
|  | import com.realnet.users.service1.AppUserServiceImpl; | ||||||
|  | import com.fasterxml.jackson.databind.ObjectMapper; | ||||||
|  | import org.springframework.data.domain.*; | ||||||
|  | import com.realnet.fnd.response.EntityResponse; | ||||||
|  | import org.springframework.http.*; | ||||||
|  | import org.springframework.beans.factory.annotation.*; | ||||||
|  | import com.realnet.basicp1.Entity.Testa; | ||||||
|  | import com.realnet.basicp1.Services.TestaService ; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | @RequestMapping(value = "/token/Testa") | ||||||
|  |  @CrossOrigin("*")  | ||||||
|  | @RestController | ||||||
|  | public class tokenFree_TestaController { | ||||||
|  | 	@Autowired | ||||||
|  | 	private TestaService Service; | ||||||
|  | 
 | ||||||
|  | @Value("${projectPath}") | ||||||
|  | 	private String projectPath; | ||||||
|  |   | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 	@PostMapping("/Testa") | ||||||
|  | 		  public Testa Savedata(@RequestBody Testa data) { | ||||||
|  | 		Testa save = Service.Savedata(data)	; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 		System.out.println("data saved..." + save); | ||||||
|  | 
 | ||||||
|  |  return save; | ||||||
|  | 	  } | ||||||
|  | @PutMapping("/Testa/{id}") | ||||||
|  | 	public  Testa update(@RequestBody Testa data,@PathVariable Integer id ) { | ||||||
|  | 		Testa update = Service.update(data,id); | ||||||
|  | 		System.out.println("data update..." + update); | ||||||
|  | 		return update; | ||||||
|  | 	}	  | ||||||
|  | //	get all with pagination | ||||||
|  | 	@GetMapping("/Testa/getall/page") | ||||||
|  | 	public Page<Testa> getall(@RequestParam(value = "page", required = false) Integer page, | ||||||
|  | 			@RequestParam(value = "size", required = false) Integer size) { | ||||||
|  | 		Pageable paging = PageRequest.of(page, size); | ||||||
|  | 		Page<Testa> get = Service.getAllWithPagination(paging); | ||||||
|  | 
 | ||||||
|  | 		return get; | ||||||
|  | 
 | ||||||
|  | 	}	 | ||||||
|  | 	@GetMapping("/Testa") | ||||||
|  | 	public List<Testa> getdetails() { | ||||||
|  | 		 List<Testa> get = Service.getdetails();		 | ||||||
|  | 		return get; | ||||||
|  | } | ||||||
|  | // get all without authentication  | ||||||
|  | 
 | ||||||
|  | 	@GetMapping("/token/Testa") | ||||||
|  | 	public List<Testa> getallwioutsec() { | ||||||
|  | 		 List<Testa> get = Service.getdetails();		 | ||||||
|  | 		return get; | ||||||
|  | } | ||||||
|  | @GetMapping("/Testa/{id}") | ||||||
|  | 	public  Testa  getdetailsbyId(@PathVariable Integer id ) { | ||||||
|  | 		Testa  get = Service.getdetailsbyId(id); | ||||||
|  | 		return get; | ||||||
|  | 	} | ||||||
|  | @DeleteMapping("/Testa/{id}") | ||||||
|  | 	public  ResponseEntity<?> delete_by_id(@PathVariable Integer id ) { | ||||||
|  | 	Service.delete_by_id(id); | ||||||
|  | 			return new ResponseEntity<>(new EntityResponse("Deleted"), HttpStatus.OK); | ||||||
|  | 	 | ||||||
|  | 	} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | } | ||||||
| @ -0,0 +1,29 @@ | |||||||
|  | package com.realnet.basicp1.Entity; | ||||||
|  |  import lombok.*; | ||||||
|  | import com.realnet.WhoColumn.Entity.Extension;  | ||||||
|  |  import javax.persistence.*; | ||||||
|  |  import java.time.LocalDateTime; | ||||||
|  |  import java.util.*; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |  @Entity  | ||||||
|  |  @Data | ||||||
|  |  public class    Testa extends Extension {  | ||||||
|  |  /** | ||||||
|  | 	 *  | ||||||
|  | 	 */ | ||||||
|  | 	private static final long serialVersionUID = 1L; | ||||||
|  | 
 | ||||||
|  |  @Id | ||||||
|  |  @GeneratedValue(strategy = GenerationType.IDENTITY) | ||||||
|  |  private Integer id; | ||||||
|  | 
 | ||||||
|  | private String  name; | ||||||
|  | 
 | ||||||
|  | @Column(length = 2000) | ||||||
|  | private String description; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | } | ||||||
| @ -0,0 +1,28 @@ | |||||||
|  | package com.realnet.basicp1.Repository; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | import org.springframework.data.domain.Page; | ||||||
|  | import org.springframework.data.domain.Pageable; | ||||||
|  | import org.springframework.data.jpa.repository.JpaRepository; | ||||||
|  | import org.springframework.data.jpa.repository.Query; | ||||||
|  | 
 | ||||||
|  | import org.springframework.stereotype.Repository;  | ||||||
|  | import java.util.*; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   | ||||||
|  | 
 | ||||||
|  | import com.realnet.basicp1.Entity.Testa; | ||||||
|  | 
 | ||||||
|  | @Repository | ||||||
|  | public interface  TestaRepository  extends  JpaRepository<Testa, Integer>  {  | ||||||
|  | 
 | ||||||
|  | @Query(value = "select * from testa where  created_by=?1", nativeQuery = true) | ||||||
|  | 	List<Testa> findAll(Long creayedBy); | ||||||
|  | 
 | ||||||
|  | @Query(value = "select * from testa where  created_by=?1", nativeQuery = true) | ||||||
|  | 	Page<Testa> findAll( Long creayedBy,Pageable page); | ||||||
|  | } | ||||||
| @ -0,0 +1,83 @@ | |||||||
|  | package com.realnet.basicp1.Services; | ||||||
|  | import com.realnet.basicp1.Repository.TestaRepository; | ||||||
|  | import com.realnet.basicp1.Entity.Testa | ||||||
|  | ;import java.util.*; | ||||||
|  | 
 | ||||||
|  | import org.springframework.beans.factory.annotation.Autowired; | ||||||
|  | import com.realnet.SequenceGenerator.Service.SequenceService; | ||||||
|  | import org.springframework.data.domain.Page; | ||||||
|  | import com.realnet.realm.Entity.Realm; | ||||||
|  | import com.realnet.realm.Services.RealmService; | ||||||
|  | import org.springframework.data.domain.Pageable; | ||||||
|  | import org.springframework.http.*; | ||||||
|  | import com.realnet.users.service1.AppUserServiceImpl; | ||||||
|  | import com.realnet.users.entity1.AppUser; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 	import org.springframework.stereotype.Service; | ||||||
|  | 
 | ||||||
|  | @Service | ||||||
|  |  public class TestaService { | ||||||
|  | @Autowired | ||||||
|  | private TestaRepository Repository; | ||||||
|  | 	@Autowired | ||||||
|  | 	private AppUserServiceImpl userService;  | ||||||
|  | @Autowired | ||||||
|  | 	private RealmService realmService; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | public Testa Savedata(Testa data) { | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 	data.setUpdatedBy(getUser().getUserId()); | ||||||
|  | 		data.setCreatedBy(getUser().getUserId()); | ||||||
|  | 		data.setAccountId(getUser().getAccount().getAccount_id()); | ||||||
|  | Testa save = Repository.save(data); | ||||||
|  | 				return save;	 | ||||||
|  | 			} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | //	get all with pagination | ||||||
|  | 	public Page<Testa> getAllWithPagination(Pageable page) { | ||||||
|  | 		return Repository.findAll( getUser().getUserId(),page); | ||||||
|  | 	}			 | ||||||
|  | public List<Testa> getdetails() {   | ||||||
|  | 		List<Realm> realm = realmService.findByUserId(getUser().getUserId()); | ||||||
|  | List<Testa> all = Repository.findAll(getUser().getUserId()); | ||||||
|  | 		 | ||||||
|  | 		return all ;		} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | public Testa getdetailsbyId(Integer id) { | ||||||
|  | 	return Repository.findById(id).get(); | ||||||
|  | 			} | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 	public void delete_by_id(Integer id) { | ||||||
|  |  Repository.deleteById(id); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | public Testa update(Testa data,Integer id) { | ||||||
|  | 	Testa old = Repository.findById(id).get(); | ||||||
|  | old.setName(data.getName()); | ||||||
|  | 
 | ||||||
|  | old.setDescription(data.getDescription()); | ||||||
|  | 
 | ||||||
|  | final Testa test = Repository.save(old); | ||||||
|  | 		data.setUpdatedBy(getUser().getUserId()); | ||||||
|  |   return test;}  | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |  public AppUser getUser() { | ||||||
|  | 		AppUser user = userService.getLoggedInUser(); | ||||||
|  | 		return user; | ||||||
|  | 
 | ||||||
|  | 	}} | ||||||
							
								
								
									
										2
									
								
								testnewstack0006-ds-d/authsec_mysql/mysql/wf_table/wf_table.sql
									
									
									
									
									
										Executable file
									
								
							
							
						
						
									
										2
									
								
								testnewstack0006-ds-d/authsec_mysql/mysql/wf_table/wf_table.sql
									
									
									
									
									
										Executable file
									
								
							| @ -0,0 +1,2 @@ | |||||||
|  | CREATE TABLE ds.Testa(id BIGINT NOT NULL AUTO_INCREMENT, description VARCHAR(400), name VARCHAR(400),  PRIMARY KEY (id)); | ||||||
|  | 
 | ||||||
| @ -0,0 +1,272 @@ | |||||||
|  | <ol class="breadcrumb breadcrumb-arrow font-trirong"> | ||||||
|  |   <li><a href="javascript://"> Testa</a></li> | ||||||
|  | </ol> | ||||||
|  | <section class="ug-hero"> | ||||||
|  |   <div class="ug-hero__content"> | ||||||
|  |     <div class="ug-hero__icon"><clr-icon shape="users"></clr-icon></div> | ||||||
|  |     <div> | ||||||
|  |       <h2 class="ug-hero__title">Testa</h2> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  |   <div class="ug-hero__actions">  | ||||||
|  |     <button id="add" class="ug-btn ug-btn-primary" (click)="goToAdd()"> | ||||||
|  |       <clr-icon shape="plus"></clr-icon> | ||||||
|  |       <span class="ug-btn-text">ADD</span> | ||||||
|  |     </button> | ||||||
|  |     | ||||||
|  |   </div> | ||||||
|  | </section> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | <div class="ug-toolbar"> | ||||||
|  |   <div class="ug-toolbar__left"> | ||||||
|  |     <div class="ug-search"> | ||||||
|  |       <clr-icon shape="search"></clr-icon> | ||||||
|  |       <input class="ug-search__input" type="text" placeholder="SEARCH" [(ngModel)]="filterText" /> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  |   <div class="ug-toolbar__right"> | ||||||
|  |     <div class="ug-view-toggle"> | ||||||
|  |       <button class="ug-btn ug-btn-sm" [class.ug-btn-primary]="viewMode==='cards'" (click)="setViewMode('cards')"> | ||||||
|  |         <clr-icon shape="view-cards"></clr-icon> | ||||||
|  |       </button> | ||||||
|  |       <button class="ug-btn ug-btn-sm" [class.ug-btn-primary]="viewMode==='table'" (click)="setViewMode('table')"> | ||||||
|  |         <clr-icon shape="table"></clr-icon> | ||||||
|  |       </button> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </div>  | ||||||
|  | <clr-datagrid class="ug-grid" [clrDgLoading]="loading" *ngIf="viewMode==='table'"> | ||||||
|  |   <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> | ||||||
|  | 
 | ||||||
|  |   | ||||||
|  |  <!-- 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 filteredGroups;let i = index" [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> | ||||||
|  | 
 | ||||||
|  |   | ||||||
|  |   <!-- 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="ug-action-item" *ngIf="medit == 'true' || medit == true" (click)="onEdit(user)"> | ||||||
|  |         <clr-icon shape="edit"></clr-icon> | ||||||
|  |         EDIT | ||||||
|  |       </button> --> | ||||||
|  |       <button class="ug-action-item" (click)="onEdit(user)"> | ||||||
|  |         <clr-icon shape="edit"></clr-icon> | ||||||
|  |         EDIT | ||||||
|  |       </button> | ||||||
|  |       <button class="ug-action-item ug-btn-error" (click)="onDelete(user)"> | ||||||
|  |         <clr-icon shape="trash"></clr-icon> | ||||||
|  |  DELETE | ||||||
|  |       </button> | ||||||
|  |     </clr-dg-action-overflow> | ||||||
|  | 
 | ||||||
|  | </clr-dg-row> | ||||||
|  | 
 | ||||||
|  |   <clr-dg-footer class="ug-grid-footer"> | ||||||
|  |     <clr-dg-pagination #pagination [clrDgPageSize]="10"> | ||||||
|  |       <clr-dg-page-size [clrPageSizeOptions]="[10,20,50,100]">Record per page</clr-dg-page-size> | ||||||
|  |       {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}} | ||||||
|  |       of {{pagination.totalItems}} Records | ||||||
|  |     </clr-dg-pagination> | ||||||
|  |   </clr-dg-footer> | ||||||
|  | </clr-datagrid> | ||||||
|  | 
 | ||||||
|  | <div class="ug-cards" *ngIf="viewMode==='cards'"> | ||||||
|  |   <div class="ug-card-item" *ngFor="let user of filteredGroups; let i = index"> | ||||||
|  |  <div class="ug-card-item__body">  | ||||||
|  |      | ||||||
|  |       <div class="ug-kv"><span>Name</span><strong>{{user.name}}</strong></div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |       <div class="ug-kv"><span>Description</span><strong>{{user.description}}</strong></div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |  </div> | ||||||
|  |     <div class="ug-card-item__footer"> | ||||||
|  |        | ||||||
|  |       <button class="ug-btn ug-btn-sm ug-btn-outline" (click)="onEdit(user)"> | ||||||
|  |         <clr-icon shape="edit"></clr-icon> Edit | ||||||
|  |       </button> | ||||||
|  |       <button class="ug-btn ug-btn-sm ug-btn-error" (click)="onDelete(user)"> | ||||||
|  |         <clr-icon shape="trash"></clr-icon> Delete | ||||||
|  |       </button> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </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> | ||||||
|  | 
 | ||||||
|  | <clr-modal [(clrModalOpen)]="modalAdd" [clrModalSize]="'md'" [clrModalStaticBackdrop]="true"> | ||||||
|  |   <h3 class="modal-title">Add Testa</h3> | ||||||
|  |   <div class="modal-body"> | ||||||
|  |     <form [formGroup]="entryForm" (ngSubmit)="onSubmit()"> | ||||||
|  | <div class="form-row"> | ||||||
|  |             <div class="form-col"> | ||||||
|  | <div class="ug-form-group"> | ||||||
|  |         <label for="name" class="ug-form-label">Name<span class="required-field">*</span></label> | ||||||
|  |         <input type="text" id="name" class="ug-form-input" formControlName="name"> | ||||||
|  |         <div *ngIf="submitted && entryForm.controls.name.errors" class="ug-form-error"> | ||||||
|  |           <div *ngIf="submitted && entryForm.controls.name.errors.required">*This field is Required</div> | ||||||
|  |         </div> | ||||||
|  |       </div> | ||||||
|  | </div> | ||||||
|  |             </div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | <div class="form-row"> | ||||||
|  |             <div class="form-col"> | ||||||
|  |  <div class="ug-form-group"> | ||||||
|  |               <label for="description" class="ug-form-label">Description</label> | ||||||
|  |               <textarea  | ||||||
|  |                 id="description"  | ||||||
|  |                 class="ug-form-input"  | ||||||
|  |                 formControlName="description"  | ||||||
|  |                 placeholder="Enter text"  | ||||||
|  |                 rows="3"></textarea> | ||||||
|  |             </div> | ||||||
|  | </div> | ||||||
|  |             </div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |       <div class="modal-footer"> | ||||||
|  |         <button type="button" class="ug-btn ug-btn-outline" (click)="modalAdd = false">Cancel</button> | ||||||
|  |         <button type="submit" class="ug-btn ug-btn-primary">ADD</button> | ||||||
|  |       </div> | ||||||
|  |     </form> | ||||||
|  |   </div> | ||||||
|  | </clr-modal> | ||||||
|  | 
 | ||||||
|  | <clr-modal [(clrModalOpen)]="modalEdit" [clrModalSize]="'md'" [clrModalStaticBackdrop]="true"> | ||||||
|  |   <h3 class="modal-title">Update Testa</h3> | ||||||
|  |   <div class="modal-body" *ngIf="rowSelected.id"> | ||||||
|  |      | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | <div class="form-row"> | ||||||
|  |             <div class="form-col"> | ||||||
|  |               <div class="ug-form-group"> | ||||||
|  |                 <label for="name" class="ug-form-label">Name<span class="required-field">*</span></label> | ||||||
|  |                 <input type="text" id="name" class="ug-form-input" [(ngModel)]="rowSelected.name" name="name" | ||||||
|  |                   placeholder="Enter Name"> | ||||||
|  |               </div> | ||||||
|  |             </div> | ||||||
|  |           </div> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |             <div class="form-col"> | ||||||
|  |               <div class="ug-form-group"> | ||||||
|  |                 <label for="description" class="ug-form-label">Description</label> | ||||||
|  |                 <textarea id="description" class="ug-form-input" [(ngModel)]="rowSelected.description" | ||||||
|  |                   name="description" placeholder="Enter text" rows="3"></textarea> | ||||||
|  |               </div> | ||||||
|  |             </div> | ||||||
|  |             | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |     <div class="modal-footer"> | ||||||
|  |       <button type="button" class="ug-btn ug-btn-outline" (click)="modalEdit = false">Cancel</button> | ||||||
|  |       <button type="submit" (click)="onUpdate(rowSelected.id)" class="ug-btn ug-btn-primary">Update</button> | ||||||
|  |     </div> | ||||||
|  | 
 | ||||||
|  | <clr-modal [(clrModalOpen)]="modaldelete" [clrModalSize]="'lg'" [clrModalStaticBackdrop]="true"> | ||||||
|  |   <div class="modal-body" *ngIf="rowSelected.id"> | ||||||
|  |     <div class="ug-delete-header"> | ||||||
|  |       <div class="ug-delete-icon"> | ||||||
|  |         <clr-icon shape="exclamation-triangle" size="48"></clr-icon> | ||||||
|  |       </div> | ||||||
|  |       <h1 class="ug-delete-title">Are You Sure Want to Delete?</h1> | ||||||
|  |       <p class="ug-delete-subtitle">This action cannot be undone</p> | ||||||
|  |     </div> | ||||||
|  | 
 | ||||||
|  | <div class="ug-delete-details"><div class="ug-delete-detail-item"> | ||||||
|  |         <span class="ug-delete-detail-label">Name:</span> | ||||||
|  |         <span class="ug-delete-detail-value">{{rowSelected.name}}</span> | ||||||
|  |       </div> | ||||||
|  | 
 | ||||||
|  | <div class="ug-delete-detail-item"> | ||||||
|  |         <span class="ug-delete-detail-label">Description:</span> | ||||||
|  |         <span class="ug-delete-detail-value">{{rowSelected.description}}</span> | ||||||
|  |       </div> | ||||||
|  | 
 | ||||||
|  |   | ||||||
|  |     </div> | ||||||
|  | 
 | ||||||
|  |     <div class="modal-footer"> | ||||||
|  |       <button type="button" class="ug-btn ug-btn-outline" (click)="modaldelete = false">Cancel</button> | ||||||
|  |       <button type="submit" (click)="delete(rowSelected.id)" class="ug-btn ug-btn-error">Delete</button> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </clr-modal> | ||||||
|  | 
 | ||||||
|  | <clr-modal [(clrModalOpen)]="modalCsv" [clrModalSize]="'sm'" [clrModalStaticBackdrop]="false"> | ||||||
|  |   <h3 class="modal-title">Import File</h3> | ||||||
|  |   <div class="modal-body"> | ||||||
|  |     <div class="ug-form-group"> | ||||||
|  |       <label class="ug-form-label">Select CSV File</label> | ||||||
|  |       <input type="file" name="file" class="ug-file-input" (change)="selectFile($event)" | ||||||
|  |         accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  |   <div class="modal-footer"> | ||||||
|  |     <button class="ug-btn ug-btn-outline" type="button" (click)="modalCsv = false">Cancel</button> | ||||||
|  |     <button class="ug-btn ug-btn-primary" type="button" [disabled]="!selectedFiles" (click)="saveCsv()">Import</button> | ||||||
|  |   </div> | ||||||
|  | </clr-modal> | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   <!-- htmlpopup --> | ||||||
| @ -0,0 +1,870 @@ | |||||||
|  | 
 | ||||||
|  | @import '../../../../../../styles.scss'; | ||||||
|  | 
 | ||||||
|  | // Import design tokens | ||||||
|  | @import '../../../../../../styles/design-tokens'; | ||||||
|  | // Newbasicp1 Styles | ||||||
|  | .ug-hero { | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: space-between; | ||||||
|  |   align-items: center; | ||||||
|  |   padding: 24px 32px; | ||||||
|  |   background: linear-gradient(135deg, var(--theme-primary) 0%, var(--theme-accent) 100%); | ||||||
|  |   color: white; | ||||||
|  |   border-radius: 16px; | ||||||
|  |   margin-bottom: 24px; | ||||||
|  |   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | ||||||
|  |   backdrop-filter: blur(16px); | ||||||
|  |   border: 1px solid rgba(255, 255, 255, 0.2); | ||||||
|  |   font-family: var(--theme-font-primary); | ||||||
|  | 
 | ||||||
|  |   &__content { | ||||||
|  |     display: flex; | ||||||
|  |     align-items: center; | ||||||
|  |     gap: 16px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__icon { | ||||||
|  |     background: rgba(255, 255, 255, 0.2); | ||||||
|  |     border-radius: 50%; | ||||||
|  |     padding: 16px; | ||||||
|  |     display: flex; | ||||||
|  |     align-items: center; | ||||||
|  |     justify-content: center; | ||||||
|  |      | ||||||
|  |     clr-icon { | ||||||
|  |       width: 36px; | ||||||
|  |       height: 36px; | ||||||
|  |       color: white; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__title { | ||||||
|  |     font-size: 28px; | ||||||
|  |     font-weight: 700; | ||||||
|  |     margin: 0; | ||||||
|  |     color: white; | ||||||
|  |     font-family: var(--theme-font-secondary); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__subtitle { | ||||||
|  |     font-size: 16px; | ||||||
|  |     margin: 0; | ||||||
|  |     opacity: 0.9; | ||||||
|  |     color: rgba(255, 255, 255, 0.8); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__actions { | ||||||
|  |     display: flex; | ||||||
|  |     gap: 12px; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-btn-text { | ||||||
|  |   margin-left: 8px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modern Button Styles using ThemeService | ||||||
|  | .ug-btn { | ||||||
|  |   display: inline-flex; | ||||||
|  |   align-items: center; | ||||||
|  |   justify-content: center; | ||||||
|  |   gap: 8px; | ||||||
|  |   padding: 12px 20px; | ||||||
|  |   font-size: 14px; | ||||||
|  |   font-weight: 500; | ||||||
|  |   line-height: 1; | ||||||
|  |   border-radius: 8px; | ||||||
|  |   border: 1px solid transparent; | ||||||
|  |   cursor: pointer; | ||||||
|  |   transition: all 200ms ease-out; | ||||||
|  |   text-decoration: none; | ||||||
|  |   position: relative; | ||||||
|  |   overflow: hidden; | ||||||
|  |   font-family: var(--theme-font-primary); | ||||||
|  |   z-index: 1; | ||||||
|  | 
 | ||||||
|  |   &:focus { | ||||||
|  |     outline: 2px solid var(--theme-primary); | ||||||
|  |     outline-offset: 2px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &:disabled { | ||||||
|  |     opacity: 0.5; | ||||||
|  |     cursor: not-allowed; | ||||||
|  |     pointer-events: none; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   // Sizes | ||||||
|  |   &.ug-btn-sm { | ||||||
|  |     padding: 8px 16px; | ||||||
|  |     font-size: 13px; | ||||||
|  |     height: 32px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-md { | ||||||
|  |     padding: 12px 20px; | ||||||
|  |     font-size: 14px; | ||||||
|  |     height: 40px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-lg { | ||||||
|  |     padding: 16px 24px; | ||||||
|  |     font-size: 16px; | ||||||
|  |     height: 48px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   // Variants | ||||||
|  |   &.ug-btn-primary { | ||||||
|  |     background: linear-gradient(135deg, var(--theme-primary) 0%, var(--theme-accent) 100%); | ||||||
|  |     color: white; | ||||||
|  |     border-color: var(--theme-primary); | ||||||
|  |     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       background: linear-gradient(135deg, var(--theme-primary, #0284c7) 0%, var(--theme-accent, #7c3aed) 100%); | ||||||
|  |       transform: translateY(-2px); | ||||||
|  |       box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     &:active { | ||||||
|  |       transform: translateY(0); | ||||||
|  |       box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-secondary { | ||||||
|  |     background: var(--theme-surface); | ||||||
|  |     color: var(--theme-text); | ||||||
|  |     border-color: rgba(0, 0, 0, 0.1); | ||||||
|  |     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       background: var(--theme-background); | ||||||
|  |       border-color: rgba(0, 0, 0, 0.2); | ||||||
|  |       transform: translateY(-1px); | ||||||
|  |       box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-outline { | ||||||
|  |     background: transparent; | ||||||
|  |     color: var(--theme-secondary); | ||||||
|  |     border-color: var(--theme-secondary); | ||||||
|  |     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       background: rgba(100, 116, 139, 0.1); // var(--theme-secondary) with 10% opacity | ||||||
|  |       border-color: var(--theme-secondary); | ||||||
|  |       color: var(--theme-secondary); | ||||||
|  |       box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-error { | ||||||
|  |     background: var(--theme-error, #ef4444); | ||||||
|  |     color: white; | ||||||
|  |     border-color: var(--theme-error, #ef4444); | ||||||
|  |     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       background: var(--theme-error-dark, #dc2626); | ||||||
|  |       border-color: var(--theme-error-dark, #dc2626); | ||||||
|  |       transform: translateY(-2px); | ||||||
|  |       box-shadow: 0 10px 15px -3px rgba(239, 68, 68, 0.3), 0 4px 6px -2px rgba(239, 68, 68, 0.1); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.ug-btn-ghost { | ||||||
|  |     background: transparent; | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  |     border-color: transparent; | ||||||
|  | 
 | ||||||
|  |     &:hover { | ||||||
|  |       background: var(--theme-background); | ||||||
|  |       color: var(--theme-text); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-toolbar { | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: space-between; | ||||||
|  |   align-items: center; | ||||||
|  |   margin-bottom: 24px; | ||||||
|  |   padding: 16px; | ||||||
|  |   background: var(--theme-surface); | ||||||
|  |   border-radius: 12px; | ||||||
|  |   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | ||||||
|  | 
 | ||||||
|  |   &__left { | ||||||
|  |     flex: 1; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__right { | ||||||
|  |     display: flex; | ||||||
|  |     gap: 8px; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Form Container Styles | ||||||
|  | .form-container { | ||||||
|  |   padding: 20px 0; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .form-row { | ||||||
|  |   display: flex; | ||||||
|  |   flex-wrap: wrap; | ||||||
|  |   margin: 0 -12px 16px -12px; | ||||||
|  |    | ||||||
|  |   @media (max-width: 768px) { | ||||||
|  |     flex-direction: column; | ||||||
|  |     margin: 0 0 16px 0; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .form-col { | ||||||
|  |   flex: 1; | ||||||
|  |   padding: 0 12px; | ||||||
|  |   min-width: 250px; | ||||||
|  |    | ||||||
|  |   @media (max-width: 768px) { | ||||||
|  |     padding: 0; | ||||||
|  |     min-width: 100%; | ||||||
|  |     margin-bottom: 16px; | ||||||
|  |      | ||||||
|  |     &:last-child { | ||||||
|  |       margin-bottom: 0; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Password Input Container | ||||||
|  | .password-input-container { | ||||||
|  |   position: relative; | ||||||
|  |    | ||||||
|  |   .password-input { | ||||||
|  |     padding-right: 40px; | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .password-toggle { | ||||||
|  |     position: absolute; | ||||||
|  |     right: 12px; | ||||||
|  |     top: 50%; | ||||||
|  |     transform: translateY(-50%); | ||||||
|  |     background: none; | ||||||
|  |     border: none; | ||||||
|  |     cursor: pointer; | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  |     padding: 4px; | ||||||
|  |     border-radius: 4px; | ||||||
|  |     transition: all 200ms ease-out; | ||||||
|  |      | ||||||
|  |     &:hover { | ||||||
|  |       color: var(--theme-text); | ||||||
|  |       background: rgba(0, 0, 0, 0.05); | ||||||
|  |     } | ||||||
|  |      | ||||||
|  |     clr-icon { | ||||||
|  |       width: 16px; | ||||||
|  |       height: 16px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Textarea Styles | ||||||
|  | textarea.ug-form-input { | ||||||
|  |   min-height: 100px; | ||||||
|  |   resize: vertical; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-search { | ||||||
|  |   position: relative; | ||||||
|  |   max-width: 400px; | ||||||
|  | 
 | ||||||
|  |   clr-icon { | ||||||
|  |     position: absolute; | ||||||
|  |     left: 12px; | ||||||
|  |     top: 50%; | ||||||
|  |     transform: translateY(-50%); | ||||||
|  |     color: #9ca3af; | ||||||
|  |     z-index: 1; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__input { | ||||||
|  |     width: 100%; | ||||||
|  |     padding: 12px 12px 12px 40px; | ||||||
|  |     border: 1px solid rgba(0, 0, 0, 0.1); | ||||||
|  |     border-radius: 8px; | ||||||
|  |     font-size: 14px; | ||||||
|  |     transition: all 200ms ease-out; | ||||||
|  |     background: var(--theme-surface); | ||||||
|  |     color: var(--theme-text); | ||||||
|  |     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05); | ||||||
|  | 
 | ||||||
|  |     &:focus { | ||||||
|  |       outline: none; | ||||||
|  |       border-color: var(--theme-primary); | ||||||
|  |       box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1); // var(--theme-primary) with 10% opacity | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-view-toggle { | ||||||
|  |   display: flex; | ||||||
|  |   border: 1px solid #d1d5db; | ||||||
|  |   border-radius: 8px; | ||||||
|  |   overflow: hidden; | ||||||
|  | 
 | ||||||
|  |   .ug-btn { | ||||||
|  |     border-radius: 0; | ||||||
|  |     border: none; | ||||||
|  |     background: var(--theme-surface); | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  | 
 | ||||||
|  |     &:first-child { | ||||||
|  |       border-right: 1px solid #d1d5db; | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     &.ug-btn-primary { | ||||||
|  |       background: var(--theme-primary); | ||||||
|  |       color: white; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modern Table Styles | ||||||
|  | .ug-grid { | ||||||
|  |   background: var(--theme-surface); | ||||||
|  |   border-radius: 16px; | ||||||
|  |   overflow: hidden; | ||||||
|  |   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | ||||||
|  |   margin-bottom: 24px; | ||||||
|  | 
 | ||||||
|  |   ::ng-deep .datagrid { | ||||||
|  |     .datagrid-head { | ||||||
|  |       background: var(--theme-background); | ||||||
|  |        | ||||||
|  |       .datagrid-column { | ||||||
|  |         padding: 16px 24px; | ||||||
|  |         font-size: 12px; | ||||||
|  |         font-weight: 600; | ||||||
|  |         color: var(--theme-text-secondary); | ||||||
|  |         text-transform: uppercase; | ||||||
|  |         letter-spacing: 0.05em; | ||||||
|  |         border-bottom: 1px solid #e5e7eb; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     .datagrid-row { | ||||||
|  |       transition: background-color 150ms ease-out; | ||||||
|  | 
 | ||||||
|  |       &:hover { | ||||||
|  |         background: var(--theme-background); | ||||||
|  |       } | ||||||
|  | 
 | ||||||
|  |       &:not(:last-child) { | ||||||
|  |         border-bottom: 1px solid #e5e7eb; | ||||||
|  |       } | ||||||
|  | 
 | ||||||
|  |       .datagrid-cell { | ||||||
|  |         padding: 16px 24px; | ||||||
|  |         font-size: 14px; | ||||||
|  |         color: var(--theme-text); | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  | 
 | ||||||
|  |     .datagrid-footer { | ||||||
|  |       background: var(--theme-background); | ||||||
|  |       border-top: 1px solid #e5e7eb; | ||||||
|  |       padding: 16px 24px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-grid-footer { | ||||||
|  |   background: var(--theme-background); | ||||||
|  |   border-top: 1px solid #e5e7eb; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modern Card Styles - More beautiful design | ||||||
|  | .ug-cards { | ||||||
|  |   display: grid; | ||||||
|  |   grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); | ||||||
|  |   gap: 24px; | ||||||
|  |   margin-bottom: 24px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-card-item { | ||||||
|  |   background: var(--theme-surface); | ||||||
|  |   border: 1px solid rgba(0, 0, 0, 0.06); | ||||||
|  |   border-radius: var(--theme-border-radius); // Using theme variable | ||||||
|  |   box-shadow: var(--theme-shadow); // Using theme variable | ||||||
|  |   overflow: hidden; | ||||||
|  |   display: flex; | ||||||
|  |   flex-direction: column; | ||||||
|  |   transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1); | ||||||
|  | 
 | ||||||
|  |   &:hover { | ||||||
|  |     transform: translateY(-5px); | ||||||
|  |     box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); | ||||||
|  |     border-color: rgba(14, 165, 233, 0.3); // var(--theme-primary) with 30% opacity | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__header { | ||||||
|  |     display: flex; | ||||||
|  |     align-items: center; | ||||||
|  |     gap: 10px; | ||||||
|  |     padding: 16px; | ||||||
|  |     background: linear-gradient(135deg, rgba(14, 165, 233, 0.1), transparent); // var(--theme-primary) with 10% opacity | ||||||
|  |     min-height: 60px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__icon { | ||||||
|  |     clr-icon { | ||||||
|  |       width: 24px; | ||||||
|  |       height: 24px; | ||||||
|  |       color: var(--theme-primary); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__title { | ||||||
|  |     font-weight: 700; | ||||||
|  |     flex: 1 1 auto; | ||||||
|  |     font-size: 18px; | ||||||
|  |     color: var(--theme-text); | ||||||
|  |     max-width: 60%; | ||||||
|  |     overflow: hidden; | ||||||
|  |     text-overflow: ellipsis; | ||||||
|  |     white-space: nowrap; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__badge { | ||||||
|  |     margin-left: auto; | ||||||
|  |     display: inline-flex; | ||||||
|  |     align-items: center; | ||||||
|  |     padding: 4px 12px; | ||||||
|  |     font-size: 12px; | ||||||
|  |     font-weight: 600; | ||||||
|  |     border-radius: 9999px; | ||||||
|  |     text-transform: uppercase; | ||||||
|  |     letter-spacing: 0.05em; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__body { | ||||||
|  |     padding: 16px; | ||||||
|  |     display: grid; | ||||||
|  |     grid-template-columns: repeat(2, minmax(0, 1fr)); | ||||||
|  |     gap: 12px; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &__footer { | ||||||
|  |     padding: 16px; | ||||||
|  |     display: flex; | ||||||
|  |     gap: 8px; | ||||||
|  |     border-top: 1px solid rgba(0, 0, 0, 0.06); | ||||||
|  |     background: var(--theme-background); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-kv { | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: space-between; | ||||||
|  |   font-size: 14px; | ||||||
|  |    | ||||||
|  |   span { | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   strong { | ||||||
|  |     color: var(--theme-text); | ||||||
|  |     font-weight: 500; | ||||||
|  |     text-align: right; | ||||||
|  |     max-width: 60%; | ||||||
|  |     overflow: hidden; | ||||||
|  |     text-overflow: ellipsis; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Theme the card footer buttons | ||||||
|  | .ug-card-item__footer .ug-btn { | ||||||
|  |   border-radius: 10px; | ||||||
|  |   flex: 1; | ||||||
|  |   justify-content: center; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-card-item__footer .ug-btn.ug-btn-outline { | ||||||
|  |   border: 1px solid var(--theme-secondary); | ||||||
|  |   color: var(--theme-secondary); | ||||||
|  |   background: transparent; | ||||||
|  |    | ||||||
|  |   &:hover { | ||||||
|  |     background: rgba(100, 116, 139, 0.1); // var(--theme-secondary) with 10% opacity | ||||||
|  |     border-color: var(--theme-secondary); | ||||||
|  |     color: var(--theme-secondary); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-card-item__footer .ug-btn.ug-btn-error { | ||||||
|  |   background: var(--theme-error, #ef4444); | ||||||
|  |   color: #fff; | ||||||
|  |   border-color: var(--theme-error, #ef4444); | ||||||
|  |    | ||||||
|  |   &:hover { | ||||||
|  |     background: var(--theme-error-dark, #dc2626); | ||||||
|  |     border-color: var(--theme-error-dark, #dc2626); | ||||||
|  |     transform: translateY(-2px); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Table view action buttons | ||||||
|  | .ug-action-item { | ||||||
|  |   @extend .ug-btn; | ||||||
|  |   @extend .ug-btn-ghost; | ||||||
|  |   @extend .ug-btn-sm; | ||||||
|  |   width: 100%; | ||||||
|  |   justify-content: flex-start; | ||||||
|  |   margin-bottom: 4px; | ||||||
|  |   text-align: left; | ||||||
|  |    | ||||||
|  |   clr-icon { | ||||||
|  |     width: 16px; | ||||||
|  |     height: 16px; | ||||||
|  |     margin-right: 8px; | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   &.ug-btn-error { | ||||||
|  |     color: var(--theme-error, #ef4444); | ||||||
|  |      | ||||||
|  |     &:hover { | ||||||
|  |       background: rgba(239, 68, 68, 0.1); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Ensure action overflow is visible | ||||||
|  | ::ng-deep .datagrid-action-overflow { | ||||||
|  |   button.action-item { | ||||||
|  |     display: flex; | ||||||
|  |     align-items: center; | ||||||
|  |     width: 100%; | ||||||
|  |     text-align: left; | ||||||
|  |     padding: 8px 12px; | ||||||
|  |      | ||||||
|  |     clr-icon { | ||||||
|  |       margin-right: 8px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Status Badges | ||||||
|  | .ug-status-badge { | ||||||
|  |   display: inline-flex; | ||||||
|  |   align-items: center; | ||||||
|  |   padding: 6px 16px; | ||||||
|  |   font-size: 13px; | ||||||
|  |   font-weight: 600; | ||||||
|  |   border-radius: 9999px; | ||||||
|  |   text-transform: uppercase; | ||||||
|  |   letter-spacing: 0.05em; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-status-enabled { | ||||||
|  |   background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(16, 185, 129, 0.05) 100%); | ||||||
|  |   color: #10b981; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-status-disabled { | ||||||
|  |   background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(239, 68, 68, 0.05) 100%); | ||||||
|  |   color: #ef4444; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Form Styles | ||||||
|  | .ug-form-group { | ||||||
|  |   margin-bottom: 20px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-form-label { | ||||||
|  |   display: block; | ||||||
|  |   font-size: 14px; | ||||||
|  |   font-weight: 500; | ||||||
|  |   color: var(--theme-text); | ||||||
|  |   margin-bottom: 8px; | ||||||
|  |   font-family: var(--theme-font-primary); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-form-input, .ug-form-select { | ||||||
|  |   width: 100%; | ||||||
|  |   padding: 12px 16px; | ||||||
|  |   font-size: 14px; | ||||||
|  |   line-height: 1.5; | ||||||
|  |   color: var(--theme-text); | ||||||
|  |   background: var(--theme-surface); | ||||||
|  |   border: 1px solid rgba(0, 0, 0, 0.1); | ||||||
|  |   border-radius: 8px; | ||||||
|  |   transition: all 200ms ease-out; | ||||||
|  |   margin-bottom: 0; | ||||||
|  |   font-family: var(--theme-font-primary); | ||||||
|  |   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05); | ||||||
|  | 
 | ||||||
|  |   &:focus { | ||||||
|  |     outline: none; | ||||||
|  |     border-color: var(--theme-primary); | ||||||
|  |     box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1); // var(--theme-primary) with 10% opacity | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &:disabled { | ||||||
|  |     background: var(--theme-background); | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  |     cursor: not-allowed; | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &.error { | ||||||
|  |     border-color: #ef4444; | ||||||
|  |     box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   &::placeholder { | ||||||
|  |     color: var(--theme-text-secondary); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-form-select { | ||||||
|  |   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e"); | ||||||
|  |   background-position: right 12px center; | ||||||
|  |   background-repeat: no-repeat; | ||||||
|  |   background-size: 16px 12px; | ||||||
|  |   padding-right: 40px; | ||||||
|  |   appearance: none; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-form-error { | ||||||
|  |   color: #ef4444; | ||||||
|  |   font-size: 12px; | ||||||
|  |   margin-top: 6px; | ||||||
|  |   font-weight: 500; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .required-field { | ||||||
|  |   color: #ef4444; | ||||||
|  |   margin-left: 4px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-file-input { | ||||||
|  |   width: 100%; | ||||||
|  |   padding: 12px; | ||||||
|  |   border: 1px solid rgba(0, 0, 0, 0.1); | ||||||
|  |   border-radius: 8px; | ||||||
|  |   background: var(--theme-surface); | ||||||
|  |   color: var(--theme-text); | ||||||
|  |    | ||||||
|  |   &::file-selector-button { | ||||||
|  |     @extend .ug-btn; | ||||||
|  |     @extend .ug-btn-secondary; | ||||||
|  |     margin-right: 12px; | ||||||
|  |     padding: 8px 16px; | ||||||
|  |     border: none; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Delete Modal Styles | ||||||
|  | .ug-delete-header { | ||||||
|  |   text-align: center; | ||||||
|  |   padding: 24px; | ||||||
|  |   border-bottom: 1px solid rgba(0, 0, 0, 0.05); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-icon { | ||||||
|  |   color: #ef4444; | ||||||
|  |   margin-bottom: 16px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-title { | ||||||
|  |   font-size: 24px; | ||||||
|  |   font-weight: 700; | ||||||
|  |   color: var(--theme-text); | ||||||
|  |   margin: 0 0 8px 0; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-subtitle { | ||||||
|  |   font-size: 16px; | ||||||
|  |   color: var(--theme-text-secondary); | ||||||
|  |   margin: 0; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-details { | ||||||
|  |   padding: 24px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-detail-item { | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: space-between; | ||||||
|  |   padding: 12px 0; | ||||||
|  |   border-bottom: 1px solid rgba(0, 0, 0, 0.05); | ||||||
|  |    | ||||||
|  |   &:last-child { | ||||||
|  |     border-bottom: none; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-detail-label { | ||||||
|  |   font-weight: 500; | ||||||
|  |   color: var(--theme-text-secondary); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .ug-delete-detail-value { | ||||||
|  |   font-weight: 600; | ||||||
|  |   color: var(--theme-text); | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .delete { | ||||||
|  |   color: #ef4444; | ||||||
|  |   text-align: center; | ||||||
|  |   margin-bottom: 16px; | ||||||
|  |   font-weight: 600; | ||||||
|  |   font-size: 20px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .heading { | ||||||
|  |   text-align: center; | ||||||
|  |   margin-bottom: 24px; | ||||||
|  |   color: var(--theme-text); | ||||||
|  |   font-weight: 600; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modal Header | ||||||
|  | ::ng-deep .modal-header { | ||||||
|  |   background: linear-gradient(135deg, var(--theme-primary) 0%, var(--theme-accent) 100%); | ||||||
|  |   color: white; | ||||||
|  |   border-radius: 16px 16px 0 0 !important; | ||||||
|  |   padding: 20px 24px !important; | ||||||
|  |    | ||||||
|  |   .modal-title { | ||||||
|  |     color: white; | ||||||
|  |     font-weight: 600; | ||||||
|  |     font-size: 20px; | ||||||
|  |     margin: 0; | ||||||
|  |     font-family: var(--theme-font-secondary); | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .close { | ||||||
|  |     color: white; | ||||||
|  |     opacity: 0.8; | ||||||
|  |      | ||||||
|  |     &:hover { | ||||||
|  |       opacity: 1; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modal Body | ||||||
|  | ::ng-deep .modal-body { | ||||||
|  |   padding: 24px !important; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Modal Footer | ||||||
|  | ::ng-deep .modal-footer { | ||||||
|  |   padding: 20px 24px !important; | ||||||
|  |   background: var(--theme-background); | ||||||
|  |   border-radius: 0 0 16px 16px !important; | ||||||
|  |   border-top: 1px solid rgba(0, 0, 0, 0.05) !important; | ||||||
|  |   display: flex; | ||||||
|  |   justify-content: flex-end; | ||||||
|  |   gap: 12px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Recaptcha Container Styles | ||||||
|  | .recaptcha-container { | ||||||
|  |   display: flex; | ||||||
|  |   flex-direction: column; | ||||||
|  |   gap: 8px; | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | .recaptcha-code { | ||||||
|  |   display: flex; | ||||||
|  |   align-items: center; | ||||||
|  |   gap: 12px; | ||||||
|  |   padding: 12px; | ||||||
|  |   background: var(--theme-background); | ||||||
|  |   border-radius: 8px; | ||||||
|  |   border: 1px solid rgba(0, 0, 0, 0.1); | ||||||
|  |    | ||||||
|  |   b { | ||||||
|  |     font-size: 18px; | ||||||
|  |     letter-spacing: 2px; | ||||||
|  |     font-family: 'Courier New', monospace; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // Toggle Styles | ||||||
|  | .clr-toggle-wrapper { | ||||||
|  |   display: flex; | ||||||
|  |   align-items: center; | ||||||
|  |   gap: 8px; | ||||||
|  |    | ||||||
|  |   label { | ||||||
|  |     margin-bottom: 0; | ||||||
|  |     font-weight: 500; | ||||||
|  |     color: var(--theme-text); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | // URL Field Styles | ||||||
|  | .ug-form-input[type="url"] { | ||||||
|  |   font-family: monospace; | ||||||
|  | } | ||||||
|  | // Responsive adjustments | ||||||
|  | @media (max-width: 768px) { | ||||||
|  |   .ug-hero { | ||||||
|  |     flex-direction: column; | ||||||
|  |     gap: 16px; | ||||||
|  |     text-align: center; | ||||||
|  |      | ||||||
|  |     &__content { | ||||||
|  |       flex-direction: column; | ||||||
|  |       text-align: center; | ||||||
|  |     } | ||||||
|  |      | ||||||
|  |     &__actions { | ||||||
|  |       width: 100%; | ||||||
|  |       justify-content: center; | ||||||
|  |       flex-wrap: wrap; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .ug-toolbar { | ||||||
|  |     flex-direction: column; | ||||||
|  |     gap: 16px; | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .ug-search { | ||||||
|  |     max-width: 100%; | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .ug-cards { | ||||||
|  |     grid-template-columns: 1fr; | ||||||
|  |   } | ||||||
|  |    | ||||||
|  |   .ug-card-item { | ||||||
|  |     &__header { | ||||||
|  |       flex-direction: column; | ||||||
|  |       text-align: center; | ||||||
|  |        | ||||||
|  |       &__icon { | ||||||
|  |         margin-right: 0; | ||||||
|  |         margin-bottom: 16px; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |      | ||||||
|  |     &__footer { | ||||||
|  |       justify-content: center; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | .recaptcha-code { | ||||||
|  |     flex-direction: column; | ||||||
|  |     align-items: flex-start; | ||||||
|  |      | ||||||
|  |     .ug-btn { | ||||||
|  |       align-self: flex-end; | ||||||
|  |     } | ||||||
|  |   }} | ||||||
| @ -0,0 +1,328 @@ | |||||||
|  | import { Component, OnInit } from '@angular/core'; | ||||||
|  | import { ToastrService } from 'ngx-toastr'; | ||||||
|  | import { AlertService } from 'src/app/services/alert.service'; | ||||||
|  | import { Testaservice} from './Testa.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 { Testacardvariable } from './Testa_cardvariable'; | ||||||
|  | import { UserInfoService } from 'src/app/services/user-info.service'; | ||||||
|  | import { CsvService } from 'src/app/services/csv.service'; | ||||||
|  | import { TranslateService } from '@ngx-translate/core'; | ||||||
|  | import { ThemeService } from 'src/app/services/theme.service'; | ||||||
|  | import { Subscription } from 'rxjs'; | ||||||
|  | import { ExcelService } from 'src/app/services/excel.service'; | ||||||
|  | import * as moment from 'moment'; | ||||||
|  | declare var JsBarcode: any;  | ||||||
|  | @Component({ | ||||||
|  |   selector: 'app-Testa', | ||||||
|  |   templateUrl: './Testa.component.html', | ||||||
|  |   styleUrls: ['./Testa.component.scss'] | ||||||
|  | }) | ||||||
|  | export class TestaComponent implements OnInit { | ||||||
|  |   cardButton = Testacardvariable.cardButton; | ||||||
|  |   cardmodeldata = Testacardvariable.cardmodeldata; | ||||||
|  |   public dashboardArray: DashboardContentModel2[]; | ||||||
|  |   isCardview = Testacardvariable.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 = 'Testa_formCode' | ||||||
|  | tableName = 'Testa';  checkFormCode; selected: any[] = []; | ||||||
|  | filterText: string = ''; | ||||||
|  |   viewMode: 'table' | 'cards' = 'cards'; | ||||||
|  |   private themeSubscription: Subscription; constructor( | ||||||
|  |     private extensionService: ExtensionService, | ||||||
|  | private userInfoService:UserInfoService, | ||||||
|  |     private mainService:Testaservice, | ||||||
|  |     private alertService: AlertService, | ||||||
|  |     private toastr: ToastrService, | ||||||
|  | private csvService: CsvService, | ||||||
|  |     private translate: TranslateService, | ||||||
|  |     private themeService: ThemeService,  | ||||||
|  | private excel: ExcelService,    private _fb: FormBuilder, | ||||||
|  |   ) { } | ||||||
|  | 
 | ||||||
|  |   switchLanguage(language: string) { | ||||||
|  |     this.translate.use(language); | ||||||
|  |   }  | ||||||
|  |   private editInterval: any; | ||||||
|  | // component button 
 | ||||||
|  |   ngOnInit(): void { | ||||||
|  |  this.themeSubscription = this.themeService.currentTheme$.subscribe(() => { | ||||||
|  |       // Theme changes will automatically update CSS variables
 | ||||||
|  |       // This triggers a re-render of themed elements
 | ||||||
|  |     }); | ||||||
|  |     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], | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   }); // 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 === "Testa_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 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   } | ||||||
|  |  ngOnDestroy(): void { | ||||||
|  |  if (this.themeSubscription) { | ||||||
|  |       this.themeSubscription.unsubscribe(); | ||||||
|  |     } | ||||||
|  |     if (this.editInterval) { | ||||||
|  |       clearInterval(this.editInterval); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   get filteredGroups(): any[] { | ||||||
|  |     const items: any[] = (this.product as unknown as any[]) || []; | ||||||
|  |     const text = (this.filterText || '').toLowerCase(); | ||||||
|  |     if (!text) { return items; } | ||||||
|  |     return items.filter(g => ( | ||||||
|  | ((g?.name || '').toString()).toLowerCase().includes(text) || | ||||||
|  | 
 | ||||||
|  | ((g?.description || '').toString()).toLowerCase().includes(text)  | ||||||
|  | 
 | ||||||
|  |     )); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   setViewMode(mode: 'table' | 'cards') { this.viewMode = mode; } | ||||||
|  |   onExport() { | ||||||
|  |     this.excel.exportAsExcelFile(this.product, 'user_', | ||||||
|  |       moment().format('YYYYMMDD_HHmmss')) | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |  error;  | ||||||
|  |   getData() { | ||||||
|  |     this.mainService.getAll().subscribe((data) => { | ||||||
|  |       console.log(data); | ||||||
|  |       this.product = data; | ||||||
|  | this.product = [...this.product].reverse(); 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() { | ||||||
|  | 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;   } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   // csv
 | ||||||
|  | 
 | ||||||
|  |   modalCsv = false; | ||||||
|  |   selectedFiles: File; | ||||||
|  |   fileList; | ||||||
|  |   ttype = 'usergroupmaintenance'; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  |   // Import CSV
 | ||||||
|  |   public selectFile(event) { | ||||||
|  |     this.selectedFiles = event.target.files[0]; | ||||||
|  |     // this.saveCsv();
 | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   csvImport() { | ||||||
|  |     console.log("import CSV"); | ||||||
|  |     this.modalCsv = true; | ||||||
|  |   } | ||||||
|  |   saveCsv() { | ||||||
|  |     this.csvService.importCsv(this.selectedFiles, this.ttype).subscribe(data => { | ||||||
|  |       console.log(data); | ||||||
|  |       this.fileList = data; | ||||||
|  |       this.modalCsv = false; | ||||||
|  |     }, | ||||||
|  |       (error) => { | ||||||
|  |         console.log(error); | ||||||
|  |         if (error.status == 202) { | ||||||
|  |           this.toastr.success(error.error.text) | ||||||
|  |         } | ||||||
|  |       }); | ||||||
|  |   } | ||||||
|  | 
 | ||||||
|  |   downloadFiles() { | ||||||
|  |     this.csvService.downloadCsvs(this.ttype); | ||||||
|  | 
 | ||||||
|  |   } | ||||||
|  | // updateaction
 | ||||||
|  | } | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| @ -0,0 +1,37 @@ | |||||||
|  | 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 Testaservice{ | ||||||
|  |   private baseURL = "Testa/Testa" ;  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
 | ||||||
|  | } | ||||||
| @ -0,0 +1,4 @@ | |||||||
|  | export const Testacardvariable = { | ||||||
|  |     "cardButton": false, | ||||||
|  |     "cardmodeldata": `` | ||||||
|  | } | ||||||
| @ -1,3 +1,4 @@ | |||||||
|  | import { TestaComponent } from './BuilderComponents/basicp1/Testa/Testa.component'; | ||||||
| 
 | 
 | ||||||
| import { SequencegenaratorComponent } from './fnd/sequencegenarator/sequencegenarator.component'; | import { SequencegenaratorComponent } from './fnd/sequencegenarator/sequencegenarator.component'; | ||||||
| import { Component, NgModule } from '@angular/core'; | import { Component, NgModule } from '@angular/core'; | ||||||
| @ -269,6 +270,9 @@ const routes: Routes = [ | |||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|       // buildercomponents
 |       // buildercomponents
 | ||||||
|  | {path:'Testa',component:TestaComponent}, | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| 
 | 
 | ||||||
|       { path: 'tokenregistery', component: Token_registeryComponent }, |       { path: 'tokenregistery', component: Token_registeryComponent }, | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -1,3 +1,4 @@ | |||||||
|  | import { TestaComponent } from './BuilderComponents/basicp1/Testa/Testa.component'; | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| import { CommonModule } from '@angular/common'; | import { CommonModule } from '@angular/common'; | ||||||
| @ -146,6 +147,9 @@ import { OauthComponent } from './builder/dashboardnew/sureconnect/oauth/oauth.c | |||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|     // buildercomponents
 |     // buildercomponents
 | ||||||
|  | TestaComponent, | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user