Как получить шрифт по умолчанию «Шрифт A11» чекового принтера EPSON TM-T88V на странице HTML?

Question

Я создал страницу в HTML, связываю данные с angularjs и установил чековый принтер EPSON TM-T88V.Я хочу использовать шрифты по умолчанию из списка .Я пытался использовать другой шрифт, такой как Verdana, sans-serif и т. Д., Но моя квитанция получает блеклый отпечаток

Есть идея, пожалуйста, предложите мне.?Заранее спасибо.

<div id="section-to-print" style="width:350px;" class="container-fluid padding-2 inner">
<!--Printing Summary-->
<div *ngFor="let data of data; let ticketIndex = index">
    <table width="100%" style="padding:0 8px 8px 8px;" id="section-to-print-{{ticketIndex}}">
        <tr>
            <td>
                <table style="text-align: center; font-size: 16px; font-family:courier; text-transform: uppercase;" width="100%">
                    <tr>
                        <td width="100%">
                            <h1 style="text-transform: uppercase;" class="text-capitalize">{{storeDetail.name}}</h1>
                        </td>
                    </tr>
                    <tr>
                        <td width="100%">
                            <span>{{storeDetail.address}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td width="100%">
                            <span>{{storeDetail.city}} , {{storeDetail.zipCode}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td width="100%">
                            <b>
                                <span>{{storeDetail.phoneNumber}}</span>
                            </b>
                        </td>
                    </tr>
                    <tr>
                        <td width="100%">
                            <span class="text-capitalize" style="font-size: 40px; font-weight: bolder; background-color: black; color: white;">{{data.ticketId}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td class="padding-0 text-capitalize margin-top-10" style="text-transform: uppercase;">
                            <b style="font-size:20px;">{{data?.customer?.firstName}} {{data?.customer?.lastName}}</b>
                        </td>
                    </tr>
                    <tr *ngIf="data?.customer?.address">
                        <td>
                            {{data?.customer?.address}}
                        </td>
                    </tr>
                    <tr *ngIf="data?.customer?.email">
                        <td>
                            {{data?.customer?.email}}
                        </td>
                    </tr>
                    <tr *ngIf="data?.customer?.mobileNo">
                        <td>
                            <b>{{data?.customer?.mobileNo}}</b>
                        </td>
                    </tr>
                    <tr style="text-align:right;">
                        <td>
                            Rack : __________
                        </td>
                    </tr>
                    <tr>
                        <td>
                            {{data.createdOn | date}}
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <strong>Operator : {{data?.createdUser?.fullName}}</strong>
                        </td>
                    </tr>
                </table>

                <table style="border-top: 2px dashed black;border-bottom: 2px dashed black; font-size: 16px; font-family:courier;"
                    width="100%">
                    <thead style="border-top: 2px dashed black;">
                        <th style="text-align:left" width="50%">Item</th>
                        <th width="25%">Quantity</th>
                        <th style="text-align: right" width="25%">Price</th>
                    </thead>
                    <tbody style="border-top: 2px dashed black;" width="100%" *ngFor="let item of data?.list; let i = index" [ngClass]="!item.isDeleted ? '' : 'hide' ">
                        <tr>
                            <td style="text-align:left" width="50%">
                                <span class="bulk-item" *ngIf="item.extras?.isBulkItem">Bulk Items</span>
                                <!--strong style="text-transform:capitalize">{{item.catName}}</strong-->
                                <span style="text-transform:capitalize" *ngIf="item.catName !== null"></span>{{item.name}}
                                <span *ngIf="item.modifierType !== null"></span>
                                <strong>{{item.modifierType}}</strong>
                            </td>

                            <td width="25%">
                                <span *ngIf="item.cartQty >= 1">{{item.cartQty}}</span>
                            </td>

                            <td style="text-align: right" width="25%">
                                <strong *ngIf="!item.isFuturePrice">{{item.finalPrice | currency:'USD':true:'1.2-2'}}</strong>
                                <strong *ngIf="item.isFuturePrice">*****</strong>
                            </td>
                        </tr>

                        <tr *ngIf="(item.extras?.repairCharges?.length > 0 || item.extras?.upCharges?.length > 0) && item.cartQty > 1">
                            <td style="text-transform:capitalize">Base Price</td>
                            <td></td>
                            <td style="text-align: right">
                                <span *ngIf="!item.isFuturePrice">{{item.price | currency:'USD':true:'1.2-2'}}</span>
                                <span *ngIf="item.isFuturePrice">*****</span>
                            </td>
                        </tr>

                        <tr *ngFor="let repair of item.extras?.repairCharges; let index = index" [ngClass]="!repair.isDeleted ? '' : 'hide' ">
                            <td class="text-capitalize text-left">{{repair.name}}</td>

                            <td *ngIf="repair.type === 'AMOUNT'">&nbsp;</td>
                            <td *ngIf="repair.type === 'AMOUNT'" style="text-align: right">{{repair.price | currency:'USD':true:'1.2-2'}}</td>

                            <td *ngIf="repair.type === 'PERCENTAGE'">{{repair.percentage}}%</td>
                            <td *ngIf="repair.type === 'PERCENTAGE'" style="text-align: right">{{((repair.percentage * item.price) / 100) | currency:'USD':true:'1.2-2'}}</td>
                        </tr>

                        <tr *ngFor="let upCharge of item?.extras?.upCharges; let index = index">
                            <td class="text-capitalize text-left">{{upCharge.name}}</td>

                            <td *ngIf="upCharge.type === 'AMOUNT'">&nbsp;</td>
                            <td *ngIf="upCharge.type === 'AMOUNT'" style="text-align: right">{{upCharge.price | currency:'USD':true:'1.2-2'}}</td>

                            <td *ngIf="upCharge.type === 'PERCENTAGE'">{{upCharge.percentage}}%</td>
                            <td *ngIf="upCharge.type === 'PERCENTAGE'" style="text-align: right">{{((upCharge.percentage * item.price) / 100) | currency:'USD':true:'1.2-2'}}</td>
                        </tr>

                        <tr *ngIf="item.notes">
                            <td style="text-transform:capitalize">Notes</td>
                            <td colspan="2" class="padding-0">{{item.notes}}</td>
                        </tr>

                        <tr *ngFor="let coupon of item.extras?.coupons; let index = index">
                            <td style="text-transform:capitalize">
                                Coupon - {{coupon.name}}
                            </td>

                            <td *ngIf="coupon.type === 'AMOUNT'">&nbsp;</td>
                            <td *ngIf="coupon.type === 'AMOUNT'" style="text-align: right">-{{coupon.price | currency:'USD':true:'1.2-2'}}</td>

                            <td *ngIf="coupon.type === 'PERCENTAGE'">{{coupon.percentage}}% ({{item.cartQty}} X {{((coupon.percentage * item.price) / 100) | currency:'USD':true:'1.2-2'}})</td>
                            <td *ngIf="coupon.type === 'PERCENTAGE'" style="text-align: right">-{{((coupon.percentage * item.price) / 100) | currency:'USD':true:'1.2-2'}}</td>
                        </tr>
                    </tbody>
                </table>

                <table style="border-bottom: 2px dashed black; font-size: 16px; font-family:courier;" width="100%">
                    <tr>
                        <td width="50%">Sub Total :</td>
                        <td width="50%" style="text-align:right;">{{ data.subTotal | currency:'USD':true:'1.2-2' }}</td>
                    </tr>
                    <tr>
                        <td>Items Total :</td>
                        <td style="text-align:right;">{{ data.itemsTotal }}</td>
                    </tr>
                    <tr>
                        <td>Taxes (included):</td>
                        <td style="text-align:right;">{{ data.tax | currency:'USD':true:'1.2-2'}}</td>
                    </tr>

                    <tr *ngFor="let extraCharge of data?.extraCharges" [ngClass]="!extraCharge.isDeleted ? '' : 'hide' ">
                        <td>{{extraCharge.name}}:</td>
                        <td style="text-align:right;">{{ extraCharge.charges | currency:'USD':true:'1.2-2' }}</td>
                    </tr>

                    <tr class="padding-0">
                        <td class="text-capitalize text-elipsis">
                            <strong>Discount</strong>
                            <span *ngIf="data?.discount?.name">- {{data.discount.name}}</span> :
                        </td>

                        <td style="text-align:right;" *ngIf="data?.discount?.type === 'AMOUNT'">-{{ data?.discount?.amount | currency:'USD':true:'1.2-2' }}</td>

                        <td *ngIf="data?.discount?.type === 'PERCENTAGE'"></td>
                        <td *ngIf="data?.discount?.type === 'PERCENTAGE'" style="text-align:right;">-{{((data?.discount?.percentage * data.subTotal)/100) | currency:'USD':true:'1.2-2'}}
                        </td>

                        <td style="text-align:right;" *ngIf="!data?.discount?.type || data?.discount?.type === null" style="text-align:right;">-{{ 0 | currency:'USD':true:'1.2-2' }}
                        </td>
                    </tr>

                    <tr class="padding-0">
                        <td>
                            <strong>Grand Total :</strong>
                        </td>
                        <td style="text-align:right;">
                            <strong *ngIf="data?.grandTotal > 0">{{ data.grandTotal | currency:'USD':true:'1.2-2' }}</strong>
                            <strong *ngIf="data?.grandTotal == 0">{{ 0 | currency:'USD':true:'1.2-2' }}</strong>
                        </td>
                    </tr>

                    <tr>
                        <td colspan="3" style="text-align: center; border-top: 2px dashed black;font-size: 21px">
                            <strong>Delivery Date:</strong>
                        </td>
                    </tr>

                    <tr>
                        <td colspan="3" style="text-align: center; border-bottom: 2px dashed black;font-size: 21px;">
                            <strong>{{data?.deliveryDate | date}}</strong>
                        </td>
                    </tr>

                    <tr style="border-top: 2px dashed black;">
                        <td colspan="3" width="100%">
                            <ngx-barcode *ngIf="data?.barcode != 0" [bc-value]="data?.barcode" [bc-display-value]="true" [bc-format]="CODE128"></ngx-barcode>
                        </td>
                    </tr>

                </table>
            </td>
        </tr>
    </table>
</div>

Answer 1

использовать опцию печати php.Вы также можете изменить размер шрифта и семейство шрифтов ..

вот пример кода php ...

<?php
header('Content-Type: text/plain; charset=UTF-8');

$printer = "\\\\BALA\\EPSON TM-T88IV Receipt"; 

$handle = printer_open($printer);
printer_start_doc($handle,"Testpage");
printer_start_page($handle);
$font = printer_create_font("Arial", 20, 10, 700, false, false, false, 0);
$pen = printer_create_pen(PRINTER_PEN_DOT, 1, "000000");
printer_select_pen($handle, $pen);
printer_select_font($handle, $font);
printer_draw_text($handle, "welcome", 10, 10);

printer_delete_font($font);
printer_delete_pen($pen);
printer_end_page($handle);
printer_end_doc($handle);
printer_close($handle);

?>