L ỜI MỞ ĐẦU 2
3.3.3. Thiết kế giao diện hệ thống 41
a) Giao diện chính của hệ thống
Hình 10. Giao diện chính của hệ thống
Giao diện chính của hệ thống gồm các thành phần sau:
• Phía bên tay trái giao diện chính là bản đồ của GoogleMaps. Người dùng có thể thực hiện các thao tác thông thường như thực hiện trên bản đồ của GoogleMaps. Trên bản đồ, các marker màu đỏđại diện cho các căn hộ cần bán, màu xanh đại diện cho các căn hộ cần cho thuê. Người
42
dùng có thể “click” trực tiếp vào các marker này để xem thông tin chi tiết về một căn hộ.
• Phía bên tay phải giao diện chính là một SidebarEntry lưu các kết quả trả về là địa chỉ căn hộ dưới dạng các liên kết cho phép người dùng “click” trực tiếp để xem thông tin về căn hộ mình muốn.
Hình 11. Thao tác với SidebarEntry
• Hai liên kết Nhà bán và Nhà cho thuê cho phép người dùng lọc kết quả theo loại giao dịch. Khi người dùng nhấn nút chọn loại giao dịch, các căn hộ tương ứng với loại giao dịch được chọn sẽ xuất hiện đồng thời trên bản đồ cũng như trên SidebarEntry. Kết quả trả về trên bản đồ sẽ là các căn hộ màu xanh hoặc màu đỏ tùy vào loại hình giao dịch mà người dùng chọn.
43
Hình 12. Lọc kết quả theo nhà để bán
• Chương trình có một ListBox cho tùy chọn vềGiá. Các mức giá đưa ra tương đối đa dạng, bao gồm các mức giá trong khoảng, mức nhỏ hơn và mức lớn hơn, cho phép người dùng dễ dàng lựa chọn. Khi người dùng chọn tùy chọn Giá, hệ thống sẽ nhận biết sự tác động, thực hiện việc tìm kiếm các căn hộ nằm trong miền giá trị người dùng đã chọn, hiển thị kết quả trên bản đồ và SidebarEntry. Nhu cầu tìm kiếm theo giá của người dùng thường gắn liền với một loại hình giao dịch nhất định (bán hoặc cho thuê). Hệ thống cung cấp thêm một tính năng tương đối thông mình, đó là khi người dùng đã chọn một loại hình giao dịch, chương trình sẽ ghi nhớ loại hình giao dịch đó. Sau đó, nếu người dùng chọn tùy chọn
44
về giá, chương trình sẽ kết hợp cả hai tùy chọn, cho phép người dùng tìm kiếm căn hộ bán hoặc cho thuê theo biên độ dao động giá nhất định.
Hình 13. Lọc kết quả theo mức giá
• Một TextBox để nhập thông tin tìm kiếm về Bán kính và một Button
Tìm kiếm để thực hiện chức năng tìm kiếm. Khi người dùng nhập bán kính, nhấn nút Tìm kiếm, thệ thống sẽ hực hiện tìm kiếm các căn hộ nằm trong phạm vi bán kính đã chọn so với trung tâm của bản đồ hiện thời, hiển thị kết quả trên bản đồ và SidebarEntry. Trên SidebarEntry, kết quả sẽ trả về sẽ bao gồm thêm bán kính tính được cho các căn hộ nằm trong phạm vi bán kính đã chọn.
45
Hình 14. Tìm kiếm các căn hộ trong phạm vi bán kính 2 km
• Một ListBox cho tùy chọn vềKiểu nhà. Hiện tại, chương trình cung cấp 4 loại kiểu nhà cho người dùng lựa chọn, bao gồm biệt thự, chung cư, nhà cao tầng và nhà cấp 4. Khi người dùng chọn tùy chọn kiểu nhà, hệ thống sẽ nhận biết sự tác động, thực hiện việc tìm kiếm các căn hộ thuộc kiểu nhà người dùng đã chọn, hiển thị kết quả trên bản đồ và
46
Hình 15. Lọc kết quả theo kiểu nhà
b) Giao diện thêm mới
Giao diện thêm mới xuất hiện khi người dùng “click” chuột vào bản đồ để xác định chính xác tọa độ căn hộ họ muốn đăng thông tin. Người dùng có thể di chuyển marker chính xác đến vị trí họ muốn bằng cách giữ chuột và kéo đến vị trí khác. Một Info Window xuất hiện với các Text Box và List Box cho người dùng nhập thông tin cần thiết về căn hộ. Người dùng thực hiện thêm mới bằng cách nhấn nút Ghi lại để gửi yêu cầu cho hệ thống xử lý.
47
Hình 15. Giao diện thêm mới
c) Giao diện cập nhật
Giao diện cập nhật xuất hiện khi người dùng chọn xem thông tin về căn hộ họ quan tâm. Khi đó phía trên của căn hộ được kích hoạt sẽ xuất hiện một Info Window cho phép người dùng xem thông tin và có thể sửa thông tin trên đó. Người dùng có thể thay đổi thông tin về vị trí căn hộ bằng cách di chuyển các
marker trên bản đồđến vị trí họ muốn. Người dùng cập nhật thông tin mới cho căn hộ bằng cách chọn Ghi lại để cập nhật thông tin về hệ thống. Việc cập nhật thực sự cần thiết nhất là với mục giá khi tỷ giá đồng USD, VNĐ hay một số đồng tiền khác biến động từng giờ, nếu không kịp thời cập nhật, thông tin sẽ trở nên cũ, không chính xác.
48
Hình 13. Giao diện cập nhật
Trong tương lai, khi xây dựng hệ thống, để thực hiện được trực tiếp các chức năng thêm mới và cập nhật, người sử dụng phải đăng nhập, khi đó là một người quản trị, hệ thống sẽ cho phép họ thực hiện hai chức năng này. Còn một người dùng muốn đăng một thông tin bất động sản, họ phải liên hệ trước với người quản trị để được cấp quyền, rồi sau đó mới được đăng tin và đảm bảo thông tin đăng phải chính xác.