fixed : auto fetched the btid from system in login time also

btc-UI/src/app/components/touch-pad-menu/touch-pad-menu.component.css

@@ -1,6 +1,5 @@
 /* 🔲 Base Styles */
 .touch-pad-container {
-  /*background-color: #cc0f0f;*/
   border: 1px solid #ccc;
   padding: 1rem;
   border-radius: 8px;
@@ -100,6 +99,7 @@ button {
   background-color: #1f5664 !important;
   color: white;
 }
+
 /* ✅ Responsive Tablet/Mobile Styles */
 @media (max-width: 800px) {
   .container-fluid {
@@ -171,8 +171,56 @@ button {
   }
 }
 
-@media (min-width: 801px) {
+/* ✅ Tablet View (800px to 1030px) */
-  /* Remove container padding on desktop to align buttons edge-to-edge */
+@media (min-width: 801px) and (max-width: 1045px) {
+  .touch-pad-container .container-fluid.mb-2 {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex {
+    flex-direction: row;
+    justify-content: space-between;
+    gap: 1rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.first {
+    flex: 0 0 50%;
+    justify-content: flex-start;
+    gap: 0.5rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.second {
+    flex: 0 0 50%;
+    justify-content: flex-end;
+    gap: 0.5rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.first button {
+    min-width: 90px;
+    font-size: 0.9rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.second button {
+    min-width: 90px;
+    font-size: 0.9rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.second button:nth-child(1) {
+    margin-left: 0;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.second button:nth-child(2) {
+    margin-left: 0.5rem;
+  }
+
+  .touch-pad-container .container-fluid.mb-2 > .d-flex > div.second button:nth-child(3) {
+    margin-left: 0.5rem;
+  }
+}
+
+/* ✅ Desktop View */
+@media (min-width: 1045px) {
   .touch-pad-container .container-fluid.mb-2 {
     padding-left: 0;
     padding-right: 0;
@@ -315,9 +363,11 @@ button {
     /* background-color: blue; */
     height: 8%;
   }
+
   .container-fluid {
     height: 90%;
   }
+
   .wrapper {
     height: 95%;
   }
@@ -332,6 +382,7 @@ button {
   .wrapper-pad {
     height: 98%;
   }
+
   .custom-touchpad {
     height: 95%;
   }
@@ -418,8 +469,9 @@ button {
   grid-column: span 2;
   background-color: #0077b6;
 }
-.calc-backspace-btn{
+
-margin-right: -120px;
+.calc-backspace-btn {
+  margin-right: -120px;
   background-color: #0077b6;
 }
 
@@ -477,6 +529,7 @@ button.ready-to-print {
   background-color: #f8d7da !important;
   color: #721c24;
 }
+
 /* 🟦 FIELD Modal Overlay */
 .field-modal {
   display: none;
@@ -486,7 +539,7 @@ button.ready-to-print {
   left: 0;
   width: 100%;
   height: 100%;
-  background-color: rgba(0,0,0,0.5);
+  background-color: rgba(0, 0, 0, 0.5);
 }
 
 /* 📦 Modal Content */
@@ -498,7 +551,7 @@ button.ready-to-print {
   max-width: 90%;
   border-radius: 10px;
   border: 3px solid #007bff;
-  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
   text-align: center;
 }
 
@@ -507,13 +560,7 @@ button.ready-to-print {
   display: flex;
   justify-content: space-between;
   align-items: center;
-      margin-right: 47%;
+  margin-right: 47%;
-}
-
-.field-modal-header h5 {
-  margin: 0;
-  font-weight: bold;
-  color: #007bff;
 }
 
 /* ❌ Close Button */
@@ -578,7 +625,6 @@ button.ready-to-print {
   font-weight: bold;
 }
 
-
 /* 🟦 Custom FIELD Button */
 .btn-field {
   background-color: #2772af; /* Bootstrap secondary base */
@@ -601,10 +647,7 @@ button.ready-to-print {
   background-color: #757373;
   /* border-color: #b1b1b1; */
 }
-.btn-bkp {
+
-  min-width: 60px;
-  font-weight: bold;
-}
 /* BOX Button Styling */
 .btn.three {
   background-color: #165d9b; /* Bootstrap secondary */
@@ -680,10 +723,13 @@ button.ready-to-print {
   justify-content: center;
   gap: 50px;
 }
-.pool-replace-btn{
+
+.pool-replace-btn {
   background-color: #125cac;
   color: white;
 }
+
+/* Limit Popup Modal */
 .limit-overlay {
   position: fixed;
   top: 0;
@@ -735,9 +781,15 @@ button.ready-to-print {
 .limit-button:hover {
   background-color: #0056b3;
 }
+
 .number-button button[disabled] {
-  background-color: #cccccc; /* Gray background for disabled */
+  background-color: #cccccc;
-  color: #666666; /* Darker text for contrast */
+  color: #666666;
-  cursor: not-allowed; /* Cursor indicates disabled state */
+  cursor: not-allowed;
-  opacity: 0.6; /* Slightly transparent */
+  opacity: 0.6;
+}
+
+.btn-bkp {
+  min-width: 60px;
+  font-weight: bold;
 }

btc-UI/src/app/login/login.component.ts

@@ -212,50 +212,54 @@ export class LoginComponent implements OnInit, OnDestroy {
   resetUserPassMessage() {
     this.passwordStatus = true;
   }
+//--------------------------------------NEW LOGIN LOGIC ----------------------------------------//
+async onSubmit(): Promise<void> {
+  if (this.loginForm.invalid) {
+    this.loginForm.markAllAsTouched();
+    return;
+  }
 
+  const { email, password } = this.loginForm.value;
 
+  // ✅ Await service (since it’s async)
+  (await this.btcService.userLogin(email, password)).subscribe({
+    next: (response) => {
+      const employee = response.body;
+      console.log('🧠 Raw employee response:', employee);
 
-  // ✅ Updated onSubmit with BTID
+      const userName = employee?.userName || 'Unknown User';
-  async onSubmit(): Promise<void> {
+      const employeeId = employee?.userIdNumber || email;
-    if (this.loginForm.invalid) {
-      this.loginForm.markAllAsTouched();
-      return;
-    }
 
-    const { email, password } = this.loginForm.value;
+      console.log('✅ Parsed name:', userName);
+      console.log('✅ Parsed ID:', employeeId);
 
-    this.btcService.userLogin(email, password).subscribe({
+      this.passwordStatus = true;
-      next: async (response) => {
-        const employee = response.body;
-        console.log('🧠 Raw employee response:', employee);
 
-        const userName = employee?.userName || 'Unknown User';
+      // ✅ Get the BTID the service fetched
-        const employeeId = employee?.userIdNumber || email;
+      const btid = this.btcService.btid;
+      console.log("📦 BTID from file (via service):", btid);
 
-        console.log('✅ Parsed name:', userName);
+      // ✅ Prepare print data
-        console.log('✅ Parsed ID:', employeeId);
+      const printData = {
+        name: userName,
+        employeeId: employeeId,
+        // btid: btid || "unknown",
+        action: 'login',
+        type: 'login'
+      };
 
-        this.passwordStatus = true;
+      console.log(printData.name);
+      console.log(printData.employeeId);
+      //console.log(printData.btid);
+      console.log(btid);
 
-        // ✅ Fetch BTID from Electron preload
+      // ✅ Store in localStorage
-        const btid = await (window as any).electronAPI?.getBtid?.();
+      localStorage.setItem('userName', userName);
-        console.log("📦 BTID from file:", btid);
+      localStorage.setItem('employeeId', employeeId);
+      localStorage.setItem('password', password);
+      localStorage.setItem('btid', btid || "unknown");
 
-        // Prepare print data
+      // ✅ Print first — login only if printing succeeds
-        const printData = {
-          name: userName,
-          employeeId: employeeId,
-          action: 'login',
-          type: 'login'
-        };
-
-        // ✅ Store in localStorage
-        localStorage.setItem('userName', userName);
-        localStorage.setItem('employeeId', employeeId);
-        localStorage.setItem('password', password);
-        localStorage.setItem('btid', btid || "unknown");
-
-        // ✅ Optional second screen + navigate
       // fetch('http://localhost:9100/print', {
       //   method: 'POST',
       //   headers: { 'Content-Type': 'application/json' },
@@ -264,25 +268,74 @@ export class LoginComponent implements OnInit, OnDestroy {
       //   .then((res) => {
       //     if (!res.ok) throw new Error('Print failed');
       //     console.log('🖨️ Print successful');
-            // Open second screen
-       (window as any).electronAPI?.openSecondScreen?.();
 
-      // // Navigate to home
+          // ✅ Only here we allow login
-        this.router.navigate(['/home']);
+          (window as any).electronAPI?.openSecondScreen?.();
-    //    })
+          this.router.navigate(['/home']);
-    //     .catch((err) => {
+        // })
-    //       console.error('‼️ Print failed', err);
+        // .catch((err) => {
-    //       this.loginError = 'Login OK, but printing failed.';
+        //   console.error('‼️ Print failed', err);
-    //     });
+        //   this.loginError = 'Login failed: printing service unavailable.';
+        //   this.passwordStatus = false; // reset status
+        // });
+    },
+    error: () => {
+      this.loginError = 'Invalid login credentials';
+    }
+  });
+}
+//-------------------------NEW LOGIN ENDS HERE -------------------------------------------------//
 
 
-    // },
+// async onSubmit(): Promise<void> {
-    //   error: () => {
+//   if (this.loginForm.invalid) {
-    //     this.loginError = 'Invalid login credentials';
+//     this.loginForm.markAllAsTouched();
-      },
+//     return;
-    });
+//   }
-  }
 
+//   const { email, password } = this.loginForm.value;
+
+//   // ✅ Await service (since it’s async)
+//   (await this.btcService.userLogin(email, password)).subscribe({
+//     next: (response) => {
+//       const employee = response.body;
+//       console.log('🧠 Raw employee response:', employee);
+
+//       const userName = employee?.userName || 'Unknown User';
+//       const employeeId = employee?.userIdNumber || email;
+
+//       console.log('✅ Parsed name:', userName);
+//       console.log('✅ Parsed ID:', employeeId);
+
+//       this.passwordStatus = true;
+
+//       // ✅ Get the BTID the service fetched
+//       const btid = this.btcService.btid;
+//       console.log("📦 BTID from file (via service):", btid);
+
+//       // Prepare print data
+//       const printData = {
+//         name: userName,
+//         employeeId: employeeId,
+//         action: 'login',
+//         type: 'login'
+//       };
+
+//       // ✅ Store in localStorage
+//       localStorage.setItem('userName', userName);
+//       localStorage.setItem('employeeId', employeeId);
+//       localStorage.setItem('password', password);
+//       localStorage.setItem('btid', btid || "unknown");
+
+//       // ✅ Open second screen + navigate
+//       (window as any).electronAPI?.openSecondScreen?.();
+//       this.router.navigate(['/home']);
+//     },
+//     error: () => {
+//       this.loginError = 'Invalid login credentials';
+//     }
+//   });
+// }
 
  showConfirmModal : boolean = false;
 

btc-UI/src/app/service/btc.service.ts

@@ -5,20 +5,60 @@ import { ApplicationHttpRouts } from '../constants/http-routs';
 @Injectable({
   providedIn: 'root',
 })
+
+// export class BtcService {
+//   constructor(private http: HttpClient) {}
+//   btid: string | null = null;
+//   //user login
+//   public userLogin(employeeId: string, password: string) {
+//     console.log('Login route ' + ApplicationHttpRouts.LOG_IN);
+//      this.btid = localStorage.getItem('btid');
+//     if (this.btid) {
+//   employeeId += "," + this.btid;
+// } else {
+//   employeeId += ",null"; // or just "," if you don’t want "null"
+// }
+//     return this.http.get<any>(ApplicationHttpRouts.LOG_IN, {
+//       headers: this.basicAuthCredentialsBuilder(employeeId, password),
+//       withCredentials: true,
+//       observe: 'response',
+//     });
+//   }
+
 export class BtcService {
   constructor(private http: HttpClient) {}
+  btid: string | null = null;
 
-  //user login
+  // user login
-  public userLogin(employeeId: string, password: string) {
+  public async userLogin(employeeId: string, password: string) {
-    console.log('Login route ' + ApplicationHttpRouts.LOG_IN);
+  console.log('Login route ' + ApplicationHttpRouts.LOG_IN);
 
-    return this.http.get<any>(ApplicationHttpRouts.LOG_IN, {
+  try {
-      headers: this.basicAuthCredentialsBuilder(employeeId, password),
+    if ((window as any).electronAPI?.getBtid) {
-      withCredentials: true,
+      this.btid = await (window as any).electronAPI.getBtid();
-      observe: 'response',
+    } else {
-    });
+      console.warn('Electron API not available — fallback to null');
+      this.btid = null;
+    }
+  } catch (err) {
+    console.error('Error fetching BTID:', err);
+    this.btid = null;
   }
 
+  // Append BTID after comma
+  if (this.btid) {
+    employeeId += ',' + this.btid;
+  } else {
+    employeeId += ',null';
+  }
+
+  return this.http.get<any>(ApplicationHttpRouts.LOG_IN, {
+    headers: this.basicAuthCredentialsBuilder(employeeId, password),
+    withCredentials: true,
+    observe: 'response',
+  });
+}
+
   // what goes to the backend for auth ... is the same as postman's basic auth
   private basicAuthCredentialsBuilder(
     employeeOrUserId: string,

docker/docker-compose.yml

@@ -31,7 +31,7 @@ services:
 
   spring:
     #image: mathewfrancisv/spring_back_postgres:v1.0.0
-    image: mathewfrancisv/btc_cezen_backend:v1.0.2
+    image: mathewfrancisv/btc_cezen_backend:v1.1.6
     container_name: spring_app
     ports:
       - "8083:8080" 
@@ -41,7 +41,7 @@ services:
       SPRING_DATASOURCE_URL: jdbc:postgresql://postgres:5432/horse
       SPRING_DATASOURCE_USERNAME: postgres # Ensure this matches POSTGRES_USER
       SPRING_DATASOURCE_PASSWORD: root     # Ensure this matches POSTGRES_PASSWORD
-      SPRING_DATASOURCE_CORSIP: http://10.83.77.61:4200
+      SPRING_DATASOURCE_CORSIP: http://10.74.231.61:4200
     #network_mode: host
     networks:
       - app_network