// ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // IMPORTS // //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // Core Angular Imports //---------------------------------------------------------- import { Component, OnInit, ViewChild, HostListener,ElementRef } 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 @ViewChild('scrollContainer',{ static: false }) scrollContainer: ElementRef; @ViewChild('categoryList', { static: false }) categoryList!: ElementRef; //++++++++++++++++++++++++++ // // 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; isAllSelected :boolean=false; isRoomActive:boolean=false; isBayActive:boolean=false; isBaySelected:boolean=false; isCategoryCompleted:boolean=false; isEquipmentCompleted:boolean=false; isShowEquipmentTemplate:boolean=false; isSelectAllChecked: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 selectedItems: any[] = []; // Store selected items categoryListForAddBays=[] // stores cat info for add bays filteredMachines: any[] = []; // Holds the filtered list of machines roomname=""// room name tagname=""// tag name activeschedule="" isSldCategoryName="" 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 sldGroupAssetID=[] sldType:any=""// type is Bay or Room activeTab: any = 'All'; // Default active tab //Arrays //----------------------------------------------- selectedTypes: string[] = []; filteredMachine: any[] = [] // stores the detais of machine 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 DisplayedStaff=[] activeBay=[] activeItem=[] filteredRooms = []; // Populate this list dynamically based on data filteredBays = []; // Populate this list dynamically based on data bays: any[] = []; selectedAssets:any[]=[] 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 :any[]= []; // Initially, all staff are displayed filteredBaysRooms=[] // store the data of bays and rooms sldModalID:number; pageRange: number = 2; totalPages:number=1 // Assuming there are 20 pages; adjust as needed. currentPage: number = 1; itemsPerPage:number=7; sldEquipmentList=[]// store info sldCategoryList:any=[] selectedMachines= []; // Stores selected machines 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") this.selectedMachines = []; // Clear selections on component load localStorage.removeItem('selectedMachines'); // Clear stored selections this.selectedItems = []; // Clear selections on component load localStorage.removeItem('selectedItems'); // Clear stored selections const savedItems = localStorage.getItem('selectedItems'); this.selectedItems = savedItems ? JSON.parse(savedItems) : []; this.getSlotDuration() const storedMachines = JSON.parse(localStorage.getItem('selectedMachines')) || []; this.selectedMachines = storedMachines; // Restore `AddedStatus` to reflect saved state this.filteredMachines.forEach(machine => { machine.Machines.forEach(asset => { asset.AddedStatus = this.isSelectedAssets(asset); // Restore state }); }); this.selectedMachines = JSON.parse(localStorage.getItem('selectedMachines')) || []; // 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.allBaysList=[] 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.allBaysList=res; this.selectBaysRoom(res[0]) this.showallitems=res; console.log(this.allBaysList); } }); } /** * @method function * @name filterStaff * @description Method to filter staff list based on search term */ filterStaff() { const query = this.searchTerm.toLowerCase(); // Filter staff based on the active tab let staffList = this.getAllRoomsList; if (this.activeTab === 'Room') { staffList = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 1); } else if (this.activeTab === 'Bay') { staffList = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 2); } // Apply search filter if there is a query if (query) { staffList = staffList.filter(staff => staff.Name.toLowerCase().includes(query) || staff.Tag.toLowerCase().includes(query) ); } // Apply search filter on the selected tab's data this.filteredStaff = staffList.filter(staff => staff.Name.toLowerCase().includes(query) || staff.Tag.toLowerCase().includes(query) ); // Preserve checked state this.filteredStaff.forEach(staff => { staff.checked = this.sldRoomsBaysList.some(value => value.GymBRID === staff.GymBRID); }); this.selectBaysRoom(this.filteredStaff[0]) console.log("Filtered Staff after search:", this.filteredStaff); } /** * @method function * @name selectBaysRoom * @HttpMethod GET * @description Get Selected BAys and Rooms Details */ selectBaysRoom(values) { console.log(values) this.loadData(); 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=[] this.filteredBaysRooms=[] 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; this.loadData() } }); } else{ this.isActiveEditSetting=false 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; // // Handle adding/removing the message from selected items // const deleteForFolderMessage = { // sldAssetId: values.sldAssetId, // Source: values.Source, // }; // 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 // } // } // onCheckRoomsBays(values, event) { // console.log(values); // const checked = event.target.checked; // if (checked) { // this.sldRoomsBaysList.push(values); // this.sldGymBridList.push(values.GymBRID); // this.sldGymBRID = values.GymBRID; // } else { // this.sldRoomsBaysList = this.sldRoomsBaysList.filter( // (item) => item.GymBRID !== values.GymBRID // ); // this.sldGymBridList = this.sldGymBridList.filter( // (id) => id !== values.GymBRID // ); // } // console.log(this.sldRoomsBaysList); // //Ensure icons update correctly when unchecking // this.isActiveAdd = this.sldRoomsBaysList.length === 0; // this.isActiveDelete = this.sldRoomsBaysList.length > 0; // this.isActiveEdit = this.sldRoomsBaysList.length === 1; // } onCheckRoomsBays(values, event) { console.log(values); const checked = event.target.checked; // // If it's a Room, uncheck it immediately and return // if (values.type === "Room") { // event.target.checked = false; // return; // } if (checked) { this.sldRoomsBaysList.push(values); this.sldGymBridList.push(values.GymBRID); console.log(this.sldRoomsBaysList); console.log(this.sldGymBridList); } else { this.sldRoomsBaysList = this.sldRoomsBaysList.filter( (value) => value.GymBRID !== values.GymBRID ); this.sldGymBridList = this.sldGymBridList.filter( (id) => id !== values.GymBRID ); } console.log("Selected List:", this.sldRoomsBaysList); // Check if at least one Bay is selected this.isBaySelected = this.sldRoomsBaysList.length > 0; // Update icon states this.isActiveDelete = this.isBaySelected; this.isActiveEdit = this.isBaySelected && this.sldRoomsBaysList.length === 1; console.log("Delete Active:", this.isActiveDelete); console.log("Edit Active:", this.isActiveEdit); } /** * @method function * @name oncheckEquiptForDeleteAssets * @description Selecetion CheckBox Assets * Checekbox */ oncheckEquiptForDeleteAssets(value, event) { const checked = event.target.checked; if (checked) { if (!this.sldAssetId.includes(value.AssetID)) { this.sldAssetId.push(value.AssetID); } } else { const index = this.sldAssetId.indexOf(value.AssetID); if (index > -1) { this.sldAssetId.splice(index, 1); } } // Check if all are selected to sync "Select All" checkbox this.isAllSelected = this.sldAssetId.length === this.filteredBaysRooms.length; // Existing functionality for delete button this.isActiveDeleteAssets = this.sldAssetId.length >= 1; this.updateDisplayedBaysRooms(); console.log("Selected Asset IDs:", this.sldAssetId); } /** * ~ onAllcheckEquiptForDeleteAssets Select Message For Delete * # Method * @param(selected value, event) */ onAllcheckEquiptForDeleteAssets(event) { const checked = event.target.checked; if (checked) { // Select all AssetIDs this.sldAssetId = this.filteredBaysRooms.map(sdl => sdl.AssetID); } else { // Deselect all this.sldAssetId = []; } // Ensure Angular detects changes this.sldAssetId = [...this.sldAssetId]; // Update delete button status this.isActiveDeleteAssets = this.sldAssetId.length >= 1; this.updateDisplayedBaysRooms(); console.log("Select All Checked:", checked); console.log("Current Selected Assets:", this.sldAssetId); } /** * @method updateIcons * @description Enable/Disable icons based on selected items */ updateIcons() { // Enable delete icon if at least one checkbox is selected this.isActiveDeleteAssets = this.sldAssetId.length > 0; } /** * @method refreshCard * @description Reset checkboxes and selected data */ // refreshCard() { // this.sldRoomsBaysList=[] // //this.chooseStateType(this.statType) // // setTimeout(() => { // // this.loadData(); // // }, 1000); // // this.getAllRooms("All") // this.isActiveEdit = false; // this.isActiveEditSetting=false // this.isActiveDeleteAssets = false; // this.isActiveAdd = true; // // console.log(this.isActiveEdit); // // console.log(this.isActiveEditSetting); // console.log(this.isActiveDeleteAssets) // // } refreshCard(value) { this.sldRoomsBaysList = []; this.sldAssetId = []; if (value == 'CSL'){ this.filteredStaff = this.filteredStaff.map(value => ({ ...value, checked: false, })); this.isActiveDelete=false; this.isActiveEdit = false; this.isActiveAdd = true; this.selectBaysRoom(this.filteredStaff[0]) } else if (value== 'LOS'){ this.filteredBaysRooms = this.filteredBaysRooms.map(value => ({ ...value, checked: false, })); this.isActiveEditSetting = false; this.isActiveDeleteAssets = false; this.isActiveAdd = true; } this.isSelectAllChecked = false; this.filteredBaysRooms = [...this.filteredBaysRooms]; this.filteredStaff = [...this.filteredStaff]; } /** * @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{ // console.log(this.capacity); // 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","New Space added successfully"); // // 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, // // }); // } // }); // } saveBaysRoom() { let typeNo; let baysroomdetails: any = {}; 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, }; } // API Endpoint const url = this.apiServer + "resource/savespace"; // API Call this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { console.log(res); if (res.status === "Success") { this.notificationService.showNotification("Success", "New Space added successfully"); // Add to the master list this.getAllRoomsList = [...this.getAllRoomsList, baysroomdetails]; // **Check which tab is active & update accordingly** if (this.activeTab === "Bay") { this.filteredStaff = this.getAllRoomsList.filter(space => space.SpaceTypeID === 2); } else if (this.activeTab === "Rooms") { this.filteredStaff = this.getAllRoomsList.filter(space => space.SpaceTypeID === 1); } else if (this.activeTab === "All") { this.filteredStaff = [ ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 2), // Bays first ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 1), // Rooms below ]; } this.getAllRooms(this.activeTab) console.log("Updated List after Add:", this.filteredStaff); // this.chooseStateType(this.activeTab) this.closeAddModal(); } else { this.notificationService.showNotification("Error", "Something Went Wrong"); } }); } /** * @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; // console.log(this.activeTab); 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.toString(), }; } //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(this.activeTab) this.notificationService.showNotification("Success","Space details 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, // }); } }); } // 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, // }; // } // const url = this.apiServer + "resource/updatebrinfo"; // this.allRoomBaysForAdd.push(baysroomdetails); // this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { // console.log(res); // if (res.status === "Success") { // this.notificationService.showNotification("Success", "Space details successfully updated"); // // Update the edited item in getAllRoomsList // this.getAllRoomsList = this.getAllRoomsList.map(item => // // item.GymBRID === baysroomdetails.GymBRID ? { ...item, ...baysroomdetails } : item // ); // // **Ensure only active tab data is updated** // if (this.activeTab === "Room") { // this.filteredStaff = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 1); // } else if (this.activeTab === "Bay") { // this.filteredStaff = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 2); // } else { // this.filteredStaff = [...this.getAllRoomsList]; // Show all for "All" tab // } // console.log("Filtered Staff after edit:", this.filteredStaff); // this.selectBaysRoom(this.filteredStaff[0]); // // Reset selections // this.sldGymBridList = []; // this.allRoomBaysForAdd = []; // this.sldGymBRID = null; // this.sldRoomsBaysList = []; // this.isActiveAdd = true; // this.isActiveDelete = false; // this.isActiveEdit = false; // this.isActiveEditSetting = false; // console.log(this.slotDuration); // this.closeAddModal(); // } else { // this.notificationService.showNotification("Error", "Something Went Wrong"); // } // }); // } /** * @method function * @name chooseStateType * @description chooseStateType type selection from Tab */ // chooseStateType(val: string) { // this.activeTab = val; // console.log("Active Tab:", val); // let SpaceTypeID; // // Clear previous selections so they don't persist across tabs // this.sldRoomsBaysList = []; // this.sldGymBridList = []; // this.isActiveDelete = false; // this.isActiveEdit = false; // // Reset all checkboxes in the full list (important to prevent checked state persistence) // this.getAllRoomsList.forEach(staff => staff.checked = false); // if (val === 'All') { // // Show all rooms/bays without keeping previous selections // this.filteredStaff = this.getAllRoomsList.map(staff => ({ ...staff, checked: false })); // Ensure fresh data // console.log(this.filteredStaff); // // Always select the first item in "All" // if (this.filteredStaff.length > 0) { // const firstItem = this.filteredStaff[0]; // this.activeItem = firstItem.GymBRID; // Highlight the first item // this.selectBaysRoom(firstItem); // Update the selected Bay/Room // } // this.loadData(); // return; // } // if (val === 'Room') { // SpaceTypeID = 1; // } else if (val === 'Bay') { // SpaceTypeID = 2; // } else { // this.filteredStaff = this.getAllRoomsList.map(staff => ({ ...staff, checked: false })); // console.log(this.filteredStaff); // return; // } // // Filter the staff list based on selected type // this.filteredStaff = this.getAllRoomsList // .filter(staff => staff.SpaceTypeID === SpaceTypeID) // .map(staff => ({ ...staff, checked: false })); // Ensure fresh unselected data // // Automatically select the first Room when switching to "Room" tab // if (val === 'Room' && this.filteredStaff.length > 0) { // const firstRoom = this.filteredStaff[0]; // this.activeItem = firstRoom.GymBRID; // Highlight the first Room // this.selectBaysRoom(firstRoom); // Update selection // } // // Automatically select the first Bay when switching to "Bay" tab // if (val === 'Bay' && this.filteredStaff.length > 0) { // const firstBay = this.filteredStaff[0]; // this.activeBay = firstBay.GymBRID; // Highlight the first Bay // this.selectBaysRoom(firstBay); // Update selection // } // console.log("Filtered Staff:", this.filteredStaff); // } // chooseStateType(val: string) { // this.activeTab = val; // console.log("Active Tab:", val); // let SpaceTypeID; // // Clear previous selections so they don't persist across tabs // this.sldRoomsBaysList = []; // this.sldGymBridList = []; // this.isActiveDelete = false; // this.isActiveEdit = false; // this.searchTerm = ''; // // Reset all checkboxes in the full list (important to prevent checked state persistence) // this.getAllRoomsList.forEach(staff => staff.checked = false); // if (val === 'All') { // // Show all rooms and bays, maintaining proper order (Bays first, then Rooms) // this.filteredStaff = [ // ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 2), // Bays first // ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 1), // Rooms below // ].map(staff => ({ ...staff, checked: false })); // Ensure fresh unselected data // console.log(this.filteredStaff); // // Always select the first item in "All" // if (this.filteredStaff.length > 0) { // const firstItem = this.filteredStaff[0]; // this.activeItem = firstItem.GymBRID; // Highlight the first item // this.selectBaysRoom(firstItem); // Update the selected Bay/Room // } // this.loadData(); // Ensure the data is loaded when switching to "All" // return; // } // // Define SpaceTypeID based on the tab selected // if (val === 'Room') { // SpaceTypeID = 1; // } else if (val === 'Bay') { // SpaceTypeID = 2; // } else { // this.filteredStaff = this.getAllRoomsList.map(staff => ({ ...staff, checked: false })); // console.log(this.filteredStaff); // return; // } // // **Filter based on selected type without affecting order** // this.filteredStaff = this.getAllRoomsList // .filter(staff => staff.SpaceTypeID === SpaceTypeID) // .map(staff => ({ ...staff, checked: false })); // Ensure fresh unselected data // // **Auto-select first item in the tab** // if (this.filteredStaff.length > 0) { // const firstItem = this.filteredStaff[0]; // this.activeItem = firstItem.GymBRID; // this.selectBaysRoom(firstItem); // } // console.log("Filtered Staff:", this.filteredStaff); // } chooseStateType(val: string) { this.activeTab = val; // this.getAllRooms(val); // this.getAllRooms(val); // Reset selections & states this.sldRoomsBaysList = []; this.sldGymBridList = []; this.isActiveDelete = false; this.isActiveEdit = false; this.searchTerm = ''; // Uncheck all items in the full list this.getAllRoomsList.forEach(staff => (staff.checked = false)); // Handle "All" case - Show Bays first, then Rooms if (val === 'All') { this.filteredStaff = [ ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 2), // Bays first ...this.getAllRoomsList.filter(space => space.SpaceTypeID === 1), // Rooms below ].map(staff => ({ ...staff, checked: false })); console.log(this.filteredStaff); this.selectFirstItem(); this.loadData(); this.resetScroll(); // Reset scroll when switching tabs return; } // Determine SpaceTypeID for filtering const SpaceTypeID = val === 'Room' ? 1 : val === 'Bay' ? 2 : null; // Filter based on selected type this.filteredStaff = SpaceTypeID ? this.getAllRoomsList .filter(staff => staff.SpaceTypeID === SpaceTypeID) .map(staff => ({ ...staff, checked: false })) : this.getAllRoomsList.map(staff => ({ ...staff, checked: false })); console.log("Filtered Staff:", this.filteredStaff); this.selectFirstItem(); this.resetScroll(); // Reset scroll when switching tabs } // Helper function to select the first item private selectFirstItem() { if (this.filteredStaff.length > 0) { const firstItem = this.filteredStaff[0]; this.activeItem = firstItem.GymBRID; this.selectBaysRoom(firstItem); } } // Helper function to reset scroll position private resetScroll() { setTimeout(() => { if (this.scrollContainer) { this.scrollContainer.nativeElement.scrollTop = 0; } }); } /** * @method function * @name scrollLeft * @description it is used scroll left side */ scrollLeft() { this.categoryList.nativeElement.scrollBy({ left: -250, behavior: 'smooth' }); } /** * @method function * @name scrollRight * @description it is used scroll rigth side */ scrollRight() { this.categoryList.nativeElement.scrollBy({ left: 250, behavior: 'smooth' }); } /** * @method function * @name removeFilter * @description it is used to reset the filters */ 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="Bay"; this.sldRoomsBaysList = [] this.getSlotDuration() this.isOpenAddSpace=true this.isBayActive=true this.isRoomActive=true } /** * @method function * @name closeAddModal * @description it is used to close the modal */ closeAddModal(){ this.isOpenAddSpace=false this.selectedMachines = []; localStorage.removeItem('selectedMachines'); this.selectedItems = []; localStorage.removeItem('selectedItems'); // Full reset to avoid persisting old selections this.tagname = ''; this.roomname = ''; this.insType = ''; this.capacity = null; this.slotDuration = null; this.isRoomActive = false; this.isBayActive = false; } /** * @method function * @name resetForm * @description it used to reset the values and form */ // 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="Bay"; // 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() { // Reset fields to default or empty values before setting new values this.tagname = ''; this.roomname = ''; this.insType = ''; this.capacity = null; this.slotDuration = 30; this.getSlotDuration(); // Proceed with logic to add a new room or bay if (this.sldRoomsBaysList.length > 0) { this.tagname = this.sldRoomsBaysList[0].Tag; this.roomname = this.sldRoomsBaysList[0].Name; if (this.sldRoomsBaysList[0].SpaceTypeID == 1) { this.insType = "Room"; this.isRoomActive = true; // Track Room is active this.isBayActive = false; // Deactivate Bay } else { this.insType = "Bay"; this.capacity = this.sldRoomsBaysList[0].SpaceCapacity; this.slotDuration = this.sldRoomsBaysList[0].BayDurationType; this.isRoomActive = false; // Deactivate Room this.isBayActive = true; // Activate Bay } } // this.isOpenAddSpace = true; // this.roomEditModal.show(); } //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ // // SUB- METHODS // //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ /** * @method function * @name selectType * @description Add Room submit button form submit */ // selectType(type: string): void { // if (type === 'Bay') { // this.insType = 'Bay'; // this.isOpenAddSpace = true; // } else if (type === 'Room') { // this.insType = 'Room'; // this.isOpenAddSpace = true; // } // } selectType(value) { console.log(value); // Reset only if switching between Room and Bay if (this.insType !== value) { if (value === "Bay") { this.roomname = ""; this.tagname = ""; this.capacity = null; this.slotDuration = null; } else if (value === "Room") { this.roomname = ""; this.tagname = ""; } } this.insType = value; this.isOpenAddSpace = true; } /** * @method function * @name addEquipment * @descriptionit is used to add new equipments. */ addEquipment(newEquipment) { this.filteredStaff.push(newEquipment); // Add new equipment } /** * @method function * @name backtoEquipmentView * @descriptionit is used to close or back the Equipment view */ backtoEquipmentView(){ this.isShowAddEquipment=false; this.sldEquipmentList=[] this.sldRoomsBaysList = [] this.isActiveEditSetting=false this.isActiveDeleteAssets=false this.isCategoryCompleted=true this.isEquipmentCompleted=false this.isActiveDelete=false this.isActiveEdit=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","Spaces successfully deleted"); // // **Update the filtered list after deletion** // this.filteredStaff = this.filteredStaff.filter(room => // !this.sldGymBridList.includes(room.GymBRID) // );this.filteredStaff // this.getAllRooms("All") // this.refreshCard(this.filteredStaff); // this.refreshCard(this.filteredBaysRooms); // 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"); // } // }) // } deleteBaysAndRooms() { let baysroomdetails = { GymBRID: this.sldGymBridList.toString() }; const url = this.apiServer + "resource/deletespace/" + this.XBID; this.apiCall.makePostApiCall(url, baysroomdetails).then((res: any) => { console.log(res); if (res.status === "Success") { this.notificationService.showNotification("Success", "Spaces successfully deleted"); // Remove deleted items from getAllRoomsList // this.getAllRoomsList = this.getAllRoomsList.filter(room => // !this.sldGymBridList.includes(room.GymBRID) // ); this.getAllRoomsList = this.getAllRoomsList.filter(room => !this.sldGymBridList.includes(room.GymBRID.toString().replace(/[^0-9]/g, '')) ); // **Filter staff list based on active tab** if (this.activeTab === "Room") { this.filteredStaff = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 1); } else if (this.activeTab === "Bay") { this.filteredStaff = this.getAllRoomsList.filter(staff => staff.SpaceTypeID === 2); } else { this.filteredStaff = [...this.getAllRoomsList]; // Show all for "All" tab } // Reset selection if (this.filteredStaff.length > 0) { const firstItem = this.filteredStaff[0]; this.activeItem = firstItem.GymBRID; this.selectBaysRoom(firstItem); } // Call filterStaff() to update search results this.filterStaff(); this.refreshCard(this.filteredStaff); this.refreshCard(this.filteredBaysRooms); this.sldRoomsBaysList = []; this.getAllRooms(this.activeTab) this.sldGymBridList = []; this.isActiveAdd = true; this.isActiveDelete = false; this.isActiveEdit = false; this.isActiveEditSetting = false; this.allRoomBaysForAdd = []; this.closeDeleteRoomsandBays(); console.log("Filtered Staff after deletion:", this.filteredStaff); } else { this.notificationService.showNotification("Error", "Something Went Wrong"); } }); } /** * @method function * @name openModalforAddEquip(){ * @description Add Equipment show Modal for adding into bays */ openModalforAddEquip(){ this.isCategoryCompleted=true; this.isShowAddEquipment=true; this.getallequipmentcategoriesforbay() this.selectedMachines = []; // Reset selections this.selectedItems=[]; localStorage.removeItem('selectedMachines'); // Clear stored selections localStorage.removeItem('selectedItems'); } /** * @method function * @name getAllEquipmentAndAssets(){ * @description GEt All Equipment and assets number in Add Bays Form * GET API */ getallequipmentcategoriesforbay(){ this.isCategoryCompleted=true; this.getAllAssets=[] const url =this.apiServer +"resource/getallequipmentcategoriesforbay/" + this.XBID + "/" + this.sldGymBRID; this.apiCall.makeGetApiCall(url).then((res: any) => { console.log(res); if(res.length!=0){ this.getAllAssets=res; } }); } // Function to go back to the Add Equipment page // goBack() { // this.isAddEquipmentPage = true; // Go back to the Add Equipment page // } // Function to handle Add Equipment action // addEquipment() { // console.log("Equipment Added"); // } /** * @method function * @name getallcategorywiseassetinfoforbay * @description GEt All Equipment in Add Bays Form * GET API */ getAllCategoryList(){ const url = this.apiServer + "resource/getallcategorywiseassetinfoforbay/" + this.XBID + "/" + this.sldGymBRID;; const equipCatTypeIDs = this.selectedItems.map(item => item.EquipCatTypeID); //API Call //----------------------------------------------------------- this.apiCall.makePostApiCall(url,equipCatTypeIDs).then((res: any) => { console.log(res) if (res.length!=0) { this.categoryListForAddBays=res; this.activateCategory(res[0]) //this.activateCategory(res) } }); } // activateCategory(value) { // console.log(value); // this.isSldCategoryName = value.CategoryName; // // Create a map of previously selected equipment // const selectedMap = new Map(); // if (this.filteredMachines) { // this.filteredMachines.forEach(machine => { // if (machine.checked) { // selectedMap.set(machine.AssetID, true); // } // }); // } // // Filter and map machines, restoring checked state and AddedStatus // this.filteredMachines = this.categoryListForAddBays // .filter(item2 => item2.CategoryName === value.CategoryName) // // .flatMap(item2 => item2.AssetInfo) // .map(machine => ({ // ...machine, // checked: selectedMap.get(machine.AssetID), // Restore checked state // AddedStatus: this.isEquipmentAlreadyInBay(machine.AssetID) // Ensure correct disabled state // })); // console.log(this.filteredMachines); // } // /** // * Checks if an equipment is already in the bay // */ // isEquipmentAlreadyInBay(assetID: number): boolean { // return this.selectedMachines.some(category => // category.assets.some(asset => asset.assetID === assetID) // ); // } /** * @method function * @name activateCategory(){ * @description Machines belonging to that category are displayed. * @description Previously selected machines remain checked even if the category is switched. */ activateCategory(value) { console.log(value); this.isSldCategoryName = value.CategoryName; // Create a map of previously selected equipment const selectedMap = new Map(); if (this.filteredMachines) { this.filteredMachines.forEach(machine => { if (machine.checked) { selectedMap.set(machine.AssetID, true); } }); } // Filter and map machines, restoring checked state if previously selected this.filteredMachines = this.categoryListForAddBays .filter(item => item.CategoryName === value.CategoryName) .map(item => item.AssetInfo) .reduce((acc, assetArray) => acc.concat(assetArray), []) .map(machine => ({ ...machine, checked: selectedMap.get(machine.AssetID) || false // Restore checked state })); console.log(this.filteredMachines); } /** * @method function * @name activateCategory(){ * @description It checks whether the machines are selected. */ // Check if the machine is selected // isSelectedAssets(machine): boolean { // let variant = this.selectedMachines.find(m => m.variantName === machine.VariantName); // return variant ? variant.assets.some(a => a.assetID === machine.AssetID) : false; // } isSelectedAssets(item: any): boolean { return this.selectedMachines.some(machine => machine.assets.some(asset => asset.assetID === item.AssetID) ); } /** * @method function * @name toggleSelectionAssets() * @description function is designed to manage the selection and deselection of machines when a user interacts with a checkbox. */ // toggleSelectionAssets(machine, value,event) { // console.log(value); // console.log(machine); // let variantIndex = this.selectedMachines.findIndex(m => m.variantName === machine.VariantName); // if (event.target.checked) { // const assetObj = { // assetID: value.AssetID, // assetSerialNo: value.AssetSerailNo, // equipCategoryName: value.EquipCategoryName, // }; // if (variantIndex === -1) { // this.selectedMachines.push({ // variantName: machine.VariantName, // assets: [assetObj], // }); // } else { // let existingVariant = this.selectedMachines[variantIndex]; // let assetExists = existingVariant.assets.some(a => a.assetID === value.AssetID); // if (!assetExists) { // existingVariant.assets.push(assetObj); // } // } // } else { // if (variantIndex !== -1) { // let existingVariant = this.selectedMachines[variantIndex]; // existingVariant.assets = existingVariant.assets.filter(a => a.assetID !== value.AssetID); // if (existingVariant.assets.length === 0) { // this.selectedMachines.splice(variantIndex, 1); // } // } // } // // **Persist selection state** // console.log('Selected Machines:', this.selectedMachines); // } toggleSelectionAssets(machine, value, event) { console.log(value); console.log(machine); let variantIndex = this.selectedMachines.findIndex(m => m.variantName === machine.VariantName); if (event.target.checked) { //value.AddedStatus = true; // Ensure checkbox stays checked const assetObj = { assetID: value.AssetID, assetSerialNo: value.AssetSerailNo, equipCategoryName: value.EquipCategoryName, }; if (variantIndex === -1) { this.selectedMachines.push({ variantName: machine.VariantName, assets: [assetObj], }); } else { let existingVariant = this.selectedMachines[variantIndex]; let assetExists = existingVariant.assets.some(a => a.assetID === value.AssetID); if (!assetExists) { existingVariant.assets.push(assetObj); } } } else { value.AddedStatus = false; // Ensure checkbox stays unchecked if (variantIndex !== -1) { let existingVariant = this.selectedMachines[variantIndex]; existingVariant.assets = existingVariant.assets.filter(a => a.assetID !== value.AssetID); if (existingVariant.assets.length === 0) { this.selectedMachines.splice(variantIndex, 1); } } } // **Persist selection state** localStorage.setItem('selectedMachines', JSON.stringify(this.selectedMachines)); console.log('Selected Machines:', this.selectedMachines); } /** * @method function * @name goToprevious() * @description it used to move or return previous equipment page */ goToprevious(){ this.isCategoryCompleted=true this.isEquipmentCompleted=false // this.selectedItems=[] } /** * @method function * @name goToCategory * @description function appears to handle navigation logic */ goToCategory() { this.isCategoryCompleted = false; this.isEquipmentCompleted = true; this.getAllCategoryList(); console.log("Selected Items:", this.selectedItems); } /** * @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"; for(const i of this.selectedMachines) { for(const j of i.assets){ let updateAdd = { BID:this.XBID, GymBRID:this.sldGymBRID, AssetID:j.assetID, } this.sldCheckBoxAssetsList.push(updateAdd) } } console.log( this.sldCheckBoxAssetsList) //return; //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.selectedMachines=[] this.selectedItems=[] 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){ //commented this becauz for deleteion functionality this.allBaysList=res; this.loadData() // this.filteredBaysRooms=res; // } }); } /** * @method Method * @name getDisplayIndex * @description This method calculates the display index for a staff member in a paginated list. */ //pagination// getDisplayIndex(index: number): number { return (this.currentPage - 1) * this.itemsPerPage + index + 1; } /** * @method Method * @name updateDisplayedStaff * @description Filters, paginates, and updates the staff list based on user selection. */ updateDisplayedBaysRooms() { this.filteredBaysRooms = []; this.itemsPerPage = 7; const totalItems = this.sldType == 2 ? this.allBaysList.length : this.allClassScheduledList.length; const totalPages = Math.ceil(totalItems / this.itemsPerPage); // Ensure currentPage is within valid range this.currentPage = Math.max(1, Math.min(this.currentPage, totalPages)); const startIndex = (this.currentPage - 1) * this.itemsPerPage; let endIndex = startIndex + this.itemsPerPage; // Ensure endIndex does not exceed total items endIndex = Math.min(endIndex, totalItems); if (this.sldType == 2) { this.filteredBaysRooms = this.allBaysList.slice(startIndex, endIndex); } else { this.filteredBaysRooms = this.allClassScheduledList.slice(startIndex, endIndex); } // Ensure delete icon is enabled only if a selected checkbox exists on the current page this.updateDeleteButtonState(); console.log("Displaying items from", startIndex, "to", endIndex); console.log(this.filteredBaysRooms); } updateDeleteButtonState() { this.isActiveDeleteAssets = this.sldAssetId.some(id => this.filteredBaysRooms.some(item => item.AssetID === id) ); } /** * @method Method * @name onPageChangeList * @description Updates the current page when a user clicks a page number. */ onPageChangeList(page: number) { //if (page === '...') return; // Ignore '...' clicks this.currentPage = page; this.updateDisplayedBaysRooms(); } /** * @method function * @name goToPreviousPageList * @description Calls updateDisplayedStaff() to update the displayed items. */ // Pagination navigation goToPreviousPageList() { if (this.currentPage > 1) { this.currentPage--; this.updateDisplayedBaysRooms(); } } /** * @method function * @name goToNextPageList * @description Moves to the next page. */ goToNextPageList() { if (this.currentPage < this.totalPages) { this.currentPage++; this.updateDisplayedBaysRooms(); } } /** * @method Function * @name getDisplayedPagesList * @description it is used to handle current page number and large page ranges in a pagination. */ 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 loadData * @description Pagination Bays and rooms in card */ loadData() { // this.isLoading = true; // Start loading // setTimeout(() => { this.itemsPerPage =7 if(this.sldType==2){ this.totalPages = Math.ceil(this.allBaysList.length / this.itemsPerPage); } else{ this.totalPages = Math.ceil(this.allClassScheduledList.length / this.itemsPerPage); } this.updateDisplayedBaysRooms(); console.log(this.totalPages); console.log(this.allBaysList); console.log(this.allClassScheduledList); // this.isLoading = false; // End loading // }, 100); // Simulate a delay } /** * @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.getAllRooms("All") this.closeDeleteEquipment() this.getAllRooms("All") this.refreshCard(this.filteredStaff); this.refreshCard(this.filteredBaysRooms) this.sldAssetId=[] this.isActiveDeleteAssets=false this.notificationService.showNotification("Success","Equipment successfully deleted"); } else{ this.sldAssetId=[] this.notificationService.showNotification("Error","Something Went Wrong"); } }); } /** * @method Function * @name openDeleteEquipment() * @description it used to open Equipment modal page */ openDeleteEquipment(){ this.isModalDeleteEquipment=true } /** * @method Function * @name closeDeleteEquipment() * @description it used to close Equipment modal page */ closeDeleteEquipment(){ this.isModalDeleteEquipment=false } /** * @method Function * @name selectQuickAddProduct() * @description used to select Product */ selectQuickAddProduct(value){ console.log(value) this.sldModalID=value.ModelID //sldEquipmentList //sldCategoryList } /** * @method Function * @name preventEKey() * @description used to prevent users from entering certain characters (e, E, +, -, .), in an input field, likely to restrict input to whole numbers. */ preventEKey(event: KeyboardEvent) { if (event.key === 'e' || event.key === 'E' || event.key === '+' || event.key === '-' || event.key === '.') { event.preventDefault(); } } /** * @method Function * @name isSelected() * @description checks the items which is selected */ // Check if an item is selected isSelected(item: any): boolean { return this.selectedItems.some((selected) => selected.EquipGrpID === item.EquipGrpID); } // isSelected(item: any): boolean { // return this.selectedMachines.some(machine => // machine.assets.some(asset => asset.assetID === item.AssetID) // ); // } /** * @method Function * @name isDisabled() * @description it disables the items which is already in bay */ // Disable items that are already in the bay isDisabled(item: any): boolean { return this.selectedItems.some((selected) => selected.AssetID === item.AssetID); } /** * @method Function * @name toggleSelection() * @description toggle selection on checkbox change */ // toggleSelection(item: any, event?: Event): void { // if (event) { // event.stopPropagation(); // Prevent parent div from triggering // } // const isChecked = this.isSelected(item); // if (isChecked) { // this.selectedItems = this.selectedItems.filter((selected) => selected.EquipGrpID !== item.EquipGrpID); // } else { // this.selectedItems.push(item); // } // localStorage.setItem('selectedItems', JSON.stringify(this.selectedItems)); // console.log("Selected Items:", this.selectedItems); // } toggleSelection(item: any, event?: Event): void { if (event) { event.stopPropagation(); // Prevent parent div from triggering } const isChecked = this.isSelected(item); if (isChecked) { // Remove category this.selectedItems = this.selectedItems.filter((selected) => selected.EquipGrpID !== item.EquipGrpID); // Remove associated equipment this.selectedMachines = this.selectedMachines.filter(machine => !machine.assets.some(asset => asset.equipCategoryName === item.CategoryName) ); } else { this.selectedItems.push(item); } // Persist changes localStorage.setItem('selectedItems', JSON.stringify(this.selectedItems)); localStorage.setItem('selectedMachines', JSON.stringify(this.selectedMachines)); console.log("Selected Items:", this.selectedItems); console.log("Selected Machines (after category update):", this.selectedMachines); } /** * @method Function * @name countSelectedAssets() * @description 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; } /** * @method Function * @name toggleAssetsList() * @description Function to toggle asset list visibility */ toggleAssetsList(index: number) { this.sldEquipmentList[index].isExpanded = !this.sldEquipmentList[index].isExpanded; } //--------------------------------------------------------------------------------------------------- // END------------------------------------------------------------------------------------------- }