diff --git a/client/public/locales/en/common.json b/client/public/locales/en/common.json index 7b1f608..13690e2 100644 --- a/client/public/locales/en/common.json +++ b/client/public/locales/en/common.json @@ -68,6 +68,8 @@ "skipItems": "Skip Items", "contentSettings": "Content Settings", "layoutSettings": "Layout Settings", + "horizontalSpacing": "Horizontal Spacing", + "verticalSpacing": "Vertical Spacing", "marginLeft": "Left Margin", "marginRight": "Right Margin", "marginTop": "Top Margin", diff --git a/client/public/locales/sv/common.json b/client/public/locales/sv/common.json index 777e3be..d709a79 100644 --- a/client/public/locales/sv/common.json +++ b/client/public/locales/sv/common.json @@ -68,6 +68,8 @@ "skipItems": "Hoppa över objekt", "contentSettings": "Innehållsinställningar", "layoutSettings": "Layoutinställningar", + "horizontalSpacing": "Horisontellt avstånd", + "verticalSpacing": "Vertikalt avstånd", "marginLeft": "Marginal - vänster", "marginRight": "Marginal - höger", "marginTop": "Marginal - topp", diff --git a/client/src/components/printing/printingDialog.tsx b/client/src/components/printing/printingDialog.tsx index 96dd08d..25c4d3e 100644 --- a/client/src/components/printing/printingDialog.tsx +++ b/client/src/components/printing/printingDialog.tsx @@ -66,6 +66,8 @@ const PrintingDialog: React.FC = ({ items, style, extraSett const [marginTop, setMarginTop] = useSavedState("print-marginTop", 10); const [marginRight, setMarginRight] = useSavedState("print-marginRight", 10); const [marginBottom, setMarginBottom] = useSavedState("print-marginBottom", 10); + const [horizontalSpacing, setHorizontalSpacing] = useSavedState("print-horizontalSpacing", 0); + const [verticalSpacing, setVerticalSpacing] = useSavedState("print-verticalSpacing", 0); const [printerMarginLeft, setPrinterMarginLeft] = useSavedState("print-printerMarginLeft", 5); const [printerMarginTop, setPrinterMarginTop] = useSavedState("print-printerMarginTop", 5); const [printerMarginRight, setPrinterMarginRight] = useSavedState("print-printerMarginRight", 5); @@ -82,7 +84,8 @@ const PrintingDialog: React.FC = ({ items, style, extraSett const printRef = useRef(null); - const calculatedRowHeight = (paperHeight - marginTop - marginBottom) / paperRows; + const itemWidth = (paperWidth - marginLeft - marginRight - horizontalSpacing) / paperColumns - horizontalSpacing; + const itemHeight = (paperHeight - marginTop - marginBottom - verticalSpacing) / paperRows - verticalSpacing; const itemsPerRow = paperColumns; const rowsPerPage = paperRows; @@ -109,8 +112,8 @@ const PrintingDialog: React.FC = ({ items, style, extraSett
= ({ items, style, extraSett } } + .print-page table { + border-spacing: ${horizontalSpacing}mm ${verticalSpacing}mm; + border-collapse: separate; + } + .print-page td { padding: 0; } @@ -599,6 +607,61 @@ const PrintingDialog: React.FC = ({ items, style, extraSett + + + + + `${value} mm` }} + value={horizontalSpacing} + onChange={(value) => { + setHorizontalSpacing(value); + }} + /> + + + { + setHorizontalSpacing(value ?? 0); + }} + /> + + + + + + + `${value} mm` }} + value={verticalSpacing} + onChange={(value) => { + setVerticalSpacing(value); + }} + /> + + + { + setVerticalSpacing(value ?? 0); + }} + /> + + +