Satini_pvduc / ocrpdf

Go to a project
Toggle navigation
Toggle navigation pinning
tien_nemo
84e0ff97 1 parent becf80db

fix save and load data

Inline Side-by-side
Showing 2 changed files with 18 additions and 83 deletions
......@@ -59,7 +59,7 @@ class OcrController extends Controller
{
try {
// Lấy template name từ request hoặc mặc định
$templateName = $request->get('template_name', 'NEMO9');
$templateName = $request->get('template_name', '');
// Giả sử file OCR JSON & ảnh nằm trong storage/app/public/image/
$jsonPath = public_path("image/data_picking_detail_1754967679.json");
......@@ -74,15 +74,6 @@ class OcrController extends Controller
return response()->json(['error' => 'File OCR JSON không hợp lệ'], 400);
}
$formData = [
'export_date' => "",
'order_code' => "",
'customer' => "",
'address' => "",
'staff' => "",
'customer_name' => ""
];
$dataMapping = [];
$is_template = false;
......@@ -97,16 +88,15 @@ class OcrController extends Controller
$coords = array_map('intval', explode(',', $detail->field_xy));
// coords = [x1, y1, x2, y2]
// Tìm text OCR nằm trong bbox này (cải thiện để gộp text)
// $text = $this->findTextInBBox($ocrData, $coords);
// field_name => text
$dataMapping[$detail->field_name] = [
'text' => '',
'coords' => $coords
];
}
$dataMapping['template_name'] = [
'text' => $mst->tpl_name,
'coords' => ''
];
$is_template = true;
......@@ -117,7 +107,6 @@ class OcrController extends Controller
'success' => true,
'ocrData' => $ocrData,
'pdfImageUrl' => $imgPath,
'formData' => $formData,
'dataMapping' => $dataMapping,
'is_template' => $is_template,
'fieldOptions' => [
......@@ -139,47 +128,6 @@ class OcrController extends Controller
}
}
private function findTextInBBox($ocrData, $coords)
{
[$x1, $y1, $x2, $y2] = $coords;
$foundItems = [];
foreach ($ocrData as $item) {
[$ix1, $iy1, $ix2, $iy2] = $item['bbox'];
// Kiểm tra xem box OCR có nằm trong vùng bbox template không
if ($ix1 >= $x1 && $iy1 >= $y1 && $ix2 <= $x2 && $iy2 <= $y2) {
$foundItems[] = [
'text' => $item['text'],
'bbox' => $item['bbox'],
'x' => $ix1,
'y' => $iy1
];
}
}
if (empty($foundItems)) {
return '';
}
// Sắp xếp các item theo vị trí (từ trái sang phải, từ trên xuống dưới)
usort($foundItems, function($a, $b) {
// Ưu tiên theo Y trước (hàng), sau đó theo X (cột)
if (abs($a['y'] - $b['y']) < 20) { // Cùng hàng (toler$foundItems = {array[2]} ance 20px)
return $a['x'] - $b['x']; // Sắp xếp theo X
}
return $a['y'] - $b['y']; // Sắp xếp theo Y
});
// Gộp text theo thứ tự đã sắp xếp
$combinedText = [];
foreach ($foundItems as $item) {
$combinedText[] = trim($item['text']);
}
return implode(' ', $combinedText);
}
/**
* Lấy danh sách template
*/
......
......@@ -128,8 +128,9 @@
@focus="highlightField(field.value)"
@click="onInputClick(field.value)"
@blur="onInputBlur(field.value)"
:readonly="field.value === 'customer_name' && !hasCustomerNameXY"
>
{{-- :readonly="field.value === 'customer_name' && !hasCustomerNameXY"--}}
</div>
<button @click="saveTemplate">💾Save</button>
</div>
......@@ -161,7 +162,6 @@
created() {
// Chỉ tạo formData cho các field cần mapping
this.fieldOptions
.filter(f => f.value !== "template_name")
.forEach(f => {
this.$set(this.formData, f.value, "");
});
......@@ -415,16 +415,16 @@
this.ocrData = data.ocrData;
this.pdfImageUrl = data.pdfImageUrl;
this.fieldOptions = data.fieldOptions;
this.formData = data.formData;
// this.formData = data.formData;
this.dataMapping = data.dataMapping;
this.is_template = data.is_template;
// Đợi image load xong trước khi xử lý
if (this.$refs.pdfImage && this.$refs.pdfImage.complete) {
this.processLoadedData();
} else {
console.log('Image not loaded yet, waiting for onImageLoad');
// Image sẽ được xử lý trong onImageLoad
}
// if (this.$refs.pdfImage && this.$refs.pdfImage.complete) {
// // this.processLoadedData();
// } else {
// console.log('Image not loaded yet, waiting for onImageLoad');
// // Image sẽ được xử lý trong onImageLoad
// }
} catch (error) {
......@@ -451,10 +451,10 @@
this.formData = {};
}
const tolerance = 20; // ngưỡng cho cùng 1 hàng
const tolerance = 20; // ngưỡng chenh lech toa do y cho cùng 1 hàng
Object.keys(this.dataMapping).forEach(fieldName => {
let { coords } = this.dataMapping[fieldName];
let { coords, text } = this.dataMapping[fieldName];
let foundItems = this.ocrData
.filter(item => this.isBoxInside(item.bbox, coords) && item.text.trim())
.map(item => ({
......@@ -478,17 +478,15 @@
};
// Nếu là template thì gán vào formData
if (this.is_template) {
this.formData[fieldName] = finalText || '';
this.formData[fieldName] = finalText && finalText.trim() !== "" ? finalText : text;
}
this.manualBoxData[fieldName] = {
text: finalText,
coords: coords
};
});
// console.log('dataMapping:', this.dataMapping);
// console.log('formData:', this.formData);
},
onImageLoad() {
......@@ -545,9 +543,6 @@
} else {
// Kiểm tra xem ocrData đã có box nào với field này chưa
const existingBox = this.ocrData.find(b => b.field === field && !b.isDeleted);
// console.log(`Checking existing box for field "${field}":`, existingBox);
// console.log(`Checking existing manualBoxData for field "${field}":`, this.manualBoxData[field]);
if (this.manualBoxData[field]) {
// Nếu không có trong ocrData, dùng manualBoxData (tọa độ mới)
coords = this.manualBoxData[field].coords;
......@@ -601,7 +596,6 @@
// Tính vị trí hiển thị của box
const [x1, y1, x2, y2] = item.bbox;
//const [x1, y1, x2, y2] = item.field_xy.split(',').map(Number);
if (!this.imageWidth || !this.imageHeight || !this.$refs.pdfImage) return;
const displayedWidth = this.$refs.pdfImage.clientWidth;
......@@ -828,8 +822,6 @@
// Set active index
this.activeIndex = this.selectingIndex;
// console.log(`Updated field "${item.field}" for box OCR at index ${this.selectingIndex} with new coordinates`);
}
this.selectingIndex = null;
......@@ -878,10 +870,6 @@
});
const finalText = combinedText.join(" ");
// console.log('Combined text:', finalText);
// Gán field và text cho box manual
// console.log(`Assigning manual field "${this.manualField}" to box at index ${manualIndex} with text: "${finalText}"`);
// Gán field trực tiếp cho box manual
this.ocrData[manualIndex].field = this.manualField;
......@@ -1007,7 +995,6 @@
};
this.ocrData.push(manualBox);
// console.log('Manual box created successfully:', manualBox);
// Force re-render
this.$forceUpdate();
......