fix : updated RC

btc-UI/src/app/components/sidebar/sidebar.component.css

@@ -379,24 +379,26 @@
 
 /* View RC Modal Box */
 .viewrc-modal-box {
-  width: 800px;
+  width: 1100px;
-  height: 500px;
+  height: 800px;
-  background: #fff;
+  background: hsl(210, 100%, 100%);
-  color: black;
+  color: rgb(0, 0, 0);
   padding: 30px;
   border-radius: 6px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
   display: flex;
   flex-direction: column;
+
 }
 
 /* View RC Modal Title */
 .viewrc-modal-title {
   text-align: center;
   font-weight: bold;
-  font-size: 20px;
+  font-size: 25px;
   color: #2980b9;
   margin-bottom: 20px;
+  
 }
 
 /* View RC Modal Body */
@@ -408,10 +410,29 @@
   flex: 1;
   margin-bottom: 20px;
   overflow-y: auto; /* 👈 Adds scroll when needed */
-  max-height: 350px; /* 👈 Limit the height to leave space for footer */
+  max-height: 700px; /* 👈 Limit the height to leave space for footer */
   padding-right: 10px; /* Optional: avoids content touching scrollbar */
+  border-radius: 0.6rem;
+  background-color: rgb(228, 237, 252);
 }
 
+.new{
+  color: #0077b6;
+  font-size: 1.8rem;
+  font-weight: bold;
+}
+
+.table_col{
+  color: rgb(19, 88, 128);
+  font-size: 1.5rem;
+  font-weight: bold;
+}
+
+.table_col1{
+  color: #01050f;
+  font-size: 1.5rem;
+  font-weight: bold;
+}
 /* View RC Modal Footer */
 .viewrc-modal-footer {
   display: flex;
@@ -420,6 +441,17 @@
   gap: 10px;
 }
 
+
+h4{
+  font-size: 1.6rem;
+  font-weight: bold;
+}
+
+.top{
+ font-size: 1.4rem;
+ font-weight: bold;
+}
+
 .viewrc-cancel-btn,
 .viewrc-print-btn {
   flex: 1;

btc-UI/src/app/components/sidebar/sidebar.component.html

@@ -205,46 +205,47 @@
 </div>
 
 
+
 <!-- View RC Modal -->
 <div class="viewrc-modal-overlay" *ngIf="showViewRc">
   <div class="viewrc-modal-box">
     <h3 class="viewrc-modal-title">VIEW RC</h3>
     <div class="viewrc-modal-body">
       <ng-container *ngIf="raceCardData && !raceCardData.error; else errorTpl">
-        <p><strong>📍 Venue:</strong> {{ raceCardData.Venue }}</p>
+        <p class="top"><strong>📍 Venue:</strong> {{ raceCardData.Venue }}</p>
-        <p><strong>📅 Date:</strong> {{ raceCardData.date }}</p>
+        <p class="top"><strong>📅 Date:</strong> {{ raceCardData.date }}</p>
 
         <div class="rc-table-container">
           <h4>🏇 Race Lists</h4>
           <table class="rc-table">
             <thead>
               <tr>
-                <th>Races</th>
+                <th class="new">Races</th>
-                <th>Race Numbers</th>
+                <th class="new">Race Numbers</th>
               </tr>
             </thead>
             <tbody>
               <tr *ngFor="let races of raceCardData.raceVenueRaces.races; let i = index">
-                <td>Race {{ i + 1 }}</td>
+                <td class="table_col">Race {{ i + 1 }}</td>
-                <td>{{ races.join(', ') }}</td>
+                <td class=" table_col1">{{ races.join('  , ') }}</td>
               </tr>
             </tbody>
           </table>
         </div>
 
         <div class="rc-table-container" *ngIf="raceCardData.pools?.comboRaces">
-          <h4>🎯 Combo Races</h4>
+          <h4>🎯Races</h4>
           <table class="rc-table">
             <thead>
               <tr>
-                <th>Pool</th>
+                <th class="new">Pool</th>
-                <th>Races</th>
+                <th class="new">Races</th>
               </tr>
             </thead>
             <tbody>
               <tr *ngFor="let pool of objectKeys(raceCardData.pools.comboRaces)">
-                <td>{{ pool }}</td>
+                <td class="table_col">{{ pool }}</td>
-                <td>{{ raceCardData.pools.comboRaces[pool].join(', ') }}</td>
+                <td class="table_col1">{{ raceCardData.pools.comboRaces[pool].join('  ,  ') }}</td>
               </tr>
             </tbody>
           </table>
@@ -258,7 +259,6 @@
 
     <div class="viewrc-modal-footer">
       <button class="viewrc-cancel-btn" (click)="closeViewRcPopup()">CANCEL</button>
-      <button class="viewrc-print-btn" (click)="printViewRc()">PRINT</button>
     </div>
   </div>
 </div>

btc-UI/src/app/components/sidebar/sidebar.component.ts

@@ -65,10 +65,57 @@ export class SidebarComponent {
     this.payoutTicketNo = '';
   }
 
-  printPayoutTicket() {
+  //--------------------Printer Logic added here ----------------------------------------------
-    alert(`Printing Payout Ticket No: ${this.payoutTicketNo}`);
+
-    this.closePayoutPopup();
+
-  }
+
+  
+printPayoutTicket() {
+  console.log("🖨️ Print ticket clicked");
+  alert(`Printing Payout Ticket No: ${this.payoutTicketNo}`);
+
+  const TicketNumber = this.payoutTicketNo;
+
+  // 🔓 Retrieve userName from localStorage
+  const userName = localStorage.getItem('userName') || 'Unknown';
+
+  const printData = {
+    TicketNumber: TicketNumber,
+    printedBy: userName, // Optional if you want to show it
+    Dividend: '10'
+
+  };
+
+  // 🖨️ Actual print request
+  const payload = {
+    type: 'payout',
+    ticketNumber: printData.TicketNumber,
+    printedBy: printData.printedBy,   // Optional
+    dividend: printData.Dividend
+  };
+
+  fetch('http://localhost:9100/print', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(payload)
+  })
+  .then(response => {
+    if (!response.ok) {
+      throw new Error(`Printer error: ${response.status}`);
+    }
+    return response.text();
+  })
+  .then(result => {
+    console.log("✅ Print successful:", result);
+  })
+  .catch(error => {
+    console.error("❌ Print failed:", error);
+  });
+
+  this.closePayoutPopup();
+}
+
+
 
   openDepositPopup() {
     this.depositClick.emit();