FEAT_PREVIEW_INVOICE

2025-11-21 16:19:36 +05:30 · 2025-11-21 16:19:36 +05:30 · d3f387b9c5
commit d3f387b9c5
parent a4b47030f2
5 changed files with 809 additions and 7 deletions
--- a/app/Config/Routes.php
+++ b/app/Config/Routes.php
@ -777,6 +777,8 @@ $routes->group('payout', function($routes) {
    $routes->get('invoices', 'PayoutController::invoices');
    $routes->post('invoices/save', 'PayoutController::saveInvoice');
    $routes->get('invoices/history', 'PayoutController::auditHistory');
+    $routes->get('invoices/preview', 'PayoutController::preview');
+    $routes->get('invoices/downloadPdf/(:any)', 'PayoutController::downloadPdf/$1');
 });

 //PARTNER COMMISSION
--- a/app/Controllers/PayoutController.php
+++ b/app/Controllers/PayoutController.php
@ -11,6 +11,9 @@ use App\Models\InvoiceUtrModel;
 use App\Models\PolicyTransactionModel;
 use App\Models\AuditHistoryModel;

+use Dompdf\Dompdf;
+use Dompdf\Options;
+
 class PayoutController extends BaseController
 {   
    use ResponseTrait;
@ -451,4 +454,108 @@ class PayoutController extends BaseController

    }

+    // ****************************************************************************************************************************************************************
+
+    public function preview($invoiceId = null)
+    {   
+        $invoiceId = $this->request->getGet('invoice_id');
+
+        // Get invoice data from database
+        $invoiceData = $this->getInvoiceData($invoiceId);
+        
+        if (empty($invoiceData)) {
+            return $this->respond([
+                'status' => false,
+                'code' => 404,
+                'data' => '',
+                'message' => 'Invoice not found'
+            ], 200);
+        }
+        
+        // Load view with data
+        $html = view('invoice_template_2', $invoiceData);
+        // echo $html; die;
+        
+        return $this->respond([
+            'status' => true,
+            'code' => 200,
+            'data' => $html
+        ], 200);
+    }
+
+    public function downloadPdf($invoiceId = null, $type = 0)
+    {
+        // Get invoice data from database
+        $invoiceData = $this->getInvoiceData($invoiceId);
+        
+        if (empty($invoiceData)) {
+            return redirect()->back()->with('error', 'Invoice not found');
+        }
+        
+        // Generate HTML
+        $html = view('invoice_template_2', $invoiceData);
+        
+        // Configure Dompdf
+        $options = new Options();
+        $options->set('isHtml5ParserEnabled', true);
+        $options->set('isPhpEnabled', true);
+        $options->set('isRemoteEnabled', true);
+        $options->set('defaultFont', 'Arial');
+        $options->set('chroot', FCPATH);
+        
+        // Initialize Dompdf
+        $dompdf = new Dompdf($options);
+        
+        // Load HTML
+        $dompdf->loadHtml($html);
+        
+        // Set paper size and orientation
+        $dompdf->setPaper('A4', 'portrait');
+        
+        // Render PDF
+        $dompdf->render();
+        
+        // Generate filename
+        $filename = 'Invoice_' . $invoiceData['invoice_no'] . '_' . date('Ymd') . '.pdf';
+        
+        if($type == 0){
+            // Download PDF
+            return $this->response
+                ->setHeader('Content-Type', 'application/pdf')
+                ->setHeader('Content-Disposition', 'attachment; filename="' . $filename . '"')
+                ->setBody($dompdf->output());
+        }else{
+            // View PDF
+            return $this->response
+                ->setHeader('Content-Type', 'application/pdf')
+                ->setHeader('Content-Disposition', 'inline; filename="' . $filename . '"')
+                ->setBody($dompdf->output());
+        }
+
+
+    }
+    
+    private function getInvoiceData($invoiceId)
+    {
+        $invoice_data = $this->invoiceModel
+                ->select('
+
+                    partner_invoice.*, 
+
+                    pa.name as agent_name, 
+                    pa.email as agent_email, 
+                    pa.mobile as agent_mobile, 
+                    pa.address as agent_address, 
+                    pa.agent_code, 
+                    pa.certificate_file_name, 
+                    pa.commission_retain
+                ')
+                ->join('partner_agent pa', 'partner_invoice.agent_id = pa.id')
+                ->where('partner_invoice.is_active', 1)
+                ->where('partner_invoice.id', $invoiceId)
+                ->first();
+
+        return $invoice_data;
+    }
+    
 }
--- a/app/Views/invoice_template.php
+++ b/app/Views/invoice_template.php
@ -0,0 +1,430 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Agent Commission Invoice</title>
+    <style>
+    
+ * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: Arial, sans-serif;
+    font-size: 12px;
+    color: #333;
+    background: #fff;
+}
+
+/* Page Setup for DOMPDF */
+@page {
+    size: A4;
+    margin: 10mm;
+}
+
+/* .invoice-container {
+    width: 100%;
+    max-width: 210mm;
+    margin: 0 auto;
+    padding: 10mm;
+    background: #fff;
+} */
+
+.invoice-container {
+    width: 180mm;       /* reduced from 210mm */
+    max-width: 180mm;
+    margin: 0 auto;
+    padding: 8mm;       /* reduced padding */
+    background: #fff;
+}
+
+
+/* Header */
+.invoice-header {
+    border-bottom: 3px solid #2c3e50;
+    padding-bottom: 15px;
+    margin-bottom: 20px;
+}
+
+.header-top {
+    width: 100%;
+    display: table;
+}
+
+.header-top > div {
+    display: table-cell;
+    vertical-align: top;
+    width: 50%;
+}
+
+.company-info h1 {
+    color: #2c3e50;
+    font-size: 24px;
+    margin-bottom: 5px;
+}
+
+.company-info p {
+    color: #666;
+    font-size: 11px;
+    line-height: 1.4;
+}
+
+.invoice-title {
+    text-align: right;
+}
+
+.invoice-title h2 {
+    font-size: 32px;
+    color: #e74c3c;
+    margin-bottom: 5px;
+}
+
+.invoice-title p {
+    font-size: 11px;
+    color: #666;
+}
+
+/* Invoice Info (converted grid to table layout) */
+.invoice-info {
+    width: 100%;
+    display: table;
+    margin-bottom: 25px;
+    background: #f8f9fa;
+    border-radius: 5px;
+}
+
+.invoice-info > div {
+    display: table-cell;
+    width: 50%;
+    vertical-align: top;
+    padding: 15px;
+}
+
+.info-section h3 {
+    font-size: 13px;
+    color: #2c3e50;
+    margin-bottom: 10px;
+    padding-bottom: 5px;
+    border-bottom: 2px solid #3498db;
+}
+
+.info-row {
+    width: 100%;
+    display: table;
+    padding: 5px 0;
+    font-size: 11px;
+}
+
+.info-row span {
+    display: table-cell;
+}
+
+.info-label {
+    font-weight: 600;
+    color: #555;
+}
+
+.info-value {
+    color: #333;
+    font-weight: 500;
+    text-align: right;
+}
+
+/* Table */
+.invoice-table {
+    width: 100%;
+    border-collapse: collapse;
+    margin-bottom: 10px;
+    margin-top: -16px;
+}
+
+.invoice-table thead {
+    display: table-header-group;
+    background: #2c3e50;
+    color: #fff;
+}
+
+.invoice-table thead th {
+    padding: 12px 8px;
+    font-size: 11px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+    text-align: left;
+}
+
+.invoice-table td {
+    padding: 10px 8px;
+    font-size: 11px;
+    border-bottom: 1px solid #e0e0e0;
+}
+
+.invoice-table tbody tr:nth-child(even) {
+    background: #f8f9fa;
+}
+
+/* Text alignment */
+.text-right {
+    text-align: right;
+}
+.text-center {
+    text-align: center;
+}
+
+/* Summary Section */
+.invoice-summary {
+    width: 100%;
+    text-align: right;
+    margin-top: 20px;
+}
+
+.summary-box {
+    width: 300px;
+    border: 2px solid #2c3e50;
+    border-radius: 5px;
+    display: inline-block;
+}
+
+.summary-row {
+    width: 100%;
+    display: table;
+    padding: 10px 15px;
+    border-bottom: 1px solid #e0e0e0;
+}
+
+.summary-row span {
+    display: table-cell;
+}
+
+.summary-row:last-child {
+    background: #2c3e50;
+    color: #fff;
+    font-weight: bold;
+    font-size: 14px;
+}
+
+.summary-label {
+    font-weight: 600;
+}
+
+/* Footer */
+.invoice-footer {
+    border-top: 2px solid #2c3e50;
+    padding-top: 15px;
+    margin-top: 30px;
+}
+
+.footer-content {
+    width: 100%;
+    display: table;
+}
+
+.footer-section {
+    display: table-cell;
+    width: 50%;
+    vertical-align: top;
+    font-size: 10px;
+    color: #666;
+}
+
+.footer-section h4 {
+    font-size: 12px;
+    color: #2c3e50;
+    margin-bottom: 8px;
+}
+
+.footer-section p {
+    line-height: 1.6;
+    margin-bottom: 5px;
+}
+
+/* Signature */
+.signature-section {
+    margin-top: 40px;
+    text-align: right;
+}
+
+.signature-line {
+    border-top: 2px solid #333;
+    width: 200px;
+    margin-left: auto;
+    padding-top: 10px;
+    font-size: 11px;
+    font-weight: 600;
+}
+
+/* Page break support */
+.page-break {
+    page-break-after: always;
+}
+
+/* Row breaking prevention */
+.invoice-table tr {
+    page-break-inside: avoid;
+}
+
+/* Optional hide */
+.hide-header .invoice-header {
+    display: none;
+}
+
+.hide-footer .invoice-footer {
+    display: none;
+}
+
+    </style>
+</head>
+<body>
+    <div class="invoice-container" id="invoiceContent">
+        <!-- Invoice Header (Can be toggled) -->
+        <div class="invoice-header">
+            <div class="header-top">
+                <div class="company-info">
+                    <h1><?= $broker_company_name ?? 'Broker Company Name' ?></h1>
+                    <p><?= $broker_address ?? 'Company Address Line 1' ?><br>
+                    <?= $broker_city ?? 'City' ?>, <?= $broker_state ?? 'State' ?> - <?= $broker_pincode ?? 'PIN' ?><br>
+                    Email: <?= $broker_email ?? 'email@company.com' ?> | Phone: <?= $broker_phone ?? '+91-XXXXXXXXXX' ?></p>
+                </div>
+                <div class="invoice-title">
+                    <p>Commission Statement</p>
+                </div>
+            </div>
+        </div>
+
+        <!-- Invoice Information -->
+        <div class="invoice-info">
+            <div class="info-section">
+                <h3>Invoice Details</h3>
+                <div class="info-row">
+                    <span class="info-label">Invoice Number:</span>
+                    <span class="info-value"><?= $invoice_number ?? 'INV-2024-0001' ?></span>
+                </div>
+                <div class="info-row">
+                    <span class="info-label">Invoice Date:</span>
+                    <span class="info-value"><?= $invoice_date ?? date('d-M-Y') ?></span>
+                </div>
+                <div class="info-row">
+                    <span class="info-label">Period:</span>
+                    <span class="info-value"><?= $period ?? 'January 2024' ?></span>
+                </div>
+            </div>
+            <div class="info-section">
+                <h3>Agent Information</h3>
+                <div class="info-row">
+                    <span class="info-label">Agent Name:</span>
+                    <span class="info-value"><?= $agent_name ?? 'Agent Name' ?></span>
+                </div>
+                <div class="info-row">
+                    <span class="info-label">Agent Code:</span>
+                    <span class="info-value"><?= $agent_code ?? 'AGT-0001' ?></span>
+                </div>
+                <div class="info-row">
+                    <span class="info-label">No. of Policies:</span>
+                    <span class="info-value"><?= $total_policies ?? '0' ?></span>
+                </div>
+                <div class="info-row">
+                    <span class="info-label">Policies Till Date:</span>
+                    <span class="info-value"><?= $policies_till_date ?? '0' ?></span>
+                </div>
+            </div>
+        </div>
+
+        <!-- Policy Details Table -->
+        <table class="invoice-table">
+            <thead>
+                <tr>
+                    <th style="width: 5%;">Sr.</th>
+                    <th style="width: 15%;">Policy No.</th>
+                    <th style="width: 25%;">Customer Name</th>
+                    <th style="width: 15%;" class="text-right">Premium (₹)</th>
+                    <th style="width: 15%;" class="text-center">Issue Date</th>
+                    <th style="width: 15%;" class="text-right">Commission (₹)</th>
+                </tr>
+            </thead>
+            <tbody>
+                <?php 
+                $serial = 1;
+                $total_premium = 0;
+                $total_commission = 0;
+                $records_per_page = 25; // Adjust based on page size
+                
+                foreach($policies as $index => $policy): 
+                    $total_premium += $policy['premium'];
+                    $total_commission += $policy['commission'];
+                    
+                    // Add page break after certain records
+                    $page_break_class = (($serial % $records_per_page) == 0 && $serial != count($policies)) ? 'page-break' : '';
+                ?>
+                <tr class="<?= $page_break_class ?>">
+                    <td class="text-center"><?= $serial ?></td>
+                    <td><?= $policy['policy_no'] ?></td>
+                    <td><?= $policy['customer_name'] ?></td>
+                    <td class="text-right"><?= number_format($policy['premium'], 2) ?></td>
+                    <td class="text-center"><?= date('d-M-Y', strtotime($policy['issue_date'])) ?></td>
+                    <td class="text-right"><?= number_format($policy['commission'], 2) ?></td>
+                </tr>
+                <?php 
+                    // Insert page header for continuation pages
+                    if($page_break_class && $serial != count($policies)):
+                ?>
+                <tr class="page-header">
+                    <td colspan="6">
+                        <h3>Invoice #<?= $invoice_number ?? 'INV-2024-0001' ?> - Continued</h3>
+                    </td>
+                </tr>
+                <?php 
+                    endif;
+                    $serial++; 
+                endforeach; 
+                ?>
+            </tbody>
+        </table>
+
+        <!-- Summary Section -->
+        <div class="invoice-summary">
+            <div class="summary-box">
+                <div class="summary-row">
+                    <span class="summary-label">Total Premium:</span>
+                    <span>₹ <?= number_format($total_premium, 2) ?></span>
+                </div>
+                <div class="summary-row">
+                    <span class="summary-label">Total Policies:</span>
+                    <span><?= count($policies) ?></span>
+                </div>
+                <div class="summary-row">
+                    <span class="summary-label">Total Commission:</span>
+                    <span>₹ <?= number_format($total_commission, 2) ?></span>
+                </div>
+            </div>
+        </div>
+
+        <!-- Invoice Footer (Can be toggled) -->
+        <div class="invoice-footer">
+            <div class="footer-content">
+                <div class="footer-section">
+                    <h4>Payment Terms</h4>
+                    <p>Payment due within 15 days of invoice date.</p>
+                    <p>Bank Transfer Details:</p>
+                    <p><strong>Bank:</strong> <?= $bank_name ?? 'Bank Name' ?></p>
+                    <p><strong>Account No:</strong> <?= $account_number ?? 'XXXXXXXXXXXX' ?></p>
+                    <p><strong>IFSC:</strong> <?= $ifsc_code ?? 'XXXXXX' ?></p>
+                </div>
+                <div class="footer-section">
+                    <h4>Notes</h4>
+                    <p>Commission calculated as per agreed terms.</p>
+                    <p>This is a computer-generated invoice.</p>
+                    <p>For queries, contact: <?= $contact_email ?? 'accounts@company.com' ?></p>
+                </div>
+            </div>
+            <div class="signature-section">
+                <div class="signature-line">
+                    Authorized Signatory
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
--- a/app/Views/invoice_template_2.php
+++ b/app/Views/invoice_template_2.php
@ -0,0 +1,158 @@
+
+<head>
+    <style>
+        /* Page Setup for DOMPDF */
+        @page {
+            size: A4;
+            margin: 10mm;
+        }
+
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: Arial, sans-serif;
+            font-size: 12px;
+            color: #333;
+            background: #fff;
+        }
+
+        .invoice-container {
+            width: 180mm;       /* reduced from 210mm */
+            max-width: 180mm;
+            margin: 0 auto;
+            padding: 8mm;       /* reduced padding */
+            background: #fff;
+        }
+
+        .invoice-container table {
+            width: 100%;
+            /* border-collapse: collapse; */
+            margin-bottom: 15pt;
+        }
+
+        .invoice-container table th,
+        .invoice-container table td {
+            border: 1pt solid #000;
+            padding: 8pt;
+            text-align: left;
+            vertical-align: top;
+        }
+
+        .invoice-container th {
+            background-color: #f0f0f0;
+            font-weight: bold;
+        }
+
+        .header {
+            text-align: center;
+            font-weight: bold;
+            background-color: #fff;
+        }
+
+        .nhance-address {
+            text-align: center;
+            font-weight: bold;
+            background-color: #fff;
+        }
+
+        .section-header {
+            font-weight: bold;
+            background-color: #f8f8f8;
+        }
+
+        .amount {
+            text-align: right;
+        }
+
+        .bank-details {
+            margin-top: 15pt;
+            margin-bottom: 15pt;
+            line-height: 1.6;
+        }
+
+        .signature {
+            text-align: right;
+            margin-top: 40pt;
+            padding-top: 20pt;
+        }
+
+        .amount-words {
+            margin-top: 10pt;
+            margin-bottom: 10pt;
+            font-weight: bold;
+        }
+
+        strong {
+            font-weight: bold;
+        }
+    </style>
+</head>
+<body>
+    <div class="invoice-container">
+        <table>
+
+            <?php if(isset($agent_name)) : ?>
+                <tr>
+                    <td colspan="3" class="header"><?= $agent_name ?></td>
+                </tr>
+            <?php endif; ?>
+
+            <?php if(isset($agent_address) && !empty($agent_address)) : ?>
+                <tr>
+                    <td colspan="3" class="header"><?= $agent_address ?></td>
+                </tr>
+            <?php endif; ?>
+
+            <tr>
+                <td class="section-header">Bill To:</td>
+                <td class="section-header">Invoice No</td>
+                <td class="section-header">Date</td>
+            </tr>
+            <tr>
+                <td>
+                    <strong>NHANCE INDIA INSURANCE BROKING PVT LTD</strong><br>
+                    'Old No.76, New No.82, 'Sreshtha', First floor , <br>
+                    4th Avenue, Ashok Nagar, Chennai - 600083 
+                </td>
+                <td><?= isset($invoice_no) && !empty($invoice_no) ? $invoice_no : "-" ?></td>
+                <td><?= isset($invoice_date) && !empty($invoice_date) ? change_date_format($invoice_date, 'Y-m-d', 'd/m/Y') : "-" ?></td>
+            </tr>
+        </table>
+
+        <table>
+            <tr>
+                <th>Sl No</th>
+                <th>Description</th>
+                <th>Amount-INR</th>
+            </tr>
+            <tr>
+                <td>1</td>
+                <td>INSURANCE BROKING SERVICE (POINT OF SALE)</td>
+                <td class="amount"><?= isset($invoice_no) && !empty($invoice_amount) ? format_indian_number($invoice_amount) : "-" ?></td>
+            </tr>
+            <tr>
+                <td colspan="2"><strong>Total</strong></td>
+                <td class="amount"><strong><?= isset($invoice_no) && !empty($invoice_amount) ? format_indian_number($invoice_amount) : "-" ?></strong></td>
+            </tr>
+        </table>
+
+        <div class="amount-words">
+            <strong>Amount Payable in words : <?= isset($invoice_no) && !empty($invoice_amount) ? numberToWords((int)$invoice_amount) . ' Only' : "-" ?> </strong>
+        </div>
+
+        <div class="bank-details">
+            <strong>BANK ACCOUNT DETAILS</strong><br>
+            ACCOUNT NUMBER : <?= isset($agent_account_no) && !empty($agent_account_no) ? $agent_account_no : "-" ?><br>
+            IFSC CODE : <?= isset($agent_ifsc_code) && !empty($agent_ifsc_code) ? $agent_ifsc_code : "-" ?><br>
+            Bank NAME : <?= isset($agent_bank_name) && !empty($agent_bank_name) ? $agent_bank_name : "-" ?>
+        </div>
+
+        <div class="signature">
+            Authorised Signatory
+        </div>
+    </div>
+</body>
--- a/app/Views/payout_list.php
+++ b/app/Views/payout_list.php
@ -23,11 +23,11 @@
    }

    .badge-container {
-    background: #F0F0F0;
-    padding: 6px 12px;
-    border-radius: 6px;
-    font-size: 14px;
-    display: inline-block;
+        background: #F0F0F0;
+        padding: 6px 12px;
+        border-radius: 6px;
+        font-size: 14px;
+        display: inline-block;
    }

    .summary-box {
@ -179,6 +179,21 @@

 </style>

+<style>
+
+    .invoice-actions {
+        display: flex;
+        justify-content: flex-end;
+        gap: 10px;
+    }
+
+    #invoiceModal .modal-body {
+        max-height: 520px;   /* adjust as needed */
+        overflow-y: auto;
+    }
+
+</style>
+
 <div class="col-12">
    <div class="card">
        <div class="card-body">
@ -216,6 +231,7 @@
                                                <a class="dropdown-item" onclick="fetchUtrDetails(<?= $row['id'] ?>, '<?= $row['invoice_no'] ?>')"><i class="mdi mdi-bank-transfer mr-2 text-muted font-18 vertical-middle"></i>UTR</a>
                                                <a href="<?= base_url('payout/invoices?type=edit&id=' . $row['id']) ?>" class="dropdown-item"><i class="mdi mdi-pencil mr-2 text-muted font-18 vertical-middle"></i>Edit</a>
                                                <a href="<?= base_url('payout/invoices?type=adjustment&id=' . $row['id']) ?>" class="dropdown-item"><i class="mdi mdi-tune mr-2 text-muted font-18 vertical-middle"></i>Adjustment</a>                                            
+                                                <a onclick="fetchPreviewInvoiceDetails(<?= $row['id'] ?>, '<?= $row['invoice_no'] ?>')" class="dropdown-item"><i class="mdi mdi-eye mr-2 text-muted font-18 vertical-middle"></i>Preview Invoice</a>                                            
                                            </div>
                                        </div>
                                    </td>
@ -242,6 +258,37 @@
    </div>
 </div>

+<!-- Invoice Preview Modal -->
+<div class="modal fade" id="invoiceModal" tabindex="-1" role="dialog" aria-hidden="true" aria-modal="true" data-bs-backdrop="static">
+    <div class="modal-dialog modal-full-width">
+        <div class="modal-content">
+            <div class="modal-header" style="background-color: gainsboro;">
+                <h5 class="modal-title" id="invoiceModalLabel">
+                     Invoice Preview <span id="invoice_heading"></span>
+                </h5>
+                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+            </div>
+            <div class="modal-body" id="invoice_modal_body">
+
+                <input type="hidden" id="row_invoice_id">
+
+                <!-- Action Buttons -->
+                <div class="invoice-actions">
+                    <button class="btn btn-success btn-sm" onclick="downloadInvoicePdf()"><i class="mdi mdi-download"></i> Download PDF</button>
+                    <!-- <button class="btn btn-info btn-sm" onclick="printInvoice()"><i class="mdi mdi-printer"></i> Print </button> -->
+                </div>
+
+                <hr>
+
+                <!-- Invoice Preview Container -->
+                <div id="invoicePreview"></div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+
 <!-------------------------------------------------------------------------------------------------->

 <script>
@ -306,8 +353,7 @@

    });

-    function fetchUtrDetails(invoice_id, invoice_no)
-    {   
+    function fetchUtrDetails(invoice_id, invoice_no){   
        if (!invoice_id) {
            toastr.warning("Invoice Id not found!", "WARNING");
            return false;
@ -356,8 +402,67 @@
        });
    }

+    function fetchPreviewInvoiceDetails(invoice_id, invoice_no){  
+
+        if (!invoice_id) {
+            toastr.warning("Invoice Id not found!", "WARNING");
+            return false;
+        }
+
+        let heading_text = ' - ( ' + invoice_no + ' )';
+
+        $('#invoicePreview').empty();
+        $('#invoice_heading').text(heading_text);
+        $('#invoicePreview').append('<div class="text-center p-5"><div class="spinner-border text-primary" role="status"><span class="sr-only">Loading...</span></div></div>');
+
+        var myModal = new bootstrap.Modal(document.getElementById('invoiceModal'));
+        myModal.show();
+
+        let url = '<?= base_url('payout/invoices/preview') ?>';
+
+        // Data to send in the AJAX request
+        let requestData = {
+            invoice_id: invoice_id,
+        };
+
+
+        // Send AJAX request
+        sendAjaxRequestForGlobal(url, 'GET', requestData, function(response) {
+
+            console.log('Data fetched successfully:', response);
+
+            $('#invoicePreview').empty();
+            $('#invoice_heading').text(heading_text);
+
+            if (response.status == true) {
+                $('#invoicePreview').append(response.data);
+                $('#row_invoice_id').val(invoice_id);
+            }else{
+                $('#invoicePreview').append('<div class="text-center p-5 text-muted">No data found</div>');
+            }
+
+        }, function(xhr, status, error) {
+            console.error('Error fetching data:', error);
+            console.error(xhr.responseText);
+            // toastr.error('An error occurred while fetching the data.', 'ERROR');
+            $('#invoicePreview').empty();
+            $('#invoicePreview').append('<div class="text-center p-5 text-muted">No data found</div>');
+        });
+    }
+
    function addInvoiceButton(){
        window.location.href='<?= base_url('payout/invoices?type=add') ?>'
    }

+    function downloadInvoicePdf(){
+
+        let invoice_id = $('#row_invoice_id').val();
+        window.location.href = '<?= base_url('payout/invoices/downloadPdf/') ?>' + invoice_id
+    }
+
+     $('#invoiceModal').on('hidden.bs.modal', function () {
+         $('#row_invoice_id').val("");
+         console.log('value reseted...')
+     });
+
 </script>