青島美麗一身網(wǎng)站的設(shè)計與制作計劃書

1 青島美麗一身網(wǎng)站的設(shè)計與制作計劃書 1 網(wǎng)站功能介紹 網(wǎng)站的界面設(shè)計主調(diào)顏色為粉紅色，由淺粉和桃紅色進行搭配，設(shè)計美觀。 本網(wǎng)站分為前臺展示和后臺管理兩大部分，其中前臺的主要功能是商品展示和用戶購買及評價留言，后臺的主要功能是管理員管理商品、處理訂單、管理用戶、管理基本信息。具體介紹如下： 頁功能 （ 1） 商品分類導(dǎo)航 服裝：外套、連衣裙、 T 恤、針織衫； 飾品：包包、首飾、帽子； （ 2） 頂部導(dǎo)航：特賣專區(qū)、特別活動、會員注冊、在線留言。如圖 1 所示： 圖 頁頂部展示 （ 3） 會員登錄界面； （ 4） 銷量前 6 名商品排序； （ 5） 最新商品展示，包括商品名稱、商品圖片、商品價格，共 9 個服裝類、6 個飾品類；如圖 2 所示： 2 圖 1頁商品展示及會員登錄、商品排名等 （ 6） 底部：加入收藏、設(shè)為主頁、后臺管理。 員注冊 （ 1） 會員注冊信息有：用戶名、密碼、真實姓名、電話、地址、頭像等； （ 2） 會員注冊后即有 10 個積分、每次登陸增加 2 個積分、每次購物增加 5個積分； 會員注冊界面如圖 3 所示： 圖 1員注冊界面 i. 商品細節(jié)顯示 3 （ 1） 商品小圖片、大圖片、商品名稱、原價格、現(xiàn)價格； （ 2） 商品詳情； （ 3） 商品評價； （ 4） 商品最近成交記錄； （ 5） 參考尺寸、物流介紹、質(zhì)量保證； 商品細節(jié)顯示如圖 4 所示： 圖 1品細節(jié)顯示 員購物 （ 1） 會員登陸后，可以購物； （ 2） 購物時填入確定電話、地址、郵編； （ 3） 購物后可以評價，評價后即在網(wǎng)頁中顯示購物記錄及評價信息； 線留言 （ 1） 會員登陸后可以留言 （ 2） 管理員可以刪除留言 會員在線留言如圖 5所示： 圖 1線留言 4 臺主要功能及特點 (1) 對管理員的管理：包括添加、刪除管理員、修改密碼等； (2) 商品的添加：添加時，需選擇商品的分類，輸入商品的名稱、價格、上傳商品的圖片 ，如圖 6 所示： 圖 2商品添加 (3) 商品的管理：可以分頁顯示商品，具有刪除功能； (4) 用戶管理：管理本網(wǎng)站的用戶，具有刪除功能； (5) 訂單查看：分頁顯示交易記錄； (6) 客服設(shè)置。 5 2 數(shù)據(jù)庫設(shè)計 采用 行數(shù)據(jù)庫設(shè)計，有 8 個數(shù)據(jù)表：商品分類表（ 商品信息表（ 商品成交記錄表（ 留言信息表（ 管理員信息表（ 用戶信息表（ 客服信息表（ 下面為幾個主要表的結(jié)構(gòu)展示： (1) 商品分類表（ 數(shù)據(jù)表視圖 圖 2品分類表表結(jié)構(gòu) (2) 商品信息表（ 設(shè)計表視圖 圖 2品分類表表結(jié)構(gòu) (3) 商品成交記錄表（ 設(shè)計表視圖 圖 2品分類表表結(jié)構(gòu) （ 4） 用戶信息表（ 設(shè)計表視圖 6 圖 2品分類表表結(jié)構(gòu) 其他各表不再詳細在這里列出，各表關(guān)系如下 圖 2品分類表表結(jié)構(gòu) 7 3 詳細設(shè)計 據(jù)庫連接技術(shù) 在需要與數(shù)據(jù)庫進行連接的所有頁面的設(shè)計上，我采用 的頭文件 , 售排名技術(shù) 將銷售前 6 名的商品展示到主頁上，可以使用 句中的排序語句： “ * 品信息表 售量 使其按銷售量由高到底排列，主要代碼如下 50 50 1 第 名： 價格： 元 總銷售額： 件 員注冊技術(shù)中的注冊信息檢查 由于在會員注冊時，用戶可能輸入非法信息，如兩次密碼不一致，所以本設(shè)計使用句來判斷用戶的輸入是否合 法，主要代碼如下： ) 8 請輸入用戶名！ ); ) 請輸入真實姓名！ ); ) 請輸入密碼！ ); |(表示 示大類， 示小類。 頁中使用 語句找到相應(yīng)的類別，然后使用雙重 do 句顯示商品，偽代碼如下： 戶購物功能設(shè)計 瀏覽者只有注冊為本網(wǎng)站的用戶，才能進行購物，用戶注冊或者登陸后，將會產(chǎn)生一個 ，用過這個 連接各網(wǎng)頁，判斷用戶是否登陸。 用戶在購買商品后，可以對商品進行評價，交易和評價的結(jié)果會添加到數(shù)據(jù)庫，顯示到網(wǎng)頁中去。如圖 7 展示的為商品評價： 10 圖 4品評價 臺管理 后臺管理界面采用左右兩側(cè)框架技術(shù)，左側(cè)為導(dǎo)航鏈接，右側(cè)為操作界面，如上文中的圖 6 所示。 品添加技術(shù) 向數(shù)據(jù)庫中添 加商品，使用的 言如下： rs= ,3 添加記錄 =) 商品名 =圖片地址 更新記錄 rs= 圖片上傳技術(shù) 圖片上傳技術(shù) 是本設(shè)計的 難點 ，我將圖片上傳的保存路徑設(shè)置為 件夾，并為文件命名，再將圖片保存到數(shù)據(jù)庫中；同樣，刪除改商品時，該圖片也將刪除，以存儲空間。 上傳后顯示及保存圖片主要代碼如下： 如果 0 說明有文件數(shù)據(jù) 保存文件 上傳成功 & 11 ) =f 品的管理 對商品進行管理如圖 8 所示，可以查看商品，刪除商品 圖 4品查看與管理 刪除商品的記錄，使用 句： id &) 刪除商品同時 也刪除其上傳的圖片，使用如下語句進行刪除 .&) 查找商品圖片名稱并賦予 量 et 找到商品圖片路徑 刪除改 文件 戶管理與訂單查看，與商品管理的操作相似，不再冗速。 12 4 小 結(jié) 網(wǎng)站已上傳。經(jīng)過測試，前臺網(wǎng)頁運行正常，實現(xiàn)了商品的動態(tài)顯示，顧客可以方便地進行選購，后臺管理方便可行。 設(shè)計主調(diào)顏色為粉紅色，由淺粉和桃紅色進行搭配，符合現(xiàn)代女性審美觀念，美觀大方。網(wǎng)站操作簡單，主題鮮明，可以適應(yīng)中小型企業(yè)或店鋪的商務(wù)網(wǎng)站的運營。通過這次實踐考核鍛煉了我網(wǎng)站建設(shè)和設(shè)計能力及一些相關(guān)軟件的運用能力。同時，還存在一些問題和不足。 在技術(shù)上也需要