feat: 产品规格带出产品大类

gongchunyi

7 天以前 cd1f2d9605c2e208bb7e70f5d3bc83b45a9ec8a6

 src/views/salesManagement/salesLedger/components/salesLabelPrint.js

@@ -18,15 +18,60 @@
  return pages;
};

const renderLabelCard = (item) => `
  <div class="label-card">
    <div class="line customer">${escapeHtml(item?.customerName)}</div>
    <div class="line order">${escapeHtml(item?.salesContractNo)}</div>
    <div class="line product">${escapeHtml(item?.productName)}</div>
    <div class="line spec">${escapeHtml(item?.specification)}</div>
    <div class="line address">${escapeHtml(item?.floorCode)}</div>
  </div>
`;
const buildMainSpec = (item) => {
  const value =
    item?.specificationModel ??
    item?.productSpecModel ??
    item?.productName ??
    "";
  return String(value ?? "").trim();
};

const buildDetailSpec = (item) => {
  const value =
    item?.specification ??
    item?.spec ??
    item?.sizeSpec ??
    item?.productSpec ??
    "";
  return String(value ?? "").trim();
};

// 根据文本长度动态计算字体大小
const getFontSize = (text, baseSize, maxWidthChars) => {
  const len = String(text ?? "").length;
  if (len <= maxWidthChars) return baseSize;
  // 超长文本按比例缩小
  const scale = maxWidthChars / len;
  const minSize = baseSize * 0.7; // 最小不低于基础大小的70%
  const calculatedSize = baseSize * scale;
  return Math.max(calculatedSize, minSize);
};

const renderLabelCard = (item) => {
  const customer = escapeHtml(item?.customerName);
  const order = escapeHtml(item?.salesContractNo);
  const model = escapeHtml(buildMainSpec(item));
  const spec = escapeHtml(buildDetailSpec(item));
  const address = escapeHtml(item?.floorCode);

  // 动态计算字体大小（基于50mm宽度，约20-25个字符为正常显示范围）
  const customerSize = getFontSize(customer, 4.2, 18);
  const orderSize = getFontSize(order, 4.6, 16);
  const modelSize = getFontSize(model, 4.0, 22);
  const specSize = getFontSize(spec, 3.8, 28);
  const addressSize = getFontSize(address, 3.5, 24);

  return `
    <div class="label-card">
      <div class="line customer" style="font-size: ${customerSize}mm;">${customer}</div>
      <div class="line order" style="font-size: ${orderSize}mm;">${order}</div>
      <div class="line model" style="font-size: ${modelSize}mm;">${model}</div>
      <div class="line spec" style="font-size: ${specSize}mm;">${spec}</div>
      <div class="line address" style="font-size: ${addressSize}mm;">${address}</div>
    </div>
  `;
};

export const printSalesLabel = (rawList = []) => {
  const list = Array.isArray(rawList) ? rawList : [];
@@ -34,7 +79,7 @@
    throw new Error("标签数据为空，无法打印");
  }

  const pageSize = 18; // 3 列 * 6 行（50x40mm）
  const pageSize = 6; // 2 列 * 3 行（50x40mm）
  const pages = splitByPage(list, pageSize);

  const printWindow = window.open("", "_blank", "width=1200,height=900");
@@ -56,10 +101,10 @@
        color: #222;
      }
      .page {
        width: 210mm;
        min-height: 297mm;
        width: 104mm;
        min-height: 124mm;
        margin: 0 auto;
        padding: 8mm 7mm;
        padding: 1mm;
        box-sizing: border-box;
        page-break-after: always;
      }
@@ -68,55 +113,57 @@
      }
      .grid {
        display: grid;
        grid-template-columns: repeat(3, 50mm);
        grid-template-columns: repeat(2, 50mm);
        grid-auto-rows: 40mm;
        gap: 2mm;
        gap: 1mm;
        justify-content: start;
      }
      .label-card {
        border: 1px solid #ddd;
        border-radius: 3mm;
        padding: 1.8mm 2.2mm;
        border: 0;
        border-radius: 0;
        padding: 2.2mm 2.5mm;
        width: 50mm;
        height: 40mm;
        box-sizing: border-box;
        display: grid;
        grid-template-rows: auto auto auto auto 1fr;
        row-gap: 0.9mm;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        overflow: hidden;
      }
      .line {
        font-weight: 700;
        line-height: 1.15;
        line-height: 1.2;
        word-break: break-all;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;
      }
      .customer {
        font-size: 4.0mm;
        /* 基础 4.2mm，动态调整 */
      }
      .order {
        font-size: 5.0mm;
        letter-spacing: 0;
        /* 基础 4.6mm，动态调整 */
      }
      .product {
        font-size: 4.5mm;
      .model {
        /* 基础 4.0mm，动态调整 */
      }
      .spec {
        font-size: 5.0mm;
        letter-spacing: 0;
        /* 基础 3.8mm，动态调整 */
      }
      .address {
        font-size: 3.8mm;
        /* 基础 3.5mm，动态调整 */
      }
      @media print {
        @page {
          size: A4 portrait;
          size: 104mm 124mm;
          margin: 0;
        }
        .page {
          width: 100%;
          min-height: 0;
          margin: 0;
          padding: 8mm 7mm;
          padding: 1mm;
        }
      }
    </style>