目 錄

摘 要 I
Abstract II
引 言 1
1 相關技術及開發(fā)環(huán)境介紹 3
1.1 相關技術 3
1.1.1 微信小程序 3
1.1.2 uni-app 3
1.1.3 JFinal 3
1.1.4 MySQL數(shù)據(jù)庫 3
1.2 開發(fā)環(huán)境 3
1.2.1 IDEA 3
1.2.2 微信開發(fā)者工具 4
1.2.3 HBuilderX 4
1.3 本章小結 4
2 系統(tǒng)分析 5
2.1 系統(tǒng)可行性需求分析 5
2.2 系統(tǒng)功能需求分析 5
2.3 本章小結 6
3 系統(tǒng)設計 7
3.1 系統(tǒng)的功能結構設計 7
3.2 軟件體系結構設計 8
3.3 數(shù)據(jù)庫設計 9
3.4 本章小結 16
4 系統(tǒng)實現(xiàn) 17
4.1 開發(fā)環(huán)境 17
4.2 系統(tǒng)和數(shù)據(jù)庫的配置 17
4.3 開發(fā)規(guī)范 17
4.3.1 書寫規(guī)則 17
4.3.2 程序注釋 17
4.4 各個功能模塊的詳細設計 18
4.4.1 首頁 18
4.4.2 我要報備模塊 18
4.4.3 委托帶看模塊 19
4.4.4 我的團隊模塊 21
4.4.5 發(fā)圈圖文模塊 21
4.4.6 我的模塊 22
4.4.7 客戶模塊 23
4.5 本章小結 24
5 系統(tǒng)測試 25
5.1 測試概述 25
5.2 測試用例 25
5.3 性能測試 26
5.4 測試結果 27
5.5 本章小結 27
結 論 28
致 謝 29
參考文獻 30
附 錄 32

摘 要

現(xiàn)在的社會是計算機技術飛速發(fā)展的時代，并取代了人力，而房產(chǎn)行業(yè)逐漸興起，房產(chǎn)經(jīng)紀人每次帶看分傭成為了這個行業(yè)的痛點，因此設計了智能高傭報備系統(tǒng)，可以達到節(jié)約房產(chǎn)經(jīng)紀人成本的效果。本系統(tǒng)沒有選擇移動APP，而是選擇現(xiàn)在非常熱門的微信小程序軟件來展示給用戶。截止目前，開發(fā)微信小程序的技術是多種多樣的，在對比當今幾款主流的框架時，由于uni-app相比于其他開發(fā)框架技術擁有更多的優(yōu)勢，最終選擇了使用uni-app技術開發(fā)智能高傭報備系統(tǒng)。通過對房產(chǎn)經(jīng)紀人工作的調(diào)研，并充分考慮未來用戶需求，本文運用uni-app技術，采用MySQL數(shù)據(jù)庫對樓盤信息數(shù)據(jù)進行緩存，本系統(tǒng)突出之處在于對樓盤信息數(shù)據(jù)針對性的精確分析。
本論文首先介紹項目中運用到的相關技術uni-app、JFinal、MySQL數(shù)據(jù)庫等；說明uni-app框架應用在智能高傭報備系統(tǒng)的原理；描述基于uni-app的智能高傭報備系統(tǒng)的主要功能的應用實現(xiàn)；另外說明選擇uni-app技術開發(fā)智能高傭報備系統(tǒng)的主要原因，在總結中說明遇到的uni-app技術問題的解決辦法或者注意事項；最后對基于uni-app的智能高傭報備系統(tǒng)進行系統(tǒng)測試，并分析測試結果。
關鍵詞：uni-app；微信小程序；JFinal；

Abstract

Modern society is the age of rapid development of computer which has displaced human.However,the real estate industry is gradually rising,every time real estate agents to see the commission has become a agnoy in this industry.Thus,designing an intelligent high commission reporting system in order to save the cost of real estate agents.This system doesn’t choose mobile APP,but choose the extremely popular WeChat small program to show to users.So far,the development of WeChat small program is diverse.Comparing to some present mainstream frameworks,uni-app has more advantages than other development framework,Therefore,finally uni-app is choosed to develop an intelligent high commission reporting system.Through the investigation of real estate brokers’work and the full consideration of the user demand in the future,the paper employs uni-app and MySQL database to cache the real estate information data.The exceptional advantage of this system is the targeted and accurate analysis for real estate information data.
The paper firstly introduces relevant technologies that projects use,such as uni-app,JFinal,MySQL database.It explains the principle of uni-app applied in the intelligent high commission reporting system and describes the application and accomplishment of the main functions of uni-app-based intelligent high commission reporting.Furthermore,it the main reasons for choosing uni-app to develop intelligent high commission reporting system.In conclusion,it moentions the solutions or matters needing attention if uni-app encounters problems.Finally,testing and analyzing the result of the uni-app-based intelligent high commission reporting system.Firstly introduces relevant technologies that projects use,uni-app,JFinal,MySQL database.Secondly,it explains the principle of uni-app framework applied in the intelligent high commission reporting system and describes the application and accomplishment of the main functions of uni-app-based intelligent high commission reporting.The main reasons for choosing uni-app to develop intelligent high commission reporting system.It moentions the solutions or matters needing attention if uni-app encounters problems.Finally,testing uni-app based intelligent high commission reporting system and analyzing its result.
Keywords: Uni - app; WeChat applet; JFinal;

引 言

當今移動互聯(lián)網(wǎng)日新月異，在《第38次中國互聯(lián)網(wǎng)絡發(fā)展狀況統(tǒng)計報告》中顯示[1]，用戶的上網(wǎng)設備由PC端進一步向移動端遞進。移動APP的出現(xiàn)，滿足了用戶多樣化的需求，但是用戶在使用APP的過程中不可避免的給用戶和手機自身造成了很多困擾。因此騰訊公司推出了一個新思路“小程序”，主打一個新概念“輕量級”[2]。
隨著移動互聯(lián)網(wǎng)的不斷發(fā)展，網(wǎng)絡應用和移動互聯(lián)網(wǎng)產(chǎn)品日益朝著“微、小、輕”的方向不斷前進，微信小程序就是一個重要體現(xiàn)。2016年初微信之父張小龍?zhí)岢鲆环N新的應用形態(tài)[3]，那就是基于微信的一種“小程序”應用，其目的是為了讓微信用戶更好地在網(wǎng)絡化的今天方便地享受優(yōu)質(zhì)服務[4]。微信小程序具有明顯的優(yōu)點, 如開發(fā)成本低、學習成本低以及反應速度快等, 正在不斷的贏得用戶和市場的廣泛認可[5]。相比移動APP，也有很多的優(yōu)勢，開發(fā)成本低，只面向微信的所有用戶群體，通過微信APP掃一掃、分享小程序、搜索小程序名稱等方式即可使用[6]，無需下載安裝更新，產(chǎn)品發(fā)布只需向微信公眾平臺提交審核，不占用手機的內(nèi)存空間，而且小程序不允許主動給用戶發(fā)送廣告等[7]?！度嗣袢請蟆肺⑿判〕绦虻耐瞥?，實現(xiàn)了多媒體內(nèi)容生產(chǎn)和用戶之間的雙向交流，在輿論引導和盈利模式的重構等方面取得重大成就[8]。
開發(fā)微信小程序的方式主要分為原生開發(fā)和框架開發(fā)，但是框架開發(fā)又有很多，主要是wepy、mpvue、taro、uni-app主流開發(fā)框架[9]。
基于uni-app的智能高傭報備系統(tǒng)是一個可以應用在全國各地的樓盤報備信息系統(tǒng)，本課題是從當前沈陽城市房產(chǎn)經(jīng)紀人報備樓盤信息審核過程困難為切入點，以滿足經(jīng)紀人報備樓盤信息的需求為核心目標設計開發(fā)了該項目。本系統(tǒng)旨在服務于工作在房產(chǎn)租賃的經(jīng)紀人人群，用戶使用本系統(tǒng)可直觀立體的觀察到所在城市的樓盤信息等。本系統(tǒng)具有一定的社會價值和實用價值，能夠通過多種方式呈現(xiàn)租房信息分析數(shù)據(jù)，可有效減輕房產(chǎn)經(jīng)紀人工作的壓力，使廣大客戶得到最好的服務待遇。
本課題研究微信小程序在房產(chǎn)領域的應用分析與現(xiàn)狀以及未來的發(fā)展前景，其中主要論述了利用uni-app技術開發(fā)微信小程序的應用與實現(xiàn)，對比微信小程序幾種主流的開發(fā)方式，說明選擇用uni-app技術開發(fā)智能高傭報備系統(tǒng)的主要原因，文章從以下五個方面分別闡述：系統(tǒng)相關技術以及系統(tǒng)開發(fā)環(huán)境的介紹，介紹智能高傭報備系統(tǒng)中運用到的相關技術內(nèi)容以及使用的開發(fā)工具，微信小程序、uni-app、JFinal、MySQL等，并對這些技術以及開發(fā)工具進行總結；系統(tǒng)分析，系統(tǒng)的可行性需求分析，包括對智能高傭報備系統(tǒng)的前后臺進行需求分析等；系統(tǒng)設計，包括基于uni-app智能高傭報備系統(tǒng)的功能結構設計，數(shù)據(jù)庫的選擇與應用，以及軟件體系結構的設計等；系統(tǒng)功能實現(xiàn)，闡述了針對系統(tǒng)設計方案的具體實現(xiàn)方法，其中包括代碼規(guī)范，開發(fā)環(huán)境及注釋規(guī)范等；系統(tǒng)測試，對基于uni-app智能高傭報備系統(tǒng)所進行得系統(tǒng)測試與功能測試，舉例說明包括測試用例與測試計劃等。

1 相關技術及開發(fā)環(huán)境介紹

1.1 相關技術
1.1.1 微信小程序
智能高傭報備系統(tǒng)是基于微信小程序技術的一款應用軟件。微信小程序?qū)儆谛〕绦虻囊环N，是一種只需要用微信APP掃一掃或者搜索軟件的名稱就可以使用的應用軟件[10]。它避免了下載、安裝、更新、卸載、內(nèi)存占有率以及導致手機卡頓的行為，只需要安裝微信應用APP，搜索目標小程序打開即可使用[11]。
1.1.2 uni-app
智能高傭報備系統(tǒng)的前端使用的是uni-app框架。uni-app框架主要的核心是基于Vue.js的前端框架。uni-app框架相比于其他開發(fā)框架的優(yōu)點在于只需要一套利用Vue.js編寫的代碼即可將其編譯到蘋果系統(tǒng)、安卓系統(tǒng)、小程序等多個平臺，實現(xiàn)了一套代碼多端共享。
1.1.3 JFinal
智能高傭報備系統(tǒng)的后臺管理系統(tǒng)采用以JFinal為核心的Java MVC架構，是基于Java語言的極速WEB+ORM框架[12]。JFinal框架采用Model View Controller架構，遵循Convention over Configuration原則，而且數(shù)據(jù)庫的開發(fā)相比于其他框架速度明顯加快，且無第三方依賴等。JFinal框架學習成本低、功能強大，對于小企業(yè)公司選擇JFinal框架進行后臺開發(fā)，節(jié)約成本。
1.1.4 MySQL數(shù)據(jù)庫
智能高傭報備系統(tǒng)使用的數(shù)據(jù)庫是MySQL數(shù)據(jù)庫。MySQL是一種關系型數(shù)據(jù)庫管理系統(tǒng)，MySQL數(shù)據(jù)庫相比于Oracle、PostgreSQL有很多優(yōu)勢，首先是開源的，不需要支付任何費用，其次可以處理成千上萬條記錄，還支持多種語言等。
1.2 開發(fā)環(huán)境
1.2.1 IDEA
使用IDEA開發(fā)工具設計本項目的后臺管理系統(tǒng)，IDEA全稱IntelliJ IDEA，是Java編程語言開發(fā)的集成環(huán)境。主要支持PostgreSQL、MySQL、Oracle等數(shù)據(jù)庫類，還支持SpringMVC、GWT、Play、Web Services、Struts等框架，以及支持Tomcat、WebLogin等容器。
1.2.2 微信開發(fā)者工具
微信開發(fā)者工具目前由微信官方網(wǎng)站所公布的相關小程序開發(fā)工具為微信Web開發(fā)者工具，并由官方網(wǎng)站來提供小程序的前端開發(fā)框架[13]。微信開發(fā)者工具需要使用微信登錄，提前配置好項目的AppID等內(nèi)容，可以在微信開發(fā)者工具上進行上傳代碼并發(fā)布到對應的微信公眾平臺賬號上，更新系統(tǒng)很方便。
1.2.3 HBuilderX
HBuilderX來設計智能高傭報備系統(tǒng)的前端，HBuilderX是推出的一款基于HTML5的最新的Web開發(fā)工具。而HBuilderX相對于HBuilder性能更高，啟動更快，頁面更加美觀等，但是響應速度沒有HBuilder快，并不影響項目的開發(fā)。
1.3 本章小結
在智能高傭報備系統(tǒng)的開發(fā)過程里，需要對開發(fā)微信小程序的相關技術有著充分的了解，本章主要進行了相關技術知識的闡述，而且介紹在開發(fā)微信小程序的過程中主要使用的相關技術以及開發(fā)工具。

2 系統(tǒng)分析

2.1 系統(tǒng)可行性需求分析
無論開發(fā)人員開發(fā)什么項目[14]，可行性需求分析是在程序員開發(fā)前必須要做的工作，通常是由專業(yè)人員來進行的。下面對基于uni-app的智能高傭報備系統(tǒng)進行實際的需求分析。
基于uni-app的智能高傭報備系統(tǒng)是一個可以應用在全國各地的經(jīng)紀人在為用戶提交報備信息的同時能夠得到更好的處理的微信小程序。本課題是從當前沈陽城市房產(chǎn)經(jīng)紀人在報備樓盤信息時流程復雜等為切入點，以滿足經(jīng)紀人快速報備信息并且能夠立即處理的需求為核心目標設計開發(fā)了該項目。本系統(tǒng)旨在服務于房產(chǎn)領域的經(jīng)紀人客戶，用戶使用本系統(tǒng)可直觀立體的觀察到各個經(jīng)紀人報備樓盤、委托帶看以及每個人之間的分傭信息等。
本系統(tǒng)具有一定的社會價值和實用價值，能夠通過多種方式呈現(xiàn)報備樓盤信息迅速得到處理的數(shù)據(jù)，可有效減輕經(jīng)紀人的壓力，使廣大房產(chǎn)領域在處理報備樓盤信息的時候得到更高的效率。
2.2 系統(tǒng)功能需求分析
基于uni-app的智能高傭報備系統(tǒng)的開發(fā)，首先需要確定系統(tǒng)[15]要實現(xiàn)的功能是什么，也就是用戶想要這個系統(tǒng)達到怎樣的工作效率。用戶使用基于uni-app的智能高傭報備系統(tǒng)是按照一定的流程來進行的：用戶首先掃碼或者其他途徑在微信找到該小程序，之后用戶注冊登錄進入小程序，瀏覽智能高傭報備小程序的幾大版塊，通過我要報備模塊提供給經(jīng)紀人對自己的服務客戶的需求進行上報，房產(chǎn)經(jīng)紀人還可以通過發(fā)起報備單途徑尋找更合適的同事進而更好的服務客戶；小程序還提供給用戶，可以通過發(fā)圈圖文功能查看最新的話題或者管理員發(fā)布的其他相關樓盤的內(nèi)容等，用戶可以通過一鍵轉發(fā)分享給自己的親朋好友，而且可以通過搜索查找已有的話題；管理員要管理樓盤信息、用戶的報備情況以及房產(chǎn)經(jīng)紀人之間的分傭記錄等，以上只是本系統(tǒng)的一些核心需求分析，但決定了系統(tǒng)所應具有的功能。
普通用戶通過本系統(tǒng)可了解到各大品牌的樓盤信息，知道有哪些利于自己客戶的樓盤，節(jié)省自己開發(fā)樓盤的開銷。能夠通過本系統(tǒng)找到價格實惠，符合現(xiàn)狀的樓盤信息，并更好的提供給自己的客戶，讓客戶都得到最好的待遇。本系統(tǒng)的前后臺總共分為兩種身份，分別是管理員身份與普通用戶身份，如圖2.1所示。

圖2.1 系統(tǒng)設計圖
2.3 本章小結
本章主要闡述了對基于uni-app的智能高傭報備系統(tǒng)的分析。包括需求分析、功能分析、可行性分析等。首先分析了系統(tǒng)的分析原則和設計目標，并給出了基于uni-app的智能高傭報備系統(tǒng)的功能需求分析。

3 系統(tǒng)設計

3.1 系統(tǒng)的功能結構設計
由分功能或功能單元按照其邏輯關系連成的結構稱為功能結構[16]。一個項目的功能結構設計是項目開發(fā)之前的準備工作，項目在日后開發(fā)能否順利進行，并達到用戶的需求，就一定要做好系統(tǒng)的功能結構設計。
基于uni-app的智能高傭報備系統(tǒng)分管理員和普通用戶兩個用戶角色，核心大功能模塊分別有報備信息模塊、委托帶看模塊、分傭信息模塊、用戶信息模塊、樓盤信息模塊、樓盤展示模塊、發(fā)圈圖文模塊、個人中心模塊等。每個功能模塊之間都有著相關聯(lián)系，基于uni-app的智能高傭報備系統(tǒng)的管理員可以對用戶信息進行操作，對樓盤信息進行操作，對報備信息進行操作等。具體信息如圖3.1所示。

圖3.1 系統(tǒng)管理員功能結構圖
基于uni-app的智能高傭報備系統(tǒng)的用戶首先需要注冊賬戶，通過正確的賬號密碼來登錄本系統(tǒng)，登錄成功后進入首頁。首頁中用戶可以選擇各個菜單進行操作，并且還能夠瀏覽用戶提交的報備信息、瀏覽樓盤信息、查詢所在城市樓盤信息、瀏覽用戶的個人信息、瀏覽地鐵附近樓盤信息、瀏覽發(fā)圈圖文內(nèi)容、瀏覽其他用戶發(fā)起的委托帶看報備單信息并接單等功能。具體信息如圖3.2所示。

圖3.2 系統(tǒng)用戶功能結構圖
3.2 軟件體系結構設計
計算機技術現(xiàn)如今非常成熟, 當前情況下, 計算機軟件呈現(xiàn)多樣化的發(fā)展形勢[17], 因此為了保證計算機軟件運行的穩(wěn)定性, 加強計算機軟件應用體系結構分析和規(guī)劃是非常必要的。基于uni-app的智能高傭報備系統(tǒng)的軟件體系結構主要由兩部分組成，分為view 模塊和 service 模塊[18]，其中view模塊主要是代表前端展示部分，而service模塊主要代表的是與后臺的對接部分，這兩個模塊分別于系統(tǒng)層進行傳輸數(shù)據(jù)等操作，從而表達了微信小程序的軟件體系結構。具體信息如圖3.3.所示。

圖3.3 微信小程序view和service的結構示意圖
基于uni-app的智能高傭報備系統(tǒng)具有雙線程模型的特點，是小程序框架與前端框架的不同軟件體系結構?；陔p線程模型的特點，可以更好地為本系統(tǒng)提供更安全的環(huán)境。具體的雙線程模型邏輯如圖3.4所示。

圖3.4 雙線程模型圖
3.3 數(shù)據(jù)庫設計
數(shù)據(jù)庫設計在整個系統(tǒng)的運行過程中，是其最為重要的核心，其設計工作的質(zhì)量時刻關系著系統(tǒng)的工作質(zhì)量[19]?；趗ni-app的智能高傭報備系統(tǒng)創(chuàng)建數(shù)據(jù)庫時采用utf-8的語法規(guī)則，然后根據(jù)庫表名命名遵循的規(guī)則所知，數(shù)據(jù)庫表的命名規(guī)范：本系統(tǒng)的數(shù)據(jù)庫的所有數(shù)據(jù)表都是用下劃線拼接來命名的。數(shù)據(jù)表的名稱不能取得太長，并且要以英文命名，使用英文是主要的要求，應該說這是一個好的程序員的習慣問題。
在起表名時應該盡量避免用關鍵字作為前綴或者表名，應該根據(jù)每個數(shù)據(jù)表想要表達的含義翻譯成對應的英文，一般的數(shù)據(jù)表名都是復數(shù)形式。在一個項目中的數(shù)據(jù)庫的數(shù)據(jù)表中肯定有相互關聯(lián)的數(shù)據(jù)表，此時可以使用相互關聯(lián)的數(shù)據(jù)表的表名或者前綴拼接在一起使用。需要注意的是，字段說明和字段名盡量保持一致，這樣可以讓一起開發(fā)的同事能夠提高開發(fā)系統(tǒng)的進度。
本系統(tǒng)包含了不低于20個數(shù)據(jù)庫表，存在著主外鍵的關系，基于uni-app的智能高傭報備系統(tǒng)的數(shù)據(jù)庫設計在項目開發(fā)系統(tǒng)設計過程中，數(shù)據(jù)庫表要設計的盡可能完善，預防在后來需求變更、功能擴充的時候，引起不必要的問題?；趗ni-app的智能高傭報備系統(tǒng)的具體核心數(shù)據(jù)表信息如表3.1所示。
表3.1 數(shù)據(jù)庫表列表
序號 表名 說明
1 of_ads 廣告表
2 of_agreements 協(xié)議表
3 of_attach 附件表
4 of_brokerage 用戶傭金記錄表
5 of_cities 地區(qū)表
6 of_commission_policys 傭金政策表
7 of_companys 開發(fā)商表
8 of_greenhand 新手必看表
9 of_houses_applications 盤源合作申請表
10 of_houses_assorts 樓盤配套信息表表
11 of_houses_info 樓盤信息表
12 of_houses_needs 我要找盤申請表
13 of_houses_params 樓盤參數(shù)表
14 of_img_text 發(fā)圈圖文表
15 of_invites 推薦記錄表
16 of_members 用戶表
17 of_params 參數(shù)表
18 of_partner_application 申請合伙人表
19 of_report_companys 報備公司表
20 of_reports 報備單表
21 of_reports_entrust 報備委托帶看表
22 of_reports_files 報備單資料表
23 of_sys_user 系統(tǒng)用戶表
基于uni-app的智能高傭報備系統(tǒng)其中較為重要的表設計是樓盤信息表(of_houses_info)，用來存儲各個城市的各個地區(qū)的樓盤信息，使用戶在查看樓盤信息的時候更加清晰。其中樓盤信息表包括但不限于編號、開發(fā)商ID、開發(fā)商名稱、報備公司ID、報備公司名稱、樓盤名稱、省、市、區(qū)、聯(lián)系人、聯(lián)系人電話、申請人、展示圖、簡介、戶型圖片、其他信息等。具體設計如表3.2所示。
表3.2 樓盤信息表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT(11) PRIMARY KEY 編號
2 company_id VARCHAR(255) 開發(fā)商ID
3 company_name VARCHAR(20) 開發(fā)商名稱
4 report_companyid INT(11) 報備公司id
5 report_companyname VARCHAR(255) 報備公司名稱
6 house_name VARCHAR(255) 樓盤名稱
7 province VARCHAR(60) 省
8 city VARCHAR(60) 市
9 district VARCHAR(60) 區(qū)
10 address VARCHAR(255) 項目地址
11 price DECIMAL(11,2) 在售均價
12 deadline DATE 合作期限
13 contact VARCHAR(60) 聯(lián)系人
14 telephone VARCHAR(20) 聯(lián)系人電話
15 apply_member INT(11) 申請人
16 pics TEXT 展示圖
17 intro LONGTEXT 簡介
18 type_pics TEXT 戶型圖片
19 other_info TEXT 其他信息
20 sale_area VARCHAR(255) 在售面積
21 data_name VARCHAR(255) 資料標題
22 house_data TEXT 樓盤資料
23 get_commission VARCHAR(255) 到手傭
24 pay_remark VARCHAR(255) 結傭備注
25 report_require VARCHAR(255) 報備要求
26 is_show TINYINT(4) 是否顯示手機號
27 is_rec TINYINT(4) 是否推薦
表3.2續(xù)頁
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
28 looks INT(11) 瀏覽量
基于uni-app的智能高傭報備系統(tǒng)其中較為重要的表設計有報備單表(of_reports)，用來存儲房源經(jīng)紀人的報備信息內(nèi)容，該表以標識每條記錄。其中包括但不限于id，訂單編號，訂單類型，報備人ID、報備人手機號等。具體設計如表3.3所示。
表3.3 報備單表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT(11) PRIMARY KEY 編號
2 order_num VARCHAR(60) 訂單編號
3 type VARCHAR(20) 訂單類型
4 member_id INT(11) 報備人ID
5 telephone VARCHAR(15) 報備人手機號
6 report_time DATETIME 報備時間
7 company VARCHAR(255) 報備公司
8 last_name VARCHAR(255) 客戶姓氏
9 sex VARCHAR(20) 客戶性別
10 custom_telephone VARCHAR(255) 客戶手機號
11 house_id VARCHAR(155) 項目id
12 house_name VARCHAR(555) 項目名
13 visit_time DATETIME 到訪時間
14 visit_method VARCHAR(20) 到訪方式
15 plate_num VARCHAR(60) 車牌號
16 departure VARCHAR(60) 出發(fā)地點
17 lead_member INT(11) 帶看人
18 rate TINYINT(4) 傭金比例
19 account DECIMAL(11,2) 傭金總額
20 status TINYINT(4) 訂單狀態(tài)
21 deal_user INT(11) 處理人

表3.3續(xù)頁
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
22 deal_time DATETIME 處理時間
23 formid VARCHAR(255) 小程序formid
基于uni-app的智能高傭報備系統(tǒng)其中較為重要的表設計有報備委托帶看表(of_reports_entrust)，用來存儲房源經(jīng)紀人的報備委托帶看信息內(nèi)容，該表以標識每條記錄。其中包括但不限于id，訂單編號，訂單類型，報備人ID、報備人手機號等。具體信息如表3.4所示。
表3.4 報備委托帶看表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT（11） PRIMARY KEY 編號
2 order_num VARCHAR(60) 訂單編號
3 member_id INT（11） 報備人
4 member_mobile VARCHAR(15) 報備人手機
5 last_name VARCHAR(60) 客戶姓氏
6 sex VARCHAR(20) 客戶性別
7 telephone VARCHAR(15) 客戶手機號碼
8 is_show TINYINT(4) 手機號是否隱藏
9 source VARCHAR(20) 客戶來源
10 house_ids TEXT 項目id
11 house_names TEXT 項目名
12 usefor VARCHAR(20) 用途
13 type VARCHAR(20) 類型
14 district VARCHAR(255) 區(qū)域
15 budget VARCHAR(60) 預算
16 area VARCHAR(60) 面積
17 house_type VARCHAR(60) 戶型
18 remark VARCHAR(255) 備注
19 rate TINYINT(4) 分傭比例
20 entrust_num INT(11) 委托量

表3.4續(xù)頁
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
21 visit_time DATETIME 到訪時間
22 report_time DATETIME 報備時間
23 lead_member INT(11) 帶看人ID
24 receive_time DATETIME 接單時間
25 is_open TINYINT(4) 是否開放接單權限
26 status TINYINT(4) 狀態(tài)
27 account DECIMAL(11,2) 傭金總額
28 deal_user INT(11) 處理人
29 deal_time DATETIME 處理時間
基于uni-app的智能高傭報備系統(tǒng)的普通用戶的登錄信息表，記錄了用戶的登錄信息。其中包含但不限于id、用戶類別、手機號、密碼、昵稱、頭像等。具體信息如表3.5所示。
表3.5 用戶信息表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT（11） PRIMARY KEY 編號
2 type TINYINT(4) 用戶類別
3 mobile VARCHAR(13) 手機號
4 password VARCHAR(200) 密碼
5 nickname VARCHAR(255) 昵稱
6 photo VARCHAR(255) 頭像
7 openid VARCHAR(255) openid
8 unionid VARCHAR(255) unionid
9 session_key VARCHAR(255) session_key
10 invite_code VARCHAR(60) 邀請碼
11 invite_id INT(11) 推薦人ID
12 real_name VARCHAR(60) 真實姓名
13 work_area VARCHAR(255) 工作區(qū)域
14 card_name VARCHAR(60) 開戶姓名

表3.5續(xù)頁
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
15 id_number VARCHAR(60) 身份證號
16 card_number VARCHAR(60) 銀行卡號
17 card_bank VARCHAR(255) 開戶銀行
18 audit_status TINYINT(4) 審核狀態(tài)
19 todo_account DECIMAL(11,2) 待結傭金
20 done_account DECIMAL(11,2) 已結傭金
21 is_partner TINYINT(4) 是否合伙人
22 is_allow TINYINT(4) 是否可接單
23 status TINYINT(4) 狀態(tài)
24 last_login_time DATETIME 最后登錄時間
25 register_time DATETIME 注冊時間
基于uni-app的智能高傭報備系統(tǒng)的傭金政策表，記錄了每個樓盤的傭金政策信息等。其中包含但不限于id、樓盤ID、名稱、前傭比例、前傭金額、后傭比例、后傭金額以及獎金等。具體信息如表3.6所示。
表3.6 傭金政策表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT（11） PRIMARY KEY 編號
2 house_id INT（11） 樓盤ID
3 name VARCHAR(60) 名稱
4 ratio_bef DECIMAL(4,1) 前傭比例
5 policy_bef DECIMAL(11,2) 前傭金額
6 ratio_aft DECIMAL(4,1) 后傭比例
7 policy_aft DOUBLE(11,2) 后傭金額
8 bonus DECIMAL(11,2) 獎金
9 policy VARCHAR(255) 傭金
10 status TINYINT(4) 狀態(tài)
基于uni-app的智能高傭報備系統(tǒng)的開發(fā)商表，記錄了每個樓盤的開發(fā)商信息等。其中包含但不限于id、開發(fā)商名稱、是否品牌開發(fā)商、聯(lián)系人姓名、排序、聯(lián)系人電話等。具體信息如表3.7所示。
表3.7 開發(fā)商表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT（11） PRIMARY KEY 編號
2 name VARCHAR(255) 開發(fā)商名稱
3 is_famous TINYINT(4) 是否品牌開發(fā)商
4 contact VARCHAR(60) 聯(lián)系人姓名
5 telephone VARCHAR(15) 聯(lián)系人電話
6 sort INT(8) 排序
7 status TINYINT(4) 狀態(tài)
8 is_del TINYINT(4) 刪除狀態(tài)
基于uni-app的智能高傭報備系統(tǒng)的發(fā)圈圖文表，該表記錄了系統(tǒng)管理員發(fā)表的圖文內(nèi)容等，其中包含但不限于id、圖文類型、文本、圖片、樓盤id、樓盤名稱等。具體信息如表3.8所示。
表3.8 發(fā)圈圖文表
序號 數(shù)據(jù)字段 數(shù)據(jù)類型 約束 存儲內(nèi)容
1 id INT（11） PRIMARY KEY 編號
2 type VARCHAR(20) 圖文類型（樓盤推薦/營銷素材）
3 text TEXT 文本
4 imgs TEXT 圖片
5 house_id INT(11) 樓盤id
6 house_name VARCHAR(255) 樓盤名稱
7 date DATE 日期
8 share_num INT(11) 分享人數(shù)
3.4 本章小結
本章主要介紹了基于uni-app的智能高傭報備系統(tǒng)的功能結構設計方案。首先介紹了基于uni-app的智能高傭報備系統(tǒng)的軟件體系結構的設計，然后敘述了主要模塊的數(shù)據(jù)庫設計，其中有樓盤信息表、開發(fā)商表等數(shù)據(jù)庫表。

4 系統(tǒng)實現(xiàn)

4.1 開發(fā)環(huán)境
基于uni-app的智能高傭報備系統(tǒng)的所在開發(fā)環(huán)境的操作系統(tǒng)是64位的Win10操作系統(tǒng)；內(nèi)存為8.00 GB；瀏覽器是Google；開發(fā)工具是IntelliJ IDEA 2019.2.4，微信開發(fā)者工具，HbuilderX；以上足以滿足基于uni-app的智能高傭報備系統(tǒng)的開發(fā)需求。
4.2 系統(tǒng)和數(shù)據(jù)庫的配置
基于uni-app的智能高傭報備系統(tǒng)是按照B/S模式即瀏覽器與服務器交互進行設計的。B/S模式這種模式相對于C/S的優(yōu)點有維護和升級方式簡單，大大降低了維護與開發(fā)的成本，對開發(fā)者來說有更多的可能性。如圖4.1所示。

圖4.1 B/S結構模式圖
4.3 開發(fā)規(guī)范
4.3.1 書寫規(guī)則
開發(fā)一個完整的項目，最需要注意的一點就是在編寫代碼的時候一定按照書寫規(guī)則進行編碼，其中書寫規(guī)則包括但不限于大小括號、函數(shù)定義、構造函數(shù)、判斷語句、循環(huán)語句等規(guī)范。例如，較長的語句或者表達式應該合理的進行換行，不要寫在一行；每個關鍵詞和符號之間需要加空格，看起來更加清晰明了；注意幾種括號之間的使用規(guī)則。
4.3.2 程序注釋
每個項目開發(fā)人員都要寫好相關必要的注釋，書寫注釋也是要求規(guī)范的。每個腳本的上方都要有自己的注釋規(guī)則，其規(guī)則必須包含有關本程序，也就是基于uni-app的智能高傭報備系統(tǒng)的信息描述、作者、日期、版本信息、項目名稱以及文件的名稱，還有重要的使用說明，注意事項，調(diào)用關系之間的說明等。
4.4 各個功能模塊的詳細設計
4.4.1 首頁
用戶掃描智能高傭報備小程序的二維碼進入系統(tǒng)的首頁，可以看到底部是系統(tǒng)的底部導航欄，頂部為系統(tǒng)名稱，頁面由上到下分別為：定位、搜索、輪播圖展示等內(nèi)容。具體的信息如圖4.2所示。

圖4.2 基于uni-app的智能高傭報備系統(tǒng)首頁
4.4.2 我要報備模塊
用戶進入首頁，若要進行樓盤報備，即點擊“我要報備”菜單，必須先進行登錄，否則無法進行樓盤報備，這樣有利于保護樓盤信息的安全等。進入我要報備頁面后，根據(jù)頁面中的提示進行輸入內(nèi)容，輸入的內(nèi)容包括但不限于報備公司，選擇樓盤，客戶信息等，其中報備公司、選擇樓盤以及客戶信息為必填項，客戶可以添加多個但最少一個，報備時間、到訪時間也是必填項，到訪方式為默認選擇項，車牌號以及出發(fā)地點可選填，所有必填項內(nèi)容輸入結束，即可點擊“確認報備”按鈕，確認報備提交的信息即可。具體的信息如圖4.3所示。

圖4.3 基于uni-app的智能高傭報備系統(tǒng)“我要報備”頁面
4.4.3 委托帶看模塊
用戶進入首頁，若要進行樓盤委托帶看報備，即點擊“委托帶看”菜單，繼續(xù)選擇“快速委托”，但是用戶必須先進行登錄，否則無法進行樓盤委托帶看報備，這樣有利于保護樓盤信息的安全等。進入委托帶看頁面后，根據(jù)頁面中的提示進行輸入內(nèi)容，輸入的內(nèi)容包括但不限于客戶信息，客戶需求等，內(nèi)容輸入結束，即可點擊“確認發(fā)單”按鈕。
進入委托帶看頁面還有另一途徑，即進入系統(tǒng)首頁，點擊我要報備模塊，進入我要報備頁面，在頁面中從自己帶看菜單可以切換到委托帶看菜單，從而進入了委托帶看樓盤報備的頁面。具體的信息如圖4.4所示。

圖4.4 基于uni-app的智能高傭報備系統(tǒng)“委托帶看”頁面
4.4.4 我的團隊模塊
用戶進入首頁，點擊“我的團隊”菜單，即可查看用戶所在團隊的分傭等其他信息，但是用戶必須先進行登錄，否則無法進行查看團隊相關信息，這樣有利于保護用戶信息安全等。進入我的團隊頁面后，頁面中顯示我的團隊人數(shù)、團隊業(yè)績獎、我的推薦人等信息。而且還可以查看我的團隊的直屬成員以及外圍組員的列表信息，還可以查看團隊業(yè)績的獎勵規(guī)則詳情等。具體的信息如圖4.5所示。

圖4.5 基于uni-app的智能高傭報備系統(tǒng)“我的團隊”頁面
4.4.5 發(fā)圈圖文模塊
用戶進入首頁，點擊底部導航的發(fā)圈圖文模塊，即可查看系統(tǒng)管理員在后臺進行發(fā)布的相關圖文內(nèi)容等。用戶想要了解某個樓盤的信息，可以在本頁面輪播圖下面的搜索樓盤名稱處輸入自己想要查找的樓盤名稱，即可快速定位到用戶心儀的樓盤名稱，并進行相關的了解以及閱讀，還可以點擊一鍵發(fā)圈按鈕，系統(tǒng)會自動復制樓盤的文字以及自動保存樓盤信息中的圖片，然后提示用戶可以去朋友圈或者跟朋友分享樓盤的相關信息。頁面中具體的信息如圖4.6所示。

圖4.6 基于uni-app的智能高傭報備系統(tǒng)“發(fā)圈圖文”頁面
4.4.6 我的模塊
用戶掃描智能高傭報備小程序的二維碼進入系統(tǒng)的首頁，可以看到底部是系統(tǒng)的底部導航欄，頂部為系統(tǒng)名稱，頁面由上到下分別為：定位、搜索、輪播圖展示等內(nèi)容。點擊底部導航欄的“我的”模塊，即可進入我的頁面，我的頁面內(nèi)容包括但不限于我的推薦碼、我的業(yè)績、我的收入以及新手必看等，具體的信息如圖4.7所示。

圖4.7 基于uni-app的智能高傭報備系統(tǒng)“我的”頁面
4.4.7 客戶模塊
用戶掃描智能高傭報備小程序的二維碼進入系統(tǒng)的首頁，可以看到底部是系統(tǒng)的底部導航欄，頂部為系統(tǒng)名稱，頁面由上到下分別為：定位、搜索、輪播圖展示等內(nèi)容。點擊底部導航欄的“客戶”模塊，即可進入我的客戶頁面，客戶頁面內(nèi)容包括但不限于我的客戶、合作客戶等。其中我的客戶列表顯示的是用戶自己報備的樓盤以及客戶的信息，并且按照時間的順序進行排列，根據(jù)報備單的不同狀態(tài)可以明顯的查看到所在的樓盤和客戶的簡略信息，讓用戶體驗感更加舒適。合作客戶部分展示的是委托帶看的報備單信息，查看委托人、客戶信息、樓盤信息等。具體的信息如圖4.8所示。

圖4.8 基于uni-app的智能高傭報備系統(tǒng)“客戶”頁面
4.5 本章小結
本章主要介紹了基于uni-app的智能高傭報備系統(tǒng)的詳細設計[20]以及系統(tǒng)的實現(xiàn)，首先介紹了系統(tǒng)和數(shù)據(jù)庫的配置，程序的開發(fā)規(guī)范、注釋規(guī)范以及部分功能。在系統(tǒng)功能實現(xiàn)的主要模塊里，截取了部分核心功能的頁面作為演示。

5 系統(tǒng)測試

5.1 測試概述
隨著軟件開發(fā)技術的發(fā)展和軟件系統(tǒng)規(guī)模的不斷擴大，傳統(tǒng)的軟件測試技術已經(jīng)很難適應新的需求，影響了軟件產(chǎn)品的質(zhì)量[21]。當今社會不可能人為的去逐步測試，這樣浪費了大量的人力、才力以及物力，所以未來軟件測試技術需要智能化、集成化以及提升測試的準確性[22]。
5.2 測試用例
軟件測試用例就是指導開發(fā)者對軟件執(zhí)行操作，幫助證明軟件功能或發(fā)現(xiàn)軟件缺陷的一種說明，體現(xiàn)出測試方案、方法、技術和策略[23]。基于uni-app的智能高傭報備系統(tǒng)的測試用例如表6.1所示。
表5.1 測試用例表
項目/軟件 基于uni-app的智能高傭報備系統(tǒng) 程序版本 1.0.0
功能模塊名 Baobei 編制人 冷雪
用例編號 TC-TEP_Baobei_1 編制時間 2020.04.22
相關的用例 無
功能特性 樓盤報備
測試目的 驗證是否能成功報備
預置條件 無
參考信息 無
測試數(shù)據(jù) 起始鏈接：https://dean.nat.deanros.com:8443/pdos-admin/admin/index.html
操作步驟 操作描述 數(shù) 據(jù) 期望結果 實際結果 測試狀態(tài)（P/F）
1 選擇報備公司，按“確認報備”按鈕。 報備公司=中華地產(chǎn)，其余為空 顯示警告信息“請選擇樓盤” 符合 P
表5.1續(xù)頁
項目/軟件 基于uni-app的智能高傭報備系統(tǒng) 程序版本 1.0.0
2 選擇報備公司以及樓盤，按“確認報備”按鈕。 報備公司=中華地產(chǎn)，樓盤=萬科幸福譽，其余為空 顯示警告信息“至少添加一個客戶” 符合 P
3 選擇報備公司以及樓盤，添加一個客戶，按“確認報備”按鈕。 報備公司=中華地產(chǎn)，樓盤=萬科幸福譽，其余為空 顯示警告信息“客戶信息不完整” 符合 P
4 選擇報備公司以及樓盤，添加一個客戶，按“確認報備”按鈕。 報備公司=中華地產(chǎn)，樓盤=萬科幸福譽，客戶姓氏=李，客戶性別=先生，客戶手機號=1551234，其他為選填 顯示已經(jīng)填寫的信息預覽，詢問“返回修改”或“立即提交” 符合 P
5 選擇“立即提交“”報備信息按鈕 報備公司=中華地產(chǎn)，樓盤=萬科幸福譽，客戶姓氏=李，客戶性別=先生，客戶手機號=1551234，其他為選填 提示“報備成功” 符合 P
6 選擇首頁“客戶”模塊 提交的報備信息是否與我的客戶頁面的顯示一致 顯示的內(nèi)容全部一致，其中手機號是按照樓盤要求進行顯示 符合 P
測試人員 冷雪 開發(fā)人員 冷雪 項目負責人 冷雪
5.3 性能測試
對基于uni-app的智能高傭報備系統(tǒng)的進行性能測試[24]，性能測試在測試智能高傭報備小程序的穩(wěn)定性方面很重要，具體內(nèi)容如圖5. 1所示。

圖5.1 性能測試圖
5.4 測試結果
對基于uni-app的智能高傭報備系統(tǒng)的各個功能進行驗證，測試過程中充分考慮了各個功能，并考慮到了整個軟件的內(nèi)部結構及代碼，檢查基于uni-app的智能高傭報備系統(tǒng)達到了系統(tǒng)設計預期的功能，基本上滿足了需求。測試結果如圖5.2所示。

圖5.2 性能測試結果圖
5.5 本章小結
本章主要敘述了基于uni-app的智能高傭報備系統(tǒng)的系統(tǒng)測試的相關步驟，測試概述、測試用例、測試結果以及遇到的問題以及解決方法。所有測試都由人為手動完成，經(jīng)測試，基于uni-app的智能高傭報備系統(tǒng)基本滿足用戶需求。

結 論

系統(tǒng)需求工作是基于uni-app的智能高傭報備系統(tǒng)的重要組成部分，其準確快速的執(zhí)行對于房產(chǎn)經(jīng)紀人的需求分析有重要的意義。為此，本文針對經(jīng)紀人對報備單審核處理的需求，設計并實現(xiàn)了基于uni-app的智能高傭報備系統(tǒng)。本文首先分析了基于uni-app的智能高傭報備系統(tǒng)的開發(fā)技術及環(huán)境，設計分析了構建基于uni-app的智能高傭報備系統(tǒng)所需要解決的一些問題，最后對基于uni-app的智能高傭報備系統(tǒng)的設計及實現(xiàn)方法進行了詳細的說明和探討。本文所開發(fā)的基于uni-app的智能高傭報備系統(tǒng)已經(jīng)在應用與實際工作當中具備了基本的功能，可以較好的滿足當下城市經(jīng)紀人的業(yè)務需求。
本文基于uni-app的智能高傭報備系統(tǒng)在設計與實現(xiàn)的過程中充分考慮了系統(tǒng)在后期程序功能的添加和刪除等的需求，所以在代碼的編寫過程中，大量使用了標準模版的代碼，便于后期修改代碼，實際應用效果說明了本系統(tǒng)設計的合理性與有效性等。
本系統(tǒng)的設計與實現(xiàn)有效的解決了房產(chǎn)領域的樓盤報備單的處理問題，加快了各類經(jīng)紀人報備樓盤以及客戶信息的效率，對于其它的數(shù)據(jù)分析項目有借鑒意義和參考價值。由于項目緊，調(diào)研范圍太不是太廣，微信小程序還存在一定的不足[25]，這是將來需要進一步完善的工作。

致 謝

時光荏苒，歲月如梭，畢業(yè)設計已經(jīng)接近了尾聲，這也意味著我的大學生活就要結束了，一晃而過，回首走過的歲月，心中倍感充實。這里有我熟悉的一切，有我熱愛的一切?；秀敝?，在美麗的校園中，我度過了人生中最為寶貴的年華。當我寫完這篇畢業(yè)論文的時候，有一種如釋重負的感覺，感慨良多。
首先，我要特別感謝我的指導老師陳思老師和董超老師。做畢業(yè)設計項目的過程是艱辛的，但是在我的努力之下還是完成了。在這個過程中董超老師給了我很大的幫助，沒有他的盡心指導和嚴格的要求，我也不會順利完成這次畢業(yè)設計。每次遇到難題，我最先做的就是向老師尋求幫助，而陳思老師像姐姐一樣跟我一起商量解決的辦法，她也從沒抱怨過什么，一直都是盡心盡力的鼓勵我。陳思老師和董超老師平日里工作繁多，但我做畢業(yè)設計的每個階段，從選題到查閱資料，論文提綱的確定，中期論文的修改，后期論文格式調(diào)整等各個環(huán)節(jié)中都給予了我悉心的指導。這幾個月以來，陳思老師和董超老師不僅在學業(yè)上給我以精心指導，同時還在思想給我以無微不至的關懷，在此謹向陳思老師和董超老師致以誠摯的謝意和崇高的敬意。
其次，還要感謝這四年來教我知識的所有老師們，所有幫助過我的同學們以及各位朋友們，畢業(yè)論文能夠順利完成，你們也都有很大的功勞。尤其要感謝系主任在這四年里的教誨，無論是在專業(yè)領域或是為人事處上我都受益匪淺。學校讓我們提前進入到社會，有了更好的人生規(guī)劃，更讓我的專業(yè)技能得到很大的提升，使這次的畢業(yè)設計更好的完成。
寫作畢業(yè)論文是一次再系統(tǒng)學習的過程，畢業(yè)論文的完成，同樣也意味著新生活的開始。在最后我要感謝學校、學院對我們的培養(yǎng)，為我們的學習以及畢業(yè)設計創(chuàng)造良好環(huán)境、提供便利條件。伴隨著畢業(yè)設計的結束，我們也將離開校園，有過少耕耘就有多少收獲，相信我們走出校園后能將自己的價值體現(xiàn)出來，回報父母、回報學校，為社會做自己力所能及的貢獻。

參考文獻

[1]孫月玲.微信小程序的設計與開發(fā)[J].科技創(chuàng)新導報,2018,15(14):142-144+146
[2]張艷慧,初雨晴,常宴寧.淺談微信小程序的發(fā)展與未來[J].電腦迷,2018(06):35
[3]洪澤勇,劉厚磊.小程序測試設計特點[J].現(xiàn)代經(jīng)濟信息,2019(23):447
[4]李哲,周靈.微信小程序的架構與開發(fā)淺析[J].福建電腦,2019,35(12):66-69
[5]張曉燕.微信“小程序”開發(fā)的系統(tǒng)實現(xiàn)及前景[J].電子技術與軟件工程,2018(12):49-50
[6]J. W. Li, X. Li, J. W. Jiang, et al. DESIGN AND IMPLEMENTATION OF SCENIC INTELLIGENT GUIDE SYSTEM BASED ON WECHAT APPLET. 2020, XLII-3/W10:457-460
[7]王婷婷.微信小程序開發(fā)[J].信息技術與信息化,2018(12):62-63
[8]孫艷華,郝培茹.《人民日報》微信公眾號運營現(xiàn)狀及啟示探析[J].青島科技大學學報(社會科學版),2020,36(01):111-115
[9]陳思,冷雪.微信小程序開發(fā)方式對比[J].電子制作,2020(02):52-53+22
[10]陳雨寧,李鎏,潘紅,劉越鋒,郭亮,陳俊威,梁麗儀,潘若帆.淺析OCR技術應用于微信小程序的研究[J].電子世界,2019(23):94-95
[11]許婉韻.關于微信小程序與原生APP使用偏好性的研究[J].農(nóng)家參謀,2018(21):216-217
[12]高勇,闞紅星,高紅磊,陳光恩.基于JFinal的兒童健康測評系統(tǒng)的設計與實現(xiàn)[J].微型電腦應用,2020,36(03):69-71
[13]袁堂青,亓婧.基于微信小程序的開發(fā)與研究[J].網(wǎng)絡安全技術與應用,2020(04):66-67
[14]Chen,Shao,Zhi.Examining the Effects of Passive WeChat Use in China[J]. International Journal of Human–Computer Interaction,2019,35(17):1630-1644
[15]Bi Li,Yan Wu,Zhifeng Hao,Xueming Yan,Boyu Chen. The effects of trust on life satisfaction in the context of WeChat use[J]. Telematics and Informatics,2019,42:1-7
[16]蔡亞楠.基于微服務的軟件體系結構設計方法研究與應用[D].北京郵電大學,2019
[17]胡昕明.計算機軟件的應用體系架構分析與研究[J].電腦編程技巧與維護,2018(05):17-18+41
[18]謝文蘭,何小平.基于Bmob后端云的微信小程序[J].內(nèi)蒙古科技與經(jīng)濟,2020(04):66-68
[19]楊晶晶.網(wǎng)站管理系統(tǒng)中數(shù)據(jù)庫設計的應用[J].福建茶葉,2020,42(04):39
[20]Tu Shuo,Yan Xiaohua,Jie Kemin,Ying Muying,Huang Chunhong. WeChat: An applicable and flexible social app software for mobile teaching.[J]. Biochemistry and molecular biology education : a bimonthly publication of the International Union of Biochemistry and Molecular Biology,2018,46(5):555-560
[21]徐旻.軟件測試的新技術應用及發(fā)展分析[J].計算機產(chǎn)品與流通,2020(05):26+29
[22]湯希祝.芻議大數(shù)據(jù)背景下軟件測試技術的發(fā)展趨勢[J].信息系統(tǒng)工程,2019(06):47
[23]Montag Christian,Becker Benjamin,Gan Chunmei. The Multipurpose Application WeChat: A Review on Recent Research.[J]. Frontiers in psychology,2018,9:2247
[24]趙浩翔,韓飛.微信小程序API性能測試[J].河北農(nóng)機,2020(01):55
[25]張麗瑩.《教育技術理論與創(chuàng)新》課程的微信小程序的設計研究[D].內(nèi)蒙古師范大學,2018

附 錄

基于uni-app的智能高傭報備系統(tǒng)的“我要報備”頁面的核心代碼：

<view class=“company” @click=“onShowPanyPicker()”>

報備公司
{{ panyName ? panyName : ‘請選擇報備公司’ }}



<view class=“company” @click=“navToChoose()”>

選擇樓盤
{{ housesLabel ? housesLabel : ‘請選擇樓盤’ }}






客戶（{{ cindex + 1 }}）
<view class=“t-button” @click=“del(cindex)”>刪除



客戶姓氏

<radio color=“#007AFF” :checked=“client.sex == 0” @click=“chooseSex(cindex, 0)” class=“i-radio”>
<view style=“margin-left: 0;margin-right: 4vw;” @click=“chooseSex(cindex, 0)”>先生
<radio color=“#007AFF” :checked=“client.sex == 1” @click=“chooseSex(cindex, 1)” class=“i-radio”>
<view style=“margin-left: 0;” @click=“chooseSex(cindex, 1)”>女士





手機號碼





****






<view class=“c-item” style=“height: 8vw;” @click=“addClient()”>


添加客戶






報備時間
{{ currentTime }}


<view class=“i-label” @click=“onShowDatePicker()”>

到訪時間
{{ visitTime ? visitTime : ‘請選擇到訪時間’ }}





到訪方式
<radio color=“#007AFF” class=“i-radio” :checked=“bySomeWay == 0” @click=“bySomeWay = 0” style=“margin-left: 4vw;”>
<view style=“margin-left: 0;margin-right: 4vw;” @click=“bySomeWay = 0”>自駕
<radio color=“#007AFF” :checked=“bySomeWay == 1” @click=“bySomeWay = 1” class=“i-radio”>
<view style=“margin-left: 0;” @click=“bySomeWay = 1”>大巴




車牌號





出發(fā)地點

<image
mode=“aspectFit”
@click=“onShowAreaPicker()”
class=“icon-more”
src=“…/…/static/fft-icon/icon_gengduo@2x.png”
style=“margin-top: 1.5vw;margin-right: 0;”

					></image>
				</view>
				<view class="divider-line"></view>

				<form v-if="outJudge" :report-submit="true" @submit="formSubmit"><button class="label-button-full" form-type="submit">確認報備</button></form>
				<form v-if="!outJudge"><button class="label-button-full">確認報備</button></form>
			</view>
		</view>

基于uni-app的智能高傭報備系統(tǒng)的“委托帶看”頁面的核心代碼：


客戶信息


客戶姓氏

<view style=“margin-left: 0;float: right;” @click=“weituo_sex = ‘女士’”>女士
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_sex = ‘女士’” :checked=“weituo_sex == ‘女士’”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_sex = ‘先生’”>先生
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_sex = ‘先生’” :checked=“weituo_sex == ‘先生’”>




手機號碼

<view style=“margin-left: 0;float: right;” @click=“weituo_mshow = 1”>授權
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_mshow = 1” :checked=“weituo_mshow == 1”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_mshow = 0”>隱藏
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_mshow = 0” :checked=“weituo_mshow == 0”>




客戶來源
<view style=“margin-left: 0;float: right;” @click=“weituo_from = ‘街客’”>街客
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_from = ‘街客’” :checked=“weituo_from == ‘街客’”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_from = ‘親屬’”>親屬
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_from = ‘親屬’” :checked=“weituo_from == ‘親屬’”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_from = ‘朋友’”>朋友
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_from = ‘朋友’” :checked=“weituo_from == ‘朋友’”>


<view class=“i-label” @click=“navToChoose()”>

意向樓盤
{{ housesLabel ? housesLabel : ‘請選擇意向樓盤’ }}





客戶需求（選填）


用途
<view style=“margin-left: 0;float: right;” @click=“weituo_usef = ‘投資’”>投資
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_usef = ‘投資’” :checked=“weituo_usef == ‘投資’”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_usef = ‘自住’”>自住
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_usef = ‘自住’” :checked=“weituo_usef == ‘自住’”>




類型
<view style=“margin-left: 0;float: right;” @click=“weituo_type = ‘商業(yè)’”>商業(yè)
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_type = ‘商業(yè)’” :checked=“weituo_type == ‘商業(yè)’”>
<view style=“margin-left: 0;margin-right: 4vw;float: right;” @click=“weituo_type = ‘住宅’”>住宅
<radio color=“#007AFF” class=“i-radio-right” @click=“weituo_type = ‘住宅’” :checked=“weituo_type == ‘住宅’”>


<view class=“i-label” @click=“onShowWTAreaPicker()”>

區(qū)域
{{ weituo_area }}


<view
class=“i-label”
@click="
$refs.mpvueWTYSPicker.show();
remarkJudge = false;
"
>

預算
{{ weituo_bala }}


<view
class=“i-label”
@click="
$refs.mpvueWTMJPicker.show();
remarkJudge = false;
"
>

面積
{{ weituo_s }}


<view
class=“i-label”
@click="
$refs.mpvueWTHXPicker.show();
remarkJudge = false;
" >

戶型
{{ weituo_htype }}




{{ weituo_remark }}




分傭比例


<view
v-for=“(dot, i) in dotlist”
:key=“dot”
:style=“{ left: dot.pos + ‘vw’, background: dot.check ? ‘#007AFF’ : ‘#D8D8D8’ }”
:class=“dot.type == ‘large’ ? ‘dot’ : ‘dot-small’”
@click=“perDotClick(i)”
>
<view
v-for=“(dot, i) in dotlist”
:key=“dot”
:style=“{ left: dot.pos - 2.2 + ‘vw’, color: dot.check ? ‘#007AFF’ : ‘#333’ }”
class=“value”
@click=“perDotClick(i)” >
{{ dot.val }}


<view v-if=“outJudge” class=“l(fā)abel-button-full” @click=“wt_submit”>確認發(fā)單
確認發(fā)單


基于uni-app的智能高傭報備系統(tǒng)的“委托帶看”頁面的核心代碼：



我的團隊（人）
<view class=“team-link” @click=“navInvite”>
立即邀請





總人數(shù)
{{requestData.myteam.headcount}}



<view class=“l(fā)abel-left” @click=“navTeamMembersDA”>
直屬組員


{{requestData.myteam.first}}


<view class=“l(fā)abel-right” @click=“navTeamMembersPe”>
外圍組員


{{requestData.myteam.second}}







團隊業(yè)績獎
<view class=“team-link” @click=“navJiangLiGuiZe”>
獎勵規(guī)則





總獎勵
{{requestData.teamaward.all}}



<view class=“l(fā)abel-left” @click=“jumpDaiQueRen”>
待確認


{{requestData.teamaward.noconfirm}}


<view class=“l(fā)abel-right” @click=“jumpYiQueRen”>
已確認


{{requestData.teamaward.confirm}}







我的推薦人
<view class=“team-link” @click=“navPartner”>
成為合伙人





團隊業(yè)績獎(元)
{{requestData.invitereport.allinvite}}




我的貢獻
{{requestData.invitereport.my}}



他人貢獻
{{requestData.invitereport.other}}



基于uni-app的智能高傭報備系統(tǒng)的“委托帶看”頁面的核心代碼：









<input placeholder=“搜索樓盤名稱” @input=“changeJouse_name”/>




<view class=“z-title-label” @click=“select1” :style=“{color: label == 1?‘#000000’:‘#9E9E9E’}”>樓盤推薦
<view class=“z-title-label” @click=“select2” :style=“{color: label == 2?‘#000000’:‘#9E9E9E’}”>營銷素材文章來源地址http://www.zghlxwxcb.cn/news/detail-838051.html

			<view class="label-line" :style="{'margin-left': label == 1?'5.5vw':'35.5vw'}"></view>
			
		</view>
		<view class="z-message" v-if="label==1" v-for="(i,index) in imgTexts1" :index="index" :key="index">
			<view class="m-head">
				<image class="head-img" src="../../static/fft-img/logo.png"></image>
				<view class="head-content">
					<view class="h-name">小編推薦</view>
					<view class="h-date">{{i.date}}</view>
				</view>
			</view>
			<view class="m-content">
				{{i.text}}
			</view>
			<view class="m-gird-img">
				<uni-grid :column="3" :show-border="false" :square="true" :highlight="false">
					<uni-grid-item>
						<image mode="aspectFill" :src="getImagePath(i.imgs)"></image>
					</uni-grid-item>
				</uni-grid>
			</view>
			<view class="m-foot">
				<view class="f-position">{{i.house_name}}</view>
				<view class="f-share">{{i.share_num}}人分享</view>
				<view class="f-button">
					<button @click="sharingLocal(i)">一鍵發(fā)圈</button>
				</view>
			</view>
		</view>
		<view class="z-message" v-if="label==2" v-for="(j,index) in imgTexts2" :index="index" :key="index">
			<view class="m-head">
				<image class="head-img" src="../../static/fft-img/logo.png"></image>
				<view class="head-content">
					<view class="h-name">小編推薦</view>
					<view class="h-date">{{j.date}}</view>
				</view>
			</view>
			<view class="m-content">
				{{j.text}}
			</view>
			<view class="m-gird-img">
				<uni-grid :column="3" :show-border="false" :square="true" :highlight="false">
					<uni-grid-item>
						<image mode="aspectFill" :src="getImagePath(j.imgs)"></image>
					</uni-grid-item>
				</uni-grid>
			</view>
			<view class="m-foot">
				<view class="f-position">{{j.house_name}}</view>
				<view class="f-share">{{j.share_num}}人分享</view>
				<view class="f-button">
					<button @click="sharingLocal(j)">一鍵發(fā)圈</button>
				</view>
			</view>
		</view>
	</view>
	<view class="full-shadow" v-if="sharing">
		<view class="share-shadow">
			<text>{{shareText}}</text>
			<image mode="aspectFill" :src="shareImage"></image>
			<button @tap="sharing=false">確定</button>
		</view>
	</view>
</view>

到了這里，關于基于uni-app的智能高傭報備系統(tǒng)設計與實現(xiàn)的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！