CropStep bileşeninden gereksiz offset alanlarını ve önizleme ölçeğini kaldırarak kodu sadeleştirildi; OcrStep bileşenine geliştirme modunu kontrol eden bir değişken eklendi ve loglama işlemleri güncellendi; tema renkleri güncellendi.

This commit is contained in:
2025-11-11 00:04:43 +03:00
parent 3934202e23
commit 3a82bf9ea6
3 changed files with 14 additions and 64 deletions

View File

@@ -4,16 +4,13 @@ import {
Box,
Button,
Grid,
Slider,
Stack,
TextField,
Typography,
} from '@mui/material';
import CheckCircleIcon from '@mui/icons-material/CheckCircle';
import { useNavigate } from 'react-router-dom';
import { useAppStore } from '../store/useAppStore';
const offsetFields = ['top', 'bottom', 'left', 'right'];
const MIN_SELECTION = 5;
const DEFAULT_SELECTION = { top: 10, left: 10, width: 80, height: 80 };
@@ -44,12 +41,6 @@ const CropStep = () => {
const [selectedImageId, setSelectedImageId] = useState(
cropConfig?.referenceImageId || uploadedImages[0]?.id || null,
);
const [offsetValues, setOffsetValues] = useState({
top: cropConfig?.top || 0,
bottom: cropConfig?.bottom || 0,
left: cropConfig?.left || 0,
right: cropConfig?.right || 0,
});
const [imageSize, setImageSize] = useState({
width: cropConfig?.imageWidth || 0,
height: cropConfig?.imageHeight || 0,
@@ -57,7 +48,6 @@ const CropStep = () => {
const [selection, setSelection] = useState(
cropConfig?.selection ? cropConfig.selection : DEFAULT_SELECTION,
);
const [previewScale, setPreviewScale] = useState(1);
const [saved, setSaved] = useState(false);
const containerRef = useRef(null);
const dragInfoRef = useRef(null);
@@ -92,12 +82,6 @@ const CropStep = () => {
cropConfig?.imageWidth
) {
setSelection(selectionFromConfig(cropConfig));
setOffsetValues({
top: cropConfig.top || 0,
bottom: cropConfig.bottom || 0,
left: cropConfig.left || 0,
right: cropConfig.right || 0,
});
setSaved(true);
} else {
setSelection(DEFAULT_SELECTION);
@@ -215,13 +199,6 @@ const CropStep = () => {
[stopDragging],
);
const handleOffsetChange = (field) => (event) => {
const value = Number(event.target.value) || 0;
setOffsetValues((prev) => ({ ...prev, [field]: value }));
setSaved(false);
resetFromStep('crop');
};
const currentCropArea = useMemo(() => {
if (!imageSize.width || !imageSize.height) return null;
return {
@@ -237,13 +214,13 @@ const CropStep = () => {
const config = {
x: 0,
y: 0,
zoom: previewScale,
zoom: 1,
width: currentCropArea.width,
height: currentCropArea.height,
top: offsetValues.top,
bottom: offsetValues.bottom,
left: offsetValues.left,
right: offsetValues.right,
top: 0,
bottom: 0,
left: 0,
right: 0,
cropAreaX: currentCropArea.x,
cropAreaY: currentCropArea.y,
imageWidth: imageSize.width,
@@ -319,8 +296,6 @@ const CropStep = () => {
width: '100%',
maxWidth: 410,
mx: 'auto',
transform: `scale(${previewScale})`,
transformOrigin: 'center top',
}}
>
<img
@@ -373,34 +348,6 @@ const CropStep = () => {
</Box>
)}
<Box>
<Typography gutterBottom>Önizleme yakınlaştırması</Typography>
<Slider
min={1}
max={2}
step={0.05}
value={previewScale}
onChange={(_, value) => {
const newValue = Array.isArray(value) ? value[0] : value;
setPreviewScale(newValue);
}}
/>
</Box>
<Grid container spacing={2}>
{offsetFields.map((field) => (
<Grid key={field} item xs={6} md={3}>
<TextField
label={field.toUpperCase()}
type="number"
fullWidth
value={offsetValues[field]}
onChange={handleOffsetChange(field)}
/>
</Grid>
))}
</Grid>
{saved && (
<Stack direction="row" spacing={1} alignItems="center" color="success.main">
<CheckCircleIcon color="success" />

View File

@@ -14,6 +14,7 @@ import { correctTurkishCharacters } from '../utils/ocrUtils';
const OcrStep = () => {
const navigate = useNavigate();
const isDev = import.meta.env.DEV;
const croppedImages = useAppStore((state) => state.croppedImages);
const ocrText = useAppStore((state) => state.ocrText);
const setOcrText = useAppStore((state) => state.setOcrText);
@@ -60,7 +61,7 @@ const OcrStep = () => {
workerPath: paths.workerPath,
corePath: paths.corePath,
langPath: paths.langPath,
logger: m => console.log('Tesseract:', m), // Debug için log
logger: isDev ? (m) => console.log('Tesseract:', m) : undefined,
},
);
@@ -75,7 +76,9 @@ const OcrStep = () => {
return;
}
// Dil ve worker zaten createWorker sırasında yüklendi
if (isDev) {
console.log('Tesseract worker başarıyla oluşturuldu');
}
workerRef.current = worker;
setWorkerReady(true);
} catch (error) {
@@ -104,7 +107,7 @@ const OcrStep = () => {
setWorkerReady(false);
}
};
}, [assetBase, orderedImages.length, setError]);
}, [assetBase, isDev, orderedImages.length, setError]);
useEffect(() => {
setStatus('idle');

View File

@@ -29,7 +29,7 @@ const theme = createTheme({
secondary: '#666057',
},
success: {
main: '#80A19F',
main: '#88aaa8ff',
contrastText: '#30281B',
},
},
@@ -40,7 +40,7 @@ const theme = createTheme({
MuiBox: {
styleOverrides: {
root: {
color: '#80A19F',
color: '#EDEFF2',
},
},
},
@@ -69,7 +69,7 @@ const theme = createTheme({
MuiAlert: {
styleOverrides: {
root: {
backgroundColor: '#80A19F',
backgroundColor: '#EDEFF2',
color: '#30281B',
borderRadius: 16,
},