基於微信小程式的校園二手商城設計與開發
時間過得可真快啊,轉眼間大學四年就結束了,人總是到了要分別的時候才懂得去懷念過去啊。前段時間弄完了畢業論文,最近在導師實驗室搬磚,一直沒時間整理,今天終於有時間,所以想把畢設給整理一下,首先宣告這個畢設做的很一般哈,給大家樂一下,也算是送給自己的畢業禮物吧
正文如下:
軟體功能及核心程式碼
4.1.1 使用者登入註冊
首先是在使用者進入平臺時獲取使用者微信暱稱,儲存作為使用者名稱。至於使用者ID,是通過java中的UUID方法隨機分配一唯一值。最後將這兩項必填資訊寫入資料庫完成註冊
核心程式碼如下:
(1)獲取使用者微信暱稱
// 登入 let that = this wx.login({ success: res => { // 傳送 res.code 到後臺換取 openId, sessionKey, unionId }, }) // 獲取使用者資訊 wx.getSetting({ success: res => { if (res.authSetting['scope.userInfo']) { // 已經授權,可以直接呼叫 getUserInfo 獲取頭像暱稱,不會彈框 wx.getUserInfo({ success: res => { // 可以將 res 傳送給後臺解碼出 unionId that.globalData.userInfo = res.userInfo //獲取使用者基本資訊並儲存為全域性變數 that.globalData.userName = res.userInfo.nickName //獲取使用者微信暱稱並儲存為全域性變數 |
(2)UUID方法隨機分配一唯一值
String uid = UUID.randomUUID().toString().substring(0, 8); //獲取UUID生成的32位數的前8位作為使用者ID |
4.1.2 商品分類導航
商品總共有4中分類,系統為每種分類分配一ID值,內容欄將會根據不同ID值顯示不同型別的商品。
核心程式碼如下:
//商品類別標籤切換事件 switchTab: function (e) { let id = e.currentTarget.dataset.id //獲取前端商品類別的ID值 let type //定義商品類別變數 let num = 0 //定義儲存商品類別的陣列初始下標 claArray = [] //定義儲存商品類別陣列的臨時變數 var that = this this.setData({ curNavId: id, //給前端商品類別賦值 }) //通過id分類List頁面內容 switch(id){ case 1: type = "推薦" break; case 2: type = "學習" break; case 3: type = "運動" break; case 4: type = "生活" break; case 5: type = "智慧" break; } if (GoodContent.length > 0){ for (let i = 0; i < GoodContent.length; i++) { let content = GoodContent[i] if (content.GoodType == type || type == "推薦") { //content.GoodType很關鍵 claArray[num++] = content } } this.setData({ listContent: claArray }) |
4.1.3 熱門商品展示
熱門商品展示主要是本系統會根據商城各商品的點選瀏覽量,自動推薦瀏覽量最高的前5款商品展示在主頁。
核心程式碼如下:
//連線資料庫獲取商品資訊 wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', //伺服器地址 data: { xx: 'selectAll', }, header: { 'Content-Type': 'application/json' }, success: function (res) { that.globalData.GoodMessage = res.data //將獲取的資料儲存在GoodMessage 全域性變數 } }) var urlList = new Array() //定義儲存熱門商品圖片Url地址的陣列 for (let i = 0; i < 5; i++) { urlList[i] = app.globalData.GoodMessage[i].GoodImgUrl } |
4.1.4 模糊搜尋商品
模糊搜尋商品主要是根據使用者輸入的關鍵字進行檢索,使用者輸入商品資訊關鍵字,與已釋出的商品資訊進行匹配,搜尋到符合要求的商品
核心程式碼如下:
//獲取伺服器資料 getdata:function(){ let that = this wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/inputMsg', data: { xx: 'select', yy: that.data.inputValue //使用者輸入的關鍵字 }, header: { 'Content-Type': 'application/json' }, success: function (res) { that.setData({ list:res.data //將伺服器返回的匹配資訊儲存 }) } }) }, |
//伺服器端與資料庫進行互動 if(str.equals(goodName)){ String sql = "SELECT * From good WHERE GoodTitle LIKE '%"+goodName+"'%"; PreparedStatement prep = null; try { prep = (PreparedStatement) connection.prepareStatement(sql); ResultSet result = prep.executeQuery(); while(result.next()){ Good good = new Good(); String GoodTitle = result.getString("GoodTitle"); good.setUserName(GoodTitle); goodList.add(good); } } catch (SQLException e) { e.printStackTrace(); } } Gson gson = new Gson(); String goods = gson.toJson(goodList); write.write(goods); |
4.1.5 釋出商品
有效使用者在釋出商品資訊時,填寫商品名稱、商品圖片、商品類別、商品介紹、聯絡人ID、聯絡人姓名等資訊,然後通過request訪問伺服器將資料寫進資料庫。
核心程式碼如下:
(1)獲取本地圖片,並將圖片臨時地址儲存在資料庫
//上傳圖片 bindSendImage:function(res){ let that = this wx.chooseImage({ count:1, //定義本地選擇圖片時只能選擇一張 sizeType:['original', 'compressed'], //定義選擇的圖片可以被壓縮 sourceType:['album', 'camera'], //圖片既可以從相簿中選擇也可以拍照獲取 success: function(res) { that.setData({ imgUrl:res.tempFilePaths[0] //獲取本地圖片url地址 }) |
4.1.6 商品收藏
使用者在進入商品的詳細資訊介面時,如果喜歡該物品但是又不想立刻購買的話,可以收藏該物品,收藏好的商品也可以點選取消。
核心程式碼如下:
//收藏事件 switchSC:function(id){ let that = this let userId = app.globalData.userId //獲取登入使用者ID switch (id){ case 0: this.setData({ shoucang:"收藏" }) //連線資料庫刪除使用者收藏資訊 wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', data: { xx: 'deleteSC', yy: userId, //使用者ID zz: that.data.GoodId, //商品ID ss: that.data.DjId //店家ID }, header: { 'Content-Type': 'application/json' }, success: function (res) { console.log("刪除成功") } }) break; case 1: this.setData({ shoucang:"收藏成功" }) //連線資料庫新增使用者收藏資訊 wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', data: { xx: 'insertSC', yy: userId, //使用者ID zz: that.data.GoodId, //商品ID ss: that.data.DjId //店家ID }, header: { 'Content-Type': 'application/json' }, success: function (res) { console.log("收藏成功") } }) break; } }, |
4.1.7 商品購買
本平臺商品在購買時採用的是偽支付事件。有效使用者在主頁商品資訊展示欄或者進入商品的詳細資訊介面時,可以選擇購買心儀的商品,購買成功的商品不可以點選取消。
核心程式碼如下:
//購買事件 goumai_btn: function () { let that = this wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', data: { xx: 'insertGM', yy: userId, //使用者ID zz: that.data.GoodId, //商品ID ss: that.data.DjId //店家ID }, header: { 'Content-Type': 'application/json' }, success: function (res) { console.log("購買成功") }) } |
4.1.8 商品購物車功能
購物車裡展示的是使用者已收藏的商品資訊,使用者可以刪除相應已收藏的商品資訊,也可以點選進入相應收藏商品的詳細資訊介面瀏覽商品資訊。
核心程式碼如下:
//連線資料庫獲取使用者收藏資訊 wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', data: { xx: 'showSC', yy: userId, //使用者ID }, header: { 'Content-Type': 'application/json' }, success: function (res) { console.log("查詢收藏資訊成功!") that.setData({ listContent: res.data //將查詢到的收藏資訊儲存在listContent陣列 }) } }) //連線資料庫刪除使用者收藏資訊 wx.request({ url: 'http://localhost:8080/Ajax-Servlet-Test1/StoreMsg', data: { xx: 'delSCGood', yy: userId, //使用者ID zz: msgGId, //商品ID ss: msgUId //店家ID }, header: { 'Content-Type': 'application/json' }, success: function (res) { console.log("刪除收藏資訊成功!") that.switchType(type) }) |
4.1.9 釋出商品管理
主要是展示使用者已釋出的商品資訊,使用者可以刪除相應已釋出的商品資訊記錄,也可以點選進入相應釋出商品的詳細資訊介面瀏覽商品資訊。核心程式碼跟購物車裡程式碼相似,這裡就不多加贅述。
4.1.10 購買商品管理
主要是展示使用者已購買的商品資訊,使用者可以刪除相應已購買的商品資訊記錄,也可以點選進入相應購買商品的詳細資訊介面瀏覽商品資訊。核心程式碼跟購物車裡程式碼相似這裡就不多加贅述
以下是專案圖片,僅供參考哈