<!DOCTYPE html>
<html>
<head>
    <title>Marker_Besar_70x30</title>
    <style type="text/css">
        body {
            margin: 0;
            padding: 0;
            width: 6.7cm;
            height: 3.2cm;
            overflow: hidden;
            font-family: 'helvetica';
            font-size: 8px;
            box-sizing: border-box;
        }
        table {
            width: 110%;
            height: 100%;
            border-collapse: collapse;
        }
        tr, td {
            height: auto;
            overflow: hidden;
            box-sizing: border-box;
        }
        .tr-note td.lbl{
            font-size: 6px;
        }
        .ico-arrow {
            position: absolute;
            top: 7px;
            right: 0px;
            height: 23px;
        }
        /* Style untuk teks vertikal */
        .vertical-text {
            writing-mode: vertical-rl;
            text-orientation: mixed;
            font-size: 10px;
            font-weight: bold;
            letter-spacing: 2px;
            padding: 2px 0;
        }
        .qr-container {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 2px;
        }
        .qr-code img {
            display: block;
        }
    </style>
    <script type="text/javascript" src="<?php echo base_url(); ?>assets/plugins/jquery/jquery.min.js"></script>
</head>
<body onload="window.print();">
    <table style="border-collapse: collapse;border: 0.5px solid #000;" border="1" cellpadding="1" width="100%">
        <?php 
            $tot = count($trx);
            $txt = '';
            
            foreach ($trx as $key => $value) {
                $is_row = false;
                $lspan = 3;
                if (strlen($value['trx_note']) > 0) {
                    $is_row = true;
                    $lspan = 4;
                }
                $is_row_cost = false;
                if (count($value['arr_cost']) > 0) {
                    $is_row_cost = true;
                    $lspan++;
                }
                
                // Ambil kata pertama dari customer_name untuk teks vertikal
                $nama = $data['customer_name'];
                $posisiSpasi = strpos($nama, ' ');
                if ($posisiSpasi !== false) {
                    $firstName = substr($nama, 0, $posisiSpasi);
                } else {
                    $firstName = $nama;
                }
        ?>
            <tr>
                <!-- KOLOM KIRI: Informasi utama -->
                <td colspan="2" style="text-align:center; padding: 2px;">
                    <br>
                    <br>
                    <div style="font-size:12px;font-weight:bold;text-align:center;">
                       <?php $nama = $data['customer_name'];$nama = ucwords(strtolower($nama)); // Buat setiap awal kata kapital
                           echo strlen($nama) > 17 ? substr($nama, 0, 17) . '...' : $nama;?><br>
                        <?php echo substr((string) $data['code'], -5).' - '.$outlet['outlet_name']; ?>
                    </div>
                </td>
                
                <!-- KOLOM KANAN: QR Code + Teks Vertikal -->
                <td rowspan="<?php echo $lspan; ?>" width="85px" style="padding: 2px;">
                    <div class="qr-container">
                      <!-- Teks Vertikal (di samping QR) -->
                         <div class="vertical-text" align="center" style="font-size: 10px;text-align:center;">
                          <?php echo substr($value['product_name'], 0, 12); ?>
                        </div>
                        <div class="vertical-text"align="center" style="font-size: 12px;font-weight:bold;text-align:center;">
                           <!-- <?php echo $firstName; ?>-->
                            <?php $nama = $data['customer_name'];$posisiSpasi = strpos($nama, ' ');$firstName = substr(($posisiSpasi !== false ? substr($nama, 0, $posisiSpasi) : $nama), 0, 10);$firstName = ucwords(strtolower($firstName)); 
                            // Ubah jadi kapital di setiap awal kata

                               $lastName = substr((strrpos($nama, ' ') !== false ? substr($nama, strrpos($nama, ' ') + 1) : $nama), 0, 10);$lastName = ucwords(strtolower($lastName)); 
                               // Ubah jadi kapital di setiap awal kata
                               // Jika sama, kosongkan
                               $lastName = ($firstName == $lastName) ? '' : $lastName;echo $firstName;?><br>
                               <?php echo $lastName; ?>
                            <div align="center" style="font-size: 12px;font-weight:bold;text-align:center;">
                                <?php echo ($key + 1).'/'.$tot.' - '. substr((string) $data['code'], -5); ?>
                            </div>
                            
                        </div>
                          
                        <!-- QR Code -->
                        <div class="qr-code">
                            <img style="display:block; width:70px; height:70px;" 
                                 src="https://quickchart.io/qr?size=70&text=<?php echo $value['item_code']; ?>">
                        </div> 
                        <div class="vertical-text" align="center" style="font-size: 12px;font-weight:bold;text-align:center;">
                                <?php echo $outlet['outlet_name']; ?>
                            </div>
                        <div class="vertical-text" align="center"style="font-size: 14px;font-weight:bold;text-align:center;">
                             
                             <?php echo ' Stopwash ';?>
                        </div>  
                         
                    </div>
                     <div align="center"style="font-size: 10px;font-weight:bold;text-align:center;">
                         <?php echo substr($value['trx_note'], 0, 40); ?>
                     </div>
                </td>
                
               
                
            </tr>
              
            <tr>
                <td style="width: 40px!important; font-size: 10px; text-align: right; font-weight: bold;">
                    <?php echo ($key + 1).'/'.$tot; ?>
                </td>
                <td style="font-size: 10px;text-align:center;font-weight:bold;">
                    <br>
                    <?php echo substr($value['product_name'], 0, 12); ?><br>
                    <?php echo''.Date('d M H:i', strtotime ($data['duedate'])); ?>
                </td>
            </tr>
            
            <tr>
                <td colspan="2" style="font-size: 10px;text-align:center;font-weight:bold;">
                    <div style="padding-bottom: 21px;">
                    <?php $text = $value['colour'].', '.$value['hue'].', '.$value['spot'];echo strlen($text) > 35 ? substr($text, 0, 35) . '...' : $text;?>
                    </div>
                </td>
            </tr>
            
             <?php if ($is_row) { ?>
            <tr>
                <!--<td colspan="2" style="font-size: 10px;font-weight:bold;">
                    <?php echo $value['trx_note']; ?>
                </td>-->
            </tr>
            <?php } ?>
            
            <?php if ($is_row_cost) {
                $txt_cost = '';
                foreach ($value['arr_cost'] as $c_key => $c_value) {
                    $comma = ', +';
                    if ($c_key == 0) {
                        $comma = '+';
                    }
                    $txt_cost .= $comma.$c_value['name'];
                }
            ?>
            <tr>
                <td colspan="2"><?php echo $txt_cost; ?></td>
            </tr>
            <?php } ?>
            
        <?php } ?>
    </table>
</body>
</html>