InvenTree: Brother-QL совместимый шаблон мест хранения 62x27mm

См. также большую версию (140x62mm) этой этикетки

Этот шаблон этикетки места хранения InvenTree полностью совместим с принтерами этикеток Brother QL-серии на 62mm. Я использую BrotherQLLabelPrintService для печати на Linux.

InvenTree 62x27mm stock location

stock_location_62x27.html
{% extends "label/label_base.html" %}
{% load l10n i18n barcode %}

{% block style %}
{% localize off %}
@page {
    size: {{ width }}mm {{ height }}mm;
    margin: 2mm; /* Равномерный отступ 2мм со всех сторон */
}

body {
    margin: 0;
    padding: 0;
}

/* Табличная вёрстка обеспечивает точное позиционирование и исправляет баги многостраничности WeasyPrint */
.label-table {
    display: table;
    width: calc({{ width }}mm - 4mm);  /* Полная ширина минус 2мм слева и 2мм справа */
    height: calc({{ height }}mm - 4mm); /* Полная высота минус 2мм сверху и 2мм снизу */
    table-layout: fixed;
    page-break-inside: avoid;
    break-inside: avoid;
}

.label-row {
    display: table-row;
}

.qr-cell {
    display: table-cell;
    width: calc({{ height }}mm - 4mm); /* Держит QR-ячейку идеальным квадратом */
    height: calc({{ height }}mm - 4mm);
    vertical-align: middle;            /* Центрирует QR-код по вертикали */
}

.qr {
    width: calc({{ height }}mm - 4mm);
    height: calc({{ height }}mm - 4mm);
    display: block;
}

.text-cell {
    display: table-cell;
    width: calc({{ width }}mm - {{ height }}mm); /* Динамически заполняет оставшееся пространство */
    height: calc({{ height }}mm - 4mm);
    vertical-align: middle;                      /* ИДЕАЛЬНОЕ ВЕРТИКАЛЬНОЕ ЦЕНТРИРОВАНИЕ */
    padding-left: 3mm;                           /* Чёткий зазор между QR и текстом */
    box-sizing: border-box;
    overflow: hidden;
}
{% endlocalize %}

.loc {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 1.05;
    margin: 0;
    padding: 0;
    
    /* Нативная обработка макета учитывает мягкие переносы UTF-8 */
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* АВТОМАТИЧЕСКАЯ РЕГУЛИРОВКА ШРИФТА (уменьшено с исходного 21pt) */
.loc.large { font-size: 21pt; }
.loc.medium { font-size: 15pt; }
.loc.small { font-size: 11pt; }
{% endblock style %}

{% block content %}
<div class="label-table">
    <div class="label-row">
        
        <div class="qr-cell">
            <img class='qr' alt="{% trans 'QR code' %}" src='{% qrcode qr_data %}'>
        </div>
        
        <div class="text-cell">
            <div class="loc {% if location.name|length > 20 %}small{% elif location.name|length > 10 %}medium{% else %}large{% endif %}">
                {{ location.name }}
            </div>
        </div>
        
    </div>
</div>
{% endblock content %}

Check out similar posts by category: InvenTree