fix focus use box ori

@@ -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', '');
+            $templateName = $request->get('template_name', 'NEMO9');
 
             // Giả sử file OCR JSON & ảnh nằm trong storage/app/public/image/
             $jsonPath = public_path("image/data_picking_detail_1754967679.json");
@@ -74,8 +74,17 @@ class OcrController extends Controller
                 return response()->json(['error' => 'File OCR JSON không hợp lệ'], 400);
             }
 
-            $formData = [];
+            $formData = [
+                'export_date'   => "",
+                'order_code'    => "",
+                'customer'      => "",
+                'address'       => "",
+                'staff'         => "",
+                'customer_name' => ""
+            ];
+
             $dataMapping = [];
+            $is_template = false;
 
             if ($templateName) {
                 $mst = MstTemplate::where('tpl_name', $templateName)->first();
@@ -89,28 +98,20 @@ class OcrController extends Controller
                         // 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);
+                        // $text = $this->findTextInBBox($ocrData, $coords);
 
                         // field_name => text
-                        $formData[$detail->field_name] = $text;
 
                         $dataMapping[$detail->field_name] = [
-                            'text' => $text,
+                            'text' => '',
                             'coords' => $coords
                         ];
                     }
-                } else {
-                    $formData = [
-                        'export_date'   => "",
-                        'order_code'    => "",
-                        'customer'      => "",
-                        'address'       => "",
-                        'staff'         => "",
-                        'customer_name' => ""
-                    ];
+
+                    $is_template = true;
+
                 }
             }
-//            dd($formData, $dataMapping);
 
             return response()->json([
                 'success' => true,
@@ -118,6 +119,7 @@ class OcrController extends Controller
                 'pdfImageUrl'  => $imgPath,
                 'formData'     => $formData,
                 'dataMapping'  => $dataMapping,
+                'is_template'  => $is_template,
                 'fieldOptions' => [
                     [ 'value' => 'template_name',  'label' => 'Tên Mẫu PDF' ],
                     [ 'value' => 'customer_name',  'label' => 'Tên khách hàng' ],

@@ -412,9 +412,10 @@
 
                     this.ocrData      = data.ocrData;
                     this.pdfImageUrl  = data.pdfImageUrl;
-                    this.formData     = data.formData;
                     this.fieldOptions = data.fieldOptions;
+                    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();
@@ -444,14 +445,33 @@
             // Tự động map field cho các box OCR dựa trên formData đã load từ DB
             autoMapFieldsFromFormData() {
                 this.manualBoxData = {}; // reset
+
+                if(this.is_template) {
+                    this.formData = {};
+                }
                 Object.keys(this.dataMapping).forEach(fieldName => {
-                    const { text, coords } = this.dataMapping[fieldName];
-                    // Ví dụ: tạo box từ dữ liệu
-                    //this.createManualBoxFromDB(fieldName, coords, text);
+                    let { text, coords } = this.dataMapping[fieldName];
+                    console.log(`Auto-mapping field "${fieldName}" with coords:`, coords, 'and text:', text);
+                    this.ocrData.forEach(item => {
+                        if (this.isBoxInside(item.bbox, coords) && item.text.trim()) {
+                            const partial = this.getPartialText(item.text, item.bbox, coords);
+                            text = partial; // cập nhật biến text để giá trị mới được truyền qua manualBoxData
+                            this.dataMapping[fieldName] = {
+                                text: partial,
+                                coords: coords
+                            };
+                        }
+                    });
 
+                    if (this.is_template) {
+                        this.formData[fieldName] = text || '';
+                    }
                     this.manualBoxData[fieldName] = { text, coords };
                 });
 
+                console.log('dataMapping:', this.dataMapping);
+                console.log('formData:', this.formData);
+
             },
 
             onImageLoad() {

@@ -511,15 +511,15 @@
                 } 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);
-                    if (existingBox) {
-                        coords = existingBox.bbox;
-                        text = existingBox.text;
-                        console.log(`Using existing box for field "${field}":`, coords, text);
-                    } else if (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;
                         text = this.manualBoxData[field].text;
                         console.log(`Using manualBoxData (new coordinates) for field "${field}":`, coords, text);
+                    } else if (existingBox) {
+                        coords = existingBox.bbox;
+                        text = existingBox.text;
+                        console.log(`Using existing box for field "${field}":`, coords, text);
                     }
                 }