化妝品大世界網(wǎng)站設(shè)計與實現(xiàn).doc

I 濟源職業(yè)技術(shù)學院濟源職業(yè)技術(shù)學院 畢畢 業(yè)業(yè) 設(shè)設(shè) 計 論計 論 文 文 題目化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 系別信息工程系 專業(yè)計算機網(wǎng)絡(luò)技術(shù)專業(yè) 班級計網(wǎng) 0804 姓名韓菲 學號 08110421 指導教師蘇文芝 日期2010 年 11 月 18 日 I 目 錄 摘 要 II ABSTRACT III 第 1 章 引言 1 1 1 任務(wù)概述 1 1 2 需求概述 1 1 3 設(shè)計目標 2 1 4 運行環(huán)境 2 第 2 章 總體設(shè)計 3 2 1 網(wǎng)站總體模塊概述 3 2 2 網(wǎng)站總體功能介紹 3 2 3 功能分配和模塊設(shè)計 4 2 4 數(shù)據(jù)庫設(shè)計 5 第 3 章 模塊詳細設(shè)計與實現(xiàn) 8 3 1 模塊功能詳細描述 8 3 1 1 網(wǎng)站的流程圖 8 3 1 2 前臺的管理 8 3 2 模塊關(guān)鍵技術(shù) 14 3 3 模塊功能實現(xiàn) 18 致謝 19 參考文獻 20 II 摘摘 要要 隨著生活水平的提高 護膚品逐漸地成為了人們生活的必需品 而化妝品 更是愛美女性們的寵兒 點綴著豐富多彩的生活 這股風潮也慢慢地吹入了大 學校園 許多大學生也開始擁有化妝品 為自己成為時尚的職業(yè)女性作準備 大學生作為一個龐大的潛在消費群體 他們的消費行為和特點是值得關(guān)注的 而且學生群體不僅在現(xiàn)時有著巨大的消費潛力 以后也將成為社會的消費主流 因此 商家根據(jù)這個特點 開發(fā)化妝品大世界網(wǎng)站以對商家店面化妝品進行宣 傳就必不可少了 隨著化妝品市場競爭的激烈化 現(xiàn)代化和國際化 隨著計算機技術(shù)的飛速 發(fā)展 計算機在服務(wù)行業(yè)中的地位明顯提高 利用計算機實現(xiàn)各種功能的運作 也日趨普遍 進而利用計算機來實現(xiàn)網(wǎng)站設(shè)計和網(wǎng)站管理更是勢在必行 化妝品大世界網(wǎng)站設(shè)計是典型的 ASP 網(wǎng)站設(shè)計 其設(shè)計主要包括后臺數(shù)據(jù) 庫的建立和維護以及前臺美觀的頁面的設(shè)計兩個方面 對于前者要求建立起數(shù) 據(jù)一致性和完整性強 數(shù)據(jù)安全性好的庫 網(wǎng)站設(shè)計結(jié)果證明 本人所設(shè)計的 化妝品大世界網(wǎng)站設(shè)計可滿足愛美女性們網(wǎng)上查看化妝品 電話訂購 網(wǎng)上學 習美容彩妝知識和網(wǎng)上留言交流三個方面的要求 會員可以通過登錄卡號增加 積分 瀏覽者可以任意瀏覽任一品牌的化妝品和美容彩妝知識 并且可以網(wǎng)上 留言 管理員可以進入后臺 對網(wǎng)站內(nèi)化妝品 美容彩妝文章進行添加 管理 和刪除 關(guān)鍵字 關(guān)鍵字 化妝品大世界網(wǎng)站設(shè)計 愛美女性 美容彩妝 III AbstractAbstract With the improvement of living standards skin care products gradually become a necessity of lift cosmetics and beauty is the darling of women who embellished by a colorful life This trend has slowly carried into to university campus many students are beginning to have cosmetics to become a fashionable career woman to make preparations Students as a huge potential consumer groups and their consumption behavior and characteristics are a cause for concern and students who are not only present in the consumer has tremendous potential the future will become the mainstream consumer So according to the characteristics the cosmetics site to the merchant locations cosmetics publicity is essential With the cosmetics of fierce market competition modernization and internationalization with the rapid development of computer technology the computer s position in the service industry markedly improved using a computer to achieve the operation of the various functions are becoming increasingly common and then use computers to design a web site and site management is even more imperative Cosmetics big world website design is typical of ASP web site design the database design includes the establishment and maintenance and the front page of a beautiful design two ways For the former require create the data uniformity and integrities are strong and data security a good library The website design as a result the design of cosmetics big world web site design can be satisfies if the internet to see women make up the telephone book online learning beauty make up knowledge and internet message exchanges three of parties Member may by access card number to increase the number of visitors can be browed any brand of cosmetics and beauty make up knowledge and internet message Administrators can get into the background to the web site the cosmetics and facial makeup article be added and deleted IV Keywords cosmetics big world website design devotion woman facial makeup 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 1 第第 1 1 章章 引言引言 1 1 任務(wù)概述任務(wù)概述 化妝品市場生機勃勃 外資品牌優(yōu)勢不減 經(jīng)過十幾年的培育和發(fā)展 我國已成為 亞洲重要的化妝品市場 行業(yè)內(nèi)品牌化競爭格局已經(jīng)形成 日益成為集產(chǎn)業(yè)化 市場化 國際化為一體的綜合性產(chǎn)業(yè) 隨著計算機技術(shù)的飛速發(fā)展 計算機在服務(wù)行業(yè)中的地位 明顯提高 利用計算機實現(xiàn)各種功能的運作也日趨普遍 進而利用計算機來實現(xiàn)網(wǎng)站設(shè) 計和網(wǎng)站管理更是勢在必行 瀏覽者可以通過網(wǎng)站了解一些關(guān)于化妝品產(chǎn)品等方面的信息 可以對化妝品的各種 品牌的圖片 價格 會員價 及品牌介紹一目了然 并且可以學習美容和彩妝方面的知 識 會員可以通過輸入自己卡號和密碼進行登錄 登錄后可以增加自己的會員積分 瀏 覽者還可以通過留言方式留下您寶貴的建議 如果有喜歡的護膚品 可以電話訂購 后 臺管理員憑管理員賬號 密碼可登錄后臺對化妝品進行修改 添加 刪除 對護膚和彩 妝方面的文章進行修改 添加 刪除 對留言內(nèi)容可以進行添加 修改 刪除 同時也 可以增加 刪除 修改后臺管理員和會員的卡號和密碼等 1 2 需求概述需求概述 需求概述的任務(wù)是通過詳細調(diào)查商家店面內(nèi)正在賣的化妝品品牌 明確商家的各種 需求 然后才能確定設(shè)計的網(wǎng)站該朝哪個方向上設(shè)計 化妝品網(wǎng)站必須充分考慮今后要 添加的新品牌 新護膚文章 新彩妝文章以及新的會員 不能僅僅只顯示當前的化妝品 品牌來設(shè)計數(shù)據(jù)庫 這設(shè)計所需軟件是 Dreamweaver Access 會員用戶憑個人賬號 密鑰可登錄會員界 面進行會員積分 商家的會員卡是需要一次性購買 500 元的東西以后或者購買會員卡兩 種途徑而得到的 所以網(wǎng)站設(shè)計不用考慮會員卡號的注冊這一功能 后臺管理員憑管理 員賬號 密鑰可登錄后臺進行化妝品品牌整理 添加 刪除等工作 管理員進入后臺能 夠添加新的管理員用戶 新的會員用戶 并且管理員能根據(jù)季節(jié)的變換 化妝品產(chǎn)品的 變化來添加新的護膚文章 彩妝文章和化妝品產(chǎn)品的詳細信息 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 2 1 3 設(shè)計目標設(shè)計目標 我們通過本網(wǎng)站設(shè)計 按照商家和用戶的需求 結(jié)合商家店內(nèi)化妝品品牌 利用先 進的計算機數(shù)據(jù)庫技術(shù)實現(xiàn)以下功能 1 會員用戶可以通過會員卡號 密碼登錄本網(wǎng)站增加會員積分 2 管理員可以方便 快捷地對化妝品品牌進行刪除 修改 添加等管理 3 能夠顯示護膚 彩妝方面的美文 4 可以快捷 準確的顯示每一個化妝品品牌的圖片 價格 會員價格及詳細介紹等 信息 5 管理員可以方便 快捷地對護膚 彩妝美文進行刪除 修改 添加等管理 1 4 運行環(huán)境運行環(huán)境 硬件環(huán)境 1 處理器 AMD1700 或更高級處理器系統(tǒng) 2 主板 華碩 4Core1600 GLAN 英特爾 P35 G33 G31 P31 Express 3 內(nèi)存 128MB 以上內(nèi)存 4 主硬盤 20GB 以上硬盤空間 5 顯卡 NVIDIA GeForce 9600 GT 128 MB 6 顯示器 1024 768 效果最佳 軟件環(huán)境 1 數(shù)據(jù)庫 Microsoft Access 2 網(wǎng)頁腳本 VBScript 3 網(wǎng)頁編輯工具 Micromedia Dreamweaver 8 4 操作系統(tǒng) Microsoft Windows XP Professional 5 其他支撐組件 ODBC 數(shù)據(jù)源 Internet 信息服務(wù) IIS 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 3 第第 2 2 章章 總體設(shè)計總體設(shè)計 2 1 網(wǎng)站總體模塊概述網(wǎng)站總體模塊概述 作為一般用戶 需要從事的活動 可以對每一種化妝品的圖片 價格 會 員價格 化妝品成分 功效進行查看 可以詳細閱讀護膚 彩妝方面的美文 可以判斷自己的膚質(zhì) 并且還可以進行留言 作為會員用戶 可以通過自己的 會員卡號和密碼登錄 增加會員積分 針對以上需求 本網(wǎng)站設(shè)計了會員登錄 化妝品顯示 護膚美文 彩妝美 文 膚質(zhì)測試和后臺管理 會員用戶通過自己在商家那里獲得的會員卡號和密 碼進行登錄會員頁面 然后登錄可以增加會員的積分 后臺管理人員能夠?qū)?妝品的各個信息 最新的護膚 彩妝文章和公告公示 進行添加 修改和刪除 網(wǎng)站信息實時更新等模塊 這完全能夠滿足用戶對網(wǎng)站頁面的需求 并且對商 家的店面進行有效地宣傳 網(wǎng)站設(shè)計整體美觀 操作方便 為一般用戶 會員用戶和商家的交流打了 很好的基礎(chǔ) 從而很有效地宣傳了商家的店里的品牌 實現(xiàn)了信息化宣傳的目 的 2 2 網(wǎng)站總體功能介紹網(wǎng)站總體功能介紹 前臺總體功能介紹 1 查看化妝品的各個品牌的圖片 名稱 價格 會員價格 化妝品成分 以及使用成效 2 網(wǎng)站的公告 3 查看每一個護膚美文 4 查看每一個明媚彩妝美文 5 會員登錄 6 膚質(zhì)測試 7 聯(lián)系我們 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 4 8 后臺管理 網(wǎng)站整體頁面的首頁如圖 2 1 所示 圖 2 1 網(wǎng)站頁面的首頁 2 3 功能分配和模塊設(shè)計功能分配和模塊設(shè)計 前臺各模版設(shè)計及功能 1 會員用戶登錄 會員用戶憑會員卡號和密碼即可登錄本網(wǎng)站 登錄以后可以獲得 0 5 分的 積分 2 后臺登錄 管理員用戶憑管理員賬號和密碼即可進入后臺 進行化妝品 文章 會員 用戶增加 管理員用戶增加和管理員密碼修改等的相關(guān)管理 3 品牌大全 用于用戶查看各個化妝品品牌的圖片 名稱 價格 會員價格 產(chǎn)品成分 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 5 使用效果等信息 4 完美護膚 點擊可以看到各種各樣的護膚美文 5 明媚彩妝 點擊可以看到各種各樣的彩妝美文 6 膚質(zhì)測試 可以根據(jù)提供的膚質(zhì)類型來判斷自己是什么樣的膚質(zhì) 7 公告 用戶能夠通過公告看到商家店面最新的消息 8 留言板 用戶有什么寶貴的建議可以通過留言的方式進行留言 9 聯(lián)系我們 用戶有什么問題或者喜歡什么樣的化妝品可以通過電話聯(lián)系我們 2 4 數(shù)據(jù)庫設(shè)計數(shù)據(jù)庫設(shè)計 數(shù)據(jù)庫是通用化的相關(guān)數(shù)據(jù)的集合 它不僅包括數(shù)據(jù)本身 而且包括數(shù)據(jù) 之間的聯(lián)系 為了讓多種應(yīng)用程序并發(fā)的使用數(shù)據(jù)庫中具有最小冗余的共享數(shù) 據(jù) 必須使數(shù)據(jù)與程序具有較高的獨立性 則需要一個軟件系統(tǒng)對數(shù)據(jù)進行專 門的管理 提供安全性和完整性等統(tǒng)一控制 方便用戶以交互命令或程序方式 對數(shù)據(jù)庫進行操作 本設(shè)計中是在一個名為 aspdb mdb 數(shù)據(jù)庫中建立了 admin 表 member 表 huazhuangpin 表 wenzhang 表 liuyanban 表等 1 admin 管理員管理信息 根據(jù)表 表 2 1 admin 數(shù)據(jù)表 字段名說明數(shù)據(jù)類型字段長度允許空 uname 管理員賬號文本型 50 否 password 管理員密碼文本型 50 否 time 時間日期 時間否 此表保存網(wǎng)站后臺管理員的賬號 密碼和管理員添加新的用戶或者修改密 碼時的時間 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 6 2 member 會員用戶信息 信息數(shù)據(jù)表 表 2 2 member 信息數(shù)據(jù)表 字段名說明數(shù)據(jù)類型字段長度允許空 kahao 會員卡號文本型 50 否 password 會員密碼文本型 50 否 jifen 會員積分數(shù)字型長整型否 此表顯示會員用戶的信息 3 huazhuangpin 信息數(shù)據(jù)表 表 2 3 huazhuangpin 信息數(shù)據(jù)表 字段名說明數(shù)據(jù)類型字段長度允許空 id 編號文本型 50 否 name 化妝品名字文本型 50 否 BigClassName 品牌文本型 50 否 BigClassNameID 品牌編號文本型 50 否 SmallClassName 小分類文本型 50 否 SmaNameID 小分類編號文本型 50 否 FirstImageName 小圖標文本型 50 否 price 價格文本型 50 否 Hyprice 會員價格文本型 50 否 jieshao 產(chǎn)品介紹文本型 50 否 picture 圖片文本型 50 否 hits 點擊數(shù)文本型 50 否 AddDate 上傳時間日期 時間 50 否 User 上傳者文本型 50 否 zongjie 品牌總結(jié)備注否 此表用來對化妝品的編號 名字 品牌 品牌編號 小圖標 價格 會員 價格 圖片 點擊數(shù) 上傳時間 上傳者和化妝品詳細介紹等的添加 修改及 刪除等管理 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 7 4 wenzhang 護膚 彩妝文章 信息數(shù)據(jù)表 表 2 4 wenzhang 信息數(shù)據(jù)表 字段名說明數(shù)據(jù)類型字段長度允許空 id 編號文本型 50 否 name 文章名字文本型 50 否 BigClassName 文章分類文本型 50 否 BigClassNameID 分類編號文本型 50 否 SmallClassName 小分類文本型 50 否 SmaNameID 小分類編號文本型 50 否 FirstImageName 小圖標文本型 50 否 hits 點擊數(shù)文本型 50 否 AddDate 上傳時間日期 時間 50 否 User 上傳者文本型 50 否 neirong 文章內(nèi)容備注否 此表用來對護膚彩妝文章的編號 文章名字 文章分類 分類編號 點擊 數(shù) 文章內(nèi)容等的添加 刪除 修改等管理 5 liuyanban 留言板 信息數(shù)據(jù)表 表 2 5 liuyanban 息數(shù)據(jù)表 字段名說明數(shù)據(jù)類型字段長度允許空 id 編號文本型 50 否 user 留言者文本型 50 否 Title 留言專題文本型 50 否 Neirong 留言內(nèi)容文本型 100 否 time 留言時間日期 時間 50 否 此表用來管理留言的添加 刪除和修改 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 8 第第 3 3 章章 模塊詳細設(shè)計與實現(xiàn)模塊詳細設(shè)計與實現(xiàn) 3 1 模塊功能詳細描述模塊功能詳細描述 3 1 1 網(wǎng)站的流程圖網(wǎng)站的流程圖 流程圖如圖 3 1 所示 品 牌 大 全 完 美 護 膚 明 媚 彩 妝 后 臺 管 理 膚 質(zhì) 測 試 聯(lián) 系 我 們 留 言 板 會 員 登 錄 化妝品大世界 圖 3 1 網(wǎng)站流程圖 3 1 2 前臺的管理前臺的管理 前臺的具體模塊設(shè)計 網(wǎng)站首頁 點擊首頁即可進入頁面 此頁面介紹該網(wǎng)站實現(xiàn)的所有功能 會員登 錄界面 化妝品品牌大全 完美護膚的文章 明媚彩妝的文章 后臺管理 膚質(zhì)測試 聯(lián)系我們以及留言板等功能 如圖 3 2 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 9 圖 3 2 網(wǎng)站首頁頁面 2 會員用戶登錄 輸入會員卡號和密碼即可登錄 如圖 3 3所示 圖 3 3 會員登錄頁面 登錄可增加積分 如圖 3 4所示 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 10 圖 3 4 注冊成功頁面 會員登錄成功后 主頁面如圖 3 5所示 圖 3 5 登錄成功后登錄頁面 3 后臺管理 在此輸入管理員名稱 密碼即可進入后臺進行后臺管理 如圖 3 6 的頁面 所示 圖 3 6 后臺登錄頁面 4 品牌大全 用戶在點擊品牌大全可進入圖 3 7 所示的頁面查看化妝品品牌 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 11 圖 3 7 化妝品品牌顯示 圖 3 8 化妝品詳細介紹 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 12 5 聯(lián)系我們 通過如圖 3 9 所示頁面的聯(lián)系我們進行相關(guān)問題的咨詢 圖 3 9 聯(lián)系我們 6 完美護膚 點擊完美護膚 可查看完美護膚方面的文章 如圖 3 10所示 圖 3 10 完美護膚的文章 7 明媚彩妝 點擊明媚彩妝 可查看明媚彩妝方面的文章 如圖 3 11所示 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 13 圖 3 11 明媚彩妝的文章 8 膚質(zhì)測試 點擊膚質(zhì)測試 可判斷自己的膚質(zhì) 如圖 3 12所示 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 14 圖 3 12 可判斷自己的皮膚 9 用戶能夠通過公告看到最新的商家店面消息 如圖 3 13所示 圖 3 13 公告 3 2 模塊關(guān)鍵技術(shù)模塊關(guān)鍵技術(shù) 用 編寫網(wǎng)站應(yīng)用程序時間長了 難免會遇到各式各樣的問題 在編 寫本網(wǎng)站的過程如化妝品信息的上傳則是我們很棘手的問題 經(jīng)過一段時間搜 集資料 終于使我克服了這個困難 使用純 代碼來實現(xiàn)化妝品信息的顯 示 上傳及首頁化妝品滾動顯示的功能 其主要代碼如下 1 化妝品信息的顯示代碼 set rs server CreateObject adodb recordset sql select from huazhuangpin rs open sql conn 1 1 if rs eof and rs bof then response Write 暫時還沒有此類商品 response End Else p 2 rs PageSize p allPages rs PageCount 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 15 page Request QueryString page If isEmpty page or Cint page allPages Then page allPages end if rs AbsolutePage page rs AbsolutePage page Response Write do while not rs eof and p 1 Response Write for i 1 to 3 Response Write Response Write Response Write 產(chǎn)品名 rs name 品牌 rs BigClassName 價格 rs price 會員價 rs hyprice rs MoveNext If rs EOF Then Exit For Next If rs EOF Then Exit do rs MoveNext Response Write p p 1 loop 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 16 Response Write if rs eof and rs bof then else p 2 rs PageSize p allPages rs PageCount page Request QueryString page If isEmpty page or Cint page allPages Then page allPages end if iCount rs RecordCount 記錄總數(shù) iPageSize rs PageSize maxpage rs PageCount page request page per page rs PageSize if Not IsNumeric page or page then page 1 else page cint page end if 2 化妝品上傳的主要代碼 3 首頁化妝品品牌滾動的主要代碼 var dir 1 每步移動像素 大 快 var speed 1 循環(huán)周期 毫秒 大 慢 demo2 innerHTML demo1 innerHTML function Marquee 正常移動 alert demo2 offsetWidth n demo scrollLeft if dir 0 demo2 offsetWidth demo scrollLeft 0 demo scrollLeft 0 if dir 0 demo scrollLeft 0 demo scrollLeft demo2 offsetWidth demo scrollLeft dir demo onmouseover function clearInterval MyMar 暫停移動 demo onmouseout function MyMar setInterval Marquee speed 繼續(xù)移動 濟源職業(yè)技術(shù)學院畢業(yè)設(shè)計 論文 18 function r left if dir 1 dir 1 換向左移 function r right if dir 1 dir 1 換向右移 var MyMar setInterval Marquee speed 3 3 模塊功能實現(xiàn)模塊功能實現(xiàn) 網(wǎng)站功能模塊圖如圖 3 13所示 品 牌 大 全 完 美 護 膚 退 出 管 理 化 妝 品 品 牌 管 理 護 膚 彩 妝 文 章 管 理 會 員 用 戶 添 加 后 臺 管 理 用 戶 添 加 修 改 管 理 用 戶 密 碼 留 言 板 管 理 會 員 登 錄 明 媚 彩 妝 后 臺 管 理 膚 質(zhì) 測 試 聯(lián) 系 我 們 留 言 板 增 加 積 分 化妝品大世界 圖 3 13 功能模塊圖 1 該網(wǎng)站前臺的功能 對所有的化妝品有關(guān)的內(nèi)容進行顯示 2 該網(wǎng)站會員用戶登錄模塊功能實現(xiàn) 可以通過會員的卡號和密碼登錄 然后增加會員的積分 3 該網(wǎng)站后臺登錄模塊功能實現(xiàn) 管理員可以通過自己的用戶名和密碼 進入后臺進行化妝品品牌 護膚彩妝文章 會員 管理員 留言板進行添加和 管理 化妝品大世界網(wǎng)站設(shè)計與實現(xiàn) 19 致謝致謝 隨著畢業(yè)論文的完成 我的大學生涯也即將結(jié)束 在論文的寫作過程中得 到了老師與同學們的幫助 在此感謝大家對我的支持與鼓勵 這一段時間是我 大學階段的尾聲 同時也是人生中的一個紀念碑 我在其中也享受到了研究的 樂趣 首先我要感謝畢業(yè)設(shè)計的指導老師蘇文芝老師 通過蘇老師的指導