MOT Hoàn thành/Sửa lại — lỗi "nuốt click" + sửa căn cơ (vòng 14)

Date: 2026-06-20 | Status: FIXED + verified. Additive (mot-enhance.js), KHÔNG sửa core.

Huyên báo

Vẫn không bấm được Hoàn thành và Sửa lại → lo lớn cho sản xuất (đấu PG còn phức tạp hơn). Yêu cầu làm căn cơ, không thiếu chi tiết, thêm không được hỏng.

Chẩn đoán (verified browser, không đoán)

1. Không có gì đè nút — elementFromPoint tại tâm nút Hoàn thành = chính nút đó. Click không bị overlay chặn.
2. Logic đúng — điền đủ 7/7 ô bắt buộc → nút sáng → bấm → state=done; Sửa lại bật khi done.
3. LỖI THẬT (gốc MOT, nguy hiểm sản xuất): field commit khi rời ô (onchange), và mỗi commit gọi renderMain() vẽ lại TOÀN BỘ thẻ. → Gõ xong ô cuối rồi bấm Hoàn thành: cú bấm làm ô blur → onchange → vẽ lại → nút bị thay phần tử mới giữa mousedown/mouseup → click bị "nuốt" → phải bấm lần 2. Cảm giác "không bấm được". (Sửa lại không vào được vì không complete được trước.)

Sửa căn cơ (mot-enhance.js — additive, không đụng core)

• (B) Commit LIVE khi gõ: delegated input listener cập nhật M.vals[key] ngay + đồng bộ trạng thái nút (syncDone) không vẽ lại → nút sáng ngay khi gõ đủ, không cần rời ô.
• (C) Chống nuốt click: override M.setVal — nếu giá trị không đổi (đã commit live) thì bỏ qua re-render → khi blur ô cuối, nút KHÔNG bị thay → cú bấm Hoàn thành ăn ngay lần đầu.
• (A) Tab kho hiện rõ: "Công việc / Hoàn thành" luôn hiện trên danh sách (vốn giấu sau kính lúp).
• Trước đó: eco-nav pointer-events:none + spacer (#main-inner) để thanh không che/chặn nút.

Verified

confirm toggle ✓ · Hoàn thành 1 cú bấm ✓ (doneStillSameElement=true, stateAfterOneClick=done) · live-type bật nút không cần blur ✓ · Sửa lại (done→open) ✓ · tab kho ✓ · không phần tử nào đè nút ✓.

NGUYÊN TẮC cho sản xuất (mang sang khi đấu PG)

1. Tách "commit giá trị" khỏi "vẽ lại UI". Gõ → cập nhật model live; chỉ vẽ lại phần cần (nút/nhãn), KHÔNG đập innerHTML cả thẻ. Tránh cả mất-focus lẫn nuốt-click.
2. Nút hành động (Hoàn thành/Submit) phải ổn định danh tính phần tử quanh thời điểm bấm (đừng thay DOM giữa mousedown/mouseup).
3. Validation/required tính live từ model, không phụ thuộc blur.
4. Khi đấu PG: submit đọc model (đã commit live) → DOT ghi; không lệ thuộc thứ tự blur.

Edge còn lại (minor)

• Ô ngày: live commit lưu thô, onchange lưu ISO (parse) → khác giá trị → vẫn re-render. Nếu ngày là ô cuối cùng gõ rồi bấm done ngay có thể vẫn cần 2 chạm. Hiếm (date có nút lịch). Sẽ chuẩn hoá khi viết core production: date commit parsed ngay ở input.

core MOT (mot-app/render/data/theme) giữ nguyên; mọi sửa nằm ở mot-enhance.js.