/home2/kerimkazan/dvf/magaza/print.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0">

    <title>Satış Fişi</title>
    <style>
        
        @page {
            size: 80mm auto; /* 80mm genişliğinde, otomatik yükseklik */
            margin: 10mm; /* Kenar boşlukları */
            }
        * {
            box-sizing: border-box;
        }
        body {
            width: 100%;
            margin: 0;
            padding: 0;
            font-family: Arial, sans-serif;
            overflow-x: hidden;
        }
        #invoice-POS {
            width: 100%;
            margin: 0 auto;
            padding: 10px;
            background: #FFF;
        }
        @media print {
            @page {
                margin: 0;
            }
            body {
                margin: 0;
                -webkit-print-color-adjust: exact;
                font-size: 12pt; /* Yazı boyutunu artırın */
            }
            #invoice-POS {
                box-shadow: none;
                margin: 0;
                width: 100%;
                max-width: none;
            }
        }
        h1 {
            font-size: 1.8em; /* Başlık boyutunu artırın */
            color: #222;
        }
        h2 {
            font-size: 1.2em; /* Alt başlık boyutunu artırın */
        }
        h3 {
            font-size: 1.4em; /* Diğer başlık boyutlarını artırın */
            font-weight: 300;
            line-height: 2em;
        }
        p {
            font-size: 1em; /* Paragraf yazı boyutunu artırın */
            color: black;
            line-height: 1.2em;
            margin: 0;
        }
        #top, #mid, #bot {
            border-bottom: 1px solid #EEE;
            padding-bottom: 10px;
            margin-bottom: 10px;
        }
        #top .logo {
            height: 120px;
            width: 106px;
            background: url(qr.png) no-repeat;
            background-size: 120px 106px;
            margin: 0 auto;
        }
        .info {
            text-align: center;
        }
        table {
            width: 100%;
            border-collapse: collapse;
        }
        td {
            padding: 5px 0;
            border: 1px solid #EEE;
            word-wrap: break-word;
            font-size: 0.9em; 
        }
        .tabletitle {
            padding: 5px;
            font-size: 1em; 
            background: #EEE;
        }
        .service {
            border-bottom: 1px solid #EEE;
        }
        .item {
            width: 24mm;
        }
        .itemtext {
            font-size: 0.9em; 
        }
        .spacer {
            height: 20px; /* Adjust this value to create the desired amount of space */
        }
        #legalcopy {
            margin-top: 5mm;
            text-align: center;
        }
    </style>
</head>
<body>
    <div id="invoice-POS">
        <center id="top">
            <div class="logo"></div>
            <div class="info">
                <h2 class="brand">SURVIVOR</h2>
            </div>
        </center>
        <div id="mid">
            <div class="info">
                <p><b>
                    BEYAZIT<br>
                    SURVIVOR<br>
                    +90 538 389 63 63
               </b> </p>
            </div>
        </div>
        <div id="bot">
            <div id="table">
                <table>
                    <thead>
                        <tr class="tabletitle">
                            <td class="item"><h2>Item</h2></td>
                            <td class="Hours"><h2>Pcs</h2></td>
                            <td class="Rate"><h2>Sub Total</h2></td>
                        </tr>
                    </thead>
                    <tbody class="print_products">
                        <!-- Ürün Bilgileri -->
                    </tbody>
                    <tr class="spacer"></tr> <!-- Spacer row to add space between products and totals -->
                    <tr class="tabletitle">
                        <td></td>
                        <td class="Rate"><h4>Total (USD)</h4></td>
                        <td class="payment"><h4 class="total_usd"></h4></td>
                    </tr>
                    <tr class="tabletitle">
                        <td></td>
                        <td class="Rate"><h4>Total (TRY)</h4></td>
                        <td class="payment"><h4 class="total_try"></h4></td>
                    </tr>
                    <tr class="tabletitle">
                        <td></td>
                        <td class="Rate"><h4>Total (EUR)</h4></td>
                        <td class="payment"><h4 class="total_eur"></h4></td>
                    </tr>
                </table>
            </div>
            <div id="legalcopy">
                <p class="legal"><strong>Thank you for your business!</strong></p>
            </div>
        </div>
    </div>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        function getSaleData(saleId) {
            return $.ajax({
                type: "POST",
                url: "ajax.php",
                data: { type: "print_forms", saleId: saleId },
                dataType: "json"
            });
        }

        function getExchangeRates() {
            return $.ajax({
                type: "GET",
                url: "kur.php",
                dataType: "json"
            });
        }

        function renderPrintContent(saleData, exchangeRates) {
            if (saleData.status) {
                const sale = saleData.sale;
                const saleProducts = saleData.saleProducts;
                const usdToTryRate = parseFloat(exchangeRates.usd_try);
                const tryToEurRate = parseFloat(exchangeRates.eur_try);

                let productRows = '';
                saleProducts.forEach(product => {
                    productRows += `
                        <tr class="service">
                            <td class="tableitem"><p class="itemtext">${product.name} (${product.variant})</p></td>
                            <td class="tableitem"><p class="itemtext">${product.quantity}</p></td>
                            <td class="tableitem"><p class="itemtext">${product.total_price} $</p></td>
                        </tr>
                    `;
                });
                $('.print_products').html(productRows);

                const discount = parseFloat(sale.discounted);
                const totalPrice = parseFloat(sale.total_price);
                const netTotalPriceUSD = totalPrice - discount;
                const totalPriceTRY = netTotalPriceUSD * usdToTryRate;
                const totalPriceEUR = totalPriceTRY / tryToEurRate;

                $('.total_usd').text(netTotalPriceUSD.toFixed(2) + ' $');
                $('.total_try').text(totalPriceTRY.toFixed(2) + ' ₺');
                $('.total_eur').text(totalPriceEUR.toFixed(2) + ' €');
            } else {
                $('#invoice-POS').html('<p>Sale not found.</p>');
            }
        }

        $(document).ready(function() {
            const urlParams = new URLSearchParams(window.location.search);
            const saleId = urlParams.get('saleId');

            if (saleId) {
                $.when(getSaleData(saleId), getExchangeRates()).done(function(saleDataResponse, exchangeRatesResponse) {
                    const saleData = saleDataResponse[0];
                    const exchangeRates = exchangeRatesResponse[0];
                    renderPrintContent(saleData, exchangeRates);

                    // Yazdırma işlemini başlatın
                    window.print();
                    window.onafterprint = function() {
                        window.close();
                    };
                }).fail(function() {
                    $('#invoice-POS').html('<p>Error fetching sale data or exchange rates.</p>');
                });
            } else {
                $('#invoice-POS').html('<p>Sale ID is required.</p>');
            }
        });
    </script>
</body>
</html>