Chương V Cài đặt thử nghiệm một ứng dụng 5.1 Phân tích và thiết kế
5.1.3.Thiết kế ứng dụng DoanEcom
Với yêu cầu phân tích nh trên, ứng dụng DoanEcom của ta sẽ hoạt động theo lợc đồ tổng quát thể hiện nh hình dới, ứng dụng mà ta xây dựng có cấu trúc th mục chứa các trang asp và tài nguyên nh sau :
Th mục Mục đích
DoanEcom Th mục gốc chứa các trang chính của ứng dụng Images Th mục chứa ảnh các mục hàng và của ứng dụng Pagelets Th mục chứa các mẫu trang thờng xuyên sử dụng Admin Th mục chứa các trang phụ vụ cho đơn thể Admin
Trang chủ mà ngời dùng sẽ tiếp xúc lần đầu tiên khi ghé thăm Website của ta là default.asp. Ta hãy tạo th mục ảo mang tên DoanEcom trong IIS trỏ đến th mục vật lý bất kỳ trên đĩa với cấu trúc th mục nếu ở phần trên.
L
ợc đồ quan hệ của các đơn thể trong toàn bộ ứng dụng DoanEcom
• Phần Header: chứa tiêu đề nh biểu tợng hay Logo của công ty và các mục chọn chính phục vụ cho toàn ứng dụng.
• Phần trang Footer: chứa các thông tin quản cáo. quản cáo là một cách thức đem lại lợi nhuận cho các Website của ta. Ta dùng một phần diện tích cho nó.
• Phần danh mục mặt hàng (catalogue) đợc thể hiện dọc bên trái trang. Phần này luôn hiển thị để khách hàng lựa chọn.
• Phần nội dung trang (Body): trong phần này chúng ta thể hiện những tuỳ biến tuỳ theo tơng tác của ngời dùng. Ví dụ nếu khách hàng chọn một chủng loại hàng thì danh sách các mẫu hàng sẽ hiển thị. Nếu ngời dùng chọn đăng ký (register) thì biểu mẫu Form sẽ thế chỗ để khách hàng điền thông tin cần thiết…
5.2. Cài đặt
5.2.1. Cỏc trang cơ bản
Các phần tiêu đề trang (header) chân trang (footer) và danh mục hàng (catalogue) có thể xây dựng tách biệt thành những mẫu trang (pagelete) sau đó nhúng vào trang chính bằng chỉ thị <!--#include-->.
Trong trang chủ default.asp chúng ta xây dựng thêm mẫu trang special.asp cho phép hiển thị mặt hàng đang trong đợt khuyến mãi, giảm giá hoặc mặt hàng mới cần thu hút sự chú ý của khách hàng. Trang default.asp có nội dụng sau :
• Trang default.asp Product List Product Details Orders List AddToCart Orders Sign In/Register Category Shopping Cart Your Account
Admin Module DoanEcom
Header.asp Categories.asp Body.asp
Footer.asp
Trang chủ của ứng dụng DoanEcom
• Trang categories.asp liệt kê danh mục các mặt hàng
danh mục của các mặt hàng sẽ đợc đặt bên trái của trang để ngời dùng có thể chọn bất kỳ lúc nào, nội dụng file nh sau :
Trang categories.asp
• Trang header.asp
Phần tiêu đề mỗi trang thể hiện thông qua header.asp. Chúng ta bố trí tiêu đề trang gồm ba phần: Một ảnh logo lớn mang biểu tợng E_Shopping. Đối với biểu tợng của công
ty E_Shopping, chúng ta đặt Hyperlink trỏ về trang Default.asp. Điều này giúp ngời dùng có thể kích chuột vào biểu tợng để quay về trang chủ bất kỳ lúc nào. Mục Sign In/Register, chúng ta tuỳ biến theo trạng thái đặng nhập của ngời dùng thông qua biến Session(“login”). Nếu ngời dùng đã đăng nhập trớc đó, biến Session(“login”) mang giá trị true, nội dung chuỗi hiển thị sẽ là Sign Out(username) cho phép thoát khỏi user hiện hành. Nếu ngời dùng cha đăng nhập, chuỗi hiển thị sẽ là Sign In/Register chứa Hyperlink trỏ đến trang login.asp hiển thị Form đăng nhập. Nội dung trang Header.asp nh sau :
Trang header.asp
• Trang Footer.asp
Phần trang Footer chứa các thông tin quảng cáo. thờng quảng cáo đợc đặt là các hình ảnh thay đổi ngẫu nhiên (banner) mỗi khi ngời dùng xem nội dung trang. Đối tợng AdRotator sẽ giúp ta thay đỗi ngẫu nhiên các ảnh quảng cáo.
Ta quảng cáo cho ba công ty ta đặt các ảnh quảng cáo trong th mục /images của ứng dụng, tạo file văn bản ad.txt nh sau :
REDIRECT /adredir.asp WIDTH 440 HEIGHT 60 BORDER 1 * /DoanEcom/images/AD_1.GIF http://www.bytecomp.com/ (adsbygoogle = window.adsbygoogle || []).push({});
Check out the ByteComp Technology Center 20
/DoanEcom/images/AD_2.GIF http://www.bytecomp.com/
Check out the ByteComp Technology Center 20
/DoanEcom/images/AD_3.GIF http://www.bytecomp.com/
Check out the ByteComp Technology Center 20
Vậy nội dung trang Footer.asp đơn giản nh sau:
Phơng thức GetAdvertisement sẽ trả về nội dung ảnh cần hiển thị. Mỗi lần refresh lại trang ta sẽ thầy ảnh quảng cáo phía chân trang tự động thay đỗi hình-
Trang Footer.asp
• Trang Special.asp
Trang special hiển thị mặt hàng đặc biệt mà nhà cung cấp muốn khách hàng lu tâm đến
Special.asp
• Trang Register.asp
Trớc khi mua hàng khách hàng cần cung cấp thông tin để liên lạc. Thông tin này có thể đợc lu một lần duy nhất thông qua bớc đăng ký (register). ở đây ta chỉ cần lu lại địa chỉ khách hàng cùng với tên username và mật khẫu password để chứng thức và xác định định danh ngòi dùng trong các lần giao dịch sẽ diễn ra trong tơng lai.
Man hình đăng ký thông tin về khách hàng
• Trang login.asp
Trang login kiểm tra mật khẫu và lu lại trạng thái đăng nhập của ngời dùng (khách hàng) trong suốt phiên làm việc (session). Việc kiểm tra login nếu thành công (so khớp username và password) biến session(“login”) sẽ bật cờ true. Trang này cũng cung cấp thêm Hyperlink cho phép khách hàng đăng ký mới nếu họ cha có tài khoản đăng nhập. Lien kết Click here to register new account trỏ đến trang register.asp. Trang sẽ hiển thị nh sau :
Man hình đăng nhậo trớc khi gửi đơn đặt hàng
Để khách hàng duyệt xem danh mục hàng hoá chi tiết, chúng ta xây dựng trang catalogue.asp. Trang này đợc gọi tơng ứng với Hyperlink trong mục hàng bên trái hiển thị bởi catalogories.asp trứơc đó. Khi catalogue đợc gọi, tham số truyền trên URL cho trang là tên danh mục ProductType.
Liêt kê chủng loại mặt hàng
• Trang Details.asp
Trang Details.asp cung cấp tham số Productcode trên địa chỉ URL cho biết mã số sản phẩm cần xem chi tiết. ở đây ta chỉ hiển thị thêm thông tin về ngày xuất xởng của sản phẩm.
Details.asp
Khi ngời dùng chọn mua một mặt hàng nào đó, họ có thể thêm bớt số lợng cần mua, thực hiện tiếp việc chọn lựa các mặt hàng khác, xoá các mặt hàng đã chọn trớc đó. Tất cả những thao tác này có thể thực hiện thông qua khái niệm thẻ hàng Shopping cart. Thẻ hàng cho phép lu giữ những thông tin tạm về mục hàng cần mua trớc khi ngời dùng ra quyết định thanh toán. Ta cài đặt nh sau:
Chức năng của thẻ hàng tơng tự bảng dữ liệu tạm. thẻ hàng phải có khả năng thêm vào một hoặc nhiều mẫu tin liên quan đến mục hàng. Xoá những mẫu tin trớc đó. Mẫu tin mà ta chứa trong thẻ hàng cần lu trữ 2 thông tin chính đó là mã số mặt hàng đợc chọn và số lợng cần mua. Do tính chất tạm thời của thẻ hàng ta có thể dùng chính biến session để lu giữ thông tin. Thẻ hàng gồm các thủ tục nh sau:
AddItem Thêm một mặt hàng mới vào thẻ hàng
RemoveItem Xoá hoặc giảm số lợng của mặt hàng trong thẻ hàng ClearAllItem Xoá tất cả các mặt hàng hiện có trong thẻ hàng GetQuantity Trả về số lợng của một mặt hàng
GetItemCount Đếm số mặt hàng có trong thẻ hàng
• Xem nội dung thẻ hàng với trang ShoppingCart.asp
Trang Shoppingcart.asp là trang đợc kích hoạt mỗi khi ngời dùng chọn Hyperlink Add to cart để đặt mua sản phẩm. Sản phẩm đợc chọn sẽ đợc đa vào thẻ hàng, đồng thời ShoppingCart.asp cũng hiển thị danh sách các mặt hàng để ngời dùng biết đợc những mục mà mình đã chọn, khách hàng có thể thêm vào hoặc thay đổi số lợng của các mặt hàng hiện hành.
Nội dung Shopping Cart chứa các mặt hàng do ng ời dùng (adsbygoogle = window.adsbygoogle || []).push({});