基于thinkPHP的達州市農(nóng)村地區(qū)農(nóng)副產(chǎn)品的商務網(wǎng)站設計

基于thinkPHP的達州市農(nóng)村地區(qū)農(nóng)副產(chǎn)品的商務網(wǎng)站設計計算機與信息科學學院 計算機科學與技術(shù) 2011級 周飛指導教師 戴政國摘 要：本網(wǎng)站是采用thinkPHP框架技術(shù)，并結(jié)合HTML5、CSS3、Js、jQuery等相關(guān)技術(shù)完成的關(guān)于達州市農(nóng)副產(chǎn)品的商務動態(tài)網(wǎng)頁，實現(xiàn)了前臺和后臺模塊功能設計和開發(fā)。前臺模塊包括網(wǎng)站首頁、鮮果區(qū)、禮品區(qū)、搶先達人、采摘樂園、試吃中心、新聞動態(tài)和聯(lián)系我們等模塊，后臺是對前臺商品內(nèi)容進行維護和更新的模塊。本水果網(wǎng)站的研制目的是希望再傳統(tǒng)農(nóng)業(yè)的基礎之上嫁接上網(wǎng)絡的推銷平臺，促使農(nóng)副產(chǎn)品銷售更暢通。關(guān)鍵詞：ThinkPHP；水果；MySQL；動態(tài)網(wǎng)頁；Abstract：This website is a business website ahout agricultural products in Dazhou which made by useing thinkPHP frame and combined HTML5，Css，Js, jQuery，mainly achieved the assign goal of front and back office.Front modules includeHomepage,Fisrt section,Gift section,Fisrt one,Picking garden, Foretaste,News,Contact us.The back modules mainly finish the task of maintain and update the content of Front modules.This goal of website is to that on the best hope of base in the traditional agriculture urge the sales of the agriculture products more unimpeded .Key words: ThinkPHP；fruit； MySQL；Dynamic website；1研究背景全球信息時代的爆發(fā)式商務經(jīng)濟時代的到來，極大程度上的改變甚至是有了替換原有的商務模式的趨勢，涌現(xiàn)了以網(wǎng)上購物為中心的銷售平臺和就業(yè)機會，同時這種模式也能為農(nóng)戶帶來了客觀的經(jīng)濟利益，提供了更加方便快捷的購物消費方式，為以銀行業(yè)為代表的金融機構(gòu)提供了大量的資金流。信息時代促使了人類的現(xiàn)代化生活方式的改變和快速發(fā)展速度。作為承載體的互聯(lián)網(wǎng)，必須能為客戶提供各種服務的多功能的商務平臺，以滿足網(wǎng)上購物的需求，比如，以淘寶、京東、天貓為代表的大型商務網(wǎng)站取得了巨大的成功和導致了生產(chǎn)銷售方式的變化，出現(xiàn)了鏈式反應。各個行業(yè)都引進了電商銷售模式，中國農(nóng)村作為中國最大的區(qū)域，發(fā)展相對落后，引進互聯(lián)網(wǎng)思維實現(xiàn)農(nóng)業(yè)現(xiàn)代化很有必要。要以“互聯(lián)網(wǎng)+”的思維去發(fā)展農(nóng)村，發(fā)展農(nóng)副產(chǎn)品，必然要發(fā)展必不可少的一個環(huán)節(jié)，那就是農(nóng)產(chǎn)品的商務網(wǎng)站平臺的建設和推廣1。由于近年市場需求和市政府政策的偏向和扶持，達州市農(nóng)副產(chǎn)品的發(fā)展勢頭2迅猛，其中有以盤石鄉(xiāng)的水果最為出色，建立了好幾十畝的水果產(chǎn)業(yè)園區(qū)，以及各中小型農(nóng)戶的自營果園?，F(xiàn)在大部分都有私家車，每當豐收時節(jié)，疲于城市的上班族們就三五成群的自駕來農(nóng)村玩，采摘食物，踏青。在這樣的需求下，如果能有這樣一個集購物、消費、和最新農(nóng)家優(yōu)惠信息的一個平臺的誕生，那將極大的方便游客和購物者，也有利于農(nóng)戶和大型果園的創(chuàng)收。2需求分析與可行性分析2.1 需求分析根據(jù)大量的走訪和調(diào)查研究，建立一個農(nóng)副產(chǎn)品商務網(wǎng)站需要最基本的前端和后臺這兩大功能模塊：2.1.1 前端：供顧客瀏覽商品、篩選商品、下訂單、支付商品、以及查閱訂單進程和維護會員信息。應有以下功能：注冊功能：所有的購買過程都只能對會員開放，注冊后完善會員信息。登錄功能：登錄后才能下訂單、查看訂單、追蹤訂單、取消訂單和更新會員信息。搜索功能：支持站內(nèi)產(chǎn)品搜索。訂單功能：集中處理用戶訂單，下訂單、查詢、追蹤、修改和取消訂單。用戶功能：查看訂單，修改會員信息，上傳頭像和修改發(fā)貨地址。新聞功能：閱讀最新的新聞，了解本網(wǎng)站的最新動態(tài)。聯(lián)系我們功能：收集客戶意見和建議，更好的完善自身，提供給客戶我們位置的地圖，做好用戶體驗。試吃中心：新產(chǎn)品上市促銷，采取免費食用的方式打開銷路。采摘樂園：提供給客戶上門親自采摘的方式，讓客戶充分地體驗采摘的樂趣。搶先達人：提供給客戶激進品嘗最新水果的機會。2.1.2后臺：主要是對產(chǎn)品、會員、訂單和文件的處理； 那么應有以下子模塊：登錄與注冊功能：驗證和限制會員信息，進入后臺進行網(wǎng)站維護。系統(tǒng)設置：更改維護系統(tǒng)的信息，如title，keywords,description等方便SEO優(yōu)化，有助于網(wǎng)絡排名的系統(tǒng)信息。新聞管理：在后臺對網(wǎng)站的新聞進行增刪改。產(chǎn)品管理：查詢、增加、刪除、修改產(chǎn)品。上傳產(chǎn)品圖片以及詳細的產(chǎn)品信息。會員管理：查看會員的信息、訂單信息、以及限制和刪除會員。訂單管理：查看所有訂單信息并管理，實現(xiàn)客戶追蹤訂單。文件管理：更新目錄結(jié)構(gòu)以及刪除不必要的文件。2.2 可行性分析2.2.1 經(jīng)濟可行性分析經(jīng)濟可行性主要從成本效益分析，開發(fā)成本的角度看，確定系統(tǒng)是否值得開發(fā)，同時也可以從網(wǎng)站的試用價值來分析。水果網(wǎng)站能引起人們的消費行為，促進消費，帶來收入。仔細分析了網(wǎng)站的開發(fā)項目和開發(fā)的預算成本后，我們在既有效控制開發(fā)成本、又不影響開發(fā)效果的基礎上估算出了該網(wǎng)站的開發(fā)需要的開發(fā)人員、硬件設備和網(wǎng)絡平臺及其經(jīng)費等具體情況如表2.1所示。表2.1 經(jīng)濟可行性分析物資名稱數(shù)量價格（元）說明開發(fā)人員設計師16000設計網(wǎng)頁樣式開發(fā)人員程序員15000編寫前端和后臺硬件設備電腦210000用于開發(fā)網(wǎng)站網(wǎng)絡平臺Windows72-開發(fā)環(huán)境經(jīng)費開發(fā)經(jīng)費26000開發(fā)人員伙食費2.2.2 技術(shù)可行性分析技術(shù)上的可行性分析主要分析現(xiàn)有技術(shù)條件能否順利完成開發(fā)工作，硬件、軟件配置能否滿足開發(fā)者的需要，各類技術(shù)為員的數(shù)量、水平、來源等。技術(shù)可行性分析如表2.2所示。表2.2 技術(shù)可行性分析技術(shù)要求是否達到說明thinkPHP是開發(fā)框架jQuery Validate是表單驗證Css3是頁面樣式及部分動畫php是開發(fā)語言Js是網(wǎng)頁動態(tài)效果Html5是網(wǎng)頁腳本語言3.系統(tǒng)設計3.1開發(fā)環(huán)境網(wǎng)站整體框架：thinkphp框架采用MVC模型3，模型（M）：模型的定義由Model類來完成。Model類位于項目目錄下面的LibModel目錄?？刂破鳎–）：應用控制器（核心控制器）和Action控制器都承擔了控制器的角色，區(qū)別在于Action控制器完成業(yè)務過程。Action控制器位于項目目錄下面的LibAction目錄。視圖（V）：模板的實現(xiàn)是和框架無關(guān)的，做到了100%分離，可以獨立預覽和制作。數(shù)據(jù)庫工具：Navicat for MySQL6是一套專為 MySQL 設計的高性能數(shù)據(jù)庫管理及開發(fā)工具。極完備的圖形用戶界面 (GUI)，Navicat 讓你可以以安全且簡單的方法創(chuàng)建、組織、訪問和共享信息，包括觸發(fā)器、存儲過程、函數(shù)、事件、視圖、管理用戶等。環(huán)境配置：XAMPP(Apache+Mysql+PHP+PERL )它可以在Windows 、Linux、Solaris、Mac OS等多種操作系統(tǒng)下安裝使用。它可以很方便的修改虛擬主機站點的根目錄，也可以很方便的在配置文件中修改Apache、MySQL和PHP的配置。3.2 網(wǎng)站結(jié)構(gòu)由需求分析我們可以得出網(wǎng)站的基本結(jié)構(gòu)，分為前端和后臺，具體的關(guān)系如下圖3-1。前端網(wǎng)站 后臺圖 3-1網(wǎng)站基本結(jié)構(gòu)前端直接面向用戶，給用戶最直接的影響，直接地影響消費者的購買欲望，所以前端功能的設計、交互性、用戶體驗非常重要4，前端包含用戶、產(chǎn)品新聞和聯(lián)系我們功能模塊。結(jié)構(gòu)圖如圖3-2所示。前端模塊用戶模塊 訂單信息 采摘樂園試吃中心產(chǎn)品模塊新聞列表新聞模塊聯(lián)系我們查看地圖發(fā)表留言 查看留言匿名發(fā)送 定時發(fā)送 取消訂單 跟蹤訂單 添加訂單 基本信息登錄注冊 訂單信息 個人信息 查詢產(chǎn)品瀏覽產(chǎn)品閱讀新聞 購買歷史 密碼找回圖3-2 前端功能結(jié)構(gòu)圖3.3系統(tǒng)流程圖3.3.1前端注冊 :從系統(tǒng)注冊開始，然后依次檢查郵箱的正確性、用戶名、登錄密碼、重復密碼、驗證碼，只有完全填寫正確、符合預定的規(guī)則，才能注冊成功，注冊成功后就立即轉(zhuǎn)入登錄頁，登錄成功后就可以進行其它操作。注冊運用了jQuery validate 表單驗證5，可以跟隨用戶判斷用戶的輸入是否符合要求，郵箱驗證要求必須滿足郵箱名的要求，用js判斷兩次密碼是否輸入一致等。具體流程如圖3-3。開始注冊檢查郵箱檢查用戶名檢查密碼符合要求是否符合要求否是檢查驗證碼填寫正確否是數(shù)據(jù)庫唯一性加入數(shù)據(jù)庫注冊成功跳轉(zhuǎn)至登錄頁圖3-3 注冊流程圖3.3.2后臺新聞管理：根據(jù)前臺的需求分析以及設計，發(fā)布新聞需要選擇新聞的縮略圖，否則這個新聞列表頁的左邊沒有縮略圖，影響美觀和感受。這個流程分為添加和修改兩個部分，填寫表單信息后分別進行判斷，是否插入縮略圖，如果有圖片就存儲圖片，但是需要注意的是，修改新聞時要替換掉原來的圖片，否則長時間的圖片的積累就會造成空間的浪費。如圖3-4。查看新聞添加新聞修改新聞填寫表單信息修改表單信息插入縮略圖修改縮略圖是刪除原有縮略圖上傳新的縮略圖寫入數(shù)據(jù)庫信息否否寫入數(shù)據(jù)成功成功是刪除新縮略圖恢復舊縮略圖刪除新縮略圖恢復舊縮略圖否否圖3-4 新聞管理流程圖3.4數(shù)據(jù)庫設計作為一個電商平臺，那么數(shù)據(jù)庫肯定會包含會員信息、產(chǎn)品信息、訂單信息、管理員信息、系統(tǒng)設置、新聞信息6，包含了水果采摘、搶先、試吃、留言板塊。根據(jù)已有的需求分析，一個購物網(wǎng)站的會員必須要有以下信息：用戶名、用戶密碼、注冊郵箱、生日（生日當天活動獎勵）、性別（利于向不同性別人群銷售不同產(chǎn)品）、聯(lián)系電話、頭像信息、收貨地址，注冊時間。如表3.1所示。表3.1 會員信息數(shù)據(jù)庫設計字段名類型說明idint用戶idusernamevarchar用戶名passwordvarchar用戶密碼emailvarchar郵箱birthdayvarchar生日sexenum性別phonevarchar電話addressvarchar地址regtimedatetime注冊時間產(chǎn)品評論設計：現(xiàn)在越來越多的人注重購買者的言論，影響產(chǎn)品的銷售和用戶體驗，也影響網(wǎng)絡銷售。產(chǎn)品評論數(shù)據(jù)庫設計如表3.2所示。表3.2產(chǎn)品評論數(shù)據(jù)庫設計字段類型說明idint產(chǎn)品iduidint用戶idpidint產(chǎn)品idctimedatetime評論時間ccontenttext評論內(nèi)容產(chǎn)品是電商的核心，有了好的產(chǎn)品，提供給客戶優(yōu)質(zhì)的產(chǎn)品，那么這個企業(yè)最大的優(yōu)勢就突顯出來了 。如表3.3所示。表3.3會員信息數(shù)據(jù)庫設計字段類型說明idint產(chǎn)品編號pidvarchar排序號pnamevarchar產(chǎn)品名pbackvarchar包裝priceint價格priceoldint原價格pintrotext產(chǎn)品簡介premindtext溫馨提示pdetailtext產(chǎn)品詳情photenum熱銷pclassvarchar類別paddressvarchar產(chǎn)地pfreshvarchar新鮮度psendvarchar運送pstandardenum規(guī)格ppreferenum優(yōu)惠pnewenum新品pgiftenum禮品pimg1varchar產(chǎn)品圖片1pshowbigvarchar首頁大廣告ptimedate上架時間網(wǎng)站管理員設計：網(wǎng)站管理員必須與消費者的管理要分開，分開前端和后臺內(nèi)容管理以免造成混亂，也有利于后臺權(quán)限的分配7，具體設計如表3.4所示。表 3.4網(wǎng)站管理員數(shù)據(jù)庫設計字段類型說明idint管理員idnamevarchar姓名passwordvarchar密碼classenum管理員級別ipvarchar最近登錄iptimedatetime最近登錄時間phonevarchar聯(lián)系電話emailvarchar郵箱留言板設計：良好的售后服務和及時解決客戶疑問也會直接影響消費者的體驗，消費者的不良言論造成的影響不可言喻。如表3.5所示。表3.5留言板設計數(shù)據(jù)庫設計字段類型說明idint留言idmnamevarchar留言者姓名mphonevarchar聯(lián)系電話memailvarchar郵箱mmesstext留言內(nèi)容mtimedatetime留言時間新聞數(shù)據(jù)庫設計：一個結(jié)構(gòu)完善的網(wǎng)站，應該有新聞發(fā)布系統(tǒng)，既有利于網(wǎng)站的排名和SEO的優(yōu)化，有利于網(wǎng)站搜索量，更有利于消費者認識我們的服務，了解我們的最新動態(tài)，了解我們的產(chǎn)品。如表3.6所示。表3.6新聞數(shù)據(jù)庫設計字段類型說明idint新聞idnnamevarchar新聞標題ntimedatetime發(fā)布時間npicktext新聞摘要nimgvarchar縮略圖地址publishenum發(fā)布狀態(tài)authorvarchar作者contentvarchar新聞內(nèi)容4.系統(tǒng)實現(xiàn)4.1前端頁面實現(xiàn)前端頁面良好的用戶體驗可以事半功倍，本站運用了html 、css 、jQuery、jQuery Validate，font-awesome。如圖4.1所示。圖4-1首頁效果圖為滿足不同用戶的需要，產(chǎn)品搜索提供了多條件的查詢，采用了jQuery+ajax無頁面刷新技術(shù)進行產(chǎn)品查詢8，規(guī)定了頁面的產(chǎn)品列表只能顯示12個產(chǎn)品，更多產(chǎn)品進行分頁顯示，如果需要查看更多可點擊上一頁和下一頁進行翻頁查看。如圖4-2所示。圖4-2前端展品展示列表搶先水果給消費者提供先一步品嘗水果的機會，搶先會限時、限量。若產(chǎn)品缺貨，“搶先”按鈕就不能使用，呈灰色狀態(tài)。如圖4-3。圖4-3搶先水果頁面采摘樂園提供給消費者進行實地采摘的機會，左下角的四張小圖可以進行鼠標指向不同的圖片后上面的大圖隨之而變，看得更清楚。如圖4-4。圖4-4 采摘樂園頁面新聞列表效果如如圖4-5。圖4-5 前端新聞列表頁面留言板以及地圖：留言板是為了方便消費者直接給商家反映消費問題，以便讓我們的商家更加優(yōu)化自己的服務，讓消費者更加舒心的消費和享受更好的服務。百度地圖的引入，主要是給消費者展示商家大概的地理位置。這個地圖主要是引入了百度地圖提供的地圖接口，在此接口上按照自己的需要設定要顯示的地圖。效果如圖4-6所示。圖4-6 留言及查看地圖4.2后臺功能實現(xiàn)后臺首頁效果如圖4-7。圖4-7 后臺首頁后臺修改系統(tǒng)設置：包括系統(tǒng)的系統(tǒng)設置，郵件設置、上傳設置、訪問設置，效果如圖4-8。圖4-8 后臺系統(tǒng)設置頁面新聞管理以列表性的形式展示，每頁限制12條數(shù)據(jù)，如果單頁數(shù)據(jù)超出12條就會自動分頁，點擊每一個新聞標題可以進入修改頁面。如圖4-9。圖4-9 修改新聞頁面本系統(tǒng)對產(chǎn)品詳情和新聞詳情都采用了kindeditor富文本編輯器進行編輯，該編輯器方便且功能強大，預設文本在前端頁面上的樣式，更有詳細的demo，不愁遇到問題不會解決，總之，這個編輯器極大的提升了開發(fā)者的速度和效率，值得一用。4.3重要代碼的實現(xiàn)文件上傳：為了實現(xiàn)多圖上傳，采用了thinkPHP自帶的上傳類文件upload.class.php,用thinkphp自帶的命名空間。文件上傳只需要在我們需要上傳文件的控制器中修改配置，然后在實例化上傳對象，對接收表單對象進行判斷，選中了文件才能上傳，具有多張圖片上傳的功能，選擇了幾張圖片才會上傳幾張圖片，上傳后的文件名以及存儲地址都能夠在實例化之前做好配置。在文件確定上傳之后，我們就獲取到上傳文件的信息，然后重新封裝成需要的數(shù)組，加入數(shù)據(jù)庫，如果在插入數(shù)據(jù)庫期間因為別的什么原因?qū)е聰?shù)據(jù)庫更新失敗，我們在返回重做之前還應刪掉剛剛上傳成功地文件，即實現(xiàn)了簡單的數(shù)據(jù)回滾9。$config = array(rootPath = ./Public/Images/product/, /保存根路徑savePath = , /保存路徑replace = false,/存在同名文件是否是覆蓋，默認為falsemaxSize = 3145728,/最大文件3M 以字節(jié)B為單位 exts = array(jpg,gif,png,jpeg),/上傳文件類型限制autoSub = false,/不使用子目錄保存上傳文件 默認為true);$upload = new ThinkUpload($config);/ 實例化上傳類/如果表單的name=pimg-$_FILES為三維數(shù)組;就要用這種方式從組下數(shù)組/ $fileData=$this-batch($_FILES,pimg); if($_FILESpimg1name)/獲取有效的表單數(shù)據(jù)，0時才上傳for ($i=1; $i uploadOne($_FILESpimg.$i); if(!$info) / 上傳錯誤提示錯誤信息$this-error($upload-getError();else$arr$i = $info; / 上傳成功 獲取上傳文件信息else$isavename= ;/獲取上傳文件的地址$pdatapimg1 = $arr1savename;$pdatapimg2 = $arr2savename;$pdatapimg3 = $arr3savename;$pdatapimg4 = $arr4savename; $pdatapshowbig = $arr5savename;$pdatapshowsmall = $arr6savename;else$this-error(請先選擇商品詳情圖1);登錄功能：首先在登錄頁面的地方運用了jQuery validate表單驗證，只需要簡單的寫法就能實現(xiàn)表單的人性化驗證10，代碼如下：$(formname=login_form).validate(rules :pwd : required,email : required:true,email : true,messages :pwd :請?zhí)顚懨艽a,email : required :請?zhí)顚戉]箱號,email :請輸入正確的郵箱號);表單輸入完畢以后，需要在后臺程序中完成驗證表單信息，并與數(shù)據(jù)庫中已經(jīng)注冊的用戶信息進行比對，完全符合才能允許進入后臺11。Thinkphp 3.2接收表單數(shù)據(jù)用了I()方法，非常的好用和方便，可以如I(post.)接收完整的表單信息，也可以如I(post.username)這樣接收表單的某個信息。登錄頁面設置了驗證碼，驗證碼也采用了ThinkPHP自帶的驗證碼，只需進行實例化，然后在模板中輸出驗證碼，驗證碼的規(guī)則也可以在實例化之前設置好，按照自己的需要設置不同的驗證碼。退出系統(tǒng)登錄：清除登錄時候可能保存在客戶端的cookie和服務區(qū)端的session ,先清除cookie 的內(nèi)容，然后設置過期的時間就保證了cookie的清除12。具體代碼如下。public function CheckLogin() header(Content-type:text/html;Charset=UTF-8);$data=I(post.); /接收表單傳來的全部數(shù)據(jù)$username=$datausername;$password=$datapassword;$input_verify=$dataverify; /空值判斷if (!$username) $this-error(請輸入用戶名！);if (!$password) $this-error(請輸入密碼！);if (!$input_verify) $this-error(請輸入驗證碼！);$verify = I(param.verify,); / 檢查驗證碼 if(!check_verify($verify) $this-error(親，驗證碼輸錯了哦！);$user=M(admin);$whereusername=$username;$wherepassword=$password;$user=$user-where($where)-find();if (!$user) $this-error(用戶名或密碼錯誤，請仔細確認！); else /登錄成功寫入SESSION并且跳轉(zhuǎn)到首頁session(uid, $userid);date_default_timezone_set(PRC);$time = date(Y-m-d H:i:s,time();/修改用戶最近登錄ip和時間$ip = get_client_ip();$userinfotime = $time;$userinfoip = $ip;$whereUserid = session(uid);$u = M(Admin);$userID =$u-where($whereUser)-data($userinfo)-save(); $this-redirect(Index/index, 登錄成功，正在為您跳轉(zhuǎn).,3);5.結(jié)束語首先，我能在大學期間碰到這么優(yōu)秀負責任的老師，帶著我們一起學習，教授我們知識，特別是帶領我們走向了網(wǎng)站制作開發(fā)的道路上。第二，在這個畢業(yè)季里完成了我的畢業(yè)設計和論文，特別是在繁重的工作任務下完成了比較復雜的畢業(yè)設計。我感受到了在學校學習的安逸生活和在社會里謀求一份工作的來之不易，我特別珍惜在學校的最后一點象牙塔時光和在社會里我前進路上的每一塊絆腳石，它們會給我?guī)砻篮玫幕貞浐颓斑M需要的充足的動力。第三，我能獨立開發(fā)一個網(wǎng)站了，從前端到后臺，從頁面布局到數(shù)據(jù)處理，踏踏實實地走過來發(fā)現(xiàn)過去學的知識真的是太少了，需要學習的東西真是太多了。網(wǎng)站的學習和開發(fā)我終于