基于微信小程序的高校地圖導(dǎo)航系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

第2章相關(guān)理論和技術(shù)2.1Wxml簡(jiǎn)介Wxml是一種標(biāo)簽型語言，它和傳統(tǒng)的Html很相似，但是不同的是Html相對(duì)較傳統(tǒng)，主要是實(shí)現(xiàn)靜態(tài)頁面的，而Wxml是基于微信開發(fā)的可以實(shí)現(xiàn)動(dòng)態(tài)頁面的語言，這是二者最大的不同。但是同樣作為標(biāo)簽語言，Wxml還是很大程度上繼承了Html的一些用法?？梢哉fWxml是基于微信框架的Html語言，它簡(jiǎn)潔了部分Html用法上的弊端，同時(shí)對(duì)頁面做出了更多限定。Wxml作為微信小程序開發(fā)的頁面語言來說，它更像是微信小程序開發(fā)的最大展現(xiàn)。作為標(biāo)簽語言，不可否認(rèn)的是，Wxml也是利用標(biāo)簽去搭建頁面的布局，書寫頁面的內(nèi)容。而標(biāo)簽作為超文本語言的運(yùn)用助手，它的格式也相當(dāng)簡(jiǎn)單，由尖括號(hào)包裹著關(guān)鍵詞和頁面具體信息。Wxml和Html最大的不同是Wxml允許用戶使用Wxml所規(guī)定的無需結(jié)束標(biāo)簽的部分標(biāo)簽和組件。這使得頁面代碼大大減少，同時(shí)也提高了系統(tǒng)運(yùn)行速度，對(duì)于儲(chǔ)存也得到了很大改善。這是Wxml作為標(biāo)簽語言和Html相比更大的優(yōu)勢(shì)所在。Wxml語言的另一個(gè)與眾不同的地方在于，它聯(lián)系了微信框架，在這基礎(chǔ)上使用了微信所自帶的組件，這使得微信小程序和微信在風(fēng)格上有極大相似處，但不可否認(rèn)的時(shí)，正是這些微信小程序所規(guī)定的組件，使得微信小程序的開發(fā)變得尤為簡(jiǎn)單。在使用這些控價(jià)或是說組件的過程中，首先閱讀微信小程序開發(fā)文檔中的各個(gè)簡(jiǎn)例，會(huì)給開發(fā)者帶來極大的靈感，并且這個(gè)組件的使用方法簡(jiǎn)單，效果極佳，也是Wxml作為微信小程序開發(fā)的一個(gè)優(yōu)勢(shì)所在。Wxml開發(fā)語言另一個(gè)重要概念是屬性，屬性往往是和組件密不可分的。在考慮使用何種組件的時(shí)候，對(duì)其添加關(guān)鍵屬性，可使的頁面更加美觀整潔，這也是開發(fā)者可以深入思考的地方。2.2MySQL特點(diǎn) MySQL功能強(qiáng)：MySQL中提供了多種數(shù)據(jù)庫存儲(chǔ)引擎，各引擎各有所長(zhǎng)，適用于不同的應(yīng)用場(chǎng)合，用戶可以選擇最合適的引擎以得到最高性能，可以處理每天訪問量超過數(shù)億的高強(qiáng)度的搜索Web站點(diǎn)。MySQL5支持事務(wù)、視圖、存儲(chǔ)過程、觸發(fā)器等。MySQL支持跨平臺(tái)：MySQL支持至少20種以上的開發(fā)平臺(tái)，包括Linux、Windows、FreeBSD、IBMAIX、AIX、FreeBSD等。這使得在任何平臺(tái)下編寫的程序都可以進(jìn)行移植，而不需要對(duì)程序做任何的修改。MySQL運(yùn)行速度快：高速是MySQL的顯著特性。在MySQL中，使用了極快的B樹磁盤表（MyISAM）和索引壓縮；通過使用優(yōu)化的單掃描多連接，能夠極快地實(shí)現(xiàn)連接；SQL函數(shù)使用高度優(yōu)化的類庫實(shí)現(xiàn)，運(yùn)行速度極快。MySQL安全性高：靈活和安全的權(quán)限與密碼系統(tǒng)，允許基本主機(jī)的驗(yàn)證。連接到服務(wù)器時(shí)，所有的密碼傳輸均采用加密形式，從而保證了密碼的安全。MySQL成本低：MySQL數(shù)據(jù)庫是一種完全免費(fèi)的產(chǎn)品，用戶可以直接通過網(wǎng)絡(luò)下載。2.3JavaScript介紹1955年網(wǎng)景公司為了解決表單驗(yàn)證時(shí)客戶端和服務(wù)端的延遲，設(shè)計(jì)并推出命名為JavaScript的客服端腳本語言，并在當(dāng)時(shí)獲得了很大的成果。隨著時(shí)間的演變，JavaScript最終成為了可以通過嵌入到Html中來實(shí)現(xiàn)對(duì)于頁面的動(dòng)態(tài)功能實(shí)現(xiàn)。JavaScript作為Java語言的一種解釋性語言，它具備了Java語言的各種特性，同時(shí)也具有自身的一些性質(zhì)，包括作為單線程的語言，它無法與跨平臺(tái)語言進(jìn)行交流，這是Java語言可以做到的，再例如，JavaScript作為一個(gè)框架，可以鑲嵌在CSS，DOM元素等等中，為其實(shí)現(xiàn)帶來動(dòng)態(tài)變化，這也是很多開發(fā)者愿意使用JavaScript的原因之一。另外，JavaScript由于其實(shí)現(xiàn)簡(jiǎn)單而被廣應(yīng)用于客戶端，和Web的應(yīng)用開發(fā)，作為用來為頁面添加動(dòng)態(tài)功能，并優(yōu)化頁面，也是為用戶的體驗(yàn)觀感得到了改善。第3章系統(tǒng)分析3.1可行性分析3.1.1技術(shù)可行性技術(shù)可行性主要是對(duì)于使用技術(shù)是否有局限，包括開發(fā)時(shí)使用的語言是否有局限性，編譯時(shí)使用的開發(fā)平臺(tái)是否需要付費(fèi)，框架的設(shè)計(jì)是否存在爭(zhēng)議等等。本次開發(fā)的地圖導(dǎo)航小程序主要依賴于微信小程序開發(fā)者以及微信小程序端頁面規(guī)定的頁面語言及框架。本次開發(fā)使用的開發(fā)語言是Wxml和Wxss，這兩者均為免費(fèi)版，數(shù)據(jù)存儲(chǔ)使用的工具是MySQL，同樣，MySQL不僅具有存儲(chǔ)數(shù)量大，操作方便，并且作為免費(fèi)使用的數(shù)據(jù)庫工具，為程序的開發(fā)帶來了很大的便利。在編寫小程序時(shí)，系統(tǒng)還嵌入了騰訊地圖的API。對(duì)于微信小程序開發(fā)來說，申請(qǐng)權(quán)限并不難，而且騰訊地圖的API嵌入同樣只需要申請(qǐng)使用即可，所以在技術(shù)可行性方面是很容易實(shí)現(xiàn)的。3.1.2經(jīng)濟(jì)可行性經(jīng)濟(jì)可行性指的是在開發(fā)過程中，整個(gè)流程的預(yù)算，費(fèi)用支出是否在合理范圍內(nèi)，這要求開發(fā)過程中不得有過分浪費(fèi)的步驟，并且經(jīng)濟(jì)可行性更是要求系統(tǒng)在開發(fā)過程中每個(gè)步驟都要符合開發(fā)要求，系統(tǒng)開發(fā)完成后要有一定經(jīng)濟(jì)效益。這些要求在系統(tǒng)的開發(fā)之前，也有過詳細(xì)的研究和探尋，綜合以上考慮，我們微信小程序的高校地圖導(dǎo)航系統(tǒng)，可以推動(dòng)校園地圖導(dǎo)航的發(fā)展，具有很好的發(fā)展前景，有一定的開發(fā)價(jià)值，同樣也能能產(chǎn)生合理的經(jīng)濟(jì)效益。所以認(rèn)定本次設(shè)計(jì)與開發(fā)從經(jīng)濟(jì)上來講是可行的。3.1.3操作可行性在系統(tǒng)完成后，后續(xù)交付于使用人員時(shí)，應(yīng)能確保系統(tǒng)的正常運(yùn)行，在此基礎(chǔ)上，要實(shí)現(xiàn)簡(jiǎn)單快捷的操作步驟，言簡(jiǎn)意賅的操作頁面，使使用人員可以清楚明了的知道每個(gè)模塊具體是做什么的，同樣，數(shù)據(jù)的儲(chǔ)存，頁面的優(yōu)化，都是一個(gè)完整良好的系統(tǒng)應(yīng)具備的。所以開發(fā)完整的系統(tǒng)必須是簡(jiǎn)潔的，高效的，使用過程中要做好不同等級(jí)用戶的使用權(quán)限管理。從以上這些部分考慮，我們可以認(rèn)定本次開發(fā)從操作上來講是可行的。3.1.4法律可行性從法律的角度來講，整個(gè)開發(fā)工作具有以下幾個(gè)特性：（1）開發(fā)所使用的所有技術(shù)資料都是合法得到的；（2）整個(gè)開發(fā)過程中不存在知識(shí)產(chǎn)權(quán)問題；（3）開發(fā)過程未抄襲任何網(wǎng)站，不存在侵犯版權(quán)問題；（4）開發(fā)過程全部來自自己，原始勞動(dòng)，不涉及承擔(dān)所謂的法律責(zé)任。3.2功能需求分析系統(tǒng)的功能需求分析主要針對(duì)系統(tǒng)內(nèi)部模塊的劃分，系統(tǒng)具體功能的實(shí)現(xiàn)，盡快確定系統(tǒng)的功能需求分析，有利于系統(tǒng)接下來的編程與全局部署。一份確切且準(zhǔn)確的分析可以將設(shè)計(jì)劃分細(xì)節(jié)，能盡早規(guī)避掉開發(fā)中可能出現(xiàn)的錯(cuò)誤，進(jìn)而降低成本，改善設(shè)計(jì)質(zhì)量。3.3用戶用例分析在基于微信小程序的地圖導(dǎo)航系統(tǒng)中，用戶登錄成功后，可以依據(jù)不同權(quán)限和角色，學(xué)生利用學(xué)號(hào)等信息登錄成功后，可查看某高校地圖信息，查看特色地標(biāo)論壇并發(fā)表相關(guān)言論，查看高校地標(biāo)實(shí)景，進(jìn)行某個(gè)場(chǎng)地預(yù)約管理,并進(jìn)行某個(gè)地標(biāo)導(dǎo)航，同時(shí)可以進(jìn)行地圖自主繪制并分享等操作，個(gè)人信息的管理等內(nèi)容。而游客登陸不需要學(xué)號(hào)等相關(guān)信息，同樣其可執(zhí)行功能也相對(duì)較少，可以查看某高校地圖信息，查看特色地標(biāo)論壇但無法發(fā)表信息或點(diǎn)贊等相關(guān)操作，可查看高校地標(biāo)實(shí)景，個(gè)人信息的管理等內(nèi)容。管理員能夠在后臺(tái)對(duì)用戶信息管理、地圖信息管理、定位點(diǎn)預(yù)約信息管理和系統(tǒng)管理。用戶用例分析圖如圖3.1所示：登陸注冊(cè)查看地圖搜索地圖 查看實(shí)景預(yù)約場(chǎng)地導(dǎo)航圖3.1用戶用例圖管理員用例分析圖如圖3.2所示：管理用戶信息管理用戶信息管理地圖信息管理地圖信息管理預(yù)約信息管理預(yù)約信息管理論壇信息管理論壇信息圖3.2管理員用例圖第4章系統(tǒng)設(shè)計(jì)4.1功能模塊設(shè)計(jì)根據(jù)對(duì)系統(tǒng)的功能進(jìn)行分析微信小程序地圖導(dǎo)航系統(tǒng)的具體功能模塊包括下面的幾個(gè)主要的功能模塊：地圖查詢管理，地標(biāo)論壇管理，地標(biāo)實(shí)景管理，地標(biāo)信息管理，場(chǎng)地預(yù)約管理,地標(biāo)導(dǎo)航管理，線路推薦管理，地圖自主繪制管理。系統(tǒng)的功能模塊如圖4.1所示：高校地圖導(dǎo)航系統(tǒng)地地場(chǎng)場(chǎng)地地地用地標(biāo)圖標(biāo)地圖標(biāo)標(biāo)戶圖實(shí)查論預(yù)自線線信信景詢壇約主路路息息管管管管繪查推管管理理理理制詢薦理理圖4.1系統(tǒng)功能模塊圖4.2數(shù)據(jù)庫設(shè)計(jì)4.2.1需求分析根據(jù)對(duì)系統(tǒng)的功能進(jìn)行分析本設(shè)計(jì)用戶角色的權(quán)限需求，這不僅僅要求是對(duì)用戶的信息的存儲(chǔ)，更新，修改，等等，更是對(duì)系統(tǒng)內(nèi)部數(shù)據(jù)的存放有了要求，并且系統(tǒng)內(nèi)部的各種信息的輸入輸出，也應(yīng)有最基本的存放地點(diǎn)。這就是使得數(shù)據(jù)庫使用變得極為重要。根據(jù)對(duì)系統(tǒng)蘇旭的數(shù)據(jù)，數(shù)據(jù)屬性，數(shù)據(jù)關(guān)系和數(shù)據(jù)約束等分析，對(duì)于基于微信小程序的高校地圖導(dǎo)航系統(tǒng)來說，需要設(shè)計(jì)一個(gè)包含用戶信息，地圖信息，位置點(diǎn)信息，管理員信息的數(shù)據(jù)庫。這些數(shù)據(jù)表將存儲(chǔ)用戶的個(gè)人信息，地圖信息（如名稱，簡(jiǎn)介，位置點(diǎn)信息等），位置點(diǎn)信息（如論壇，實(shí)景，預(yù)約等）以及管理員的賬戶信息。4.2.2概念結(jié)構(gòu)設(shè)計(jì)根據(jù)數(shù)據(jù)庫需求分析，設(shè)計(jì)系統(tǒng)的概念模型。系統(tǒng)的實(shí)體有管理員，用戶，地圖。管理員實(shí)體圖管理員包含賬號(hào)和密碼兩個(gè)屬性。賬號(hào)管理員密碼圖4.2管理員實(shí)體圖用戶實(shí)體圖用戶包含賬號(hào)，密碼，手機(jī)號(hào)，學(xué)校，姓名，學(xué)號(hào)等屬性。賬號(hào)學(xué)校密碼用戶姓名手機(jī)號(hào)學(xué)號(hào)頭像圖4.3用戶實(shí)體圖地圖實(shí)體圖地圖包含名稱，圖片，簡(jiǎn)介，學(xué)校名稱等屬性。 名稱 地圖 位置點(diǎn)信息圖片簡(jiǎn)介 學(xué)校名稱圖4.4地圖實(shí)體圖總體實(shí)體圖管理員管理員密碼賬號(hào)n操作修改密碼學(xué)校操作名稱賬號(hào)操作mnm操作mn操作圖片地圖用戶姓名操作簡(jiǎn)介學(xué)號(hào)手機(jī)號(hào)位置點(diǎn)信息學(xué)校名稱查看頭像圖4.5總體實(shí)體圖4.2.3邏輯結(jié)構(gòu)設(shè)計(jì)根據(jù)概念結(jié)構(gòu)設(shè)計(jì)轉(zhuǎn)化設(shè)計(jì)得到邏輯結(jié)構(gòu)設(shè)計(jì)，高校地圖導(dǎo)航系統(tǒng)具體表設(shè)計(jì)如下：(1)管理員表users管理員表users的結(jié)構(gòu)如表4.1所示。表4.1管理員表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idBigint主鍵主鍵usernamevarchar10用戶名passwordvarchar10密碼rolevarchar2角色管理員addtimetimestamp新增時(shí)間CURRENT_TIMESTAMP(2)收藏表storeup“收藏表storeup”是用來查看收藏的信息。Storeup的結(jié)構(gòu)如表4.2所示。表4.2收藏表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idBigint主鍵主鍵addtimetimestamp創(chuàng)建時(shí)間CURRENT_TIMESTAMPuseridbigint用戶idrefidbigint地圖序號(hào)xnamevarchar20學(xué)校名稱namevarchar20地圖名稱picturelongtext4294967295圖片remarkvarchar200備注(3)用戶表yonghu“用戶表yonghu”是用來記錄用戶信息。yonghu的結(jié)構(gòu)如表4.3所示。表4.3用戶表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idbigint主鍵主鍵addtimetimestamp創(chuàng)建時(shí)間CURRENT_TIMESTAMPzhanghaovarchar20賬號(hào)mimavarchar20密碼nichengvarchar10昵稱xingbievarchar2性別shoujivarchar11手機(jī)touxianglongtext4294967295頭像numberfloat20學(xué)號(hào)(4)預(yù)約表orders“預(yù)約表orders”是用來記錄預(yù)約的信息。orders的結(jié)構(gòu)如表4.4所示。表4.4預(yù)約表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idbigint主鍵主鍵addtimetimestamp20創(chuàng)建時(shí)間CURRENT_TIMESTAMPorderidvarchar20預(yù)約編號(hào)tnamevarchar5預(yù)約人姓名useridbigint10用戶idGidbigint預(yù)約地點(diǎn)goodnamevarchar10位置點(diǎn)名稱picturelongtext4294967295位置點(diǎn)照片timefloat預(yù)約時(shí)間0discountpricefloat預(yù)約用途0telvarchar11預(yù)約人聯(lián)系電話(5)地圖信息表news地圖信息表news的結(jié)構(gòu)如表4.5所示。表4.5地圖信息表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idbigint主鍵主鍵addtimetimestamp創(chuàng)建時(shí)間CURRENT_TIMESTAMPtitlevarchar200名稱introductionlongtext4294967295簡(jiǎn)介picturelongtext4294967295圖片contentlongtext4294967295學(xué)校(6)論壇信息表discussyanchanghui“論壇信息表discussyanchanghui”是用來記錄論壇評(píng)論的信息。discussyanchanghui的結(jié)構(gòu)如表4.6所示。表4.6論壇信息表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idbigint主鍵主鍵addtimetimestamp創(chuàng)建時(shí)間CURRENT_TIMESTAMPrefidbigint關(guān)聯(lián)表iduseridbigint用戶idavatarurllongtext4294967295頭像nicknamevarchar20用戶名contentlongtext4294967295評(píng)論內(nèi)容replylongtext4294967295回復(fù)內(nèi)容(7)在線客服表chat在線客服表chat的結(jié)構(gòu)如表4.7所示。表4.7在線客服表字段名稱類型長(zhǎng)度字段說明主鍵默認(rèn)值idbigint主鍵主鍵addtimetimestamp創(chuàng)建時(shí)間CURRENT_TIMESTAMPuseridbigint用戶idadminidbigint管理員idasklongtext4294967295提問replylongtext4294967295回復(fù)isreplyint是否回復(fù)第5章系統(tǒng)實(shí)現(xiàn)5.1實(shí)現(xiàn)環(huán)境該系統(tǒng)的開發(fā)環(huán)境為：開發(fā)工具：微信小程序開發(fā)者，開發(fā)語言：Wxml、框架：Javascript，服務(wù)器：tomcat7、數(shù)據(jù)庫：mysql5.7。5.2地標(biāo)實(shí)景用戶進(jìn)地圖頁面并雙擊地標(biāo)則可進(jìn)入地標(biāo)的3D影像，對(duì)地標(biāo)實(shí)景的展示，如圖5.1所示。圖5.1地標(biāo)實(shí)景界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@IgnoreAuth @PostMapping(value="/login") publicRlogin(Stringusername,Stringpassword,Stringcaptcha,HttpServletRequestrequest){ UsersEntityuser=userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",username)); if(user==null||!user.getPassword().equals(password)){ returnR.error("賬號(hào)或密碼不正確"); } Stringtoken=tokenService.generateToken(user.getId(),username,"users",user.getRole()); returnR.ok().put("token",token); }5.3地圖管理用戶登錄成功進(jìn)入系統(tǒng)后，可看到默認(rèn)地圖，可根據(jù)為支點(diǎn)對(duì)校園內(nèi)部環(huán)境進(jìn)行查看，同樣也可在搜索框內(nèi)輸入任一大學(xué)名稱，對(duì)該校園地圖進(jìn)行查詢。地圖默認(rèn)頁面如圖5.2所示。圖5.2地圖界面點(diǎn)擊位置點(diǎn)可進(jìn)行導(dǎo)航操作和論壇頁面查看，部分特殊地點(diǎn)如自習(xí)室，羽毛球館等還會(huì)有預(yù)約功能，其詳細(xì)界面如圖5.3所示。圖5.3位置點(diǎn)界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@IgnoreAuth@RequestMapping("/list")publicRlist(@RequestParamMap<String,Object>params,YanchanghuiEntityyanchanghui, HttpServletRequestrequest){EntityWrapper<YanchanghuiEntity>ew=newEntityWrapper<YanchanghuiEntity>(); PageUtilspage=yanchanghuiService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,yanchanghui),params),params));returnR.ok().put("data",page);}5.4個(gè)人中心以用戶身份登錄到系統(tǒng)中，進(jìn)入個(gè)人中心界面，可以對(duì)個(gè)人信息進(jìn)行更新，查看我的評(píng)論和贊，預(yù)約信息及個(gè)人信息。個(gè)人中心界面如圖5.4所示：圖5.4我的界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@IgnoreAuth@RequestMapping("/list")publicRlist(@RequestParamMap<String,Object>params,YonghuEntityyonghu, HttpServletRequestrequest){EntityWrapper<YonghuEntity>ew=newEntityWrapper<YonghuEntity>(); PageUtilspage=yonghuService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,yonghu),params),params));returnR.ok().put("data",page);}5.5路線推薦當(dāng)用戶點(diǎn)擊任意位置點(diǎn)并選擇導(dǎo)航按鈕時(shí)，系統(tǒng)將自動(dòng)獲取當(dāng)前用戶位置如圖5.5所示，用戶選擇出行方式后系統(tǒng)將進(jìn)行導(dǎo)航并推薦路線，如5.6所示。圖5.5自動(dòng)定位界面圖5.6路線推薦界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@RequestMapping("/page")publicRpage(@RequestParamMap<String,Object>params,YanchanghuiEntityyanchanghui, HttpServletRequestrequest){EntityWrapper<YanchanghuiEntity>ew=newEntityWrapper<YanchanghuiEntity>(); PageUtilspage=yanchanghuiService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,yanchanghui),params),params));returnR.ok().put("data",page);}5.6論壇管理當(dāng)用戶點(diǎn)擊位置點(diǎn)后，并選擇位置點(diǎn)相對(duì)應(yīng)的論壇，進(jìn)入論壇。用戶可在論壇中發(fā)表對(duì)該位置點(diǎn)的意見，并進(jìn)行交流，同時(shí)促進(jìn)學(xué)生間的友誼。同樣，目前的論壇管理已實(shí)現(xiàn)發(fā)表評(píng)論，收藏點(diǎn)贊和關(guān)注用戶的功能。其界面如圖5.7所示：圖5.7論壇管理界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@RequestMapping("/page")PublicRpage(@RequestParamMap<String,Object>params,YanchanghuileibieEntityyanchanghuileibie, HttpServletRequestrequest){EntityWrapper<YanchanghuileibieEntity>ew=newEntityWrapper<YanchanghuileibieEntity>(); PageUtilspage=yanchanghuileibieService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,yanchanghuileibie),params),params));returnR.ok().put("data",page);}5.7預(yù)約管理當(dāng)用戶點(diǎn)擊部分特殊位置點(diǎn)，如圖書館，機(jī)房，自習(xí)室等地點(diǎn)后，可對(duì)這些地點(diǎn)進(jìn)行線上預(yù)約，其具體界面如圖5.8所示：圖5.8預(yù)約管理界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@RequestMapping("/page")publicRpage(@RequestParamMap<String,Object>params,OrdersEntityorders, HttpServletRequestrequest){ if(!request.getSession().getAttribute("role").toString().equals("管理員")){ orders.setUserid((Long)request.getSession().getAttribute("userId")); }EntityWrapper<OrdersEntity>ew=newEntityWrapper<OrdersEntity>(); PageUtilspage=ordersService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,orders),params),params));returnR.ok().put("data",page);}5.8用戶管理用戶在前端注冊(cè)的信息同步更新到數(shù)據(jù)庫中，而當(dāng)以管理員身份登錄到系統(tǒng)中，進(jìn)入到用戶管理界面時(shí)，可以進(jìn)入用戶信息管理列表界面，輸入昵稱或性別，選擇查詢按鈕找到用戶信息，當(dāng)用戶過長(zhǎng)時(shí)間未登錄或其他特殊情況發(fā)生時(shí)，管理員還可以對(duì)用戶信息進(jìn)行修改、刪除等操作，也包括查看詳情等等。用戶管理界面如圖5.9所示：圖5.9用戶管理界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@RequestMapping("/page")publicRpage(@RequestParamMap<String,Object>params,YonghuEntityyonghu, HttpServletRequestrequest){EntityWrapper<YonghuEntity>ew=newEntityWrapper<YonghuEntity>(); PageUtilspage=yonghuService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew,yonghu),params),params));returnR.ok().put("data",page);}5.9系統(tǒng)管理以管理員身份登錄到后臺(tái)系統(tǒng)中，可以看到下面有三個(gè)方面信息，分別是輪播圖管理、地圖、在線客服。選擇系統(tǒng)管理下的“輪播圖管理”按鈕，進(jìn)入輪播圖管理列表界面，輸入標(biāo)題，選擇查詢找到輪播圖，還可以對(duì)輪播圖進(jìn)行修改、查看詳情等操作。輪播圖管理界面如圖5.10所示：圖5.10輪播圖管理界面實(shí)現(xiàn)該功能的關(guān)鍵代碼如下：@RequestMapping("/list")publicRlist(UsersEntityuser){ EntityWrapper<UsersEntity>ew=newEntityWrapper<UsersEntity>(); ew.allEq(MPUtil.allEQMapPre(user,"user"));returnR.ok().put("data",userService.selectListView(ew));第6章系統(tǒng)測(cè)試6.1測(cè)試目的系統(tǒng)在對(duì)各功能模塊設(shè)計(jì)以及前臺(tái)操作界面設(shè)計(jì)完成后，為了保證系統(tǒng)可靠穩(wěn)定運(yùn)行，正式使用前需要進(jìn)行一系列的功能和性能測(cè)試，進(jìn)而便于在正式使用前及時(shí)進(jìn)行系統(tǒng)的修復(fù)和改進(jìn)。為保證系統(tǒng)在正式投入使用后，可以正常運(yùn)行，6.2測(cè)試方法黑盒測(cè)試是對(duì)系統(tǒng)整體功能性的一種測(cè)試手段，測(cè)試人員在進(jìn)行黑盒測(cè)試時(shí)，主要從用戶角度考慮，通過利用相應(yīng)的功能測(cè)試用例，將系統(tǒng)的實(shí)際測(cè)試情況和預(yù)期情況相互比較，便于發(fā)現(xiàn)系統(tǒng)所存的問題。6.3測(cè)試內(nèi)容用戶端測(cè)試用例依據(jù)用戶要求進(jìn)行設(shè)計(jì)，采用黑盒測(cè)試的技術(shù)，由于篇幅問題，這里只給出具有代表性的部分測(cè)試用例表，如表6.1所示。具體頁面如圖6.1，6.2，6.3所示。表6.1登錄測(cè)試用例表測(cè)試編號(hào)測(cè)試目的操作步驟預(yù)期結(jié)果實(shí)際結(jié)果001登錄測(cè)試輸入正確的用戶名和密碼登錄成功登錄成功002登錄測(cè)試輸入錯(cuò)誤的用戶名登錄失敗登錄失敗003登錄測(cè)試輸入錯(cuò)誤的的密碼登錄失敗登錄失敗圖6.1登錄測(cè)試成功圖6.2登陸測(cè)試用戶名錯(cuò)誤圖6.3登陸測(cè)試密碼錯(cuò)誤管理端在運(yùn)行時(shí)要滿足瀏覽器的運(yùn)行需求，比如添加用戶信息測(cè)試、修改用戶信息測(cè)試、刪除用戶信息測(cè)試等。本節(jié)根據(jù)管理端各模塊進(jìn)行測(cè)試，如表6.2所示。效果如圖6.4，6.5，6.6，6.7所示。表6.2員工管理測(cè)試用例表測(cè)試編號(hào)測(cè)試目的操作步驟預(yù)期結(jié)果實(shí)際結(jié)果001位置點(diǎn)一查詢某高校，并對(duì)目標(biāo)建筑進(jìn)行導(dǎo)航顯示推薦路線添加成功002位置點(diǎn)二查詢某高校，并查看目標(biāo)建筑論壇查看成功查看成功003位置點(diǎn)三查詢某高校，并對(duì)目標(biāo)建筑進(jìn)行預(yù)約預(yù)約成功預(yù)約成功圖6.4自動(dòng)定位界面圖6.5路線推薦界圖6.6論壇頁面圖6.6預(yù)約頁面圖6.7預(yù)約成功頁面6.4測(cè)試結(jié)論經(jīng)過使用多個(gè)測(cè)試用例對(duì)系統(tǒng)的部分功能進(jìn)行了全面測(cè)試，整個(gè)系統(tǒng)在測(cè)試過程中，都能很好的把正確數(shù)據(jù)呈現(xiàn)給用戶，不管是從系統(tǒng)的功能上、還是從系統(tǒng)的使用上，基本上都能達(dá)到我們當(dāng)初預(yù)計(jì)的結(jié)果。結(jié)論在本次研究所實(shí)現(xiàn)的基于微信小程序的地圖導(dǎo)航系統(tǒng)過程中，我們首先介紹了研究的現(xiàn)實(shí)意義，研究現(xiàn)狀，接下來我們說明了本次開發(fā)所使用的相關(guān)技術(shù)和基本原理知識(shí)，寫論文是一個(gè)不斷學(xué)習(xí)的過程，從最初剛寫論文時(shí)對(duì)面臨的問題的模糊認(rèn)識(shí)到最終能夠?qū)υ搯栴}有深刻的認(rèn)識(shí)，我體會(huì)到實(shí)踐對(duì)于學(xué)習(xí)的重要性，以前只是明白理論，沒有經(jīng)過實(shí)踐考察，對(duì)知識(shí)的理解不夠明確，經(jīng)過這次的做，真正做到理論時(shí)間相結(jié)合?？傊?，經(jīng)過畢業(yè)設(shè)計(jì)，我深刻體會(huì)到要做好一個(gè)完整的事情，需要有系統(tǒng)的思維方式和方法，對(duì)待要解決的問題，要耐心、要善于運(yùn)用已有的資源來充實(shí)自我。同時(shí)我也深刻的認(rèn)識(shí)到，在對(duì)待一個(gè)新事物時(shí)，必須要從整體研究，完成一步之后再作下一步，這樣才能更加效。本次研究還有著許多的不足之處，對(duì)地圖點(diǎn)定位的許多重要信息沒在數(shù)據(jù)庫中做好保存；界面設(shè)計(jì)不夠美觀，許多功能菜單和信息顯示界面處理的不簡(jiǎn)潔，整體界面效果不夠人性化等等，在接下來的工作中，我們將會(huì)對(duì)以上不足做出改進(jìn)，爭(zhēng)取讓開發(fā)的精準(zhǔn)扶貧系統(tǒng)逐步完善化。如今信息化發(fā)展如此之快，計(jì)算機(jī)技術(shù)被應(yīng)用于各個(gè)行業(yè)領(lǐng)域之中，各種管理系統(tǒng)的應(yīng)用也十分廣泛，當(dāng)前我們注意到已經(jīng)出現(xiàn)了很多地圖導(dǎo)航APP，而它們的某些特點(diǎn)和比較有優(yōu)勢(shì)的地方，是我開發(fā)的過程中可以參考的資源。微信小程序地圖導(dǎo)航系統(tǒng)的實(shí)現(xiàn)，將大大加快了便利，具有重要意見。參考文獻(xiàn)周穎,胡外光,陳敏蓮,胡珊珊.基于微信小程序的醫(yī)院WIFI室內(nèi)導(dǎo)航研究[J].現(xiàn)代經(jīng)濟(jì)信息,2019,(16):333-334.張紫甜,古麗米拉·克孜爾別克.基于GPS定位模塊制作高精細(xì)校園地圖[J].計(jì)算機(jī)時(shí)代,2018,(02):55-57+61.李欣,許佳勝,商貝寧.基于小程序的校園導(dǎo)航系統(tǒng)[J].計(jì)算機(jī)產(chǎn)品與流通,2020,(01):118.洪丹丹,張晉安,徐墨,鎖志海.移動(dòng)微校園建設(shè)及關(guān)鍵技術(shù)探討[J].中國(guó)教育網(wǎng)絡(luò),2016,(12):68-70.何毅.基于微信平臺(tái)的數(shù)字化微校園資源建設(shè)研究[D].南京師范大學(xué),2018.王子龍,馮特,趙晨帆,楊周.基于微信小程序的“易校園”平臺(tái)的研究與開發(fā)[J].技術(shù)與市場(chǎng),2021,28(02):112-113.項(xiàng)筱萌.智慧校園微信小程序云服務(wù)開發(fā)與構(gòu)建[J].信息記錄材料,2020,21(09):174-175.邵恒,張泳,王皓.基于微信小程序的旅游GIS系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].現(xiàn)代測(cè)繪,2019,42(01):33-35.湛朱喜,易澤慧,張強(qiáng).基于微信小程序的校園導(dǎo)游智能機(jī)器人[J].電腦知識(shí)與技術(shù),2019,15(11):76-77+80.黃榮,陳來斌,郭雪微,陳瑤,廉佐政,張光妲.基于微信小程序的校園助手設(shè)計(jì)與實(shí)現(xiàn)[J].齊齊哈爾大學(xué)學(xué)報(bào)(自然科學(xué)版),2018,34(06):41-43.朱玉強(qiáng).微信小程序在圖書館移動(dòng)服務(wù)中的應(yīng)用實(shí)踐——以排架游戲?yàn)槔齕J].圖書館論壇,2017,37(07):132-138.張艷慧,初雨晴,常宴寧.淺談微信小程序的發(fā)展與未來[J].電影迷,2018,No.97(06):43-43.孫幫會(huì).基于手機(jī)二維碼的校園智能導(dǎo)航系統(tǒng)研究[D].安徽理工大學(xué),2017.武思怡,解佺,張雨,侯秉昀.微信小程序開發(fā)研究[J].無線互聯(lián)科技,2018,15(11),52-54.雷英才.基于微信小程序的校園導(dǎo)覽系統(tǒng)的設(shè)計(jì)與開發(fā)[D].中國(guó)地質(zhì)大學(xué),2019.艾佳.微信小程序的現(xiàn)狀與發(fā)展[J].新媒體研究,2019,(9):80-81.周艷,蔣程程,張聰,覃夢(mèng)逗.輕量化校園地圖導(dǎo)覽小程序的設(shè)計(jì)與實(shí)現(xiàn)[J].地理信息世界,2021,28(01):61-67.柳葉.基于微信小程序的校園導(dǎo)航系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J].測(cè)繪與空間地理信息,2021,44(11):84-86.王金恒,陳堅(jiān)城,莫志裕,田桂豐.基于微信小程序的校園導(dǎo)航系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J].電腦編程技巧與維護(hù),2021,(06):77-79.X.Shiyong,D.Tianxiang,Z.Rongzheng,W.Rongsen.ResearchOnMybatisMapperModelBasedOnSQLTemplate[J].InInternationalConferenceonComputerEngineeringandApplication(ICCEA’2020),2020.W.Sheikh,N.Sheikh.Audiometry:Amodel-view-viewmodel(MVVM)applicationframeworkforhearingimpairmentdiagnosis[C].TheJournalofOpenSourceSoftware,2020,5(51):2-16.Q.Liu,H.Yuan.AHighPerformanceMemoryKey-ValueDatabaseBasedonRedis[J].ComputerScience,2019,14(3):170-183.\t"/en/Detail/index/GARJ2015/_blank"MaryleneS.Eder;\t"/en/Detail/index/GARJ2015/_blank"CatherineJeanL.Noceteand\t"/en/Detail/index/GARJ2015/_blank"GemelynL.Rances.WebInteractiveCampusMap[J].InternationalJournalofScientific&TechnologyResearch,2015,4(3):62-67.\t"/en/Detail/index/GARJ2021_2/_blank"NordinNoradila;\t"/en/Detail/index/GARJ2021_2/_blank"MarkomMarniAzira;\t"/en/Detail/index/GARJ2021_2/_blank"SuhaimiFarhanaAqilah.AWeb-BasedCampusNavigationSystemwithMobileAugmentedRealityIntervention[J].JournalofPhysics:ConferenceSeries,2021,1997(1)附錄packagecom.controller;importjava.util.Arrays;importjava.util.Calendar;importjava.util.Date;importjava.util.Map;importjavax.servlet.http.HttpServletRequest;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.stereotype.Controller;importorg.springframework.web.bind.annotation.GetMapping;importorg.springframework.web.bind.annotation.PathVariable;importorg.springframework.web.bind.annotation.PostMapping;importorg.springframework.web.bind.annotation.RequestBody;importorg.springframework.web.bind.annotation.RequestMapping;importorg.springframework.web.bind.annotation.RequestParam;importorg.springframework.web.bind.annotation.ResponseBody;importorg.springframework.web.bind.annotation.RestController;importcom.annotation.IgnoreAuth;importcom.baomidou.mybatisplus.mapper.EntityWrapper;importcom.entity.TokenEntity;importcom.entity.UsersEntity;importcom.service.TokenService;importcom.service.UsersService;importcom.utils.CommonUtil;importcom.utils.MPUtil;importcom.utils.PageUtils;importcom.utils.R;importcom.utils.ValidatorUtils;/***登錄相關(guān)*/@RequestMapping("users")@RestControllerpublicclassUsersController{ @Autowired privateUsersServiceuserService; @Autowired privateTokenServicetokenService; /** *登錄 */ @IgnoreAuth @PostMapping(value="/login") publicRlogin(Stringusername,Stringpassword,Stringcaptcha,HttpServletRequestrequest){ UsersEntityuser=userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",username)); if(user==null||!user.getPassword().equals(password)){ returnR.error("賬號(hào)或密碼不正確"); } Stringtoken=tokenService.generateToken(user.getId(),username,"users",user.getRole()); returnR.ok().put("token",token); } /** *注冊(cè) */ @IgnoreAuth @PostMapping(value="/register") publicRregister(@RequestBodyUsersEntityuser){// ValidatorUtils.validateEntity(user); if(userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",user.getUsername()))!=null){ returnR.error("用戶已存在"); }userService.insert(user);returnR.ok();} /** *退出 */ @GetMapping(value="logout") publicRlogout(HttpServletRequestrequest){ request.getSession().invalidate(); returnR.ok("退出成功"); } /***密碼重置*/@IgnoreAuth @RequestMapping(value="/resetPass")publicRresetPass(Stringusername,HttpServletRequestrequest){ UsersEntityuser=userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",username)); if(user==null){ returnR.error("賬號(hào)不存在"); } user.setPassword("123456");userService.update(user,null);returnR.ok("密碼已重置為：123456");} /***列表*/@RequestMapping("/page")publicRpage(@RequestParamMap<String,Object>params,UsersEntityuser){EntityWrapper<UsersEntity>ew=newEntityWrapper<UsersEntity>(); PageUtilspage=userService.queryPage(params,MPUtil.sort(MPUtil.between(MPUtil.allLike(ew,user),params),params));returnR.ok().put("data",page);} /***列表*/@RequestMapping("/list")publicRlist(UsersEntityuser){ EntityWrapper<UsersEntity>ew=newEntityWrapper<UsersEntity>(); ew.allEq(MPUtil.allEQMapPre(user,"user"));returnR.ok().put("data",userService.selectListView(ew));}/***信息*/@RequestMapping("/info/{id}")publicRinfo(@PathVariable("id")Stringid){UsersEntityuser=userService.selectById(id);returnR.ok().put("data",user);}/***獲取用戶的session用戶信息*/@RequestMapping("/session")publicRgetCurrUser(HttpServletRequestrequest){ Longid=(Long)request.getSession().getAttribute("userId");UsersEntityuser=userService.selectById(id);returnR.ok().put("data",user);}/***保存*/@PostMapping("/save")publicRsave(@RequestBodyUsersEntityuser){// ValidatorUtils.validateEntity(user); if(userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",user.getUsername()))!=null){ returnR.error("用戶已存在"); }userService.insert(user);returnR.ok();}/***修改*/@RequestMapping("/update")publicRupdate(@RequestBodyUsersEntityuser){//ValidatorUtils.validateEntity(user); UsersEntityu=userService.selectOne(newEntityWrapper<UsersEntity>().eq("username",user.getUsername())); if(u!=null&&u.getId()!=user.getId()&&u.getUsername().equals(user.getUsername())){ returnR.error("用戶名已存在。"); }userService.updateById(user);//全部更新returnR.ok();}/***刪除*/@RequestMapping("/delete")publicRdelete(@RequestBodyLong[]ids){userService.deleteBatchIds(Arrays.asList(ids));returnR.ok();}}packagecom.controller;importjava.text.SimpleDateFormat;importjava.util.ArrayList;importjava.util.Arrays;importjava.util.Calendar;importjava.util.Map;importjava.util.HashMap;importjava.util.Iterator;importjava.util.Date;importjava.util.List;importjavax.servlet.http.HttpServletRequest;importcom.utils.ValidatorUtils;importmons.lang3.StringUtils;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.transaction.annotation.Transactional;importorg.springframework.format.annotation.DateTimeFormat;importorg.springframework.web.bind.annotation.PathVariable;importorg.springframework.web.bind.annotation.RequestBody;importorg.springframework.web.bind.annotation.RequestMapping;importorg.springframework.web.bind.annotation.RequestParam;importorg.springframework.web.bind.annotation.RestController;importcom.baomidou.mybatisplus.ma