Bài viết gần đây
| Chat trực tiếp khách hàng — chủ tiệm trên app Vietnam Nails (hướng dẫn chi tiết)
Được viết bởi thanhdt vào ngày 15/06/2026 lúc 07:59 | 47 lượt xem
Bài viết mô tả tính năng Chat trên hệ thống Vietnam Nails / HieuDao Beauty — minh họa bằng ảnh chụp màn hình thật từ app đang chạy production. Phù hợp chủ tiệm nail/spa muốn giảm nhắn Zalo/Messenger và tập trung hỗ trợ khách trong một app.
1. Vì sao tiệm nail cần chat trong app?
Khách ở Phần Lan (và châu Âu nói chung) quen đặt lịch online, nhưng vẫn có câu hỏi phút chót:
- «Còn slot gel manicure sáng mai không?»
- «Dịch vụ này bao lâu, giá cuối sau voucher?»
- «Em đổi giờ được không?»
Nếu mỗi câu hỏi qua Zalo riêng, lễ tân phải nhảy qua lại giữa app lịch và tin nhắn — dễ trễ, dễ sót. Chat tích hợp trong app giữ khách ở một nơi: vừa xem dịch vụ, vừa hỏi chủ tiệm, vừa đặt lịch.
Lợi ích thực tế:
- Giảm tải inbox Facebook/Zalo cá nhân của chủ tiệm
- Lịch sử hội thoại gắn với tài khoản khách (biết ai đang hỏi)
- Chủ tiệm trả lời tập trung tại
/admin/chat— badge tin chưa đọc - Tăng tỷ lệ chốt đặt lịch khi khách được trả lời nhanh
2. Phía khách hàng — trải nghiệm từng bước
2.1. Nút chat nổi trên mọi trang app
Sau khi đăng nhập, khách thấy nút tròn Chat với chủ tiệm ở góc phải (phía trên thanh điều hướng). Chưa đăng nhập thì app chuyển sang trang login — tránh spam ẩn danh.
2.2. Mở hộp thoại — gửi tin nhắn
Bấm nút chat → panel trượt lên với:
- Tiêu đề Chat với chủ tiệm
- Lịch sử tin nhắn (khách màu hồng bên phải, tiệm màu xám bên trái)
- Ô nhập + nút Gửi (Enter để gửi nhanh)
- Tự cập nhật ~5 giây khi hộp đang mở
2.3. Badge tin mới từ chủ tiệm
Khi chủ tiệm trả lời, khách thấy badge đỏ trên nút chat (số tin chưa đọc). Mở hộp thoại → tin được đánh dấu đã đọc.
3. Phía chủ tiệm — Admin Chat
Chủ tiệm đăng nhập admin → menu Chat khách (/admin/chat).
3.1. Danh sách hội thoại
Mỗi dòng hiển thị:
- Tên + số điện thoại khách
- Tin nhắn cuối (preview)
- Thời gian
- Badge đỏ nếu khách nhắn mà chưa đọc
3.2. Trả lời trực tiếp
Chọn hội thoại → xem full lịch sử → gõ trả lời → Gửi. Khách nhận tin ngay trên app (poll tự động).
4. Quy trình vận hành (SOP) gợi ý
- Lễ tân / chủ tiệm mở admin Chat ít nhất 2–3 lần/ngày (sáng, trưa, tối)
- Trả lời trong 15–30 phút giờ mở cửa — khách EU kỳ vọng phản hồi nhanh
- Câu hỏi đặt lịch → gửi link Đặt lịch hoặc book giúp trên admin
- Không xử lý thanh toán nhạy cảm qua chat — hướng khách dùng Ví hoặc tại quầy
5. Kỹ thuật phía sau (tóm tắt cho dev)
| Thành phần | Chi tiết |
|---|---|
| Database | Bảng chat_messages — sender: customer | owner |
| API khách | GET/POST /api/chat/messages |
| API admin | GET /api/admin/chat/threads · POST /api/admin/chat/messages |
| UI khách | CustomerChatWidget.tsx — floating + poll |
| UI admin | admin/Chat.tsx — 2 cột threads + hội thoại |
| Read receipt | read_at — đánh dấu đã đọc khi mở hộp thoại |
Muốn học build tính năng tương tự từ đầu? Xem khóa Lập trình NodeJS — Express API.
6. Kết hợp với tính năng khác
Chat không đứng một mình — nó bổ sung cho:
- Đặt lịch slot 5 phút — hỏi xong → chuyển sang Booking
- Ví & voucher — giải thích khuyến mãi trước khi khách book
- My Bookings — khách hỏi trạng thái lịch pending/confirmed
- Xuất Excel admin — báo cáo khách hàng tương tác nhiều
Đọc thêm loạt bài case study:
7. Muốn có chat cho tiệm của bạn?
- Thuê gia công / tư vấn: Zalo 0397 919 841
- Email: daotao@huongnghiepdulieu.com
- Học tự build: NodeJS · FastAPI
Ảnh minh họa chụp từ app Vietnam Nails · HieuDao Beauty · Helsinki · Hướng Nghiệp Dữ Liệu · 06/2026