// ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // IMPORTS // //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // Core Angular Imports //---------------------------------------------------------- import { Component, OnInit, ViewChild, HostListener } from "@angular/core"; // Custom Imports //----------------------------- import { ModalDirective } from "ngx-bootstrap/modal"; import { environment } from "../../../../environments/environment"; import { ApicallService } from "../../../_services/apiCall/apicall.service"; import { HttpClient } from "@angular/common/http"; import { Router } from "@angular/router"; import { Subscription } from "rxjs"; // 3rd Party Libraray Imports //----------------------------- import { fromEvent, Observable, Subject } from "rxjs"; import { FormGroupDirective, NgForm } from "@angular/forms"; import { DatePipe } from "@angular/common"; import { WebsocketService } from "../../../_services/websocketSVC/websocket.service"; import { PopupService } from "src/app/_services/popup/services/popup.service"; // +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // COMPONENT DECLARATION // //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ @Component({ selector: 'app-bays', templateUrl: './bays.component.html', styleUrls: ['./bays.component.scss'] }) export class BaysComponent implements OnInit { // Forms //------------------------- @ViewChild("ASTF", { static: true }) ASTF: FormGroupDirective;// Add Rooms,Bays form @ViewChild("USTF", { static: true }) USTF: FormGroupDirective;// Edit Rooms,Bays form @ViewChild("roomAddModal", { static: true }) public roomAddModal: ModalDirective;// Add Rooms,Bays Modal @ViewChild("roomEditModal", { static: true }) public roomEditModal: ModalDirective;// Edit Rooms,Bays Modal @ViewChild("addEquipBays", { static: true }) public addEquipBays: ModalDirective;// Add Equipment into bays @ViewChild("deleteBaysRoom", { static: true }) public deleteBaysRoom: ModalDirective;// Add Equipment into bays //++++++++++++++++++++++++++ // // GLOBAL VARIABLES // //++++++++++++++++++++++++++ // IDs //------------------------- XBID: number;// BID FCID: number;// Gym ID userID: number;// User XID sldBRIDForShowBays:number// BRID slotDuration: number;// Duration is scheduling class // Flags & Switches //---------------------------------------------- models: any = {}; searchTerm = ''; // Variable to hold the search term isActiveDelete :boolean= false;// active delete icon isActiveAdd :boolean= true;// active add icon isActiveEdit:boolean= false;// active edit icon isActiveEditSetting:boolean= false;// active edit icon showmenu:boolean= false; isShowScroll :boolean = false;// scroll icon shows isShowPagination :boolean = false;// pagination icon cardheight: number; // check card height isActiveDeleteAssets:boolean=false; isShowPaginationProfile :boolean = false;// scroll icon shows isShowScrollProfile :boolean = false;// scroll icon shows isOpenAddSpace:boolean = false;// scroll icon shows isModalDeleteSpace:boolean = false;// scroll icon shows isShowAddEquipment:boolean = false;// scroll icon shows isModalDeleteEquipment:boolean=false; // Generals //---------------------------------------------- insType="Room"// type is room or bay roomname=""// room name tagname=""// tag name FirstName: any;// first name staffPage: number = 1;// satff page schedulePage: number = 1;// modal page schedulePage1: number = 1;// modal page staffPerPage: number = 4;// staff page schedulePerPage: number = 4;// staff page sldAsseted:any; // stores the selected values rooms statType="All"// type pf status sldBRNumber:number// selecetd Room number sldGymBRID:number// selecetd gymm brId capacity:number;// capcity of bays Name:any;// name of room / bays sldType=""// type is Bay or Room activeTab: string = 'All'; // Default active tab //Arrays //----------------------------------------------- selectedTypes: string[] = []; getAllRoomsList=[] // get all rooms and bays list allClassScheduledList=[]// get all class scheduled allRoomBaysForAdd=[]// all staff Add list showallitems=[]// scroll length show all items sldRoomsBaysList=[]// selecetd room bays list sldGymBridList=[]// selecetd gym br id allBaysList=[]// all list of bays sldCheckBoxAssetsList=[]// selection checkbox list added userDetails: any = {};// user details apiServer: string = environment.apiUrl; // Server API URL subscriptions: Array = []; // subscription list getAllAssets=[]// stored all assets Equipment sldAssetId=[]// seleects Assests ID from ceneter card bays slotDurationList = [];//duration list view filteredStaff = []; // Initially, all staff are displayed sldModalID:number; pageRange: number = 3; totalPages:number; // Assuming there are 20 pages; adjust as needed. currentPage: number = 1; itemsPerPage:number; sldEquipmentList=[]// store info sldCategoryList:any=[] categoryListForDropDown = [ { id: 1, value: "All", }, { id: 2, value: "Room", }, { id: 3, value: "Bay", }, ]; // Constructor //------------------------------------------------------------------------ constructor( // A. Declarations //-------------------------- private notificationService:PopupService, private apiCall: ApicallService, private http: HttpClient, private datePipe: DatePipe, private router: Router, // private socketSVC: WebsocketService ,// private BP: BreakpointObserver, ) { } // Angular LifeCycle //---------------------------------------------------- ngOnInit() { this.userDetails = JSON.parse(localStorage.getItem("userDetails")); this.XBID = this.userDetails.BID; this.userID = this.userDetails.XID; this.FCID = this.userDetails.FCID; this.chooseStateType("All") this.getAllRooms("All") // Add Bays Status By Using Socket //------------------------------------------------------------- // this.socketSVC.addBaysStatus("addbays-" +this.XBID).subscribe((res: any) => { // console.log(res); // if (res.Status == "Success") { // if(this.statType=="All"){ // this.getAllRooms("All") // } // else if(this.statType=="Bay"){ // this.getAllRooms("Bay") // } // else{ // this.getAllRooms("Room") // } // this.allRoomBaysForAdd=[] // } // }); // Update Bays Bays Status By Using Socket //------------------------------------------------------------- // this.socketSVC.updateBaysStatus("UpdateBays-" +this.XBID).subscribe((res: any) => { // console.log(res); // if (res.Status == "Success") { // // Edit Rooms/ Bays and socket will execute and give the response // // Edit response to getAllRoomsList array // console.log(this.getAllRoomsList); // for (const user of this.getAllRoomsList) { // if (res.BRInfo.GymBRID == user.GymBRID) { // console.log("Eneter into the conditions"); // this.isActiveEdit=false; // this.isActiveDelete=false // this.isActiveEditSetting=false // this.isActiveAdd=true // this.allRoomBaysForAdd=[] // user.Name=res.BRInfo.Name // user.Tag=res.BRInfo.Tag // user.BRType=res.BRInfo.BRType // user.BRNumber=res.BRInfo.BRNumber // user.GymBRID=res.BRInfo.GymBRID // user.SpaceTypeID=res.BRInfo.SpaceTypeID // // this.getAllRoomsList.unshift(test) // this.selectBaysRoom(res.BRInfo); // } // } // } // }); // deletestaff Socket //------------------------------------------------------------- // this.socketSVC.getdeletespace("deletespace-" +this.XBID).subscribe((res: any) => { // console.log("hi"); // console.log(res); // if (res.Status === "Success") { // this.refreshCard(); // } // }); // Unassign Socket //------------------------------------------------------------- // this.socketSVC.getUnAssignBays("UnAssignBays-" +this.XBID).subscribe((res: any) => { // console.log("UnAssignBays"); // console.log(res); // if (res.Status === "Success") { // this.refreshCard(); // this.getAllAssetsForBays() // this.getSlotDuration() // } // }); } //++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // METHODS // //++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // ------------------ Mouse Events and Browser Events End Here------------ //------------------------------------------------------------------------- //------------------------------------------------------------------------- //------------------------------------------------------------------------- /** * @method method * @name getSlotDuration * @description Get Slot Durations */ getSlotDuration() { this.slotDurationList = []; // ----------------------------------------------------------- // API Call getslotduration const url = this.apiServer + "resource/getslotduration"; this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); if (res.length > 0) { this.slotDurationList = res; } }); } /** * @method function * @name getAllRooms * @description GET API */ getAllRooms(val){ this.getAllRoomsList=[] this.showallitems=[] this.staffPage=1 // ----------------------------------------------------------------------------- // API Call getfcstaffwithadminandcoadmin const url =this.apiServer +"resource/getspaceinfo/" + this.XBID + "/" + val; this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); // ----------------------------------------------------------------------------- // response length is greater than 0 // Call selectStaff method if (res.length > 0) { this.getAllRoomsList=res; this.filteredStaff = res; this.selectBaysRoom(res[0]) this.showallitems=res; } }); } /** * @method function * @name filterStaff * @description Method to filter staff list based on search term */ filterStaff(): void { const query = this.searchTerm.toLowerCase(); this.filteredStaff = this.getAllRoomsList.filter(staff => staff.Name.toLowerCase().includes(query) || staff.Tag.toLowerCase().includes(query) ); } /** * @method function * @name selectBaysRoom * @HttpMethod GET * @description Get Selected BAys and Rooms Details */ selectBaysRoom(values) { console.log(values) this.sldType=values.SpaceTypeID; this.sldBRNumber=values.BRNumber; this.sldBRIDForShowBays=values.GymBRID this.sldGymBRID=values.GymBRID; this.allClassScheduledList=[] this.sldAssetId=[] this.sldAsseted=[] this.sldAsseted=values this.isActiveDeleteAssets=false const date = this.datePipe.transform(new Date(), "yyyy-MM-dd"); // ----------------------------------------------------------------------------- // API Call getfcstaffwithadminandcoadmin //this.sldRoomsBaysList[0].SpaceTypeID==2 if(values.SpaceTypeID!=2){ this.isActiveEditSetting=false this.allBaysList=[] const url =this.apiServer +"resource/getbayssessionprofile/" + this.XBID + "/"+ values.GymBRID + "/" + date; this.schedulePage=1 this.schedulePage1=1 this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); // ----------------------------------------------------------------------------- // response length is greater than 0 // Call selectStaff method if (res.length > 0) { this.allClassScheduledList=res; } }); } else{ this.isActiveEditSetting=true this.allClassScheduledList=[] this.getAllAssetsForBays() } } /** * @method function * @name onCheckRoomsBays * @description CheckBox selecetion is single selection */ onCheckRoomsBays(values,event){ console.log(values) const checked = event.target.checked; if(checked){ this.sldRoomsBaysList.push(values) this.sldGymBridList.push(values.AssetID) this.sldGymBRID=values.AssetID; } else{ const k = this.sldRoomsBaysList.findIndex( (std) => std.AssetID == values.AssetID ); this.sldRoomsBaysList.splice(k, 1); const j = this.sldGymBridList.findIndex( (stds) => stds.AssetID == values.AssetID ); this.sldGymBridList.splice(j, 1); } console.log( this.sldRoomsBaysList) //------------------------------------------------------------ // check the length and enables icons and disable icons //------------------------------------------------------------ if(this.sldRoomsBaysList.length >1){ this.isActiveAdd=false; this.isActiveDelete=true; this.isActiveEdit=false // this.isActiveEditSetting=false } else if(this.sldRoomsBaysList.length==1 && this.sldRoomsBaysList[0].SpaceTypeID==2){ this.isActiveAdd=false; this.isActiveDelete=true; this.isActiveEdit=true // this.isActiveEditSetting=true } else if(this.sldRoomsBaysList.length==1 && this.sldRoomsBaysList[0].SpaceTypeID!=2){ this.isActiveAdd=false; this.isActiveDelete=true; this.isActiveEdit=true // this.isActiveEditSetting=false } else{ this.isActiveAdd=true; this.isActiveDelete=false; this.isActiveEdit=false // this.isActiveEditSetting=false } } /** * @method function * @name refreshCard * @description Get Latest Data From Server */ refreshCard() { this.sldRoomsBaysList=[] //this.chooseStateType(this.statType) this.getAllRooms("All") this.isActiveEdit = false; this.isActiveEditSetting=false this.isActiveDelete = false; this.isActiveAdd = true; } /** * @method function * @name saveBaysRoom * @description POST API * based on the type no 1 or 2 like room / bays * sending payload capacity and duration null */ saveBaysRoom(){ let typeNo; let baysroomdetails={} if(this.insType=="Room"){ typeNo=1 baysroomdetails={ BID:this.XBID, Name:this.roomname, Tag:this.tagname, SpaceTypeID:typeNo, SpaceCapacity:null, SlotDurationTypeID:null, } } else{ typeNo=2 baysroomdetails={ BID:this.XBID, Name:this.roomname, Tag:this.tagname, SpaceTypeID:typeNo, SpaceCapacity:this.capacity, SlotDurationTypeID:this.slotDuration, } } // call API savespace // POST API---------------------------------------- //http://stage.minute.fit/api/resource/savebays const url = this.apiServer + "resource/savespace"; this.allRoomBaysForAdd.push(baysroomdetails) //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { console.log(res) if (res.status === "Success" ) { this.closeAddModal() this.getAllRooms("All") this.notificationService.showNotification("Success","Successfully Added"); // this._notification.remove() // this._notification.create("success", "Successfully Added", { // Position: "top-right", // Style: "flip bar", // Duration: 3000, // }); } else { this.allRoomBaysForAdd.push(baysroomdetails) this.notificationService.showNotification("Error","Something Went Wrong"); // this._notification.remove() // this._notification.create("danger", "Something Went Wrong", { // Position: "top-right", // Style: "flip bar", // Duration: 3000, // }); } }); } /** * @method function * @name updateBaysRoom * @description POST API updatebrinfo * based on the type no 1 or 2 like room / bays * sending payload capacity and duration null */ updateBaysRoom(){ let typeNo; let baysroomdetails={} if(this.insType=="Room"){ typeNo=1 baysroomdetails={ BID:this.XBID, GymBRID:this.sldRoomsBaysList[0].GymBRID, Name:this.roomname, Tag:this.tagname, SpaceTypeID:typeNo, SpaceCapacity:null, BRNumber :this.sldRoomsBaysList[0].BRNumber, SlotDurationTypeID:null, } } else{ typeNo=2 baysroomdetails={ BID:this.XBID, GymBRID:this.sldRoomsBaysList[0].GymBRID, Name:this.roomname, Tag:this.tagname, SpaceTypeID:typeNo, BRNumber :this.sldRoomsBaysList[0].BRNumber, SpaceCapacity:this.capacity, SlotDurationTypeID:this.slotDuration, } } //http://stage.minute.fit/api/resource/savebays const url = this.apiServer + "resource/updatebrinfo"; this.allRoomBaysForAdd.push(baysroomdetails) //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { console.log(res) if (res.status === "Success" ) { this.sldGymBridList=[] this.allRoomBaysForAdd=[] this.closeAddModal() // this.chooseStateType(this.statType) this.getAllRooms("All") this.notificationService.showNotification("Success","Successfully Updated"); // this._notification.remove() // this._notification.create("success", "Successfully Updated", { // Position: "top-right", // Style: "flip bar", // Duration: 3000, // }); this.sldGymBRID=null this.sldRoomsBaysList=[] this.isActiveAdd=true; this.isActiveDelete=false; this.isActiveEdit=false this.isActiveEditSetting=false } else { this.notificationService.showNotification("Error","Something Went Wrong"); //this.allRoomBaysForAdd.push(baysroomdetails) // this._notification.remove() // this._notification.create("danger", "Something Went Wrong", { // Position: "top-right", // Style: "flip bar", // Duration: 3000, // }); } }); } /** * @method function * @name chooseStateType * @description chooseStateType type selection from Tab */ chooseStateType(val:string){ this.activeTab=val console.log(val) let SpaceTypeID; if (val === 'All') { // If "All" is selected, show all staff this.filteredStaff = this.getAllRoomsList; console.log(this.filteredStaff); } //this.getAllRooms(val) if(val=='Room'){ SpaceTypeID=1 } else if(val=='Bay'){ SpaceTypeID=2 } else { this.filteredStaff = this.getAllRoomsList; console.log(this.filteredStaff); return; } this.filteredStaff = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === SpaceTypeID); console.log(this.filteredStaff); } removeFilter(filter) { // Reset the filter to "All" and show all items this.statType = 'All'; this.filteredStaff = this.getAllRoomsList; //this.filteredStaff = this.filteredStaff.filter(type => type !== filter); // this.selectedTypes = this.selectedTypes.filter(t => t !== filter); } /** * @method function * @name showAddModal * @description Add Room submit button form submit */ showAddModal(){ this.insType="Room"; this.getSlotDuration() this.isOpenAddSpace=true } closeAddModal(){ this.isOpenAddSpace=false } // Method to reset the form resetForm(form: NgForm) { form.resetForm(); // Reset form to its initial state // Reset additional flags or variables if needed this.insType="Room"; // Resetting default values this.closeAddModal() } /** * @method function * @name triggerAddContractorSubmit * @DEsc Trigger submit while adding contractor */ triggerAddContractorSubmit(form) { if(form.valid) { console.log('Form submitted:', this.models); if(this.isActiveEdit==false){ this.saveBaysRoom() } if(this.isActiveEdit==true){ this.updateBaysRoom() } // Reset the form after submission this.resetForm(form); } else { console.log('Form is invalid'); } } /** * @method function * @name activeEditModal * @description Add Room submit button form submit */ activeEditModal(){ this.tagname=this.sldRoomsBaysList[0].Tag this.roomname=this.sldRoomsBaysList[0].Name if(this.sldRoomsBaysList[0].SpaceTypeID==1){ this.insType="Room" } else{ this.insType="Bay" this.capacity=this.sldRoomsBaysList[0].SpaceCapacity this.slotDuration=this.sldRoomsBaysList[0].BayDurationType } this.getSlotDuration() this.isOpenAddSpace=true // this.roomEditModal.show() } //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // SUB- METHODS // //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ /** * @method function * @name selectType * @description Add Room submit button form submit */ selectType(value){ console.log(value) this.insType=value } /** * @method function * @name openModalforAddEquip(){ * @description Add Equipment show Modal for adding into bays */ openModalforAddEquip(){ this.isShowAddEquipment=true; this.getAllEquipmentAndAssets() } backtoEquipmentView(){ this.isShowAddEquipment=false; this.sldEquipmentList=[] this.isActiveEditSetting=false } /** * @method function * @name openActiveDeleteModal(){ * @description Delete rooms and bays open pop up */ openActiveDeleteModal(){ this.isModalDeleteSpace=true } /** * @method function * @name closeDeleteRoomsandBays(){ * @description Delete rooms and bays modal closed pop up */ closeDeleteRoomsandBays(){ this.isModalDeleteSpace=false } /** * @method function * @name deleteBaysAndRooms() * POST API deletespace */ deleteBaysAndRooms(){ let baysroomdetails={ GymBRID:this.sldGymBridList.toString(), } const url = this.apiServer + "resource/deletespace/" + this.XBID; //this.allRoomBaysForAdd.push(baysroomdetails) //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { console.log(res) if (res.status === "Success" ) { this.notificationService.showNotification("Success","Successfully Deleted"); this.refreshCard(); this.closeDeleteRoomsandBays() this.sldRoomsBaysList=[] this.sldGymBridList=[] this.isActiveAdd=true; this.isActiveDelete=false; this.isActiveEdit=false this.isActiveEditSetting=false this.allRoomBaysForAdd=[] } else { // this.allRoomBaysForAdd.push(baysroomdetails) this.notificationService.showNotification("Error","Something Went Wrong"); } }) } /** * @method function * @name getAllEquipmentAndAssets(){ * @description GEt All Equipment and assets number in Add Bays Form * GET API */ getAllEquipmentAndAssets(){ this.getAllAssets=[] const url =this.apiServer +"resource/getallassetsnotassignedtobay/" + this.XBID + "/" + this.sldGymBRID; this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); if(res.length!=0){ // if(this.allBaysList.length!=0){ // for(let i of res){ // for(let j of i.assettList){ // for(let k of this.allBaysList){ // if(j.AssetID===k.AssetID){ // j.checked="true"; // } // } // } // } // } this.getAllAssets=res; } }); } /** * @method function * @name selectCheckBoxReservation * @description Add and remove Equipment and assets into selecetd Bays * Seleect Checbox */ selectCheckBoxReservation(value,asset,event){ console.log(value) console.log(asset) const checked = event.target.checked; const values={ BID:this.XBID, AssetID:asset.AssetID, GymBRID:this.sldGymBRID, } // this.sldCheckBoxAssetsList=[] if(checked){ this.sldCheckBoxAssetsList.push(values) value.selectedCount = this.countSelectedAssets(value.assettList); } else{ const k = this.sldCheckBoxAssetsList.findIndex( (std) => std.AssetID === asset.AssetID ); this.sldCheckBoxAssetsList.splice(k, 1); } console.log(this.sldCheckBoxAssetsList) } /** * @method function * @name UpdateAddEquipToBays(){ * @description Add and remove Equipment and assets into selecetd Bays * POST API */ UpdateAddEquipToBays(){ const url = this.apiServer + "resource/assignassetstobays"; //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url, this.sldCheckBoxAssetsList).then((res: any) => { console.log(res) if (res.status === "Success" ) { this.isActiveEditSetting=false; this.isActiveDeleteAssets=false; this.sldGymBridList=[] this.sldRoomsBaysList=[] this.sldCheckBoxAssetsList=[] this.backtoEquipmentView() if(this.statType=="All"){ this.getAllRooms("All") } else if(this.statType=="Bay"){ this.getAllRooms("Bay") } else{ this.getAllRooms("Room") } this.notificationService.showNotification("Success","Equipment successfully added"); } else{ this.notificationService.showNotification("Error","Something Went Wrong"); } }) } /** * @method function * @name getAllAssetsForBays * @description Display assets into selecetd Bays * GET API getallassetsassignedtobay */ getAllAssetsForBays(){ this.schedulePage=1 this.schedulePage1=1 this.allBaysList=[] const url =this.apiServer +"resource/getallassetsassignedtobay/" + this.XBID + "/" +this.sldBRIDForShowBays; this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); if(res.length!=0){ this.allBaysList=res; } }); } /** * @method function * @name oncheckEquiptForDeleteAssets * @description Selecetion CheckBox Assets * Checekbox */ oncheckEquiptForDeleteAssets(value,event){ console.log(value) const checked = event.target.checked; if(checked){ this.sldAssetId.push(value.AssetID) } else{ const k = this.sldAssetId.findIndex( (std) => std.AssetID === value.AssetID ); this.sldAssetId.splice(k, 1); } console.log(this.sldAssetId) if(this.sldAssetId.length>=1){ this.isActiveDeleteAssets=true } else{ this.isActiveDeleteAssets=false } } getDisplayIndex(index: number): number { return (this.currentPage - 1) * this.itemsPerPage + index + 1; } updateDisplayedStaff() { this.filteredStaff=[] console.log(this.sldRoomsBaysList) this.itemsPerPage =6 const startIndex = (this.currentPage - 1) * this.itemsPerPage; console.log(startIndex) const endIndex = startIndex + this.itemsPerPage; console.log(endIndex) this.filteredStaff = this.sldRoomsBaysList.slice(startIndex, endIndex); console.log(this.filteredStaff) // this.selectStaff(this.filteredStaff[0]); } goToPreviousPageList() { if (this.currentPage > 1) { this.currentPage--; this.updateDisplayedStaff(); } } goToNextPageList() { if (this.currentPage < this.totalPages) { this.currentPage++; this.updateDisplayedStaff(); } } getDisplayedPagesList(): (number | string)[] { const pages: (number | string)[] = []; const total = this.totalPages; const current = this.currentPage; const range = this.pageRange; const startPage = Math.max(2, current - range); const endPage = Math.min(total - 1, current + range); pages.push(1); // First page if (startPage > 2) pages.push('...'); // Ellipsis for skipped pages for (let i = startPage; i <= endPage; i++) { pages.push(i); } if (endPage < total - 1) pages.push('...'); // Ellipsis for skipped pages if (total > 1) pages.push(total); // Last page return pages; } /** * @method function * @name deleteAssetsFromBays * @description POST API unassignassetsfrombays * Delete Assets from Bays */ deleteAssetsFromBays(){ let AssetID={ AssetID:this.sldAssetId.toString() } const url = this.apiServer + "resource/unassignassetsfrombays/"+ this.XBID; //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url, AssetID).then((res: any) => { console.log(res) if (res.status === "Success" ) { this.getAllAssetsForBays() this.closeDeleteEquipment() this.refreshCard() this.sldAssetId=[] this.isActiveDeleteAssets=false this.notificationService.showNotification("Success","Equipment successfully deleted"); } else{ this.sldAssetId=[] this.notificationService.showNotification("Error","Something Went Wrong"); } }); } openDeleteEquipment(){ this.isModalDeleteEquipment=true } closeDeleteEquipment(){ this.isModalDeleteEquipment=false } selectQuickAddProduct(value){ console.log(value) this.sldModalID=value.ModelID //sldEquipmentList //sldCategoryList } // Toggle selection of the clicked item toggleSelection(item: any) { console.log(item) const index = this.sldEquipmentList.findIndex(selectedItem => selectedItem.ModelID === item.ModelID); // return false; if (index > -1) { // If the item is already selected, remove it this.sldEquipmentList.splice(index, 1); } else { // If the item is not selected, add it to the array this.sldEquipmentList.push(item); } this.sldEquipmentList.forEach(cat => { if(cat.ModelID !== item.ModelID){ cat.assettList.forEach(asset => { asset.selected = asset.AssetStatus === 'Assigned'; console.log(asset.selected) // asset.selected = !asset.selected; }); } }); } // Method to calculate the number of selected assets for a category countSelectedAssets(assettList: any[]): number { console.log(assettList) return assettList.filter(asset => asset.selected).length; } // Check if an item is selected // isSelected(item: any): boolean { // return this.sldEquipmentList.some(selectedItem => selectedItem.ModelID === item.ModelID); // } // Function to toggle asset list visibility toggleAssetsList(index: number) { this.sldEquipmentList[index].isExpanded = !this.sldEquipmentList[index].isExpanded; } // Check if an item is selected isSelected(item) { return item.selected || false; } // Toggle item selection // toggleSelection(item) { // item.selected = !item.selected; // this.sldEquipmentList.forEach(cat => { // if(cat.ModelID !== item.ModelID){ // cat.assettList.forEach(asset => { // asset.selected = asset.AssetStatus === 'Assigned'; // console.log(asset.selected) // }); // } // }); // } // toggleAssetsList(index: number) { // // Toggle the expanded state for the clicked category // this.sldEquipmentList[index].isExpanded = !this.sldEquipmentList[index].isExpanded; // // Update the selected status based on both Assigned and non-Assigned assets // this.sldEquipmentList.forEach((cat, catIndex) => { // if (catIndex === index) { // // Only toggle the current category // cat.assettList.forEach(asset => { // // Check the current selected status and toggle it // if (asset.AssetStatus === 'Assigned') { // asset.selected = !asset.selected; // } else { // asset.selected = false; // Reset or change this logic as needed for other statuses // } // }); // } // }); // console.log('Updated asset list:', this.sldEquipmentList); // } //--------------------------------------------------------------------------------------------------- // END------------------------------------------------------------------------------------------- } const seledtedData = this.DisplayedStaff.filter((value) => value.AssetTypeID == 2); if (checked) { // Select All: Add all to `sldRoomsBaysList` this.sldRoomsBaysList = seledtedData.map((value) => ({ BID: value.XBID, AssetID: value.AssetID, EquipCatTypeID: value.AssetTypeID, CategoryName: value.CategoryName, ModelName:value.ModelName, AssetTag:value.AssetTag })); seledtedData.forEach((value) => { value.checked = true; // Mark as checked if (!this.sldAssetId.includes(value.AssetID)) { this.sldAssetId.push(value.AssetID); // Add sldAssetId } }); } this.isActiveDelete = this.sldAssetId.length > 0; this.isActiveDeleteAssets = this.sldAssetId.length > 0; // ✅ Correctly enable/disable settings icon this.isActiveEditSetting = this.sldAssetId.length > 0; // If no checkboxes are selected, disable everything if (this.sldAssetId.length === 0) { this.isActiveDelete = false; this.isActiveEditSetting = false; // ✅ Ensure settings button is OFF when no checkboxes are selected this.isActiveAdd = true; } // oncheckEquiptForDeleteAssets(value,event){ // console.log(value); // const checked = event.target.checked; // // Update the checked property of the individual message // value.checked = checked; // console.log(value.checked); // if(checked){ // this.sldAssetId.push(value.AssetID) // } // else{ // this.sldAssetId = this.sldAssetId.filter( // (id) => id. AssetID!== value.AssetID // ); // } // this.isSelectAllChecked = this.DisplayedStaff.every((value) => value.checked); // // console.log(this.sldAssetId) // // else{ // // const k = this.sldAssetId.findIndex( // // (std) => std.AssetID === value.AssetID // // ); // // this.sldAssetId.splice(k, 1); // // } // console.log(this.sldAssetId) // if(this.sldAssetId.length>=1){ // this.isActiveDeleteAssets=true // } // else{ // this.isActiveDeleteAssets=false // } // if(this.sldRoomsBaysList.length >1){ // this.isActiveAdd=false; // this.isActiveDelete=true; // this.isActiveEdit=false // // this.isActiveEditSetting=false // } // else if(this.sldRoomsBaysList.length==1 && this.sldRoomsBaysList[0].SpaceTypeID==2){ // this.isActiveAdd=false; // this.isActiveDelete=true; // this.isActiveEdit=true // // this.isActiveEditSetting=true // } // else if(this.sldRoomsBaysList.length==1 && this.sldRoomsBaysList[0].SpaceTypeID!=2){ // this.isActiveAdd=false; // this.isActiveDelete=true; // this.isActiveEdit=true // // this.isActiveEditSetting=false // } // else{ // this.isActiveAdd=true; // this.isActiveDelete=false; // this.isActiveEdit=false // // this.isActiveEditSetting=false // } // this.isActiveDeleteAssets = this.sldAssetId.length > 0; // if (this.sldAssetId.length > 0) { // // At least one checkbox is selected // this.isActiveDelete = true; // if (this.sldRoomsBaysList.length === 1) { // this.isActiveEditSetting = true; // } else { // this.isActiveEditSetting = false; // } // } else { // // No checkboxes are selected // this.isActiveDelete = false; // this.isActiveEditSetting = false; // } else { // Remove AssetID if unchecked this.sldAssetId = this.sldAssetId.filter(id => id !== value.AssetID); } // Check if all checkboxes are selected this.isSelectAllChecked = this.DisplayedStaff.every(item => item.checked); // Update icons based on selection this.updateIcons();
item

{{ item.CategoryName }}