74 lines
2.0 KiB
TypeScript
74 lines
2.0 KiB
TypeScript
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`
|
||
};
|
||
}
|