refactor: move code to plotcutter

src/components/md-deck/PltPreview.tsx

@@ -1,5 +1,7 @@
 import { createSignal, For, Show, createMemo } from 'solid-js';
-import type { PageData } from './hooks/usePDFExport';
+import { parsePlt, extractCutPaths, parsedPltToSvg } from '../../plotcutter/parser';
+import { generateTravelPaths, travelPathsToSvg } from '../../plotcutter/layout';
+import { pts2plotter } from '../../plotcutter/plotter';
 import type { CardPath } from '../../plotcutter';
 import type { CardShape } from '../../plotcutter';
 import {
@@ -7,116 +9,166 @@ import {
   calculateCenter,
   contourToSvgPath
 } from '../../plotcutter';
-import { generateTravelPaths, travelPathsToSvg } from '../../plotcutter';
-import { pts2plotter } from '../../plotcutter';
 
 export interface PltPreviewProps {
-  pages: PageData[];
+  /** PLT 文件内容 */
-  cardWidth: number;
+  pltCode: string;
-  cardHeight: number;
+  /** 卡片形状（用于生成刀路） */
   shape: CardShape;
+  /** 卡片宽度 (mm) */
+  cardWidth: number;
+  /** 卡片高度 (mm) */
+  cardHeight: number;
+  /** 出血 (mm) */
   bleed: number;
+  /** 圆角半径 (mm) */
   cornerRadius: number;
+  /** 打印方向 */
+  orientation: 'portrait' | 'landscape';
+  /** 关闭回调 */
   onClose: () => void;
 }
 
 /**
- * 生成卡片切割路径
+ * 从 PLT 代码解析并生成卡片路径数据
  */
-function generateCardPaths(
+function parsePltToCardPaths(pltCode: string, a4Height: number): {
-  pages: PageData[],
+  cutPaths: [number, number][][];
-  cardWidth: number,
+  cardPaths: CardPath[];
-  cardHeight: number,
+} {
-  shape: CardShape,
+  const parsed = parsePlt(pltCode);
-  bleed: number,
+  const cutPaths = extractCutPaths(parsed, 5); // 5mm 阈值
-  cornerRadius: number,
-  a4Height: number
-): CardPath[] {
-  const cardPaths: CardPath[] = [];
-  let pathIndex = 0;
 
-  // 计算切割尺寸（排版尺寸减去出血）
+  // 将解析的路径转换为 CardPath 格式用于显示
-  const cutWidth = cardWidth - bleed * 2;
+  const cardPaths: CardPath[] = cutPaths.map((points, index) => {
-  const cutHeight = cardHeight - bleed * 2;
+    const center = calculateCenter(points);
+    const pathD = contourToSvgPath(points);
+    const startPoint = points[0];
+    const endPoint = points[points.length - 1];
 
-  for (const page of pages) {
+    return {
-    for (const card of page.cards) {
+      pageIndex: 0,
-      if (card.side !== 'front') continue;
+      cardIndex: index,
+      points,
+      centerX: center.x,
+      centerY: center.y,
+      pathD,
+      startPoint,
+      endPoint
+    };
+  });
 
-      // 生成形状轮廓点（相对于卡片左下角）
+  return { cutPaths, cardPaths };
-      const shapePoints = getCardShapePoints(shape, cutWidth, cutHeight, cornerRadius);
-
-      // 平移到页面坐标并翻转 Y 轴
-      const pagePoints = shapePoints.map(([x, y]) => [
-        card.x + bleed + x,
-        a4Height - (card.y + bleed + y)
-      ] as [number, number]);
-
-      const center = calculateCenter(pagePoints);
-      const pathD = contourToSvgPath(pagePoints);
-
-      // 起点和终点（对于闭合路径是同一点）
-      const startPoint = pagePoints[0];
-      const endPoint = pagePoints[pagePoints.length - 1];
-
-      cardPaths.push({
-        pageIndex: page.pageIndex,
-        cardIndex: pathIndex++,
-        points: pagePoints,
-        centerX: center.x,
-        centerY: center.y,
-        pathD,
-        startPoint,
-        endPoint
-      });
-    }
-  }
-
-  return cardPaths;
 }
 
 /**
- * PLT 预览组件 - 显示切割路径预览
+ * 生成单页满排时的 PLT 代码（用于预览对比）
+ */
+function generateSinglePagePlt(
+  shape: CardShape,
+  cardWidth: number,
+  cardHeight: number,
+  bleed: number,
+  cornerRadius: number,
+  orientation: 'portrait' | 'landscape'
+): string {
+  const a4Width = orientation === 'landscape' ? 297 : 210;
+  const a4Height = orientation === 'landscape' ? 210 : 297;
+  const printMargin = 5;
+
+  const usableWidth = a4Width - printMargin * 2;
+  const usableHeight = a4Height - printMargin * 2;
+  const cardsPerRow = Math.floor(usableWidth / cardWidth);
+  const rowsPerPage = Math.floor(usableHeight / cardHeight);
+  const cardsPerPage = cardsPerRow * rowsPerPage;
+
+  const maxGridWidth = cardsPerRow * cardWidth;
+  const maxGridHeight = rowsPerPage * cardHeight;
+  const offsetX = (a4Width - maxGridWidth) / 2;
+  const offsetY = (a4Height - maxGridHeight) / 2;
+
+  const cutWidth = cardWidth - bleed * 2;
+  const cutHeight = cardHeight - bleed * 2;
+
+  const allPaths: [number, number][][] = [];
+
+  for (let i = 0; i < cardsPerPage; i++) {
+    const row = Math.floor(i / cardsPerRow);
+    const col = i % cardsPerRow;
+    const x = offsetX + col * cardWidth;
+    const y = offsetY + row * cardHeight;
+
+    const shapePoints = getCardShapePoints(shape, cutWidth, cutHeight, cornerRadius);
+    const pagePoints = shapePoints.map(([px, py]) => [
+      x + bleed + px,
+      a4Height - (y + bleed + py)
+    ] as [number, number]);
+
+    allPaths.push(pagePoints);
+  }
+
+  if (allPaths.length === 0) return '';
+
+  const startPoint: [number, number] = [0, a4Height];
+  const endPoint: [number, number] = [0, a4Height];
+  return pts2plotter(allPaths, a4Width, a4Height, 1, startPoint, endPoint);
+}
+
+/**
+ * PLT 预览组件 - 基于 PLT 文本解析显示切割路径预览
  */
 export function PltPreview(props: PltPreviewProps) {
-  const a4Width = 297; // 横向 A4
+  const a4Width = props.orientation === 'landscape' ? 297 : 210;
-  const a4Height = 210;
+  const a4Height = props.orientation === 'landscape' ? 210 : 297;
 
   // 使用传入的圆角值，但也允许用户修改
   const [cornerRadius, setCornerRadius] = createSignal(props.cornerRadius);
 
-  // 生成所有卡片路径
+  // 解析传入的 PLT 代码
-  const cardPaths = createMemo(() =>
+  const parsedData = createMemo(() => {
-    generateCardPaths(
+    if (!props.pltCode) {
-      props.pages,
+      return { cutPaths: [] as [number, number][][], cardPaths: [] as CardPath[] };
-      props.cardWidth,
+    }
-      props.cardHeight,
+    return parsePltToCardPaths(props.pltCode, a4Height);
-      props.shape,
+  });
-      props.bleed,
-      cornerRadius(),
-      a4Height
-    )
-  );
 
   // 生成空走路径
   const travelPathD = createMemo(() => {
-    const travelPaths = generateTravelPaths(cardPaths(), a4Height);
+    const cardPaths = parsedData().cardPaths;
+    if (cardPaths.length === 0) return '';
+    const travelPaths = generateTravelPaths(cardPaths, a4Height);
     return travelPathsToSvg(travelPaths);
   });
 
-  // 生成 HPGL 代码用于下载
+  // 生成单页满排时的 PLT 代码（用于对比）
-  const plotterCode = createMemo(() => {
+  const singlePagePltCode = createMemo(() => {
-    const allPaths = cardPaths().map(p => p.points);
+    return generateSinglePagePlt(
-    return allPaths.length > 0 ? pts2plotter(allPaths, a4Width, a4Height, 1) : '';
+      props.shape,
+      props.cardWidth,
+      props.cardHeight,
+      props.bleed,
+      cornerRadius(),
+      props.orientation
+    );
+  });
+
+  // 生成当前 PLT 的 HPGL 代码（重新生成，确保圆角更新）
+  const currentPltCode = createMemo(() => {
+    const cardPaths = parsedData().cardPaths;
+    if (cardPaths.length === 0) return '';
+    const allPaths = cardPaths.map(p => p.points);
+    const startPoint: [number, number] = [0, a4Height];
+    const endPoint: [number, number] = [0, a4Height];
+    return pts2plotter(allPaths, a4Width, a4Height, 1, startPoint, endPoint);
   });
 
   const handleDownload = () => {
-    if (!plotterCode()) {
+    if (!currentPltCode()) {
       alert('没有可导出的卡片');
       return;
     }
 
-    const blob = new Blob([plotterCode()], { type: 'application/vnd.hp-HPGL' });
+    const blob = new Blob([currentPltCode()], { type: 'application/vnd.hp-HPGL' });
     const url = URL.createObjectURL(blob);
     const link = document.createElement('a');
     link.href = url;
@@ -154,7 +206,7 @@ export function PltPreview(props: PltPreviewProps) {
             <button
               onClick={handleDownload}
               class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1.5 rounded text-sm font-medium cursor-pointer flex items-center gap-1"
-              disabled={cardPaths().length === 0}
+              disabled={parsedData().cardPaths.length === 0}
             >
               📥 下载 PLT
             </button>
@@ -170,101 +222,82 @@ export function PltPreview(props: PltPreviewProps) {
 
         {/* 预览区域 */}
         <div class="flex flex-col items-center gap-8 mt-20">
-          <For each={props.pages}>
+          <svg
-            {(page) => {
+            class="bg-white shadow-xl"
-              const pageCardPaths = cardPaths().filter(p => p.pageIndex === page.pageIndex);
+            viewBox={`0 0 ${a4Width} ${a4Height}`}
-
+            style={{
-              return (
+              width: `${a4Width}mm`,
-                <svg
+              height: `${a4Height}mm`
-                  class="bg-white shadow-xl"
-                  viewBox={`0 0 ${a4Width} ${a4Height}`}
-                  style={{
-                    width: `${a4Width}mm`,
-                    height: `${a4Height}mm`
-                  }}
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  {/* A4 边框 */}
-                  <rect
-                    x="0"
-                    y="0"
-                    width={a4Width}
-                    height={a4Height}
-                    fill="none"
-                    stroke="#ccc"
-                    stroke-width="0.5"
-                  />
-
-                  {/* 页面边框 */}
-                  <rect
-                    x={page.frameBounds.minX}
-                    y={page.frameBounds.minY}
-                    width={page.frameBounds.maxX - page.frameBounds.minX}
-                    height={page.frameBounds.maxY - page.frameBounds.minY}
-                    fill="none"
-                    stroke="#888"
-                    stroke-width="0.2"
-                  />
-
-                  {/* 空走路径（虚线） */}
-                  <Show when={travelPathD()}>
-                    <path
-                      d={travelPathD()}
-                      fill="none"
-                      stroke="#999"
-                      stroke-width="0.2"
-                      stroke-dasharray="2 2"
-                    />
-                  </Show>
-
-                  {/* 切割路径 */}
-                  <For each={pageCardPaths}>
-                    {(path) => {
-                      return (
-                        <g>
-                          {/* 切割路径 */}
-                          <path
-                            d={path.pathD}
-                            fill="none"
-                            stroke="#3b82f6"
-                            stroke-width="0.3"
-                          />
-
-                          {/* 动画小球 */}
-                          <circle
-                            r="0.8"
-                            fill="#ef4444"
-                          >
-                            <animateMotion dur="4s" repeatCount="indefinite" path={path.pathD}>
-                            </animateMotion>
-                          </circle>
-
-                          {/* 序号标签 */}
-                          <g transform={`translate(${path.centerX}, ${path.centerY})`}>
-                            <circle
-                              r="2"
-                              fill="white"
-                              stroke="#3b82f6"
-                              stroke-width="0.1"
-                            />
-                            <text
-                              text-anchor="middle"
-                              dominant-baseline="middle"
-                              font-size="1.5"
-                              fill="#3b82f6"
-                              font-weight="bold"
-                            >
-                              {path.cardIndex + 1}
-                            </text>
-                          </g>
-                        </g>
-                      );
-                    }}
-                  </For>
-                </svg>
-              );
             }}
-          </For>
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            {/* A4 边框 */}
+            <rect
+              x="0"
+              y="0"
+              width={a4Width}
+              height={a4Height}
+              fill="none"
+              stroke="#ccc"
+              stroke-width="0.5"
+            />
+
+            {/* 空走路径（虚线） */}
+            <Show when={travelPathD()}>
+              <path
+                d={travelPathD()}
+                fill="none"
+                stroke="#999"
+                stroke-width="0.2"
+                stroke-dasharray="2 2"
+              />
+            </Show>
+
+            {/* 切割路径 */}
+            <For each={parsedData().cardPaths}>
+              {(path) => {
+                return (
+                  <g>
+                    {/* 切割路径 */}
+                    <path
+                      d={path.pathD}
+                      fill="none"
+                      stroke="#3b82f6"
+                      stroke-width="0.3"
+                    />
+
+                    {/* 动画小球 */}
+                    <circle
+                      r="0.8"
+                      fill="#ef4444"
+                    >
+                      <animateMotion dur="4s" repeatCount="indefinite" path={path.pathD}>
+                      </animateMotion>
+                    </circle>
+
+                    {/* 序号标签 */}
+                    <g transform={`translate(${path.centerX}, ${path.centerY})`}>
+                      <circle
+                        r="2"
+                        fill="white"
+                        stroke="#3b82f6"
+                        stroke-width="0.1"
+                      />
+                      <text
+                        text-anchor="middle"
+                        dominant-baseline="middle"
+                        font-size="1.5"
+                        fill="#3b82f6"
+                        font-weight="bold"
+                      >
+                        {path.cardIndex + 1}
+                      </text>
+                    </g>
+                  </g>
+                );
+              }}
+            </For>
+          </svg>
         </div>
 
         {/* 图例说明 */}

src/components/md-deck/PrintPreview.tsx

@@ -25,6 +25,7 @@ export function PrintPreview(props: PrintPreviewProps) {
   const { generatePltData, downloadPltFile } = usePlotterExport(store);
 
   const [showPltPreview, setShowPltPreview] = createSignal(false);
+  const [pltCode, setPltCode] = createSignal('');
 
   const frontVisibleLayers = () => store.state.frontLayerConfigs.filter((l) => l.visible);
   const backVisibleLayers = () => store.state.backLayerConfigs.filter((l) => l.visible);
@@ -45,7 +46,13 @@ export function PrintPreview(props: PrintPreviewProps) {
   };
 
   const handleOpenPltPreview = () => {
-    setShowPltPreview(true);
+    const data = generatePltData();
+    if (data) {
+      setPltCode(data.pltCode);
+      setShowPltPreview(true);
+    } else {
+      alert('没有可预览的卡片');
+    }
   };
 
   const handleClosePltPreview = () => {
@@ -53,7 +60,7 @@ export function PrintPreview(props: PrintPreviewProps) {
   };
 
   return (
-    <Show when={!showPltPreview()} fallback={<PltPreview pages={pages()} cardWidth={store.state.dimensions?.cardWidth || 56} cardHeight={store.state.dimensions?.cardHeight || 88} shape={store.state.shape} bleed={store.state.bleed || 1} cornerRadius={store.state.cornerRadius ?? 3} onClose={handleClosePltPreview} />}>
+    <Show when={!showPltPreview()} fallback={<PltPreview pltCode={pltCode()} cardWidth={store.state.dimensions?.cardWidth || 56} cardHeight={store.state.dimensions?.cardHeight || 88} shape={store.state.shape} bleed={store.state.bleed || 1} cornerRadius={store.state.cornerRadius ?? 3} orientation={store.state.printOrientation || 'landscape'} onClose={handleClosePltPreview} />}>
       <div class="fixed inset-0 bg-black/50 z-50 overflow-auto">
         <div class="min-h-screen py-20 px-4">
           <PrintPreviewHeader

src/components/md-deck/hooks/usePlotterExport.ts

@@ -1,69 +1,30 @@
 import type { DeckStore } from './deckStore';
-import type { PageData } from './usePDFExport';
+import { calculateSinglePageLayout, generateTravelPaths, pts2plotter } from '../../../plotcutter';
-import type { CardShape } from '../types';
-import {
-  getCardShapePoints,
-  calculateCenter
-} from '../../../plotcutter/contour';
-import { pts2plotter } from '../../../plotcutter/plotter';
-
-export interface CardPathData {
-  points: [number, number][];
-  centerX: number;
-  centerY: number;
-  startPoint: [number, number];
-  endPoint: [number, number];
-}
 
 export interface PltExportData {
-  paths: CardPathData[];
+  /** 单页满排时的 PLT 代码 */
-  travelPaths: [number, number][][];
+  pltCode: string;
-  plotterCode: string;
+  /** A4 宽度 (mm) */
   a4Width: number;
+  /** A4 高度 (mm) */
   a4Height: number;
+  /** 每页卡片数 */
+  cardsPerPage: number;
 }
 
 export interface UsePlotterExportReturn {
-  generatePltData: (pages: PageData[]) => PltExportData | null;
+  /** 生成单页满排时的 PLT 数据 */
-  downloadPltFile: (plotterCode: string) => void;
+  generatePltData: () => PltExportData | null;
-  exportToPlt: (pages: PageData[]) => void;
+  /** 下载 PLT 文件 */
+  downloadPltFile: (pltCode: string) => void;
+  /** 直接导出 PLT（打开下载） */
+  exportToPlt: () => void;
 }
 
 /**
- * 生成空走路径（抬刀移动路径）
+ * PLT 导出 hook - 生成单页满排时的 HPGL 格式文件
- * 从左上角出发，连接所有卡片的起点/终点，最后返回左上角
+ * 
- */
+ * 刀路只关心单页排满的情况，不考虑实际牌组的张数。
-function generateTravelPaths(
-  cardPaths: CardPathData[],
-  a4Height: number
-): [number, number][][] {
-  const travelPaths: [number, number][][] = [];
-
-  // 起点：左上角 (0, a4Height) - 注意 SVG 坐标 Y 向下，plotter 坐标 Y 向上
-  const startPoint: [number, number] = [0, a4Height];
-
-  if (cardPaths.length === 0) {
-    return travelPaths;
-  }
-
-  // 从起点到第一张卡的起点
-  travelPaths.push([startPoint, cardPaths[0].startPoint]);
-
-  // 卡片之间的移动
-  for (let i = 0; i < cardPaths.length - 1; i++) {
-    const currentEnd = cardPaths[i].endPoint;
-    const nextStart = cardPaths[i + 1].startPoint;
-    travelPaths.push([currentEnd, nextStart]);
-  }
-
-  // 从最后一张卡返回起点
-  travelPaths.push([cardPaths[cardPaths.length - 1].endPoint, startPoint]);
-
-  return travelPaths;
-}
-
-/**
- * PLT 导出 hook - 生成 HPGL 格式文件并下载
  */
 export function usePlotterExport(store: DeckStore): UsePlotterExportReturn {
   const bleed = () => store.state.bleed || 1;
@@ -71,81 +32,51 @@ export function usePlotterExport(store: DeckStore): UsePlotterExportReturn {
   const cardWidth = () => store.state.dimensions?.cardWidth || 56;
   const cardHeight = () => store.state.dimensions?.cardHeight || 88;
   const shape = () => store.state.shape;
-  const a4Width = 297; // 横向 A4
+  const orientation = () => store.state.printOrientation || 'landscape';
-  const a4Height = 210;
 
   /**
-   * 生成 PLT 数据（不下载，用于预览）
+   * 生成单页满排时的 PLT 数据
    */
-  const generatePltData = (pages: PageData[]): PltExportData | null => {
+  const generatePltData = (): PltExportData | null => {
-    const paths: CardPathData[] = [];
+    const layout = calculateSinglePageLayout({
-    const currentBleed = bleed();
+      cardWidth: cardWidth(),
-    const currentCornerRadius = cornerRadius();
+      cardHeight: cardHeight(),
+      shape: shape(),
+      bleed: bleed(),
+      cornerRadius: cornerRadius(),
+      orientation: orientation()
+    });
 
-    // 计算切割尺寸（排版尺寸减去出血）
+    if (layout.cardPaths.length === 0) {
-    const cutWidth = cardWidth() - currentBleed * 2;
-    const cutHeight = cardHeight() - currentBleed * 2;
-
-    for (const page of pages) {
-      for (const card of page.cards) {
-        if (card.side !== 'front') continue;
-
-        // 获取卡片形状点（相对于卡片原点，使用切割尺寸）
-        const shapePoints = getCardShapePoints(shape(), cutWidth, cutHeight, currentCornerRadius);
-
-        // 转换点到页面坐标：
-        // - X 轴：卡片位置 + 出血偏移
-        // - Y 轴：翻转（SVG Y 向下，plotter Y 向上）
-        const pagePoints = shapePoints.map(([x, y]) => [
-          card.x + currentBleed + x,
-          a4Height - (card.y + currentBleed + y)
-        ] as [number, number]);
-
-        const center = calculateCenter(pagePoints);
-        const startPoint = pagePoints[0];
-        const endPoint = pagePoints[pagePoints.length - 1];
-        
-        paths.push({
-          points: pagePoints,
-          centerX: center.x,
-          centerY: center.y,
-          startPoint,
-          endPoint
-        });
-      }
-    }
-
-    if (paths.length === 0) {
       return null;
     }
 
     // 生成空走路径
-    const travelPaths = generateTravelPaths(paths, a4Height);
+    const travelPaths = generateTravelPaths(layout.cardPaths, layout.a4Height);
-    
+
     // 生成 HPGL 代码（包含空走路径，从左上角出发并返回）
-    const allPaths = paths.map(p => p.points);
+    const allPaths = layout.cardPaths.map(p => p.points);
-    const startPoint: [number, number] = [0, a4Height]; // 左上角
+    const startPoint: [number, number] = [0, layout.a4Height];
-    const endPoint: [number, number] = [0, a4Height];   // 返回左上角
+    const endPoint: [number, number] = [0, layout.a4Height];
-    const plotterCode = pts2plotter(allPaths, a4Width, a4Height, 1, startPoint, endPoint);
+    const plotterCode = pts2plotter(allPaths, layout.a4Width, layout.a4Height, 1, startPoint, endPoint);
 
     return {
-      paths,
+      pltCode: plotterCode,
-      travelPaths,
+      a4Width: layout.a4Width,
-      plotterCode,
+      a4Height: layout.a4Height,
-      a4Width,
+      cardsPerPage: layout.cardsPerPage
-      a4Height
     };
   };
 
   /**
    * 下载 PLT 文件
    */
-  const downloadPltFile = (plotterCode: string) => {
+  const downloadPltFile = (pltCode: string) => {
-    const blob = new Blob([plotterCode], { type: 'application/vnd.hp-HPGL' });
+    const blob = new Blob([pltCode], { type: 'application/vnd.hp-HPGL' });
     const url = URL.createObjectURL(blob);
     const link = document.createElement('a');
     link.href = url;
-    link.download = `deck-export-${new Date().toISOString().slice(0, 19).replace(/:/g, '-')}.plt`;
+    link.download = `deck-plt-${new Date().toISOString().slice(0, 19).replace(/:/g, '-')}.plt`;
     document.body.appendChild(link);
     link.click();
     document.body.removeChild(link);
@@ -153,15 +84,15 @@ export function usePlotterExport(store: DeckStore): UsePlotterExportReturn {
   };
 
   /**
-   * 直接导出 PLT（兼容旧接口）
+   * 直接导出 PLT（打开下载）
    */
-  const exportToPlt = (pages: PageData[]) => {
+  const exportToPlt = () => {
-    const data = generatePltData(pages);
+    const data = generatePltData();
     if (!data) {
       alert('没有可导出的卡片');
       return;
     }
-    downloadPltFile(data.plotterCode);
+    downloadPltFile(data.pltCode);
   };
 
   return { generatePltData, downloadPltFile, exportToPlt };

src/plotcutter/contour.ts

@@ -1,16 +1,4 @@
-export type CardShape = 'rectangle' | 'circle' | 'triangle' | 'hexagon';
+import type { CardShape, ContourPoint, ContourBounds } from './types';
-
-export interface ContourPoint {
-  x: number;
-  y: number;
-}
-
-export interface ContourBounds {
-  minX: number;
-  minY: number;
-  maxX: number;
-  maxY: number;
-}
 
 /**
  * 生成带圆角的矩形轮廓点

src/plotcutter/index.ts

@@ -2,4 +2,6 @@ export * from "./bezier";
 export * from "./vector";
 export * from "./plotter";
 export * from "./contour";
-export * from "./layout";
+export * from "./layout";
+export * from "./types";
+export * from "./parser";

src/plotcutter/layout.ts

@@ -1,18 +1,12 @@
 import { contourToSvgPath } from './contour';
+import { getCardShapePoints, calculateCenter } from './contour';
+import type { CardPath, SinglePageLayout, LayoutOptions, CardPosition } from './types';
 
-/**
+const A4_WIDTH_PORTRAIT = 210;
- * 卡片切割路径
+const A4_HEIGHT_PORTRAIT = 297;
- */
+const A4_WIDTH_LANDSCAPE = 297;
-export interface CardPath {
+const A4_HEIGHT_LANDSCAPE = 210;
-  pageIndex: number;
+const DEFAULT_PRINT_MARGIN = 5;
-  cardIndex: number;
-  points: [number, number][];
-  centerX: number;
-  centerY: number;
-  pathD: string;
-  startPoint: [number, number];
-  endPoint: [number, number];
-}
 
 /**
  * 生成空走路径（抬刀移动路径）
@@ -93,3 +87,149 @@ export function calculateTotalBounds(cardPaths: CardPath[]): {
     height: maxY - minY
   };
 }
+
+/**
+ * 计算单页满排时的排版布局和刀路
+ * 
+ * 此函数只关心单页排满的情况，不考虑实际牌组的张数。
+ * 返回的布局信息可以用于：
+ * - 预览单页最大容量时的刀路
+ * - 计算排版参数
+ * - 生成 PLT 文件
+ */
+export function calculateSinglePageLayout(options: LayoutOptions): SinglePageLayout {
+  const {
+    cardWidth,
+    cardHeight,
+    shape,
+    bleed,
+    cornerRadius,
+    orientation,
+    printMargin = DEFAULT_PRINT_MARGIN
+  } = options;
+
+  // 确定 A4 尺寸
+  const a4Width = orientation === 'landscape' ? A4_WIDTH_LANDSCAPE : A4_WIDTH_PORTRAIT;
+  const a4Height = orientation === 'landscape' ? A4_HEIGHT_LANDSCAPE : A4_HEIGHT_PORTRAIT;
+
+  // 计算可用区域
+  const usableWidth = a4Width - printMargin * 2;
+  const usableHeight = a4Height - printMargin * 2;
+
+  // 计算每行/每页的卡片数
+  const cardsPerRow = Math.floor(usableWidth / cardWidth);
+  const rowsPerPage = Math.floor(usableHeight / cardHeight);
+  const cardsPerPage = cardsPerRow * rowsPerPage;
+
+  // 计算网格居中偏移
+  const maxGridWidth = cardsPerRow * cardWidth;
+  const maxGridHeight = rowsPerPage * cardHeight;
+  const offsetX = (a4Width - maxGridWidth) / 2;
+  const offsetY = (a4Height - maxGridHeight) / 2;
+
+  // 计算切割尺寸（排版尺寸减去出血）
+  const cutWidth = cardWidth - bleed * 2;
+  const cutHeight = cardHeight - bleed * 2;
+
+  // 生成卡片位置和刀路
+  const cardPositions: CardPosition[] = [];
+  const cardPaths: CardPath[] = [];
+
+  for (let i = 0; i < cardsPerPage; i++) {
+    const row = Math.floor(i / cardsPerRow);
+    const col = i % cardsPerRow;
+
+    // 卡片位置（左下角坐标）
+    const x = offsetX + col * cardWidth;
+    const y = offsetY + row * cardHeight;
+
+    cardPositions.push({ x, y, cardIndex: i });
+
+    // 生成形状轮廓点（相对于卡片左下角）
+    const shapePoints = getCardShapePoints(shape, cutWidth, cutHeight, cornerRadius);
+
+    // 平移到页面坐标并翻转 Y 轴（SVG Y 向下，plotter Y 向上）
+    const pagePoints = shapePoints.map(([px, py]) => [
+      x + bleed + px,
+      a4Height - (y + bleed + py)
+    ] as [number, number]);
+
+    const center = calculateCenter(pagePoints);
+    const pathD = contourToSvgPath(pagePoints);
+    const startPoint = pagePoints[0];
+    const endPoint = pagePoints[pagePoints.length - 1];
+
+    cardPaths.push({
+      pageIndex: 0,
+      cardIndex: i,
+      points: pagePoints,
+      centerX: center.x,
+      centerY: center.y,
+      pathD,
+      startPoint,
+      endPoint
+    });
+  }
+
+  return {
+    cardPositions,
+    cardPaths,
+    a4Width,
+    a4Height,
+    cardsPerRow,
+    rowsPerPage,
+    cardsPerPage
+  };
+}
+
+/**
+ * 根据卡片位置生成刀路（用于自定义布局）
+ */
+export function generateCardPathsFromPositions(
+  positions: CardPosition[],
+  options: Omit<LayoutOptions, 'orientation' | 'printMargin'> & { a4Height: number }
+): CardPath[] {
+  const {
+    cardWidth,
+    cardHeight,
+    shape,
+    bleed,
+    cornerRadius,
+    a4Height
+  } = options;
+
+  // 计算切割尺寸
+  const cutWidth = cardWidth - bleed * 2;
+  const cutHeight = cardHeight - bleed * 2;
+
+  const cardPaths: CardPath[] = [];
+
+  for (const pos of positions) {
+    // 生成形状轮廓点（相对于卡片左下角）
+    const shapePoints = getCardShapePoints(shape, cutWidth, cutHeight, cornerRadius);
+
+    // 平移到页面坐标并翻转 Y 轴
+    const pagePoints = shapePoints.map(([px, py]) => [
+      pos.x + bleed + px,
+      a4Height - (pos.y + bleed + py)
+    ] as [number, number]);
+
+    const center = calculateCenter(pagePoints);
+    const pathD = contourToSvgPath(pagePoints);
+    const startPoint = pagePoints[0];
+    const endPoint = pagePoints[pagePoints.length - 1];
+
+    cardPaths.push({
+      pageIndex: 0,
+      cardIndex: pos.cardIndex,
+      points: pagePoints,
+      centerX: center.x,
+      centerY: center.y,
+      pathD,
+      startPoint,
+      endPoint
+    });
+  }
+
+  return cardPaths;
+}

src/plotcutter/parser.ts

@@ -0,0 +1,221 @@
+import type { ParsedPlt } from './types';
+
+/**
+ * HPGL 单位转换系数
+ */
+const HPGL_UNIT = 0.025; // 1 HPGL unit = 0.025mm
+
+/**
+ * 解析 HPGL/PLT 代码，提取路径信息
+ * 
+ * 支持的命令：
+ * - IN: 初始化
+ * - TB: 定义绘图区域
+ * - CT: 设置切线角度
+ * - SP: 选择画笔
+ * - PU: 抬笔移动
+ * - PD: 下笔绘制
+ * - D: 绘制到指定点（简写）
+ * - U: 抬笔移动到指定点（简写）
+ * - @: 结束命令
+ */
+export function parsePlt(pltCode: string): ParsedPlt {
+  const result: ParsedPlt = {
+    paths: [],
+    startPoint: undefined,
+    endPoint: undefined,
+    width: undefined,
+    height: undefined
+  };
+
+  // 解析 TB 命令获取页面尺寸
+  const tbMatch = pltCode.match(/TB(\d+),(\d+),(\d+)/);
+  if (tbMatch) {
+    const width = Number(tbMatch[2]) * HPGL_UNIT;
+    const height = Number(tbMatch[3]) * HPGL_UNIT;
+    result.width = width;
+    result.height = height;
+  }
+
+  // 提取所有下笔绘制的路径
+  // 解析逻辑：跟踪 PU/PD/U/D 命令，收集 PD/D 命令的点
+  const lines = pltCode.split('\n');
+  let currentPath: [number, number][] = [];
+  let isPenDown = false;
+  let currentPosition: [number, number] = [0, 0];
+
+  for (const line of lines) {
+    const trimmed = line.trim();
+    
+    // 解析 PU 命令（抬笔移动）
+    const puMatch = trimmed.match(/PU\s*(\d+(?:\.\d+)?),(\d+(?:\.\d+)?)/i);
+    if (puMatch) {
+      if (currentPath.length > 0) {
+        result.paths.push([...currentPath]);
+        currentPath = [];
+      }
+      isPenDown = false;
+      currentPosition = [
+        Number(puMatch[1]) * HPGL_UNIT,
+        Number(puMatch[2]) * HPGL_UNIT
+      ];
+      continue;
+    }
+
+    // 解析 PD 命令（下笔绘制）
+    const pdMatch = trimmed.match(/PD\s*(\d+(?:\.\d+)?),(\d+(?:\.\d+)?)/i);
+    if (pdMatch) {
+      const newPoint: [number, number] = [
+        Number(pdMatch[1]) * HPGL_UNIT,
+        Number(pdMatch[2]) * HPGL_UNIT
+      ];
+      
+      if (!isPenDown) {
+        // 新的路径起点
+        currentPath = [newPoint];
+        isPenDown = true;
+      } else {
+        currentPath.push(newPoint);
+      }
+      currentPosition = newPoint;
+      continue;
+    }
+
+    // 解析 U 命令（抬笔移动，简写）
+    const uMatch = trimmed.match(/U\s*(\d+(?:\.\d+)?),(\d+(?:\.\d+)?)/i);
+    if (uMatch) {
+      if (currentPath.length > 0) {
+        result.paths.push([...currentPath]);
+        currentPath = [];
+      }
+      isPenDown = false;
+      currentPosition = [
+        Number(uMatch[1]) * HPGL_UNIT,
+        Number(uMatch[2]) * HPGL_UNIT
+      ];
+      continue;
+    }
+
+    // 解析 D 命令（下笔绘制，简写）
+    const dMatch = trimmed.match(/D\s*(\d+(?:\.\d+)?),(\d+(?:\.\d+)?)/i);
+    if (dMatch) {
+      const newPoint: [number, number] = [
+        Number(dMatch[1]) * HPGL_UNIT,
+        Number(dMatch[2]) * HPGL_UNIT
+      ];
+      
+      if (!isPenDown) {
+        // 新的路径起点
+        currentPath = [newPoint];
+        isPenDown = true;
+      } else {
+        currentPath.push(newPoint);
+      }
+      currentPosition = newPoint;
+      continue;
+    }
+
+    // 解析 PA 命令（绝对坐标移动）
+    const paMatch = trimmed.match(/PA\s*(\d+(?:\.\d+)?),(\d+(?:\.\d+)?)/i);
+    if (paMatch) {
+      const newPoint: [number, number] = [
+        Number(paMatch[1]) * HPGL_UNIT,
+        Number(paMatch[2]) * HPGL_UNIT
+      ];
+      
+      if (isPenDown) {
+        currentPath.push(newPoint);
+      } else {
+        if (currentPath.length > 0) {
+          result.paths.push([...currentPath]);
+          currentPath = [];
+        }
+        currentPosition = newPoint;
+      }
+      continue;
+    }
+
+    // 检查结束命令
+    if (trimmed.includes('@')) {
+      if (currentPath.length > 0) {
+        result.paths.push([...currentPath]);
+        currentPath = [];
+      }
+      break;
+    }
+  }
+
+  // 处理最后一条路径
+  if (currentPath.length > 0) {
+    result.paths.push([...currentPath]);
+  }
+
+  // 设置起点和终点
+  if (result.paths.length > 0) {
+    const firstPath = result.paths[0];
+    const lastPath = result.paths[result.paths.length - 1];
+    
+    if (firstPath.length > 0) {
+      result.startPoint = firstPath[0];
+    }
+    if (lastPath.length > 0) {
+      result.endPoint = lastPath[lastPath.length - 1];
+    }
+  }
+
+  return result;
+}
+
+/**
+ * 从解析的 PLT 数据中提取切割路径（排除空走路径）
+ * 
+ * 空走路径特征：
+ * - 路径长度短（通常是直线移动）
+ * - 连接两个切割路径的终点和起点
+ * 
+ * @param parsedPlt 解析后的 PLT 数据
+ * @param minCutLength 最小切割路径长度阈值（mm），小于此值的路径被视为空走路径
+ */
+export function extractCutPaths(parsedPlt: ParsedPlt, minCutLength: number = 5): [number, number][][] {
+  const allPaths = parsedPlt.paths;
+  const cutPaths: [number, number][][] = [];
+
+  for (const path of allPaths) {
+    if (path.length < 2) continue;
+
+    // 计算路径长度
+    let pathLength = 0;
+    for (let i = 1; i < path.length; i++) {
+      const [x1, y1] = path[i - 1];
+      const [x2, y2] = path[i];
+      const dx = x2 - x1;
+      const dy = y2 - y1;
+      pathLength += Math.sqrt(dx * dx + dy * dy);
+    }
+
+    // 如果路径长度大于阈值，认为是切割路径
+    if (pathLength >= minCutLength) {
+      cutPaths.push(path);
+    }
+  }
+
+  return cutPaths;
+}
+
+/**
+ * 将解析的路径转换为 SVG path 命令
+ */
+export function parsedPltToSvg(paths: [number, number][]): string {
+  if (paths.length === 0) return '';
+
+  const [startX, startY] = paths[0];
+  let d = `M ${startX} ${startY}`;
+
+  for (let i = 1; i < paths.length; i++) {
+    const [x, y] = paths[i];
+    d += ` L ${x} ${y}`;
+  }
+
+  d += ' Z';
+  return d;
+}

src/plotcutter/types.ts

@@ -0,0 +1,101 @@
+/**
+ * 卡片形状类型
+ */
+export type CardShape = 'rectangle' | 'circle' | 'triangle' | 'hexagon';
+
+/**
+ * 轮廓点类型
+ */
+export interface ContourPoint {
+  x: number;
+  y: number;
+}
+
+/**
+ * 轮廓边界框
+ */
+export interface ContourBounds {
+  minX: number;
+  minY: number;
+  maxX: number;
+  maxY: number;
+}
+
+/**
+ * 卡片切割路径
+ */
+export interface CardPath {
+  pageIndex: number;
+  cardIndex: number;
+  points: [number, number][];
+  centerX: number;
+  centerY: number;
+  pathD: string;
+  startPoint: [number, number];
+  endPoint: [number, number];
+}
+
+/**
+ * 单页排版结果
+ */
+export interface SinglePageLayout {
+  /** 单页满排时的卡片位置 */
+  cardPositions: CardPosition[];
+  /** 对应的刀路路径 */
+  cardPaths: CardPath[];
+  /** A4 纸宽度 (mm) */
+  a4Width: number;
+  /** A4 纸高度 (mm) */
+  a4Height: number;
+  /** 每行卡片数 */
+  cardsPerRow: number;
+  /** 每页行数 */
+  rowsPerPage: number;
+  /** 每页总卡片数 */
+  cardsPerPage: number;
+}
+
+/**
+ * 卡片位置
+ */
+export interface CardPosition {
+  x: number;
+  y: number;
+  cardIndex: number;
+}
+
+/**
+ * 排版选项
+ */
+export interface LayoutOptions {
+  /** 卡片宽度 (mm) */
+  cardWidth: number;
+  /** 卡片高度 (mm) */
+  cardHeight: number;
+  /** 卡片形状 */
+  shape: CardShape;
+  /** 出血 (mm) */
+  bleed: number;
+  /** 圆角半径 (mm) */
+  cornerRadius: number;
+  /** 打印方向 */
+  orientation: 'portrait' | 'landscape';
+  /** 打印边距 (mm) */
+  printMargin?: number;
+}
+
+/**
+ * PLT 解析结果
+ */
+export interface ParsedPlt {
+  /** 解析出的路径 */
+  paths: [number, number][][];
+  /** 起点坐标 (mm) */
+  startPoint?: [number, number];
+  /** 终点坐标 (mm) */
+  endPoint?: [number, number];
+  /** 页面宽度 (mm) */
+  width?: number;
+  /** 页面高度 (mm) */
+  height?: number;
+}