refactor: ai's attempt

src/components/utils/dimensions.ts

@@ -0,0 +1,73 @@
+import type { Dimensions } from '../types';
+
+export interface DimensionOptions {
+  size: string;
+  bleed: string;
+  padding: string;
+  grid: string;
+}
+
+/**
+ * 解析卡牌尺寸和网格配置
+ */
+export function calculateDimensions(options: DimensionOptions): Dimensions {
+  const [width, height] = options.size.split('x').map(Number);
+  const [bleedW, bleedH] = options.bleed.includes('x')
+    ? options.bleed.split('x').map(Number)
+    : [Number(options.bleed), Number(options.bleed)];
+  const [padW, padH] = options.padding.includes('x')
+    ? options.padding.split('x').map(Number)
+    : [Number(options.padding), Number(options.padding)];
+
+  // 实际卡牌尺寸（含出血）
+  const cardWidth = width + bleedW * 2;
+  const cardHeight = height + bleedH * 2;
+
+  // 网格区域尺寸（减去 padding）
+  const gridAreaWidth = width - padW * 2;
+  const gridAreaHeight = height - padH * 2;
+
+  // 解析网格
+  const [gridW, gridH] = options.grid.split('x').map(Number);
+
+  // 每个网格单元的尺寸（mm）
+  const cellWidth = gridAreaWidth / gridW;
+  const cellHeight = gridAreaHeight / gridH;
+
+  // 网格区域起点（相对于卡牌左上角，含 bleed 和 padding）
+  const gridOriginX = bleedW + padW;
+  const gridOriginY = bleedH + padH;
+
+  return {
+    cardWidth,
+    cardHeight,
+    gridAreaWidth,
+    gridAreaHeight,
+    cellWidth,
+    cellHeight,
+    gridW,
+    gridH,
+    gridOriginX,
+    gridOriginY
+  };
+}
+
+/**
+ * 计算 layer 位置样式（单位：mm）
+ */
+export function getLayerStyle(
+  layer: { x1: number; y1: number; x2: number; y2: number },
+  dims: Dimensions
+): { left: string; top: string; width: string; height: string } {
+  const left = (layer.x1 - 1) * dims.cellWidth;
+  const top = (layer.y1 - 1) * dims.cellHeight;
+  const width = (layer.x2 - layer.x1 + 1) * dims.cellWidth;
+  const height = (layer.y2 - layer.y1 + 1) * dims.cellHeight;
+
+  return {
+    left: `${left}mm`,
+    top: `${top}mm`,
+    width: `${width}mm`,
+    height: `${height}mm`
+  };
+}