基于Vue的精靈烘培商品管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

一、開(kāi)發(fā)背景1.1選題背景電子商務(wù)平臺(tái)是一種信息交互的網(wǎng)站平臺(tái)，它主要向用戶展示一些靜態(tài)的頁(yè)面與后臺(tái)動(dòng)態(tài)的數(shù)據(jù)，靜態(tài)頁(yè)面信息包括店鋪簡(jiǎn)介，新聞資訊等不經(jīng)常更換的訊息，而動(dòng)態(tài)信息屬于商品信息，具體有價(jià)格、商品種類等需要經(jīng)常調(diào)整的信息。精靈烘培商品管理系統(tǒng)是面向商家的商品管理平臺(tái)，這樣才會(huì)幫助顧客了解該店鋪時(shí)下最熱門(mén)商品，同時(shí)選擇最優(yōu)。滿足用戶的交互信息及商品選購(gòu)，以便完成交易。物質(zhì)與精神的高度發(fā)展成就了電商購(gòu)物平臺(tái)，而電商購(gòu)物平臺(tái)網(wǎng)站的品種豐富、價(jià)格低廉、消費(fèi)方便的特點(diǎn)促使它幾乎成為了一種必需。1.2研究意義電子商務(wù)的運(yùn)轉(zhuǎn)邏輯是商業(yè)邏輯，其中營(yíng)銷(xiāo)占很大的比重。電商的店家都希望伴隨著轉(zhuǎn)化率的提升，商品利潤(rùn)率也日益增長(zhǎng)[1]。在生活中，面對(duì)如潮水般的商品，如何使得用戶從多、雜的商品挑選到自己心儀的商品[2]；如何使得那些知名度不高，質(zhì)量又好的商品拓寬自己的銷(xiāo)路[3]；如何使得商品資源從單一的推廣渠道得到有效的利用。有鑒于此，一個(gè)既能讓客戶放心選擇商品，又能滿足商店管理員對(duì)自己商品進(jìn)行全面管理，了解商品詳情，該管理系統(tǒng)應(yīng)運(yùn)而生[4]。而這，也正是本文研究問(wèn)題的目的和意義。本設(shè)計(jì)后臺(tái)使用node.js語(yǔ)言搭建，通過(guò)使用mongoose管理mongodb數(shù)據(jù)庫(kù)實(shí)現(xiàn)。1.3研究現(xiàn)狀2014年，中國(guó)烘焙行業(yè)收入達(dá)2427億元，同比增長(zhǎng)10.28%，其中糕點(diǎn)行業(yè)實(shí)現(xiàn)收入899億元，餅干及其他焙烤食品實(shí)現(xiàn)收入1527億元[5]。近年來(lái)受西方文化的影響，越來(lái)越多的國(guó)人接受烘培食品作為主食[6]。隨著人們生活品質(zhì)的提高以及生活進(jìn)度的加快也使得營(yíng)養(yǎng)豐富、口味多樣的烘焙食品受到人們的廣泛的喜愛(ài)[7]。據(jù)統(tǒng)計(jì)，2015年中國(guó)已存在烘培企業(yè)1408家，銷(xiāo)售額達(dá)到1601億元。從人均消費(fèi)來(lái)看，烘培市場(chǎng)潛力十分巨大，2015年人均烘焙食品消費(fèi)量?jī)H6.6公斤，香港、日本則分別為15.4、22.5公斤，烘培行業(yè)市場(chǎng)空間巨大[8]?，F(xiàn)在烘焙食品行情與世界其他國(guó)家比，還有非常大的差距[9]。不管是加工食品技術(shù)、食品質(zhì)量，還是食品生產(chǎn)規(guī)模、食品花色品種方面，還有大量進(jìn)步空間[10]。)雖然烘焙食品行業(yè)在中國(guó)的發(fā)展歷史僅僅幾十年，但隨著中國(guó)人民日常飲食習(xí)慣的變化和國(guó)際交往的日漸增多，烘焙食品的生產(chǎn)注入了新的活力，從此成為一個(gè)獨(dú)特的中西飲食文化交融的新興行業(yè)[11]。中國(guó)的城市化帶來(lái)的人口高度集中，相對(duì)應(yīng)的是更密集的餐廳，但享受的卻是仍然遠(yuǎn)遠(yuǎn)低于發(fā)達(dá)國(guó)家的人力成本[12]。這意味著在中國(guó)，烘培行業(yè)可以用更廉價(jià)的成本實(shí)現(xiàn)最高效的配送，同時(shí)，三者結(jié)合也更利于電商購(gòu)物平臺(tái)在中國(guó)的成長(zhǎng)。因此，線上營(yíng)銷(xiāo)也是能占取相應(yīng)的市場(chǎng)，這對(duì)于商品的銷(xiāo)售，公司的盈利和品牌的宣傳都是線下發(fā)展所不能及的。因此，烘培精靈商品管理平臺(tái)是一種可持續(xù)發(fā)展的營(yíng)銷(xiāo)模式。雖然中國(guó)傳統(tǒng)美食還不算是主流行業(yè)，但它正在穩(wěn)健提升中。對(duì)于包裝配送和味道保鮮的問(wèn)題有所解決的同時(shí)，中國(guó)美食的市場(chǎng)大門(mén)就會(huì)被完全打開(kāi)，從而開(kāi)始進(jìn)入規(guī)模性的高速增長(zhǎng)中。人民收入的普遍提高和日常消費(fèi)習(xí)慣的改變將帶動(dòng)中國(guó)烘培行業(yè)的發(fā)展。當(dāng)前國(guó)內(nèi)人均可支配收入正處于持續(xù)增長(zhǎng)時(shí)期，現(xiàn)在，烘培食品在國(guó)內(nèi)更多的是作為主食和休閑食品。各色各樣的人為了工作方便和節(jié)約時(shí)間，普遍選擇烘培作為早餐，同時(shí)，因?yàn)橄M(fèi)者在健康方面的需求提高，市場(chǎng)上又涌現(xiàn)了很多營(yíng)養(yǎng)型烘培。隨著民眾生活節(jié)奏的加快以及西方飲食文化逐漸的被國(guó)內(nèi)所接受，烘培食品在未來(lái)的需求會(huì)越來(lái)越大[13]。在購(gòu)物平臺(tái)上挑選食物時(shí)，用戶可以選取到自己想要的種類，也可以斟酌價(jià)格、品種、口味等，最主要的是可以貨比三家而不用消耗體力和礙于面子的問(wèn)題來(lái)挑選合適自己的一家。讓吃飯變的更舒心更簡(jiǎn)單生活更美好。

二、開(kāi)發(fā)工具及環(huán)境2.1node.js技術(shù)分析簡(jiǎn)單的說(shuō)Node.js就是運(yùn)行在服務(wù)端的JavaScript[14]。Node.js是一個(gè)是的JavaScript可以在服務(wù)器端運(yùn)行的JavaScript環(huán)境，它基于Google的V8引擎，因?yàn)閂8引擎執(zhí)行Javascript的速度非?？?，而且性能非常好。Nodejs基于Javascript語(yǔ)言，這樣的話，不用再去學(xué)習(xí)后端語(yǔ)言，降低了學(xué)習(xí)的成本。熟悉node的人，都知道node還有一個(gè)強(qiáng)大的地方就是npm包管理器。而且社區(qū)極度活躍，也帶動(dòng)node的快速發(fā)展。當(dāng)然，成也蕭何，敗也蕭何。因?yàn)殚_(kāi)放提交包的功能，使得Nodejs社區(qū)里的包品質(zhì)良莠不齊。如果你npm了一個(gè)有問(wèn)題的包，那將會(huì)給你帶來(lái)極大的麻煩。2.2MVVM框架MVVM是Model-View-ViewModel的簡(jiǎn)寫(xiě)。它本質(zhì)上就是MVC的改進(jìn)版。MVVM就是將其中的View的狀態(tài)和行為抽象化，從而將視圖UI和業(yè)務(wù)邏輯分開(kāi)。當(dāng)然這些事都是交給ViewModel處理，它可以取出Model里的數(shù)據(jù)。同時(shí)處理View中需要展示內(nèi)容而涉及的業(yè)務(wù)邏輯。微軟的WPF帶來(lái)了新的體驗(yàn)，如Silverlight、音頻、視頻、3D、動(dòng)畫(huà)……。MVVM（Model-View-ViewModel）框架的便是由MVP（Model-View-Presenter）模式與WPF結(jié)合的應(yīng)用方式發(fā)展演變過(guò)來(lái)的一種新型架構(gòu)框架。立足于原有MVP框架并且把WPF的新特性糅合進(jìn)去，以應(yīng)對(duì)日益復(fù)雜的需求變化[15]。2.3數(shù)據(jù)庫(kù)技術(shù)分析完整的購(gòu)物平臺(tái)網(wǎng)站不只有表面看到的靜態(tài)頁(yè)面，包括假數(shù)據(jù)的顯示。但是要實(shí)時(shí)滿足店主和客戶的需求以及相關(guān)的操作，那么就還需要用來(lái)存儲(chǔ)數(shù)據(jù)的后臺(tái)數(shù)據(jù)庫(kù)，以及對(duì)后臺(tái)個(gè)數(shù)據(jù)處理的接口和中臺(tái)界面?；蛘哒f(shuō)是后臺(tái)管理可視化界面。當(dāng)然，者并不是簡(jiǎn)單地，也有很多的環(huán)節(jié)。其中包含數(shù)據(jù)庫(kù)的設(shè)置、數(shù)據(jù)庫(kù)表的設(shè)置、數(shù)據(jù)庫(kù)結(jié)構(gòu)的設(shè)置、數(shù)據(jù)庫(kù)的表的結(jié)構(gòu)的設(shè)置。當(dāng)然，在此之前你需要先對(duì)前臺(tái)頁(yè)面所需要的數(shù)據(jù)庫(kù)字段進(jìn)行分析。但是精靈烘培系統(tǒng)不只只是需要注意到數(shù)據(jù)庫(kù)的制作，因?yàn)閿?shù)據(jù)是最重要的資料，關(guān)系著每個(gè)用戶與商家的切身利益，在這個(gè)信息多元化的時(shí)代，個(gè)人私有信息的失竊可能導(dǎo)致極其嚴(yán)重的后果。所以安全方面也是重中之重。選擇一個(gè)合適的數(shù)據(jù)庫(kù)是必不可少的。據(jù)相關(guān)機(jī)構(gòu)研究，發(fā)布了一份數(shù)據(jù)庫(kù)的設(shè)計(jì)標(biāo)準(zhǔn)。該研究表明，只有符合第三規(guī)范的數(shù)據(jù)庫(kù)才是合理的數(shù)據(jù)庫(kù)。所以，要想設(shè)計(jì)出一個(gè)即安全同時(shí)效率又高的數(shù)據(jù)庫(kù)就必須要嚴(yán)格遵守規(guī)范里對(duì)于數(shù)據(jù)庫(kù)表、數(shù)據(jù)庫(kù)視圖、觸發(fā)器等的約束，這一切基本的部件都通過(guò)合理設(shè)計(jì)才能完成數(shù)據(jù)庫(kù)的設(shè)計(jì)。MongoDB是基于分布式文件存儲(chǔ)的數(shù)據(jù)庫(kù)。由C++語(yǔ)言編寫(xiě)。是為了給WEB應(yīng)用提供可擴(kuò)展的高性能數(shù)據(jù)存儲(chǔ)。MongoDB是一個(gè)介于關(guān)系數(shù)據(jù)庫(kù)和非關(guān)系數(shù)據(jù)庫(kù)之間的產(chǎn)品，是非關(guān)系數(shù)據(jù)庫(kù)當(dāng)中功能最豐富的數(shù)據(jù)庫(kù)。它支持的數(shù)據(jù)結(jié)構(gòu)非常松散，是類似json的bson格式，像普遍的SQL數(shù)據(jù)庫(kù)是不能夠存儲(chǔ)數(shù)組字段的，但在mongoDB里這些問(wèn)題是不存在的。這樣也是的系統(tǒng)更為方便容錯(cuò)率較高。三、精靈烘培商品管理平臺(tái)需求分析3.1需求可行性分析在精靈烘培商品管理系統(tǒng)設(shè)計(jì)之前去訪問(wèn)、思索該系統(tǒng)所需要滿足的需求，這就是系統(tǒng)可行性分析，主要通過(guò)精靈烘培商品管理平臺(tái)的前臺(tái)頁(yè)面的開(kāi)發(fā)和精靈烘培商品管理平臺(tái)中臺(tái)管理頁(yè)面開(kāi)發(fā)這兩方面來(lái)分析可行性?？尚行匝芯恐斜容^重要的幾方面有精靈烘培商品管理系統(tǒng)的操作可行性、精靈烘培商品管理系統(tǒng)的技術(shù)可行性、精靈烘培商品管理平臺(tái)的經(jīng)濟(jì)可行性和精靈烘培商品管理平臺(tái)的需求可行性等。操作可行性：如今的用戶對(duì)于任何事物都崇尚簡(jiǎn)潔風(fēng)，所以剛開(kāi)始就摒棄了以前大多數(shù)管理平臺(tái)采用的重金屬風(fēng)格，整個(gè)系統(tǒng)采用簡(jiǎn)單設(shè)計(jì)風(fēng)格，同時(shí)保證系統(tǒng)美觀。而且各種人性化設(shè)計(jì)使得各方面操作簡(jiǎn)單明了，易上手。精靈烘培商品管理系統(tǒng)正是本著這種簡(jiǎn)潔操作的理念去開(kāi)發(fā)的一種系統(tǒng)。它操作簡(jiǎn)單明了，不論老少婦孺都可以實(shí)現(xiàn)下單購(gòu)物的傻瓜式操作流程。技術(shù)可行性：該精靈烘培商品管理平臺(tái)是在線運(yùn)營(yíng)的電商類網(wǎng)站，有前臺(tái)商品信息展示的模塊和中臺(tái)數(shù)據(jù)庫(kù)管理模塊。于是針對(duì)于這種表現(xiàn)形式可以使用MVVM框架形成布局。為了頁(yè)面也能簡(jiǎn)結(jié)開(kāi)發(fā)，使用Element-ui布局。并且組件十分豐富，促進(jìn)開(kāi)發(fā)進(jìn)度。之后根據(jù)系統(tǒng)平臺(tái)的風(fēng)格和規(guī)模大小以及大體功能來(lái)選擇node.js來(lái)進(jìn)行程序的開(kāi)發(fā)。node.js這種腳本語(yǔ)言幾乎就是為動(dòng)態(tài)網(wǎng)頁(yè)而生的，他是在服務(wù)器端的，就是運(yùn)行環(huán)境。同時(shí)也可以良好的處理多并發(fā)。最主要的的是node.js的npm包管理器，這個(gè)管理器對(duì)于Vue項(xiàng)目開(kāi)發(fā)起到重要的作用。甚至有好多人感覺(jué)它就是世界上最美的語(yǔ)言。由于互聯(lián)網(wǎng)如今高速發(fā)展的背景下node.js技術(shù)已經(jīng)更新迭代到非常穩(wěn)定和兼容良好的狀態(tài)，正是因?yàn)槿绱?，所以node.js現(xiàn)在已經(jīng)在系統(tǒng)開(kāi)發(fā)中被廣泛使用。它和mongodb結(jié)合起來(lái)使用是當(dāng)下主流的程序開(kāi)發(fā)人員所推崇的。由于互聯(lián)網(wǎng)的蓬勃發(fā)展和程序開(kāi)發(fā)的不斷完善目前的node.js技術(shù)幾乎趨于完整，擁有非常穩(wěn)定和程序化的優(yōu)勢(shì)，所以在這里采用node.js。經(jīng)濟(jì)可行性：所有計(jì)劃和行動(dòng)幾乎都可以劃分到公益和盈利這兩大模塊下面。精靈烘培商品管理系統(tǒng)，它就是一個(gè)盈利的電商網(wǎng)站，所以精靈烘培商品管理平臺(tái)的經(jīng)濟(jì)可行性是極其重要的一個(gè)環(huán)節(jié)。開(kāi)發(fā)每個(gè)系統(tǒng)都需要做出極大的付出，所以成本較高。為了節(jié)約成本，在系統(tǒng)開(kāi)發(fā)前進(jìn)行整個(gè)系統(tǒng)成本，盈利區(qū)間進(jìn)行分析是重要的。如果系統(tǒng)開(kāi)發(fā)所需要的成本已經(jīng)十分高昂，導(dǎo)致后期運(yùn)營(yíng)都難以平衡收支的情況就可以不用開(kāi)發(fā)了。綜上，本精靈烘培商品管理平臺(tái)的經(jīng)濟(jì)可行性分析達(dá)標(biāo)。需求可行性：需求可行性一定是根據(jù)精靈烘培商品管理平臺(tái)自身的功能而決定的，精靈烘培商品管理平臺(tái)里擁有多少功能它就會(huì)有相應(yīng)的多少需求，這些需求能否達(dá)到要求，這些又是否合理可行，這都是需求可行性要研究分析的內(nèi)容。本精靈烘培商品管理平臺(tái)是一個(gè)在線營(yíng)銷(xiāo)的平臺(tái)，商鋪本身自己就可以在中臺(tái)界面管理自己的商品，而且也能保證用戶能隨時(shí)隨地下單，同時(shí)進(jìn)行唯一性識(shí)別，這樣方便快捷，安全高效。3.2精靈烘培商品管理平臺(tái)功能需求精靈烘培商品管理平臺(tái)的主要功能特點(diǎn)就是方便與快捷，所以精靈烘培商品管理平臺(tái)的分類明了、選購(gòu)便利、操作簡(jiǎn)單。只要能在保證系統(tǒng)以及用戶信息安全的情況下操作一步就不要兩步的設(shè)計(jì)，給買(mǎi)家達(dá)到想要的購(gòu)物體驗(yàn)。第一點(diǎn)，用戶可以簡(jiǎn)單清晰的查看各種商品的基礎(chǔ)信息，比如商品價(jià)格、商品實(shí)物圖、商品口味等商品詳情，甚至還會(huì)有用戶的評(píng)價(jià)等，方便于用戶選擇自己喜愛(ài)的食物。看到有喜歡的商品就可以添加到購(gòu)物車(chē)中，最后可以一起結(jié)算，在此期間也可以隨時(shí)移除不滿意或者不想買(mǎi)的東西甚至清空購(gòu)物車(chē)中所選商品。第二點(diǎn)，精靈烘培商品管理平臺(tái)的后臺(tái)是管理這個(gè)網(wǎng)站的動(dòng)態(tài)數(shù)據(jù)和用戶信息的地方，網(wǎng)站中的商品的類別需要管理，還有公告留言等數(shù)據(jù)信息也是需要后臺(tái)管理員的維護(hù)、更新。考慮到精靈烘培商品管理平臺(tái)的管理員可能對(duì)于計(jì)算機(jī)沒(méi)有基礎(chǔ)，所以不管是增加、刪除還是修改這些模塊中的內(nèi)容都是非常簡(jiǎn)便，界面設(shè)計(jì)也非常明了，會(huì)讓網(wǎng)站的管理員操作起來(lái)很容易上手。精靈烘培管理系統(tǒng)后臺(tái)管理前臺(tái)界面商品詳情商品管理查看評(píng)價(jià)評(píng)價(jià)管理查看分類瀏覽首頁(yè)用戶管理訂單管理精靈烘培管理系統(tǒng)后臺(tái)管理前臺(tái)界面商品詳情商品管理查看評(píng)價(jià)評(píng)價(jià)管理查看分類瀏覽首頁(yè)用戶管理訂單管理圖3-1精靈烘培管理系統(tǒng)平臺(tái)功能圖3.3精靈烘培商品管理平臺(tái)性能需求精靈烘培商品管理平臺(tái)用戶的各種操作在簡(jiǎn)潔明了的情況下與實(shí)際功能相匹配，來(lái)達(dá)到準(zhǔn)確性；店主的操作要在對(duì)應(yīng)的規(guī)范之內(nèi)，保證用戶的購(gòu)物體驗(yàn)，確保及時(shí)性。同時(shí)在系統(tǒng)開(kāi)發(fā)時(shí)就有前瞻性的眼光，使得系統(tǒng)在日后面對(duì)超負(fù)荷的信息量時(shí)也能正常運(yùn)行處理信息和相應(yīng)程序，確保用戶和商家都擁有良好的買(mǎi)賣(mài)體驗(yàn)。精靈烘培商品管理平臺(tái)的開(kāi)放性和可擴(kuò)充性：在準(zhǔn)確性和及時(shí)性的處理時(shí)考慮到未來(lái)，也同樣在系統(tǒng)的可擴(kuò)充性分析時(shí)考慮周全，界面簡(jiǎn)潔，用戶的操作體驗(yàn)提升。產(chǎn)品的增刪管理功能就是擴(kuò)充性來(lái)解決的問(wèn)題了。同時(shí)，該商品平臺(tái)對(duì)所有人可見(jiàn)，進(jìn)行選購(gòu)，只有店主可以訪問(wèn)中臺(tái)界面。精靈烘培商品管理平臺(tái)的易用性和易維護(hù)性：對(duì)于這兩點(diǎn)的要求，就是要對(duì)于操作的簡(jiǎn)單和界面的簡(jiǎn)潔來(lái)主體實(shí)現(xiàn)，再結(jié)合游客在留言板上的信息或者用戶評(píng)論，進(jìn)行相應(yīng)的優(yōu)化和維護(hù)。操作流程就按照傳統(tǒng)的購(gòu)物流程，挑選、付款來(lái)實(shí)現(xiàn)，沒(méi)有冗余的步驟。精靈烘培商品管理平臺(tái)的數(shù)據(jù)要求：不論是前臺(tái)展示頁(yè)面還是中臺(tái)管理頁(yè)面，對(duì)于數(shù)據(jù)庫(kù)中數(shù)據(jù)的增刪改查等操作都要高度一致、完整、準(zhǔn)確、有效、實(shí)時(shí)等。另外還有數(shù)據(jù)的共享與獨(dú)立性。各種情況以數(shù)據(jù)庫(kù)安全為第一要素。精靈烘培管理系統(tǒng)平臺(tái)性能圖，如圖3-2所示：精靈烘培商品管理系統(tǒng)易用性與易維護(hù)性開(kāi)放性與可擴(kuò)充性準(zhǔn)確性和及時(shí)性數(shù)據(jù)要求高度一致精靈烘培商品管理系統(tǒng)易用性與易維護(hù)性開(kāi)放性與可擴(kuò)充性準(zhǔn)確性和及時(shí)性數(shù)據(jù)要求高度一致圖3-2精靈烘培管理系統(tǒng)平臺(tái)性能圖四、精靈烘培商品管理平臺(tái)總體設(shè)計(jì)4.1精靈烘培商品管理平臺(tái)架構(gòu)致力于打造一個(gè)快捷、高效、大氣的精靈烘培商品管理平臺(tái)。本網(wǎng)站的總體設(shè)計(jì)思路是，在用戶注冊(cè)前就可以登陸該購(gòu)物平臺(tái)，可以瀏覽商品，只是沒(méi)有下達(dá)訂單的能力。這樣可以方便用戶考慮自己是不是需要注冊(cè)。是否滿足自己需要，當(dāng)然可以再留言板說(shuō)出自己的意見(jiàn)，以便進(jìn)行后期維護(hù)以及優(yōu)化。不過(guò)是沒(méi)有對(duì)商品的評(píng)論權(quán)限的。當(dāng)?shù)顷懞罂梢詫?duì)網(wǎng)站內(nèi)的所有用戶可見(jiàn)頁(yè)面進(jìn)行訪問(wèn)，并且可以對(duì)選中的商品添加到購(gòu)物車(chē)中進(jìn)行下達(dá)訂單操作，以及商品質(zhì)量不高或有自己建議時(shí)，也可以對(duì)該商品進(jìn)行評(píng)論。而店主則可以進(jìn)行中臺(tái)各模塊的管理，通過(guò)用戶注冊(cè)時(shí)的信息和購(gòu)物車(chē)資料來(lái)對(duì)顧客進(jìn)行商品的派送。遵循著為人民服務(wù)的原則和對(duì)烘培食品熱愛(ài)的態(tài)度在做開(kāi)發(fā)，所以本網(wǎng)站是貼切人們?nèi)粘Ｉ畹木`烘培商品管理平臺(tái)，并且將長(zhǎng)此以往的改進(jìn)下去。精靈烘培管理系統(tǒng)結(jié)構(gòu)圖，如圖4-1所示：精靈烘培管理系統(tǒng)精靈烘培管理系統(tǒng)前臺(tái)交互系統(tǒng)后臺(tái)管理系統(tǒng)首頁(yè)展示商品展示登錄注冊(cè)管理系統(tǒng)用戶評(píng)論管理系統(tǒng)用戶管理評(píng)論管理管理系統(tǒng)商品管理分類管理圖4-1精靈烘培管理系統(tǒng)結(jié)構(gòu)圖4.2精靈烘培商品管理平臺(tái)用例精靈烘培商品管理平臺(tái)主要滿足3種類型用戶的需求，一種是精靈烘培商品管理平臺(tái)的用戶，另一種是精靈烘培商品管理平臺(tái)的管理員還有就是精靈烘培商品管理平臺(tái)的游客。精靈烘培商品管理平臺(tái)的管理員，主要負(fù)責(zé)對(duì)于管理員的的管理、商品分類的管理、商品的管理、用戶信息的管理，以及訂單的處理等職責(zé)。精靈烘培管理系統(tǒng)管理員用戶商品詳情精靈烘培管理系統(tǒng)管理員用戶商品詳情商品管理查看評(píng)價(jià)分類管理查看分類瀏覽首頁(yè)用戶管理訂單管理游客購(gòu)買(mǎi)商品登錄注冊(cè)圖4-2精靈烘培管理系統(tǒng)管理平臺(tái)用戶模式圖4.3精靈烘培商品管理平臺(tái)業(yè)務(wù)流程必須要進(jìn)行登錄才能以用戶的身份進(jìn)行一些需要權(quán)限，比如商品的選購(gòu)和商品的評(píng)論等操作。游客可以在網(wǎng)站首頁(yè)進(jìn)行注冊(cè)操作，注冊(cè)成功即可登錄，當(dāng)然不注冊(cè)也可以享受瀏覽商品的權(quán)限，增加對(duì)這個(gè)平臺(tái)的了解。網(wǎng)站為所有用戶提供商品展示、商品詳細(xì)信息的查看等功能，并且還要記錄用戶的購(gòu)物記錄。身處系統(tǒng)中臺(tái)的系統(tǒng)管理員對(duì)商品分類、商品詳細(xì)信息、管理員、用戶、用戶評(píng)論、以及系統(tǒng)各項(xiàng)設(shè)置進(jìn)行一些管理。圖4-3精靈烘培管理系統(tǒng)商品分類管理圖4.410147精靈烘培商品管理平臺(tái)的功能模塊在中臺(tái)界面進(jìn)行管理，進(jìn)入中臺(tái)頁(yè)面，這里可以對(duì)后臺(tái)數(shù)據(jù)進(jìn)行修改，可視化的圖片方便更直接的理解商品當(dāng)前信息。管理功能包括商品的增刪改查，以及對(duì)根據(jù)查找的方式進(jìn)行相應(yīng)的排序。在這里對(duì)數(shù)據(jù)庫(kù)進(jìn)行直接處理，管理員具有所有管理權(quán)限。在數(shù)據(jù)庫(kù)處理之后，整理所有數(shù)據(jù)處理接口，調(diào)試出安全合適的前端接口，在前端調(diào)用處理。表4-1商品管理信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255商品的idNamevarchar255商品名稱Srcvarchar255商品圖片PriceFloat11商品原價(jià)special_priceFloat11商品特價(jià)BidFloat11商品進(jìn)價(jià)Pidvarchar255商品所在分類Descriptionvarchar255商品描述Create_timevarchar255商品添加時(shí)間表4-2管理員信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255管理員的idNamevarchar255管理員名稱Srcvarchar255管理員頭像PasswordVarchar255管理員密碼create_timeVarchar255注冊(cè)時(shí)間DescriptionVarchar255管理員簡(jiǎn)介表4-3評(píng)論信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255評(píng)論的idDescriptionvarchar255評(píng)論的內(nèi)容GidVarChar255商品iduidVarchar255用戶idnum_zanNumber255贊的數(shù)量num_pingNumber255評(píng)論數(shù)量PidVarchar255上級(jí)評(píng)論create_timeVarchar255評(píng)論時(shí)間SortNumber255排序表4-4用戶信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255用戶的idNamevarchar255用戶名稱Srcvarchar255用戶頭像Descriptionvarchar255用戶個(gè)人簡(jiǎn)介PasswordVarchar255用戶密碼表4-5商品分類信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255分類的idLabelvarchar255分類名稱Srcvarchar255分類圖片地址SortNumber255分類排序ChildrenVarchar255二級(jí)分類表4-6輪播圖信息表列名數(shù)據(jù)類型長(zhǎng)度說(shuō)明idvarchar255輪播圖的idNamevarchar255輪播圖名稱Imgvarchar255輪播圖圖片地址SortNumber255輪播圖排序17334.5精靈烘培商品管理平臺(tái)的數(shù)據(jù)庫(kù)設(shè)計(jì)數(shù)據(jù)庫(kù)采用mongonDB,更改數(shù)據(jù)庫(kù)存儲(chǔ)地址更直接的找到數(shù)據(jù)庫(kù)，方便直接從文件夾里查看。在終端里執(zhí)行mongod--configmongondb.config,運(yùn)行你當(dāng)前存儲(chǔ)地址的數(shù)據(jù)庫(kù)進(jìn)行存儲(chǔ)數(shù)據(jù)。這個(gè)數(shù)據(jù)庫(kù)方便地方在于可以對(duì)數(shù)組直接進(jìn)行處理，在數(shù)據(jù)處理方面極其方便。管理商品系統(tǒng)管理員用戶管理購(gòu)買(mǎi)1n1管理商品系統(tǒng)管理員用戶管理購(gòu)買(mǎi)1n1nmnId名稱密碼商品名稱價(jià)格描述名稱頭像Id圖片圖4-4主體E-R圖五、精靈烘培商品管理平臺(tái)調(diào)試5.1精靈烘培商品管理平臺(tái)模塊1.用戶登錄模塊進(jìn)行用戶登錄，對(duì)后臺(tái)發(fā)送請(qǐng)求，判斷輸入的用戶賬號(hào)是否存在。對(duì)其進(jìn)行用戶查詢。如果該用戶賬號(hào)存在，就判斷密碼是否正確，正確。瀏覽器sessionStrong存儲(chǔ)當(dāng)前用戶信息。即登錄成功。系統(tǒng)的登錄界面如圖5-1所示。圖5-1系統(tǒng)登錄頁(yè)面實(shí)現(xiàn)圖系統(tǒng)的測(cè)試結(jié)果如表5-1所示。表5-1用戶登錄功能模塊測(cè)試用例表驗(yàn)收項(xiàng)操作步驟預(yù)期結(jié)果實(shí)際結(jié)果是否通過(guò)用戶登錄功能以正確的用戶登錄，驗(yàn)證權(quán)限是否對(duì)應(yīng)正常登陸獲取權(quán)限與預(yù)期結(jié)果一致通過(guò)以錯(cuò)誤的用戶進(jìn)行登錄，驗(yàn)證是否可以判斷出用戶出錯(cuò)可進(jìn)行驗(yàn)證，確保安全與預(yù)期結(jié)果一致通過(guò)用戶注冊(cè)模塊將當(dāng)前用戶身份賬號(hào)進(jìn)行判斷，存在就不能再次注冊(cè)。否則判斷輸入信息是否合適，判斷核實(shí)后，存儲(chǔ)到數(shù)據(jù)庫(kù)。系統(tǒng)的注冊(cè)界面如圖5-2所示：圖5-2系統(tǒng)注冊(cè)頁(yè)面實(shí)現(xiàn)圖表5-2用戶注冊(cè)功能模塊測(cè)試用例表驗(yàn)收項(xiàng)操作步驟預(yù)期結(jié)果實(shí)際結(jié)果是否通過(guò)用戶注冊(cè)功能以正確的用戶信息注冊(cè)，驗(yàn)證注冊(cè)是否成功正常注冊(cè)添加用戶與預(yù)期結(jié)果一致通過(guò)以錯(cuò)誤的用戶郵箱進(jìn)行注冊(cè)，驗(yàn)證是否可以判斷出用戶賬戶出錯(cuò)可進(jìn)行驗(yàn)證，確保安全與預(yù)期結(jié)果一致通過(guò)以不一致的密碼進(jìn)行注冊(cè)，驗(yàn)證是否可以判斷出用戶密碼出錯(cuò)可進(jìn)行驗(yàn)證，確保安全與預(yù)期結(jié)果一致通過(guò)商品信息模塊展示商品信息，以及對(duì)商品的各項(xiàng)字段進(jìn)行依次設(shè)置，獲取所需信息，美化前臺(tái)頁(yè)面。系統(tǒng)的商品信息界面如圖5-3所示。圖5-3系統(tǒng)商品信息界面實(shí)現(xiàn)圖表5-3商品管理功能模塊測(cè)試用例表驗(yàn)收項(xiàng)操作步驟預(yù)期結(jié)果實(shí)際結(jié)果是否通過(guò)商品管理功能添加刪除商品。成功修改商品狀態(tài)與預(yù)期結(jié)果一致通過(guò)修改商品信息成功修改商品信息與預(yù)期結(jié)果一致通過(guò)管理員登錄模塊同用戶登錄一樣，只不過(guò)為了數(shù)據(jù)安全，管理員會(huì)存在過(guò)期管理員，所以每個(gè)管理員都有個(gè)黑白名單管理。系統(tǒng)的測(cè)試結(jié)果如表5-4所示。表5-4管理員權(quán)限功能模塊測(cè)試用例表驗(yàn)收項(xiàng)操作步驟預(yù)期結(jié)果實(shí)際結(jié)果是否通過(guò)管理員權(quán)限功能以正確的管理員用戶，驗(yàn)證權(quán)限是否對(duì)應(yīng)正常登陸獲取權(quán)限與預(yù)期結(jié)果一致通過(guò)以錯(cuò)誤的管理員進(jìn)行登錄，驗(yàn)證是否可以判斷出用戶出錯(cuò)可進(jìn)行驗(yàn)證，確保安全與預(yù)期結(jié)果一致通過(guò)結(jié)語(yǔ)本文論述了一個(gè)基于Vue開(kāi)發(fā)的精靈烘培商品管理平臺(tái)，可以說(shuō)實(shí)現(xiàn)了一個(gè)基本的電子商務(wù)網(wǎng)站該有的功能也突出了該有的特色與優(yōu)點(diǎn)。精靈烘培商品管理平臺(tái)前臺(tái)頁(yè)面共有以下基本功能模塊：用戶的注冊(cè)、用戶的登錄、前臺(tái)商品的展示、前臺(tái)商品分類樓層的渲染、商品詳情的查詢、用戶添加商品和查看商品評(píng)論和選購(gòu)商品、用戶下達(dá)訂單、進(jìn)行商品結(jié)算；后臺(tái)是管理員的登錄、注冊(cè)以及黑白名單管理過(guò)往管理員信息，還有修改密碼功能，增加數(shù)據(jù)庫(kù)安全性。不論是在前臺(tái)還是后臺(tái)都使用了SESSION來(lái)保存用戶信息以確保賬戶在線，同時(shí)采用md5加密用戶密碼來(lái)保證信息安全。首頁(yè)的查詢功能對(duì)數(shù)據(jù)庫(kù)進(jìn)行模糊查詢，匹配包含這些數(shù)據(jù)的商品，可以使用戶快速查找想要的烘培食品。請(qǐng)求使用到了axios技術(shù)，因axios不需要刷新整個(gè)頁(yè)面更新數(shù)據(jù)。中臺(tái)交互頁(yè)面使用的都是vue文件，也可以理解為都是根組件下的組件，都可以通過(guò)路由實(shí)現(xiàn)引入，整體框架還是MVVM。同時(shí)，Vue的單頁(yè)面開(kāi)發(fā)使得用戶體驗(yàn)良好。網(wǎng)站的數(shù)據(jù)庫(kù)使用mongoDB，主要建立了6張表，分別包括用來(lái)管理管理員信息的管理員管理表、用來(lái)管理用戶信息的用戶信息管理、用來(lái)管理烘培商品的商品分類管理、用來(lái)管理烘培商品的商品詳情表以及用戶購(gòu)物之后存儲(chǔ)用戶與對(duì)應(yīng)商品的訂單表，他們之間互相關(guān)聯(lián)、密不可分。精靈烘培商品管理平臺(tái)的特色就是操作簡(jiǎn)單明了，優(yōu)點(diǎn)就是界面簡(jiǎn)潔大氣。整個(gè)精靈烘培商品管理平臺(tái)在具有所有電商平臺(tái)應(yīng)該有的同時(shí)也能保證簡(jiǎn)潔但不簡(jiǎn)單。在整個(gè)系統(tǒng)的開(kāi)發(fā)過(guò)程中，克服一個(gè)個(gè)新的難題，增長(zhǎng)自己的見(jiàn)識(shí)，四年所學(xué)在這次進(jìn)行一次完整的融合。對(duì)于問(wèn)題的理解能力和分析能力有了進(jìn)一步提升?？傊?，論文的設(shè)計(jì)的實(shí)現(xiàn)對(duì)綜合能力有著前所未有的提升。

參考文獻(xiàn)[1]肖融,俞淑,趙琴.我國(guó)面包行業(yè)質(zhì)量調(diào)研報(bào)告[J].質(zhì)量與標(biāo)準(zhǔn)化,2017(08):41-44.[2]何昱澤.面向大數(shù)據(jù)處理的分布式機(jī)器學(xué)習(xí)算法編排系統(tǒng)的研究與實(shí)現(xiàn)[D].北京郵電大學(xué),2017.[3]鄺洪勝.基于Python的電商導(dǎo)購(gòu)APP設(shè)計(jì)與實(shí)現(xiàn)[D].華南理工大學(xué),2015.[4]蔡俊.烘焙食品企業(yè)創(chuàng)業(yè)中的市場(chǎng)營(yíng)銷(xiāo)戰(zhàn)略[D].上海海事大學(xué),2005.[5]孟曙艷.電子商務(wù)信息管理系統(tǒng)數(shù)據(jù)的安全性[J].電子商務(wù),2017(12):51-52.[6]溫玉宇.大數(shù)據(jù)時(shí)代商務(wù)管理的現(xiàn)狀及發(fā)展趨勢(shì)研究[J].現(xiàn)代營(yíng)銷(xiāo)(下旬刊),2017(09):42.[7]成翔旻.電子商務(wù)對(duì)財(cái)會(huì)工作的影響及對(duì)策[J].電子商務(wù),2017(06):69-70.[8]吉文帥.基于跨境電子商務(wù)的現(xiàn)代物流信息管理系統(tǒng)研究[J].電腦迷,2017(05):194-195.[9]宋曉姣.電子商務(wù)輔助教學(xué)管理系統(tǒng)需求分析[J].電腦知識(shí)與技術(shù),2017,13(01):286-288.[10]楊立飛.H公司在中國(guó)烘焙業(yè)市場(chǎng)的營(yíng)銷(xiāo)策略研究[D].蘭州大學(xué),2010.[11]宋曉姣.校園網(wǎng)環(huán)境下構(gòu)建電子商務(wù)輔助教學(xué)管理系統(tǒng)的探討[J].電子商務(wù)，2016,26(08):78-79.[12]楊冬玲.汽車(chē)制造企業(yè)中的電子商務(wù)供應(yīng)鏈管理系統(tǒng)探討[J].科技展望,2016,26(19):181-182.[13]劉立豪,余佳.O2O背景下的旅行社電子商務(wù)后臺(tái)管理系統(tǒng)開(kāi)發(fā)研究[J].知識(shí)經(jīng)濟(jì),2016(13):45-46.[14]閆婧.企業(yè)電子商務(wù)信息系統(tǒng)的建模分析與設(shè)計(jì)[J].南京廣播電視大學(xué)學(xué)報(bào),2016(02):91-93.[13]廖文華.基于MongoDB數(shù)據(jù)庫(kù)的衛(wèi)星廣播電視監(jiān)測(cè)系統(tǒng)[J].西部廣播電視,2017(04):196-198.[14]何昱澤.面向大數(shù)據(jù)處理的分布式機(jī)器學(xué)習(xí)算法編排系統(tǒng)的研究與實(shí)現(xiàn)[D].北京郵電大學(xué),2017.[15]楊志強(qiáng).企業(yè)應(yīng)用框架的設(shè)計(jì)與實(shí)現(xiàn)[D].華南理工大學(xué),2014.致謝從小父母教導(dǎo)的就是感謝身邊的每一個(gè)人，任何一個(gè)人都會(huì)帶給你很多東西。指導(dǎo)老師更是我應(yīng)該感謝的那一個(gè)人，不僅僅是畢業(yè)設(shè)計(jì)方面的指導(dǎo)，對(duì)我今后的影響也意義深遠(yuǎn)。雖然整個(gè)畢業(yè)設(shè)計(jì)是由我一個(gè)人完成的，但這其中老師對(duì)我指導(dǎo)起到了很大作用。具有不可磨滅的意義。當(dāng)然了，還有好多同學(xué)也在畢業(yè)設(shè)計(jì)期間幫助我，他們的一些獨(dú)特見(jiàn)解也對(duì)我的幫助很大，同時(shí)，他們樂(lè)于助人的精神也是最值得我學(xué)習(xí)的，為有這樣的老師和同學(xué)感到榮幸。從一開(kāi)始的開(kāi)題等事項(xiàng)時(shí)老師就非常關(guān)注我們的進(jìn)度，在后來(lái)的中期檢查和多次修改中也能看出來(lái)老師認(rèn)真地態(tài)度，對(duì)我們不僅有信心還有耐心，這種品質(zhì)讓我對(duì)老師這個(gè)職業(yè)更加敬重。而且因?yàn)樽约旱囊恍┰蚴沟迷谛r(shí)間不穩(wěn)定，那段時(shí)間老師可是操碎了心。甚至語(yǔ)音通話來(lái)幫助我們完成畢業(yè)設(shè)計(jì)。這種敬業(yè)精神和對(duì)學(xué)生負(fù)責(zé)的態(tài)度才是真正的人民教師。千言萬(wàn)語(yǔ)也道不盡要感謝的人，但也要在這里祝愿他們?nèi)f事如意，開(kāi)開(kāi)心心。附錄1.后臺(tái)管理員管理界面（src\components\page\admin\adminadd.vue）<template><el-containerstyle="height:100%"><!--頂部--><el-headerstyle="height:50px;"><Header></Header></el-header><!--左邊--><el-container><el-asidestyle="height:100%"><el-menu:router="true"><!--系統(tǒng)管理--><el-submenuindex="1"><templateslot="title"><iclass="el-icon-location"></i><span>系統(tǒng)管理</span></template><el-menu-itemindex="banner">輪播管理</el-menu-item><el-menu-itemindex="system">系統(tǒng)配置管理</el-menu-item></el-submenu><!--銷(xiāo)售管理--><el-submenuindex="2"><templateslot="title"><iclass="el-icon-location"></i><span>銷(xiāo)售管理</span></template><el-menu-itemindex="category">分類管理</el-menu-item><el-menu-itemindex="goods">商品管理</el-menu-item></el-submenu><!--會(huì)員管理--><el-submenuindex="3"><templateslot="title"><iclass="el-icon-location"></i><span>會(huì)員管理</span></template><el-menu-itemindex="admin">管理員管理</el-menu-item><el-menu-itemindex="user">用戶管理</el-menu-item></el-submenu><!--評(píng)論管理--><el-submenuindex="4"><templateslot="title"><iclass="el-icon-location"></i><span>評(píng)論管理</span></template><el-menu-itemindex="anonymous">匿名評(píng)論</el-menu-item><el-menu-itemindex="comment">用戶評(píng)論</el-menu-item></el-submenu></el-menu></el-aside><el-container><!--正文--><el-mainstyle="height:100%"><divid="admin"><el-tabsv-model="activeName"><el-tab-panelabel="查看管理員"name="show"><el-form:inline="true"><el-form-itemlabel="搜索"><el-inputv-model="name"placeholder="請(qǐng)輸入需要查找的管理員名稱"></el-input></el-form-item><el-form-item><el-buttonicon="el-icon-search"circle@click="search"></el-button></el-form-item></el-form><el-table:data="tableData"@selection-change="Change"><el-table-columnprop="name"label="管理員名稱"align="center"></el-table-column><el-table-columnprop="create_time"label="添加日期"align="center"></el-table-column><el-table-columnprop="sort"label="管理員排序"align="center"></el-table-column><el-table-columnlabel="操作"width="100"align="center"><templateslot-scope="scope"><el-button@click="del(scope.row)"type="text"size="small">刪除</el-button></template></el-table-column></el-table><el-rowtype="flex"justify="center"><el-paginationbackgroundlayout="prev,pager,next,jumper,->":total=this.tot:size=pageSize@current-change="pageChange"></el-pagination></el-row></el-tab-pane><el-tab-panelabel="添加管理員"name="add"><el-form:inline="false":model="form"class="demo-form-inline":rules="rule"ref="form"><el-form-itemlabel="管理員名稱"prop="name"><el-inputv-model=""placeholder="商品名稱"></el-input></el-form-item><el-form-itemlabel="管理員頭像"prop="src"><el-uploadclass="avatar-uploader"action="/upload":show-file-list="false":on-success="Success"><imgv-if="imageUrl":src="imageUrl"class="avatar"><iv-elseclass="el-icon-plusavatar-uploader-icon"></i></el-upload></el-form-item><el-form-itemlabel="管理員排序"prop="sort"><el-inputv-model.Number="form.sort"type="Number"placeholder="排序"></el-input></el-form-item><el-form-item><el-buttontype="primary"@click="submit('form')">提交</el-button></el-form-item></el-form></el-tab-pane></el-tabs></div></el-main></el-container></el-container></el-container></template><script>importHeaderfrom'@/components/conadmin/header'exportdefault{components:{Header},data(){return{headCon:'21',activeName:'show',url:'/api/admin',tableData:[],name:'',tot:5,page:1,pageSize:1,imageUrl:'',form:{name:'',src:'',sort:''},rule:{name:[{required:true,message:'請(qǐng)輸入管理員名稱',trigger:'blur'}],}}},methods:{fetchData(){this.axios.get(this.url,{params:{p:this.page,size:this.pageSize}}).then(res=>{if(res.data.status==='ok'){this.tableData=res.data.data;this.tot=res.data.tot;this.$message({message:'請(qǐng)求成功',type:'success',showClose:true})}else{this.$message({message:'請(qǐng)求失敗',type:'error',showClose:true})}}).catch(err=>{this.$message({message:'請(qǐng)求失敗',type:'error',showClose:true});})},pageChange(p){this.page=p;this.fetchData();},Change(v){this.ids=v.map((value)=>{returnvalue._id})},del(obj){this.$confirm('此操作將永久刪除該商品,是否繼續(xù)?','提示',{confirmButtonText:'確定',cancelButtonText:'取消',type:'warning'}).then(()=>this.axios.delete(this.url+'/'+obj._id).then(res=>{if(res.data.status==='ok'){this.fetchData();this.$message({message:'成功',type:'success'})}else{this.$message({message:'失敗',type:'error'})}}).catch()).catch(()=>{this.$message({type:'info',message:'已取消刪除'})})},search(){this.fetchData();},