-第1章緒論1.1研究背景與意義根據(jù)市場(chǎng)調(diào)研數(shù)據(jù)，咖啡消費(fèi)已經(jīng)從單純的飲品消費(fèi)向“咖啡文化”消費(fèi)轉(zhuǎn)型，咖啡廳不僅是休閑場(chǎng)所，也是社交、工作、娛樂(lè)的綜合空間。這種轉(zhuǎn)變帶來(lái)了咖啡行業(yè)和相關(guān)服務(wù)平臺(tái)的快速發(fā)展REF_Ref15229\r\h[1]。隨著互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展和智能手機(jī)的普及，消費(fèi)者對(duì)線上點(diǎn)單、支付、預(yù)訂等服務(wù)的需求越來(lái)越高。通過(guò)設(shè)計(jì)一個(gè)基于Vue框架的咖啡廳網(wǎng)站，可以為顧客提供更加便捷的線上訂購(gòu)和支付功能，減少等待時(shí)間，提升服務(wù)效率。顧客可以通過(guò)網(wǎng)站快速選擇咖啡、完成支付，并選擇合適的配送方式或預(yù)約到店消費(fèi)，提升整體的用戶體驗(yàn)。1.2國(guó)內(nèi)外現(xiàn)狀在國(guó)內(nèi)，隨著咖啡文化的普及和互聯(lián)網(wǎng)技術(shù)的快速發(fā)展，越來(lái)越多的咖啡廳開(kāi)始通過(guò)在線平臺(tái)提供服務(wù)?，F(xiàn)有的咖啡廳網(wǎng)站或應(yīng)用程序主要聚焦于在線點(diǎn)單、外賣配送和會(huì)員管理等功能，但在用戶體驗(yàn)、功能完善性以及后臺(tái)管理效率方面仍存在不足。近年來(lái)，基于Vue框架的前端開(kāi)發(fā)逐漸成為主流，其高效、靈活的特性為咖啡廳網(wǎng)站的開(kāi)發(fā)提供了新的技術(shù)解決方案。國(guó)內(nèi)學(xué)者和企業(yè)開(kāi)始關(guān)注如何利用Vue等技術(shù)構(gòu)建功能完善、用戶體驗(yàn)優(yōu)良的咖啡廳服務(wù)平臺(tái)，但相關(guān)研究和實(shí)踐仍處于探索階段，尚未形成成熟的體系。在國(guó)外，咖啡文化歷史悠久，咖啡廳在線服務(wù)平臺(tái)的發(fā)展相對(duì)成熟。例如，星巴克、Costa等國(guó)際知名咖啡品牌通過(guò)其官方網(wǎng)站和移動(dòng)應(yīng)用程序提供了豐富的在線服務(wù)，包括在線點(diǎn)單、會(huì)員積分、個(gè)性化推薦等。這些平臺(tái)通常采用先進(jìn)的前后端分離架構(gòu)和微服務(wù)技術(shù)，能夠支持高并發(fā)訪問(wèn)和復(fù)雜業(yè)務(wù)邏輯。然而，國(guó)外研究更多集中于用戶體驗(yàn)優(yōu)化、個(gè)性化推薦算法和大數(shù)據(jù)分析等方面，而對(duì)基于Vue等框架的咖啡廳服務(wù)平臺(tái)的系統(tǒng)性研究相對(duì)較少。因此，結(jié)合Vue技術(shù)開(kāi)發(fā)專注于本地化服務(wù)的咖啡廳網(wǎng)站，具有重要的創(chuàng)新意義和實(shí)踐價(jià)值。1.3研究目標(biāo)本系統(tǒng)旨在解決當(dāng)前咖啡廳網(wǎng)站中信息更新不及時(shí)、用戶體驗(yàn)差、功能單一等問(wèn)題。通過(guò)對(duì)咖啡廳服務(wù)流程的數(shù)字化管理與優(yōu)化，提升平臺(tái)的功能完整性和用戶體驗(yàn)。預(yù)期目標(biāo)為：提供基于咖啡名稱、咖啡類別、口味、價(jià)格等多維度的搜索與篩選功能，幫助用戶快速找到感興趣的咖啡產(chǎn)品，提升信息檢索的效率。打造一個(gè)簡(jiǎn)潔、直觀且易于操作的用戶界面，提升用戶體驗(yàn)，確保用戶可以輕松瀏覽咖啡詳情、在線下單、查看訂單及修改個(gè)人信息。構(gòu)建一個(gè)集咖啡展示、在線購(gòu)買、到店取物、用戶互動(dòng)于一體的綜合平臺(tái)，實(shí)現(xiàn)咖啡產(chǎn)品的集中管理和精細(xì)化分類，確保咖啡信息能及時(shí)更新并準(zhǔn)確傳遞給用戶。優(yōu)化購(gòu)買流程與數(shù)據(jù)分析，提高信息的時(shí)效性和準(zhǔn)確性，改善購(gòu)買流程與獲取方式，增強(qiáng)用戶的便捷性與滿意度。同時(shí)，為商家提供高效的訂單管理、會(huì)員管理、庫(kù)存管理等工具，提升平臺(tái)整體的運(yùn)營(yíng)效率和管理水平。

第2章需求分析2.1業(yè)務(wù)需求（1）用戶權(quán)限業(yè)務(wù)需求：提供用戶注冊(cè)、登錄、密碼找回等功能，確保用戶能夠順利進(jìn)入平臺(tái)。用戶可以查看和修改個(gè)人信息，包括昵稱、頭像、聯(lián)系方式、收貨地址等，保持個(gè)人資料的更新。用戶可以查看自己的訂單歷史、當(dāng)前訂單狀態(tài)以及收藏的咖啡產(chǎn)品，方便管理個(gè)人消費(fèi)記錄。（2）咖啡產(chǎn)品管理業(yè)務(wù)需求：用戶可以瀏覽所有咖啡產(chǎn)品的詳細(xì)信息，包括咖啡名稱、類別、價(jià)格、原料、口感描述等。支持按咖啡類別（如美式咖啡、拿鐵、冷萃咖啡等）進(jìn)行篩選，幫助用戶根據(jù)需求選擇咖啡。（3）購(gòu)買與訂單管理業(yè)務(wù)需求：用戶可以在線購(gòu)買咖啡（4）推薦與互動(dòng)業(yè)務(wù)需求：基于用戶的購(gòu)買歷史和興趣，平臺(tái)可推薦相關(guān)咖啡產(chǎn)品，提高用戶的購(gòu)買體驗(yàn)。用戶可以對(duì)咖啡產(chǎn)品進(jìn)行評(píng)價(jià)和打分，分享自己的消費(fèi)體驗(yàn)。（5）商家管理需求：商家可以添加、編輯、刪除咖啡產(chǎn)品信息，包括咖啡的基本信息、價(jià)格、庫(kù)存數(shù)量等。（6）數(shù)據(jù)統(tǒng)計(jì)與分析需求：商家可以查看銷售數(shù)據(jù)、用戶消費(fèi)行為等統(tǒng)計(jì)信息，為經(jīng)營(yíng)決策提供支持。平臺(tái)提供庫(kù)存管理功能，幫助商家及時(shí)補(bǔ)充咖啡原料，避免庫(kù)存不足。通過(guò)以上業(yè)務(wù)需求設(shè)計(jì)，“小滿”咖啡廳網(wǎng)站能夠?yàn)橛脩籼峁┍憬莸目Х荣?gòu)買體驗(yàn)，同時(shí)為商家提供高效的管理工具，提升整體運(yùn)營(yíng)效率和服務(wù)質(zhì)量。2.2功能性需求2.2.1用例概述在圖2.1高層用例圖中抽取了滿足用戶基本業(yè)務(wù)需求的基本用例。這些用例可以從訂購(gòu)咖啡、瀏覽咖啡三個(gè)方面完成整個(gè)咖啡廳網(wǎng)站的正常運(yùn)作。圖2.1高層用例圖用例摘要描述如表2.1所示。表2.1用例摘要描述用例標(biāo)識(shí)（UC）用例名稱摘要描述1登錄使用系統(tǒng)前的身份驗(yàn)證。2注冊(cè)讀者進(jìn)行系統(tǒng)注冊(cè)，申請(qǐng)系統(tǒng)使用權(quán)。3瀏覽咖啡用戶可以在線瀏覽咖啡4管理咖啡管理員可以對(duì)咖啡信息進(jìn)行增刪改查操作。5管理公告管理員可以對(duì)公告信息進(jìn)行增刪改查操作。6管理用戶管理員可以對(duì)用戶信息進(jìn)行增刪改查操作。7管理訂單管理員可以對(duì)訂單信息進(jìn)行處理。8訂購(gòu)咖啡用戶可以選擇咖啡進(jìn)行訂購(gòu)。9統(tǒng)計(jì)數(shù)據(jù)管理員可以查看到系統(tǒng)的用戶數(shù)量、咖啡數(shù)量等。10查看公告用戶可以查看系統(tǒng)公告。11管理個(gè)人信息管理員可以對(duì)個(gè)人信息進(jìn)行管理。2.2.2用例描述（1）管理咖啡用例管理員可以通過(guò)管理咖啡用例對(duì)咖啡進(jìn)行維護(hù)，包括對(duì)咖啡的增刪改查。管理咖啡用例圖如圖2.2所示。圖2.2管理咖啡用例圖管理咖啡用例描述如表2.2所示。表2.2管理咖啡用例用例標(biāo)識(shí)4.1用例名稱管理咖啡參與者管理員前置條件已經(jīng)以管理員身份登錄。后置條件在咖啡表中添加或修改一條記錄。用例概述管理員可以對(duì)咖啡進(jìn)行添加?；臼录?.管理員在管理咖啡主界面選取添加咖啡項(xiàng)。2.系統(tǒng)顯示添加咖啡界面。3.管理員輸入咖啡名稱、咖啡內(nèi)容、咖啡圖片、分類等信息后，提交添加請(qǐng)求。4.系統(tǒng)檢查輸入信息的有效性。5.系統(tǒng)顯示添加咖啡成功。備選事件流4a系統(tǒng)驗(yàn)證上傳圖片格式是否正確，若無(wú)符合規(guī)定轉(zhuǎn)入步驟3。備注若管理員未上傳圖片，系統(tǒng)會(huì)將其設(shè)置為默認(rèn)封面。（2）管理用戶用例管理員能夠利用管理用戶用例來(lái)維護(hù)用戶信息，涵蓋用戶的增加、刪除、修改和查詢等操作。管理用戶用例圖詳見(jiàn)圖2.3。圖2.3管理用戶用例圖管理用戶用例描述如表2.3所示。表2.3管理用戶用例用例標(biāo)識(shí)6.1用例名稱管理用戶參與者管理員續(xù)表2.3管理用戶用例前置條件已經(jīng)以管理員身份登錄。后置條件在用戶表中添加或修改一條記錄。用例概述管理員可以對(duì)用戶信息進(jìn)行添加?；臼录?.管理員在用戶管理界面中，選擇新增用戶信息。2.系統(tǒng)立即呈現(xiàn)創(chuàng)建用戶界面。3.接著，管理員填寫(xiě)用戶名、密碼、上傳頭像、挑選性別等詳細(xì)信息，并提交添加用戶請(qǐng)求。4.系統(tǒng)隨即對(duì)輸入的詳細(xì)信息執(zhí)行有效性檢驗(yàn)。5.一旦系統(tǒng)驗(yàn)證信息準(zhǔn)確無(wú)誤，便會(huì)出現(xiàn)添加用戶成功的提示信息。備選事件流4a系統(tǒng)驗(yàn)證上傳頭像格式是否正確，若無(wú)符合規(guī)定轉(zhuǎn)入步驟3。備注若管理員未上傳頭像，系統(tǒng)會(huì)將其設(shè)置為默認(rèn)頭像。（3）管理公告用例管理員能夠利用管理公告用例圖，執(zhí)行維護(hù)公告信息的相關(guān)任務(wù)，涵蓋了添加、刪除、修改以及查詢公告等各項(xiàng)操作。管理公告用例圖呈現(xiàn)于圖2.4。圖2.4管理公告用例圖管理公告用例描述如表2.4所示。表2.4管理公告用例用例標(biāo)識(shí)5.1用例名稱管理公告參與者管理員前置條件已經(jīng)以管理員身份登錄。后置條件在公告表中添加或修改一條記錄。用例概述管理員可以對(duì)公告信息進(jìn)行添加?；臼录?.管理員在公告管理的主頁(yè)上，選擇創(chuàng)建新的公告。2.系統(tǒng)隨即展示出發(fā)布公告的界面。3.管理員輸入公告的標(biāo)題，撰寫(xiě)正文內(nèi)容，并提交申請(qǐng)以添加公告。4.系統(tǒng)對(duì)提交的信息執(zhí)行有效性檢查。5.一旦系統(tǒng)確認(rèn)信息準(zhǔn)確無(wú)誤，就會(huì)顯示公告已成功發(fā)布的提示。備選事件流4a系統(tǒng)驗(yàn)證公共內(nèi)容若為空則提示“重新提交”，并轉(zhuǎn)入步驟3。備注無(wú)（4）管理訂單用例利用管理訂單用例，管理員能夠執(zhí)行訂單信息的維護(hù)工作，其用例圖展示于圖2.5。圖2.5管理訂單用例圖管理訂單用例描述如表2.5所示。表2.5管理訂單用例用例標(biāo)識(shí)10.1用例名稱管理訂單參與者管理員前置條件已經(jīng)以管理員身份登錄。后置條件在數(shù)據(jù)庫(kù)表中修改一條訂單信息。用例概述管理員可以對(duì)訂單信息進(jìn)行維護(hù)?；臼录?.管理員登錄后臺(tái)，點(diǎn)擊進(jìn)入訂單管理界面。2.顯示訂單管理界面的系統(tǒng)。3.管理員確認(rèn)并更改訂單詳情后提交。4.系統(tǒng)對(duì)輸入的詳情進(jìn)行有效性驗(yàn)證。5.系統(tǒng)展示訂單已成功修改的信息。備選事件流4a系統(tǒng)驗(yàn)證訂單若為空則提示“重新提交”，并轉(zhuǎn)入步驟3。備注無(wú)（5）統(tǒng)計(jì)數(shù)據(jù)用例該系統(tǒng)具備統(tǒng)計(jì)功能，能夠搜集包括用戶資料和咖啡庫(kù)存在內(nèi)的多種數(shù)據(jù)，并在管理界面以圖表形式清晰呈現(xiàn)。數(shù)據(jù)統(tǒng)計(jì)的用例圖展示于圖2.6。圖2.6統(tǒng)計(jì)數(shù)據(jù)用例圖統(tǒng)計(jì)數(shù)據(jù)用例描述如表2.6所示。

表2.6統(tǒng)計(jì)數(shù)據(jù)用例用例標(biāo)識(shí)11.1用例名稱統(tǒng)計(jì)數(shù)據(jù)參與者管理員前置條件已經(jīng)以管理員身份登錄。后置條件在后臺(tái)首頁(yè)添加圖表及數(shù)據(jù)。用例概述管理員可以查看數(shù)據(jù)統(tǒng)計(jì)及圖表信息?；臼录?.管理員登錄后臺(tái)系統(tǒng)并進(jìn)入首頁(yè)。2.顯示在系統(tǒng)界面上的是當(dāng)前用戶數(shù)量以及咖啡的數(shù)量。3.系統(tǒng)立刻根據(jù)用戶和咖啡數(shù)量展示出餅圖。備選事件流3a若系統(tǒng)為統(tǒng)計(jì)到數(shù)據(jù)，則隱藏圖表的顯示。備注所有圖表均由Echarts組件庫(kù)實(shí)現(xiàn)2.3非功能性需求準(zhǔn)確性：在業(yè)務(wù)流程中，必須完全消除所有可能的錯(cuò)誤。穩(wěn)固性：面對(duì)系統(tǒng)故障，必須實(shí)施有效的數(shù)據(jù)保護(hù)策略，保證數(shù)據(jù)的完整性不受損害，并能夠使系統(tǒng)恢復(fù)到正常工作狀態(tài)。效能：系統(tǒng)在處理日常業(yè)務(wù)時(shí)，其響應(yīng)時(shí)間應(yīng)限制在2秒之內(nèi)；即便在業(yè)務(wù)高峰時(shí)段，響應(yīng)時(shí)間也不應(yīng)超過(guò)5秒。兼容度：系統(tǒng)應(yīng)能在Windows10或更新版本的操作系統(tǒng)上順暢運(yùn)行。2.4系統(tǒng)運(yùn)行開(kāi)發(fā)環(huán)境本網(wǎng)站的相關(guān)開(kāi)發(fā)與運(yùn)行環(huán)境如表2.7所示。表2.7網(wǎng)站開(kāi)發(fā)與運(yùn)行環(huán)境序號(hào)項(xiàng)目/類別開(kāi)發(fā)環(huán)境運(yùn)行環(huán)境1操作系統(tǒng)Windows10Node182編程語(yǔ)言Vue,JavaScriptNode183開(kāi)發(fā)工具VSCodeNode184數(shù)據(jù)模擬json-serverNode182.5系統(tǒng)可行性分析2.5.1技術(shù)可行性分析JavaScript以其靈活性和高效性能，確保了系統(tǒng)功能的構(gòu)建和優(yōu)化。作為服務(wù)器端運(yùn)行環(huán)境的Node.js，為系統(tǒng)賦予了強(qiáng)大的數(shù)據(jù)處理和高并發(fā)處理能力。作為開(kāi)發(fā)環(huán)境的VSCode，其友好的用戶界面和豐富的插件，顯著提升了開(kāi)發(fā)效率。json-server在沒(méi)有后端數(shù)據(jù)庫(kù)的情況下，支持前端開(kāi)發(fā)和測(cè)試，模擬數(shù)據(jù)。這些技術(shù)的結(jié)合，為系統(tǒng)的開(kāi)發(fā)和運(yùn)行提供了堅(jiān)實(shí)的技術(shù)基礎(chǔ)，確保了技術(shù)實(shí)現(xiàn)的可行性。2.5.2時(shí)間可行性分析預(yù)計(jì)在未來(lái)的2至3周內(nèi)，我們將完成需求分析、定義系統(tǒng)功能、構(gòu)建技術(shù)框架以及設(shè)計(jì)數(shù)據(jù)庫(kù)模型。接下來(lái)，計(jì)劃分階段用時(shí)8至10周開(kāi)發(fā)資訊模塊、社區(qū)模塊和公告管理模塊。最終，我們打算用3周時(shí)間進(jìn)行功能測(cè)試、安全測(cè)試、性能測(cè)試，并根據(jù)用戶反饋進(jìn)行相應(yīng)的優(yōu)化。從時(shí)間規(guī)劃上來(lái)看，這個(gè)方案是完全可行的。2.5.3市場(chǎng)可行性分析隨著互聯(lián)網(wǎng)的快速發(fā)展和人們對(duì)咖啡消費(fèi)體驗(yàn)需求的提升，咖啡廳在線服務(wù)平臺(tái)逐漸成為連接用戶與商家的重要橋梁。然而，現(xiàn)有的咖啡廳服務(wù)平臺(tái)在用戶體驗(yàn)、功能完善性以及后臺(tái)管理效率方面仍存在諸多不足。因此，開(kāi)發(fā)這樣一個(gè)系統(tǒng)在市場(chǎng)需求上是實(shí)際可行的。第3章系統(tǒng)設(shè)計(jì)3.1系統(tǒng)功能模塊設(shè)計(jì)調(diào)研網(wǎng)上同類系統(tǒng)功能，要求本系統(tǒng)包括用戶、商家2種角色。用戶端功能有：登錄/注冊(cè)、咖啡列表瀏覽、咖啡分類查詢、查看產(chǎn)品介紹、查看咖啡教程、加入購(gòu)物車、在線購(gòu)買、生成到店取物驗(yàn)證碼、收藏咖啡信息、查看店鋪介紹、查看店鋪聯(lián)系方式、查看個(gè)人訂單、個(gè)人信息的修改/查詢商家端功能有：登錄/注冊(cè)、訂單管理等。圖3.SEQ圖表\*ARABIC1咖啡廳網(wǎng)站功能結(jié)構(gòu)圖3.2系統(tǒng)架構(gòu)在設(shè)計(jì)和開(kāi)發(fā)咖啡廳網(wǎng)站的過(guò)程中，必須全面考慮用戶需求，細(xì)致規(guī)劃網(wǎng)站功能，并逐步推進(jìn)系統(tǒng)架構(gòu)設(shè)計(jì)，確保網(wǎng)站的穩(wěn)定性和可維護(hù)性。在該系統(tǒng)中，應(yīng)用層承擔(dān)實(shí)現(xiàn)網(wǎng)站內(nèi)不同用戶角色特定功能的任務(wù)，并通過(guò)顯示器層的瀏覽器交互界面呈現(xiàn)；技術(shù)層則運(yùn)用前后端的多種技術(shù)手段處理應(yīng)用層的請(qǐng)求，調(diào)用數(shù)據(jù)層提供的服務(wù)；數(shù)據(jù)層則負(fù)責(zé)網(wǎng)站數(shù)據(jù)的管理與維護(hù)，數(shù)據(jù)庫(kù)層則負(fù)責(zé)存儲(chǔ)和管理網(wǎng)站的所有數(shù)據(jù)，確保數(shù)據(jù)的安全性、完整性和一致性。具體的體系結(jié)構(gòu)圖請(qǐng)參見(jiàn)圖3.2。圖3.2架構(gòu)圖3.3頁(yè)面原型3.3.1首頁(yè)原型首頁(yè)頁(yè)面布局簡(jiǎn)單清晰，主要從界面設(shè)計(jì)的八個(gè)方面進(jìn)行內(nèi)容展示。首頁(yè)頁(yè)面分為搜索欄內(nèi)容，導(dǎo)航條，頁(yè)面展示內(nèi)容和底部導(dǎo)航內(nèi)容組成。每點(diǎn)擊標(biāo)題內(nèi)容網(wǎng)頁(yè)會(huì)展現(xiàn)與之相關(guān)的頁(yè)面首頁(yè)原型如3.3所示。圖3.3首頁(yè)原型圖3.3.2資訊詳情頁(yè)原型圖資訊詳情頁(yè)的內(nèi)容顯示包括資訊圖片、資訊標(biāo)題、資訊內(nèi)容等，作為文章的視覺(jué)引導(dǎo)，幫助用戶快速理解資訊的主題，確保用戶能夠快速把握文章的主題并決定是否繼續(xù)閱讀。資訊詳情頁(yè)原型如3.4所示。圖3.4資訊詳情原型圖3.3.3登錄頁(yè)原型圖用戶進(jìn)入平臺(tái)的起點(diǎn)是登錄頁(yè)面，其設(shè)計(jì)強(qiáng)調(diào)簡(jiǎn)潔與便捷，以保證用戶能夠迅速且順暢地完成登錄流程。登錄頁(yè)面由標(biāo)志、用戶名輸入欄、密碼輸入欄、注冊(cè)按鈕等組成。具體可見(jiàn)圖3.5。圖3.5登錄頁(yè)原型圖3.4JSON接口設(shè)計(jì)3.4.1咖啡列表加載接口設(shè)計(jì)在項(xiàng)目加載過(guò)程中，需要請(qǐng)求咖啡列表數(shù)據(jù)。向服務(wù)器發(fā)送請(qǐng)求時(shí)，會(huì)附帶一個(gè)包含數(shù)值的參數(shù)對(duì)象，用于控制請(qǐng)求的數(shù)據(jù)量。數(shù)據(jù)傳遞的詳細(xì)情況請(qǐng)參見(jiàn)表3.1。表3.1咖啡列表接口加載接口設(shè)計(jì)功能說(shuō)明咖啡列表加載URL地址http://localhost:3000/goodsList/請(qǐng)求方式GET參數(shù)說(shuō)明字段名是否必須類型描述page是Num控制分頁(yè)查詢的顯示頁(yè)數(shù)請(qǐng)求示例http://localhost:3000/goodsList/?page=1返回參數(shù)類型JSON類型參數(shù)說(shuō)明返回示例status:返回狀態(tài)碼statusText:返回狀態(tài)data：{"created_at"：創(chuàng)建時(shí)間"content"：資訊內(nèi)容"image_url"：圖片地址"title"：資訊標(biāo)題"id"：資訊編號(hào)"type"：資訊分類"status"：狀態(tài)}"status":200,"statusText":"OK","data":[{"created_at":"2024-12-31","content":"咖啡列表內(nèi)容xxxxxx","image_url":"info.jpg","title":"資訊標(biāo)題1","id":"資訊標(biāo)題1","type":"分類1","status":1}]3.4.2分類查詢接口設(shè)計(jì)用戶發(fā)布帖子時(shí)需填寫(xiě)帖子信息包括帖子的創(chuàng)建日期、標(biāo)題、圖片、發(fā)布人id、內(nèi)容等等數(shù)據(jù)，涉及到的數(shù)據(jù)傳遞如表3.2所示。表3.2分類查詢接口設(shè)計(jì)功能說(shuō)明發(fā)布帖子URL地址http://localhost:3000/categoryList/請(qǐng)求方式POST參數(shù)說(shuō)明字段名是否必須類型描述get是string分類名稱請(qǐng)求示例http://localhost:3000/categoryList返回參數(shù)類型JSON類型參數(shù)說(shuō)明返回示例status:返回狀態(tài)碼statusText:返回狀態(tài)data：返回值"status":200,"statusText":"OK","data":13.4.3公告信息加載接口設(shè)計(jì)在公告信息的展示過(guò)程中，前端會(huì)向服務(wù)器發(fā)送請(qǐng)求以獲取公告相關(guān)的數(shù)據(jù)，這些數(shù)據(jù)通常涵蓋了公告的發(fā)布日期、標(biāo)題、圖片和詳細(xì)內(nèi)容等重要信息。為了提高數(shù)據(jù)加載的效率，前端在請(qǐng)求時(shí)會(huì)附帶一個(gè)對(duì)象，該對(duì)象包含了當(dāng)前頁(yè)碼和每頁(yè)顯示的數(shù)據(jù)量等信息，以便后端根據(jù)這些參數(shù)提供相應(yīng)的公告數(shù)據(jù)。通過(guò)這種分頁(yè)機(jī)制，公告內(nèi)容可以分批獲取，防止一次性加載過(guò)多數(shù)據(jù)，這樣既加快了系統(tǒng)響應(yīng)速度，也改善了用戶體驗(yàn)。數(shù)據(jù)的傳輸和交互均遵循標(biāo)準(zhǔn)的API接口規(guī)范，如表3.3所示，確保了前后端間數(shù)據(jù)的順暢傳遞和準(zhǔn)確呈現(xiàn)。表3.3公告信息加載接口設(shè)計(jì)功能說(shuō)明公告信息加載URL地址http://localhost:3000/Kafei/?_page={page}&_limit=10請(qǐng)求方式GET參數(shù)說(shuō)明字段名是否必須類型描述page是Num控制分頁(yè)查詢的顯示數(shù)續(xù)表3.3公告信息加載接口設(shè)計(jì)請(qǐng)求示例http://localhost:3000/Kafei/?_page=1&_limit=10返回參數(shù)類型JSON類型參數(shù)說(shuō)明返回示例status:返回狀態(tài)碼statusText:返回狀態(tài)data：{"created_at"：創(chuàng)建時(shí)間"content"：公告內(nèi)容"image_url"：圖片地址"title"：公告標(biāo)題"id"：公告編號(hào)"status"：狀態(tài)}"status":200,"statusText":"OK","data":[{"created_at":"2024-12-31","content":"公告內(nèi)容xxxxxx","image_url":"Kafei.jpg","title":"公告標(biāo)題1","id":"公告標(biāo)題1","status":1}]3.4.4登錄接口設(shè)計(jì)用戶登錄時(shí)，需要向后端發(fā)送包含用戶名和密碼等信息的請(qǐng)求。此過(guò)程中，數(shù)據(jù)的傳輸涉及一個(gè)包含用戶信息的對(duì)象，具體數(shù)據(jù)項(xiàng)如表3.5所示。表3.5登錄接口設(shè)計(jì)功能說(shuō)明登錄URL地址http://localhost:5000/user/?userName={userName}&password={password}請(qǐng)求方式GET參數(shù)說(shuō)明字段名是否必須類型描述userName是String用戶名Password是String密碼請(qǐng)求示例http://localhost:3000/user/?userName=張三&password=123456返回參數(shù)類型JSON類型參數(shù)說(shuō)明返回示例status:返回狀態(tài)碼statusText:返回狀態(tài)data：{"created_at"：注冊(cè)時(shí)間"content"：簡(jiǎn)介"image_url"：頭像"sex"：性別"password"：密碼"userName":用戶名"status"：狀態(tài)}"status":200,"statusText":"OK","data":[{"created_at"："2024-12-14""content"："簡(jiǎn)介""image_url"："頭像""sex"："性別""password"："密碼""userName":用戶名"status"：狀態(tài)}]

第4章系統(tǒng)實(shí)現(xiàn)4.1咖啡管理功能實(shí)現(xiàn)4.1.1添加咖啡功能實(shí)現(xiàn)管理員通過(guò)登錄系統(tǒng)，在主頁(yè)面上管理咖啡，添加咖啡信息并提交至后臺(tái)，以便在頁(yè)面上新增咖啡條目。添加咖啡功能的實(shí)現(xiàn)過(guò)程如圖4.1所示。圖4.1添加咖啡圖4.1.2刪除咖啡功能實(shí)現(xiàn)管理員通過(guò)登錄系統(tǒng)，在主界面管理咖啡并執(zhí)行刪除操作。刪除功能的流程詳見(jiàn)圖4.2。圖4.2刪除咖啡圖4.1.3修改咖啡功能實(shí)現(xiàn)管理員登錄系統(tǒng)后，在主頁(yè)面上執(zhí)行咖啡管理任務(wù)，以更新咖啡信息。在這個(gè)頁(yè)面，管理員能夠編輯咖啡詳情，并在點(diǎn)擊“確認(rèn)修改”按鈕后，系統(tǒng)會(huì)展示已更新的表單。管理員接著將表單提交至后臺(tái)，從而更新數(shù)據(jù)庫(kù)中的咖啡信息?？Х刃畔⑿薷牡木唧w流程如圖4.3所示。圖4.3修改咖啡圖4.1.4查看咖啡功能實(shí)現(xiàn)管理員登錄系統(tǒng)后，將進(jìn)入主頁(yè)面進(jìn)行咖啡管理。通過(guò)此頁(yè)面，管理員能夠?yàn)g覽咖啡的詳細(xì)列表。頁(yè)面加載時(shí)，系統(tǒng)會(huì)向數(shù)據(jù)庫(kù)發(fā)送查詢請(qǐng)求，以獲取所有咖啡的相關(guān)信息，并將其展示在頁(yè)面上。如圖4.4所示。圖4.4查看咖啡圖4.2用戶管理功能實(shí)現(xiàn)4.2.1修改用戶信息功能實(shí)現(xiàn)管理員在用戶登錄系統(tǒng)后，可在主頁(yè)面上執(zhí)行添加用戶的功能。點(diǎn)擊頁(yè)面上的添加按鈕，便能在表單中輸入用戶信息并進(jìn)行添加。添加用戶功能的具體實(shí)現(xiàn)過(guò)程如圖4.5所示。圖4.5修改用戶信息圖4.3訂單管理功能實(shí)現(xiàn)4.3.1在線下單功能實(shí)現(xiàn)用戶登錄系統(tǒng)后，可在主頁(yè)面上進(jìn)行訂單管理，包括添加新訂單。具體操作步驟是在表單中填寫(xiě)訂單詳細(xì)信息，然后將請(qǐng)求提交給后臺(tái)處理。添加訂單功能的實(shí)現(xiàn)流程詳見(jiàn)圖4.6。圖4.6添加訂單圖4.3.2查看訂單功能實(shí)現(xiàn)一旦用戶成功登錄系統(tǒng)，便能進(jìn)入主頁(yè)面并查看訂單詳情。在該頁(yè)面上，用戶可以瀏覽到所有訂單的列表。點(diǎn)擊任一訂單條目，系統(tǒng)將展示該訂單的詳細(xì)信息，供用戶審閱。通過(guò)這一功能，用戶可以輕松獲取有關(guān)訂單的基本信息。該功能的實(shí)現(xiàn)，旨在提供一個(gè)清晰、直觀的訂單展示界面。如圖4.7所示。圖4.7查看訂單圖4.4咖啡分類管理功能實(shí)現(xiàn)4.4.1添加咖啡分類功能實(shí)現(xiàn)管理員在發(fā)布咖啡分類時(shí)，需先登錄系統(tǒng)，在系統(tǒng)主頁(yè)面上進(jìn)行咖啡分類的管理工作。隨后，管理員在表單中填寫(xiě)咖啡分類的相關(guān)信息，并將填寫(xiě)的請(qǐng)求提交給后臺(tái)進(jìn)行處理?？Х确诸惏l(fā)布的具體操作流程如圖4.10所示。圖4.10添加咖啡分類圖4.4.2查看咖啡分類功能實(shí)現(xiàn)管理員登錄系統(tǒng)后，能夠進(jìn)入主頁(yè)面，瀏覽各類咖啡的詳細(xì)分類。在該頁(yè)面上，所有咖啡分類信息將被列出并展示。具體如圖4.11所示。圖4.11查看咖啡分類信息圖4.4.3修改咖啡分類信息功能實(shí)現(xiàn)管理員登錄系統(tǒng)后，進(jìn)入主頁(yè)面以修改咖啡分類。頁(yè)面展示了所有已發(fā)布的咖啡分類，點(diǎn)擊“修改”按鈕后，即可進(jìn)入相應(yīng)的編輯界面。管理員在編輯界面填寫(xiě)表單，以更新咖啡分類的相關(guān)內(nèi)容。具體操作可參考圖4.12。圖4.12修改咖啡分類信息圖4.4.4刪除咖啡分類信息功能實(shí)現(xiàn)管理員登錄系統(tǒng)后，將進(jìn)入主頁(yè)面以管理咖啡分類信息。頁(yè)面加載時(shí)，系統(tǒng)會(huì)查詢數(shù)據(jù)庫(kù)并獲取咖啡分類信息以展示給管理員。管理員可以在此界面對(duì)咖啡分類進(jìn)行各種操作，包括點(diǎn)擊刪除按鈕提交請(qǐng)求，從而從數(shù)據(jù)庫(kù)中刪除相應(yīng)的信息。具體操作如圖4.13所示。圖4.13刪除咖啡分類信息圖4.5數(shù)據(jù)統(tǒng)計(jì)功能實(shí)現(xiàn)管理員通過(guò)查看數(shù)據(jù)統(tǒng)計(jì)功能的實(shí)現(xiàn)，可以掌握如圖4.14所示的統(tǒng)計(jì)信息。圖4.14數(shù)據(jù)統(tǒng)計(jì)圖第5章系統(tǒng)測(cè)試5.1功能測(cè)試（1）咖啡模塊功能測(cè)試咖啡模塊的測(cè)試涵蓋了添加、編輯以及刪除咖啡信息的各個(gè)方面。具體的測(cè)試用例詳見(jiàn)表5.1至表5.3。表5.1添加咖啡功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果addKafei_01準(zhǔn)確填寫(xiě)咖啡信息請(qǐng)依照系統(tǒng)指示填寫(xiě)咖啡的名稱、咖啡分類、類別以及上傳圖片等信息，之后點(diǎn)擊“確定”。系統(tǒng)提示添加成功addKafei_02咖啡名稱字?jǐn)?shù)不超過(guò)正常范圍輸入的咖啡標(biāo)題字符數(shù)超過(guò)100，其他選項(xiàng)請(qǐng)正常填寫(xiě)。系統(tǒng)提示咖啡名稱不規(guī)范addKafei_03必填項(xiàng)填寫(xiě)不完全用戶未完整填寫(xiě)系統(tǒng)所要求的必要信息。系統(tǒng)會(huì)根據(jù)實(shí)際情況提示用戶哪項(xiàng)沒(méi)有填寫(xiě)addKafei_04重新填寫(xiě)咖啡信息點(diǎn)擊“清空”按鈕。頁(yè)面回到初始狀態(tài)表5.2修改咖啡信息功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果setKafei_01正確編輯咖啡信息請(qǐng)根據(jù)系統(tǒng)指示編輯咖啡的標(biāo)題、賽事詳情、分類以及相關(guān)圖片等信息，并點(diǎn)擊“確定”。系統(tǒng)提示修改成功setKafei_02咖啡名稱字?jǐn)?shù)不超過(guò)正常范圍修改后的咖啡名稱字?jǐn)?shù)超過(guò)100，其他選項(xiàng)請(qǐng)正常填寫(xiě)。系統(tǒng)提示咖啡名稱不規(guī)范setKafei_03必填項(xiàng)填寫(xiě)不完全用戶未完整填寫(xiě)系統(tǒng)所要求的必要信息系統(tǒng)會(huì)根據(jù)實(shí)際情況提示用戶哪項(xiàng)沒(méi)有填寫(xiě)setKafei_04重新編輯咖啡信息點(diǎn)擊“清空”頁(yè)面回到初始狀態(tài)表5.3刪除咖啡功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果delKafei_01正確刪除該條咖啡在選中咖啡后，點(diǎn)擊刪除按鈕以提交請(qǐng)求。系統(tǒng)提示刪除成功delKafei_02批量刪除咖啡在選擇多項(xiàng)咖啡后，點(diǎn)擊刪除按鈕以提交請(qǐng)求。系統(tǒng)提示刪除成功（2）咖啡分類模塊功能測(cè)試咖啡分類模塊的測(cè)試涵蓋了添加、刪除以及查看咖啡分類的功能。測(cè)試用例的設(shè)計(jì)詳見(jiàn)表5.4至表5.5。表5.4添加咖啡分類功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果inKafei_01正確填寫(xiě)入咖啡分類表單請(qǐng)依照系統(tǒng)要求填寫(xiě)咖啡分類的名稱、內(nèi)容、上傳圖片等信息后，點(diǎn)擊“確定”。系統(tǒng)提示發(fā)布成功inKafei_02咖啡分類名稱字?jǐn)?shù)不超過(guò)正常范圍提交的咖啡標(biāo)題字符數(shù)超過(guò)100，其他選項(xiàng)請(qǐng)正常填寫(xiě)。系統(tǒng)提示咖啡分類名稱不規(guī)范inKafei_03必填項(xiàng)填寫(xiě)不完全用戶未完全填寫(xiě)系統(tǒng)所要求的必填信息。系統(tǒng)會(huì)根據(jù)實(shí)際情況提示用戶哪項(xiàng)沒(méi)有填寫(xiě)表5.5刪除咖啡分類功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果outKafei_01正確填寫(xiě)刪除表單請(qǐng)依照系統(tǒng)指示點(diǎn)擊“確定”系統(tǒng)提示刪除成功outKafei_02咖啡分類名稱字?jǐn)?shù)不超過(guò)正常范圍輸入的咖啡分類名稱超過(guò)100個(gè)字符，其他選項(xiàng)請(qǐng)正常填寫(xiě)。系統(tǒng)提示咖啡分類名稱不規(guī)范outKafei_03必填項(xiàng)填寫(xiě)不完全用戶未完全填寫(xiě)系統(tǒng)所要求的必要信息。系統(tǒng)會(huì)根據(jù)實(shí)際情況提示用戶哪項(xiàng)沒(méi)有填寫(xiě)（3）用戶模塊功能測(cè)試用戶模塊的測(cè)試主要涉及對(duì)用戶信息的新增、編輯及移除操作，以確保各項(xiàng)功能均能依照預(yù)期正常運(yùn)作。在新增用戶信息的測(cè)試環(huán)節(jié)，我們驗(yàn)證了系統(tǒng)是否能夠準(zhǔn)確地錄入新的用戶數(shù)據(jù)；在編輯用戶信息的測(cè)試環(huán)節(jié)，著重檢驗(yàn)了系統(tǒng)是否能夠成功地更新既有的用戶詳細(xì)信息；在移除用戶信息的測(cè)試環(huán)節(jié)，我們確認(rèn)了系統(tǒng)是否能夠準(zhǔn)確地刪除指定的用戶記錄，并確保數(shù)據(jù)的一致性。具體的測(cè)試用例可參見(jiàn)表5.6至表5.8。表5.6添加用戶功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果addUser_01正確填寫(xiě)用戶信息請(qǐng)依照系統(tǒng)規(guī)定，填寫(xiě)用戶的標(biāo)題、內(nèi)容、分類以及上傳圖片等必要信息后，點(diǎn)擊“確定”按鈕。系統(tǒng)提示添加成功addUser_02用戶標(biāo)題應(yīng)保持在合理長(zhǎng)度內(nèi)用戶名稱的字符數(shù)超過(guò)了100個(gè)，其他選項(xiàng)請(qǐng)按照要求正常填寫(xiě)。系統(tǒng)提示用戶名稱不規(guī)范續(xù)表5.6添加用戶功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果addUser_03必填項(xiàng)未完全填寫(xiě)用戶未完全填寫(xiě)系統(tǒng)所要求的必要信息。系統(tǒng)會(huì)根據(jù)實(shí)際情況提示用戶哪項(xiàng)沒(méi)有填寫(xiě)addUser_04重新填寫(xiě)用戶信息點(diǎn)擊“清除”頁(yè)面回到初始狀態(tài)表5.7修改用戶信息功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果setUser_01正確編輯用戶信息請(qǐng)依照系統(tǒng)規(guī)定編輯用戶的標(biāo)題、正文、分類以及圖片等相關(guān)信息，隨后點(diǎn)擊“確認(rèn)”。系統(tǒng)提示修改成功setUser_02用戶標(biāo)題的字符數(shù)量應(yīng)控制在合理范圍內(nèi)若用戶標(biāo)題修改后的字符數(shù)超過(guò)50個(gè)，請(qǐng)依照常規(guī)方式填寫(xiě)其他選項(xiàng)。系統(tǒng)提示用戶名稱不規(guī)范setUser_03必填項(xiàng)填寫(xiě)不完全用戶未完整填寫(xiě)系統(tǒng)所必需的信息系統(tǒng)將根據(jù)實(shí)際情況提示用戶哪些項(xiàng)目尚未填寫(xiě)。setUser_04重新編輯用戶信息點(diǎn)擊“清除”頁(yè)面回到初始狀態(tài)表5.8刪除用戶功能測(cè)試用例用例編號(hào)測(cè)試用例描述操作過(guò)程及數(shù)據(jù)預(yù)期結(jié)果delUser_01正確地刪除該條用戶選定用戶并點(diǎn)擊刪除按鈕，即可啟動(dòng)刪除請(qǐng)求。系統(tǒng)提示刪除成功delUser_02批量移除用戶在選定多名用戶之后，點(diǎn)擊刪除按鈕以提交刪除請(qǐng)求。系統(tǒng)提示刪除成功5.2非功能測(cè)試兼容性測(cè)試用例如表5.9、表5.10所示。表5.9手機(jī)型號(hào)兼容性測(cè)試用例測(cè)試用例名稱測(cè)試手機(jī)型號(hào)兼容性_001華為Mate40兼容性_002VivoX6兼容性_003Oppofindx表5.10瀏覽器兼容性測(cè)試用例測(cè)試用例名稱瀏覽器版本兼容性_001Edge10兼容性_002Chrome兼容性_003火狐瀏覽器性能測(cè)試用例如表5.11所示。表5.11兼容性測(cè)試用例場(chǎng)景并發(fā)數(shù)量測(cè)試點(diǎn)登錄2600登錄的響應(yīng)時(shí)間120015001700查找咖啡1400查找的響應(yīng)時(shí)間25007200查找的響應(yīng)時(shí)間42005.3測(cè)試總結(jié)本次測(cè)試共涵蓋了32個(gè)測(cè)試案例。在測(cè)試執(zhí)行過(guò)程中，時(shí)間管理總體上是恰當(dāng)?shù)?。然而，由于系統(tǒng)響應(yīng)的遲緩，部分案例的執(zhí)行時(shí)間被延長(zhǎng)，尤其是在咖啡模塊的增加、刪除和修改操作中，這種現(xiàn)象尤為突出。這可能是由于數(shù)據(jù)量龐大或網(wǎng)絡(luò)延遲所導(dǎo)致。在測(cè)試過(guò)程中，共識(shí)別出3項(xiàng)缺陷，主要影響以下模塊：咖啡模塊：部分?jǐn)?shù)據(jù)未能正確更新，導(dǎo)致查詢結(jié)果與實(shí)際數(shù)據(jù)存在差異?？Х确诸惸K：在執(zhí)行操作后，部分咖啡分類的數(shù)量未能即時(shí)更