danak/dpage-editor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix bug in book page

Browse Source
This commit is contained in:
hamid zarghami
2026-04-29 12:25:33 +03:30
parent c742ff3829
commit c5702ec6b3
1 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/viewer/components/BookPage.tsx
+13 -7
View File
@@ -55,9 +55,11 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
position: 'absolute', position: 'absolute',
left: `${(obj.x || 0) * scale}px`, left: `${(obj.x || 0) * scale}px`,
top: `${(obj.y || 0) * scale}px`, top: `${(obj.y || 0) * scale}px`,
opacity: obj.opacity ?? 1, // editor opacity is stored as 0-100, CSS expects 0-1
opacity: (obj.opacity ?? 100) / 100,
transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined, transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined,
transformOrigin: 'center center', // Konva default transform origin is top-left for Rect/Text/Image/etc.
transformOrigin: 'top left',
}; };
if (obj.visible === false) { if (obj.visible === false) {
@@ -77,6 +79,7 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
fontSize: `${(obj.fontSize || 16) * scale}px`, fontSize: `${(obj.fontSize || 16) * scale}px`,
fontFamily: obj.fontFamily || 'irancell, sans-serif', fontFamily: obj.fontFamily || 'irancell, sans-serif',
fontWeight: obj.fontWeight || 'normal', fontWeight: obj.fontWeight || 'normal',
lineHeight: 1,
color: getColorWithOpacity(obj.fill, obj.opacity), color: getColorWithOpacity(obj.fill, obj.opacity),
whiteSpace: 'pre-wrap', whiteSpace: 'pre-wrap',
letterSpacing: obj.letterSpacing ? `${obj.letterSpacing * scale}px` : undefined, letterSpacing: obj.letterSpacing ? `${obj.letterSpacing * scale}px` : undefined,
@@ -225,7 +228,8 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
border: hasStroke && obj.stroke border: hasStroke && obj.stroke
? `${actualStrokeWidth * scale}px solid ${obj.stroke}` ? `${actualStrokeWidth * scale}px solid ${obj.stroke}`
: 'none', : 'none',
opacity: obj.opacity ?? 1, boxSizing: 'border-box',
opacity: (obj.opacity ?? 100) / 100,
transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined, transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined,
transformOrigin: 'center center', transformOrigin: 'center center',
zIndex: index, // برای حفظ ترتیب رندر zIndex: index, // برای حفظ ترتیب رندر
@@ -276,7 +280,7 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
top: `${centerY - radius}px`, top: `${centerY - radius}px`,
width: `${size}px`, width: `${size}px`,
height: `${size}px`, height: `${size}px`,
opacity: obj.opacity ?? 1, opacity: (obj.opacity ?? 100) / 100,
transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined, transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined,
transformOrigin: 'center center', transformOrigin: 'center center',
zIndex: index, zIndex: index,
@@ -318,7 +322,8 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
border: obj.stroke border: obj.stroke
? `${(obj.strokeWidth || 1) * scale}px solid ${obj.stroke}` ? `${(obj.strokeWidth || 1) * scale}px solid ${obj.stroke}`
: 'none', : 'none',
opacity: obj.opacity ?? 1, boxSizing: 'border-box',
opacity: (obj.opacity ?? 100) / 100,
transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined, transform: obj.rotation ? `rotate(${obj.rotation}deg)` : undefined,
transformOrigin: 'center center', transformOrigin: 'center center',
}} }}
@@ -336,6 +341,7 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
border: hasStroke && obj.stroke border: hasStroke && obj.stroke
? `${actualStrokeWidth * scale}px solid ${obj.stroke}` ? `${actualStrokeWidth * scale}px solid ${obj.stroke}`
: 'none', : 'none',
boxSizing: 'border-box',
zIndex: index, // برای حفظ ترتیب رندر zIndex: index, // برای حفظ ترتیب رندر
}; };
@@ -365,7 +371,7 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
width: `${lineLength}px`, width: `${lineLength}px`,
height: `${(obj.strokeWidth || 2) * scale}px`, height: `${(obj.strokeWidth || 2) * scale}px`,
backgroundColor: obj.stroke || '#000000', backgroundColor: obj.stroke || '#000000',
opacity: obj.opacity ?? 1, opacity: (obj.opacity ?? 100) / 100,
transform: `rotate(${lineAngle}deg)`, transform: `rotate(${lineAngle}deg)`,
transformOrigin: 'left center', transformOrigin: 'left center',
}} }}
@@ -397,7 +403,7 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
width: `${arrowLength}px`, width: `${arrowLength}px`,
height: `${strokeWidth}px`, height: `${strokeWidth}px`,
backgroundColor: obj.stroke || '#000000', backgroundColor: obj.stroke || '#000000',
opacity: obj.opacity ?? 1, opacity: (obj.opacity ?? 100) / 100,
transform: `rotate(${arrowAngle}deg)`, transform: `rotate(${arrowAngle}deg)`,
transformOrigin: 'left center', transformOrigin: 'left center',
}} }}