Sending Print Jobs to Multiple LAN Printers in Laravel POS Application #1303

ProfessorMoaz · 2024-11-01T15:31:05Z

In my Laravel-based POS web application, I need to send print jobs to two different LAN printers with specific IP addresses. What is the best way to implement this functionality? Are there any specific packages or methods in Laravel that I should consider for managing print requests to multiple printers on a local network?

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Restaurant Bill</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 20px;
            font-size: 12px;
        }

        .container {
            max-width: 300px;
            margin: 0 auto;
            border: 1px solid #ddd;
            padding: 10px;
        }

        .header,
        .footer {
            text-align: center;
            margin-bottom: 10px;
        }

        .header h1 {
            margin: 0;
            font-size: 18px;
        }

        .order-details table {
            width: 100%;
            border-collapse: collapse;
            margin-bottom: 10px;
        }

        .order-details th,
        .order-details td {
            border-bottom: 1px solid #ddd;
            padding: 5px;
            text-align: left;
        }

        .total {
            font-weight: bold;
        }

        .footer {
            font-size: 10px;
            margin-top: 10px;
        }
    </style>
    <!-- Update to local QZ Tray JavaScript -->
    <script src="{{ asset('qz-tray.js')}}"></script> <!-- Adjust path as needed -->
</head>

<body>
    <div class="container" id="bill-content">
        <div class="header">
            @if ($store->image)
            <img src="{{ asset('images/stores/' . $store->image) }}" alt="{{ $store->name }}"
                style="max-width: 100px; height: auto; object-fit:cover; border-radius:10px;">
            @endif
            <h1>{{ $store->name }}</h1>
            <p>{{ $store->address }}</p>
            <p>Phone #: {{ $store->phone }}</p>
        </div>

        <div class="order-info">
            <p><strong>Bill No:</strong> {{ $order->id }}</p>
            <p><strong>Date:</strong> {{ $order->created_at->format('d-m-Y H:i') }}</p>
            <p><strong>Biller:</strong> {{ $order->user->name }}</p>
        </div>

        <div class="order-details">
            <table>
                <tr>
                    <th>Item</th>
                    <th>Qty</th>
                    <th>Price</th>
                    <th>Amount</th>
                </tr>
                @foreach($order->orderProducts as $orderProduct)
                <tr>
                    <td>{{ $orderProduct->name }}</td>
                    <td>{{ $orderProduct->quantity }}</td>
                    <td>{{ number_format($orderProduct->price, 2) }}</td>
                    <td>{{ number_format($orderProduct->quantity * $orderProduct->price, 2) }}</td>
                </tr>
                @endforeach
                <tr>
                    <td colspan="3" class="total">Subtotal</td>
                    <td class="total">{{ number_format($order->subtotal, 2) }}</td>
                </tr>
                <tr>
                    <td colspan="3">Discount</td>
                    <td>{{ number_format($order->discount, 2) }}</td>
                </tr>
                <tr>
                    <td colspan="3" class="total">Grand Total</td>
                    <td class="total">{{ number_format($order->grand_total, 2) }}</td>
                </tr>
            </table>
        </div>

        <div class="footer">
            <p>Thank you for visiting us!</p>
            <p>This is a computer-generated bill and does not require a signature.</p>
        </div>
    </div>

    <script>
        // Function to print the bill using QZ Tray
        function printSlip() {
            const data = [{
                type: 'raw',
                format: 'plain',
                data: document.getElementById('bill-content').innerText
            }];

            // Connect to QZ Tray
            qz.websocket.connect().then(function() {
                return qz.printers.find("Microsoft Print to PDF"); // Replace with your printer's name or IP
            }).then(function(printer) {
                const config = qz.configs.create(printer);
                return qz.print(config, data);
            }).then(function() {
                console.log('Print job sent successfully!');
                qz.websocket.disconnect();
            }).catch(function(err) {
                console.error(err);
            });
        }

        // Automatically trigger the print function when the page loads
        window.onload = printSlip;
    </script>
</body>

</html>

tresf · 2024-11-05T18:37:20Z

In my Laravel-based POS web application, I need to send print jobs to two different LAN printers with specific IP addresses.

The preferred method for sending jobs to two different printers is to first install them through your printer preferences/control panel and then to reference them from code.

For example, you may create a mapping for each printer like this:

var firstPrinter = qz.configs.create("Printer 1");
var secondPrinter = qz.configs.create("Printer 2");

qz.websocket.connect.then(() => {
   return qz.print(firstPrinter, firstData /** TBD **/);
}).then(() => {
   return qz.print(secondPrinter, secondData /** TBD **/);
});

... however if you wish to send the same contents to both printers, we have a shorthand method for this:

qz.websocket.connect.then(() => {
   return qz.print([firstPrinter, secondPrinter], bothData /** TBD **/);
});

Are there any specific packages or methods in Laravel that I should consider for managing print requests to multiple printers on a local network?

Laravel being a PHP framework, probably not, at least nothing specific to QZ Tray's JavaScript API although there are plenty of reasons to leverage frameworks for tasks adjacent to the use of QZ Tray (e.g. PDF rendering, endpoints for our licensing component, ajax requests, etc).

tresf · 2024-11-05T18:38:23Z

Note, if you have a document that's prepared in raw format, we also do provide printing directly to an IP address on port 9100 but that would be only through our raw API, so will depend on your data format requirements.

tresf · 2024-11-11T18:55:04Z

@ProfessorMoaz hi, this issue was opened 10 days ago and has some unanswered questions. It will be automatically closed if a response is not received.

tresf self-assigned this Nov 5, 2024

tresf added the support label Nov 5, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Sending Print Jobs to Multiple LAN Printers in Laravel POS Application #1303

Sending Print Jobs to Multiple LAN Printers in Laravel POS Application #1303

ProfessorMoaz commented Nov 1, 2024 •

edited by tresf

Loading

tresf commented Nov 5, 2024 •

edited

Loading

tresf commented Nov 5, 2024

tresf commented Nov 11, 2024

Sending Print Jobs to Multiple LAN Printers in Laravel POS Application #1303

Sending Print Jobs to Multiple LAN Printers in Laravel POS Application #1303

Comments

ProfessorMoaz commented Nov 1, 2024 • edited by tresf Loading

tresf commented Nov 5, 2024 • edited Loading

tresf commented Nov 5, 2024

tresf commented Nov 11, 2024

ProfessorMoaz commented Nov 1, 2024 •

edited by tresf

Loading

tresf commented Nov 5, 2024 •

edited

Loading