LẬP TRÌNH GIAO DIỆN

Một phần của tài liệu Xậy dựng hệ thống đỗ xe ô tô thông minh với thiết bị cảm biến (Trang 49 - 52)

Trang chủ cung cấp một công cụ tìm kiếm các bãi xe theo khu vực. Khi người dùng nhập và kích tìm, danh sách các bãi xe liên kết sẽ được thể hiện.

Hình 4.1-1: Trang chủ web app.

Ở trang chi tiết, danh sách các bãi đỗ trên địa bàn tìm kiếm được liệt kê với nhiều thông tin được công bố như tên bãi, địa chỉ, trạng thái còn trống chỗ hay không.

Bên cạnh đó, vị trí bãi giữ xe được hiển thị trực quan trên bản đồ giúp khách hàng dễ dàng định vị hoặc sử dụng chức năng dẫn đường đã được tích hợp.

Kích vào biểu tượng trên cột MAP(Go) để hiển thị vị trí chính xác của từng bãi đỗ trực quan trên bản đồ.

Hình 4.1-2: Bảng kê các bãi đỗ xe tìm thấy trong khu vực

Để sử dụng chức năng dẫn đường, người dùng kích vào nút « Directions » để bật tool google map, đã liên kết sẵn điểm đến là địa chỉ bãi giữ xe. Người dùng chỉ cần chọn điểm xuất phát là « Your location » (vị trí hiện tại của bạn) để kích hoạt. Hoặc cũng có thể nhập 1 địa chỉ khác với mục đích tra cứu thông tin.

Khi kích hoạt chức năng dẫn đường.

Hình 4.1-4: Gợi ý đường đi từ google map

Khi đi vào chi tiết bên trong 1 bãi xe, khách hàng được liệt kê tất cả các tầng, phân khu và trạng thái của từng vị trí đỗ.

Nhìn vào bảng kê, người dùng hoàn toàn nắm được thông tin tầng nào (phân khu nào) còn vị trí đỗ, tầng nào không. Hoặc cũng có thể đặt chỗ trước thông qua nút « Book now ».

Nút « Back » để quay lại danh sách các bãi đỗ xe trước đó.

Hình 4.1-5: Trạng thái vị trí đỗ xếp theo tầng (phân khu)

Khi một vị trí có xe vào, nút “Book now” bị vô hiệu hóa trên web app, cho đến khi xe được đánh ra ngoài, vị trí trống được kích hoạt, đồng thời hiện nút “Book now” để người dùng có thể đặt chỗ trước.

Một phần của tài liệu Xậy dựng hệ thống đỗ xe ô tô thông minh với thiết bị cảm biến (Trang 49 - 52)