├── pages ├── index │ ├── index.json │ ├── index.wxss │ ├── index.wxml │ └── index.js ├── logs │ ├── logs.json │ ├── logs.wxss │ ├── logs.wxml │ └── logs.js ├── order │ ├── order.json │ ├── order.wxml │ ├── order.wxss │ └── order.js ├── pay │ ├── pay.json │ ├── pay.wxml │ ├── pay.wxss │ └── pay.js ├── balance │ ├── balance.json │ ├── balance.wxml │ ├── balance.wxss │ └── balance.js ├── wallet │ ├── wallet.json │ ├── wallet.wxss │ ├── wallet.wxml │ └── wallet.js ├── welcome │ ├── welcome.json │ ├── welcome.wxml │ ├── welcome.wxss │ └── welcome.js ├── inputLock │ ├── inputLock.json │ ├── inputLock.wxml │ ├── inputLock.wxss │ └── inputLock.js └── payDeposit │ ├── payDeposit.json │ ├── payDeposit.wxml │ ├── payDeposit.wxss │ └── payDeposit.js ├── config └── config.js ├── .DS_Store ├── utils ├── .DS_Store ├── icons │ ├── use.png │ ├── .DS_Store │ ├── wallet.png │ ├── refresh.png │ ├── scanning.png │ ├── warning.png │ └── xuanzhong.png ├── pictures │ ├── 1.jpg │ └── .DS_Store ├── util.js └── api.js ├── app.wxss ├── app.js ├── app.json ├── project.config.json └── README.md /pages/index/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "共享雨伞" 3 | } -------------------------------------------------------------------------------- /pages/logs/logs.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "查看启动日志" 3 | } -------------------------------------------------------------------------------- /pages/order/order.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "订单详情" 3 | } -------------------------------------------------------------------------------- /pages/pay/pay.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "支付页面" 3 | } -------------------------------------------------------------------------------- /pages/balance/balance.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "余额充值" 3 | } -------------------------------------------------------------------------------- /pages/wallet/wallet.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "我的钱包" 3 | } -------------------------------------------------------------------------------- /pages/welcome/welcome.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "解锁用伞" 3 | } -------------------------------------------------------------------------------- /config/config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | api: 'http://pig.leewaiho.com' 3 | } -------------------------------------------------------------------------------- /pages/inputLock/inputLock.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "雨伞解锁" 3 | } -------------------------------------------------------------------------------- /pages/payDeposit/payDeposit.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "交纳押金" 3 | } -------------------------------------------------------------------------------- /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/.DS_Store -------------------------------------------------------------------------------- /utils/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/.DS_Store -------------------------------------------------------------------------------- /utils/icons/use.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/use.png -------------------------------------------------------------------------------- /utils/pictures/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/pictures/1.jpg -------------------------------------------------------------------------------- /utils/icons/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/.DS_Store -------------------------------------------------------------------------------- /utils/icons/wallet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/wallet.png -------------------------------------------------------------------------------- /utils/icons/refresh.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/refresh.png -------------------------------------------------------------------------------- /utils/icons/scanning.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/scanning.png -------------------------------------------------------------------------------- /utils/icons/warning.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/warning.png -------------------------------------------------------------------------------- /utils/icons/xuanzhong.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/icons/xuanzhong.png -------------------------------------------------------------------------------- /utils/pictures/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LiaPig/WeChat-shareUmbrella/HEAD/utils/pictures/.DS_Store -------------------------------------------------------------------------------- /pages/logs/logs.wxss: -------------------------------------------------------------------------------- 1 | .log-list { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 40rpx; 5 | } 6 | .log-item { 7 | margin: 10rpx; 8 | } 9 | -------------------------------------------------------------------------------- /pages/logs/logs.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | {{index + 1}}. {{log}} 5 | 6 | 7 | -------------------------------------------------------------------------------- /app.wxss: -------------------------------------------------------------------------------- 1 | /**app.wxss**/ 2 | .container { 3 | height: 100%; 4 | width: 100%; 5 | display: flex; 6 | flex-direction: column; 7 | align-items: center; 8 | justify-content: space-between; 9 | padding: 0; 10 | margin: 0; 11 | box-sizing: border-box; 12 | } 13 | -------------------------------------------------------------------------------- /pages/logs/logs.js: -------------------------------------------------------------------------------- 1 | //logs.js 2 | const util = require('../../utils/util.js') 3 | 4 | Page({ 5 | data: { 6 | logs: [] 7 | }, 8 | onLoad: function () { 9 | this.setData({ 10 | logs: (wx.getStorageSync('logs') || []).map(log => { 11 | return util.formatTime(new Date(log)) 12 | }) 13 | }) 14 | } 15 | }) 16 | -------------------------------------------------------------------------------- /pages/inputLock/inputLock.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 获取解锁码 4 | 计费说明：1元/天 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /pages/payDeposit/payDeposit.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 100元押金 5 | 6 | 交纳押金之后即可租用雨伞，押金随时可退 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | const api = require('./utils/api.js'); 2 | 3 | //app.js 4 | App({ 5 | onLaunch: function () { 6 | const that = this; 7 | // 展示本地存储能力 8 | var logs = wx.getStorageSync('logs') || [] 9 | logs.unshift(Date.now()) 10 | wx.setStorageSync('logs', logs) 11 | 12 | 13 | 14 | 15 | }, 16 | globalData: { 17 | userInfo: null, 18 | token: null 19 | }, 20 | // 全局定义的用户当前的经纬度 21 | // latitude: null, 22 | // longitude: null, 23 | }) -------------------------------------------------------------------------------- /pages/pay/pay.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 感谢您的使用，愿您心情愉快 5 | 6 | 7 | 本次需要支付 {{cost_str}} 元 8 | 原价 {{cost_str}} 元 | 无可用优惠券 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "pages": [ 3 | "pages/index/index", 4 | "pages/payDeposit/payDeposit", 5 | "pages/welcome/welcome", 6 | "pages/inputLock/inputLock", 7 | "pages/wallet/wallet", 8 | "pages/balance/balance", 9 | "pages/order/order", 10 | "pages/logs/logs", 11 | "pages/pay/pay" 12 | ], 13 | "window": { 14 | "backgroundTextStyle": "light", 15 | "navigationBarBackgroundColor": "#fff", 16 | "navigationBarTitleText": "WeChat", 17 | "navigationBarTextStyle": "black" 18 | } 19 | } -------------------------------------------------------------------------------- /pages/index/index.wxss: -------------------------------------------------------------------------------- 1 | /**index.wxss**/ 2 | .container { 3 | width: 100%; 4 | height: 100%; 5 | } 6 | 7 | .map { 8 | position: absolute; 9 | width: 100%; 10 | height: 100%; 11 | } 12 | 13 | /* .userinfo { 14 | display: flex; 15 | flex-direction: column; 16 | align-items: center; 17 | } 18 | 19 | .userinfo-avatar { 20 | width: 128rpx; 21 | height: 128rpx; 22 | margin: 20rpx; 23 | border-radius: 50%; 24 | } 25 | 26 | .userinfo-nickname { 27 | color: #aaa; 28 | } 29 | 30 | .usermotto { 31 | margin-top: 200px; 32 | } */ -------------------------------------------------------------------------------- /utils/util.js: -------------------------------------------------------------------------------- 1 | const formatTime = date => { 2 | const year = date.getFullYear() 3 | const month = date.getMonth() + 1 4 | const day = date.getDate() 5 | const hour = date.getHours() 6 | const minute = date.getMinutes() 7 | const second = date.getSeconds() 8 | 9 | return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') 10 | } 11 | 12 | const formatNumber = n => { 13 | n = n.toString() 14 | return n[1] ? n : '0' + n 15 | } 16 | 17 | module.exports = { 18 | formatTime: formatTime 19 | } 20 | -------------------------------------------------------------------------------- /pages/welcome/welcome.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 欢迎使用共享雨伞 8 | 规范用伞，文明你我 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /pages/order/order.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 当前雨伞编号: 5 | {{umbrellaId}} 6 | 7 | 8 | 开始租用时间: 9 | {{startTime}} 10 | 归还点编号: 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "description": "项目配置文件。", 3 | "setting": { 4 | "urlCheck": false, 5 | "es6": true, 6 | "postcss": true, 7 | "minified": true, 8 | "newFeature": true 9 | }, 10 | "compileType": "miniprogram", 11 | "libVersion": "1.9.1", 12 | "appid": "wxd5fbb5156af5f5d1", 13 | "projectname": "WeChat-shareUmbrella", 14 | "isGameTourist": false, 15 | "condition": { 16 | "search": { 17 | "current": -1, 18 | "list": [] 19 | }, 20 | "conversation": { 21 | "current": -1, 22 | "list": [] 23 | }, 24 | "game": { 25 | "currentL": -1, 26 | "list": [] 27 | }, 28 | "miniprogram": { 29 | "current": -1, 30 | "list": [] 31 | } 32 | } 33 | } -------------------------------------------------------------------------------- /pages/inputLock/inputLock.wxss: -------------------------------------------------------------------------------- 1 | /* pages/inputLock/inputLock.wxss */ 2 | .introduce { 3 | width: 100%; 4 | /* height: 30%; */ 5 | padding-left: 10%; 6 | padding-top: 10%; 7 | } 8 | .bigText { 9 | display: inline-block; 10 | width: 100%; 11 | height: 50%; 12 | font-size: 52rpx; 13 | } 14 | .smallText { 15 | color: #909399; 16 | } 17 | .section { 18 | width: 80%; 19 | margin-left: 10%; 20 | padding-top: 30%; 21 | border-bottom: 1rpx solid #909399; 22 | } 23 | .button { 24 | margin-top: 15%; 25 | width: 80%; 26 | border-radius: 50rpx; 27 | background-color: #909399; 28 | color: #ffffff; 29 | border: 2rpx solid #909399; 30 | } 31 | .button_hover { 32 | background-color: #ffffff; 33 | color: #909399; 34 | } -------------------------------------------------------------------------------- /pages/balance/balance.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | {{balance}}元 5 | 其中充值余额{{balance}}元 6 | 7 | 8 | 充值金额 9 | 10 | 11 | 12 | {{item.name}} 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /pages/index/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 11 | 12 | 13 | 23 | 24 | -------------------------------------------------------------------------------- /pages/payDeposit/payDeposit.wxss: -------------------------------------------------------------------------------- 1 | /* pages/payDeposit/payDeposit.wxss */ 2 | .pageView { 3 | position: fixed; 4 | width: 100%; 5 | height: 100%; 6 | top: 0; 7 | left: 0; 8 | background-color: #F2F2F2; 9 | } 10 | .container { 11 | position: relative; 12 | top: 5%; 13 | width: 100%; 14 | height: 30%; 15 | padding: 10% 50rpx 10% 50rpx; 16 | background-color: #ffffff; 17 | } 18 | .title { 19 | display: inline-block; 20 | width: 100%; 21 | font-size: 60rpx; 22 | } 23 | .logo { 24 | position: absolute; 25 | right: 10%; 26 | width: 60rpx; 27 | height: 60rpx; 28 | } 29 | .tip { 30 | color: #707880; 31 | } 32 | 33 | .buttonView { 34 | position: absolute; 35 | bottom: 0; 36 | width: 100%; 37 | height: 20%; 38 | } 39 | .pay { 40 | width: 80%; 41 | background-color: #707880; 42 | color: #ffffff; 43 | border-radius: 50rpx; 44 | border: 2rpx solid #707880; 45 | } 46 | .pay_hover { 47 | background-color: #ffffff; 48 | color: #707880; 49 | border: 2rpx solid #707880; 50 | } -------------------------------------------------------------------------------- /pages/wallet/wallet.wxss: -------------------------------------------------------------------------------- 1 | /* pages/wallet/wallet.wxss */ 2 | .block_container { 3 | display: inline-block; 4 | width: 100%; 5 | height: 200rpx; 6 | margin-left: 50rpx; 7 | padding-top: 50rpx; 8 | border-bottom: 1rpx solid #909399; 9 | font-size: 45rpx; 10 | } 11 | .block1 { 12 | display: inline-block; 13 | width: 60%; 14 | } 15 | .block1_title { 16 | display: inline-block; 17 | width: 100%; 18 | } 19 | .block1_text_special { 20 | display: inline-block; 21 | height: 50rpx; 22 | 23 | font-size: 35rpx; 24 | text-align: center; 25 | color: red; 26 | } 27 | .block1_text_normal { 28 | font-size: 35rpx; 29 | color: #909399; 30 | } 31 | .block2 { 32 | display: inline-block; 33 | width: 40%; 34 | } 35 | .chongzhi { 36 | display: inline-block; 37 | width: 70%; 38 | height: 80rpx; 39 | line-height: 80rpx; 40 | font-size: 35rpx; 41 | border-radius: 50rpx; 42 | border: 2rpx solid #909399; 43 | background-color: #909399; 44 | color: #ffffff; 45 | } 46 | .chongzhi_hover { 47 | background-color: #ffffff; 48 | color: #909399; 49 | } 50 | .logo { 51 | display: inline-block; 52 | height: 50rpx; 53 | width: 50rpx; 54 | position: relative; 55 | top: 10rpx; 56 | } -------------------------------------------------------------------------------- /pages/welcome/welcome.wxss: -------------------------------------------------------------------------------- 1 | /* pages/welcome/welcome.wxss */ 2 | .container { 3 | position: fixed; 4 | width: 100%; 5 | height: 100%; 6 | } 7 | .pic { 8 | display: inline-block; 9 | width: 100%; 10 | height: 30%; 11 | background-color: pink 12 | } 13 | .pict { 14 | width: 100%; 15 | height: 100%; 16 | } 17 | .introduce { 18 | position: absolute; 19 | top: 30%; 20 | padding-top: 90rpx; 21 | width: 100%; 22 | height: 20%; 23 | text-align: center; 24 | } 25 | .bigText { 26 | display: inline-block; 27 | width: 100%; 28 | height: 50%; 29 | font-size: 52rpx; 30 | } 31 | .smallText { 32 | color: #909399; 33 | } 34 | .buttonGroup { 35 | display: inline-block; 36 | width: 100%; 37 | height: 40%; 38 | margin-top: 0; 39 | } 40 | .scan { 41 | width: 80%; 42 | background-color: #707880; 43 | color: #ffffff; 44 | border-radius: 50rpx; 45 | border: 2rpx solid #707880; 46 | } 47 | .scan_hover { 48 | background-color: #ffffff; 49 | color: #707880; 50 | border: 2rpx solid #707880; 51 | } 52 | .input { 53 | width: 80%; 54 | margin-top: 30rpx; 55 | background-color: #ffffff; 56 | border: 2rpx solid #707880; 57 | /* color: #707880; */ 58 | border-radius: 50rpx; 59 | } 60 | .input_hover { 61 | background-color: #707880; 62 | color: #ffffff; 63 | } -------------------------------------------------------------------------------- /pages/order/order.wxss: -------------------------------------------------------------------------------- 1 | /* pages/order/order.wxss */ 2 | .umbrellaNum { 3 | position: absolute; 4 | top: 5%; 5 | width: 100%; 6 | height: 20%; 7 | text-align: center; 8 | } 9 | .umbrellaNum .title { 10 | color: #909399; 11 | } 12 | 13 | .startTime { 14 | position: absolute; 15 | top: 20%; 16 | width: 100%; 17 | height: 50%; 18 | padding-top: 10%; 19 | text-align: center; 20 | } 21 | .startTime .title { 22 | float: left; 23 | width: 100%; 24 | font-size: 45rpx; 25 | color: #909399; 26 | } 27 | .startTime .title2 { 28 | float: left; 29 | padding-top: 20%; 30 | width: 100%; 31 | font-size: 45rpx; 32 | color: #909399; 33 | } 34 | .startTime .content { 35 | float: left; 36 | padding-top: 5%; 37 | font-size: 50rpx; 38 | width: 100%; 39 | } 40 | .startTime .section { 41 | float: left; 42 | padding-top: 5%; 43 | width: 80%; 44 | margin-left: 10%; 45 | border-bottom: 1rpx solid #909399; 46 | } 47 | 48 | .buttonView { 49 | position: absolute; 50 | top: 80%; 51 | width: 100%; 52 | } 53 | .end { 54 | width: 80%; 55 | background-color: #707880; 56 | color: #ffffff; 57 | border-radius: 50rpx; 58 | border: 2rpx solid #707880; 59 | } 60 | .end_hover { 61 | background-color: #ffffff; 62 | color: #707880; 63 | border: 2rpx solid #707880; 64 | } 65 | -------------------------------------------------------------------------------- /pages/wallet/wallet.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 余额 5 | {{balance_str}} 6 | 元 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 押金 16 | 17 | 18 | 19 | 未交 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 押金 29 | {{deposit_str}} 30 | 元 31 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /pages/pay/pay.wxss: -------------------------------------------------------------------------------- 1 | /* pages/pay/pay.wxss */ 2 | .pay { 3 | position: fixed; 4 | display: inline-block; 5 | width: 100%; 6 | height: 100%; 7 | background: #909399; 8 | } 9 | 10 | .container1 { 11 | position: relative; 12 | top: 0%; 13 | height: 120rpx; 14 | width: 100%; 15 | text-align: center; 16 | line-height: 120rpx; 17 | color: #fff; 18 | } 19 | 20 | .container2 { 21 | position: relative; 22 | display: inline-block; 23 | height: calc(100% - 100rpx); 24 | width: 92%; 25 | padding-left: 8%; 26 | background: #fff; 27 | border-radius: 35rpx; 28 | } 29 | .container2 .title { 30 | display: inline-block; 31 | width: 100%; 32 | margin-top: 100rpx; 33 | font-size: 55rpx; 34 | } 35 | .container2 .tips { 36 | display: inline-block; 37 | width: 100%; 38 | margin-top: 30rpx; 39 | font-size: 35rpx; 40 | color: #909399; 41 | } 42 | .container2 .button_group { 43 | display: inline-block; 44 | width: 100%; 45 | height: 100rpx; 46 | line-height: 100rpx; 47 | margin-top: 80rpx; 48 | } 49 | .container2 .button_group .pay { 50 | display: inline-block; 51 | width: 82%; 52 | height: 100rpx; 53 | line-height: 100rpx; 54 | font-size: 35rpx; 55 | border-radius: 50rpx; 56 | border: 2rpx solid #909399; 57 | background-color: #909399; 58 | color: #ffffff; 59 | } 60 | .container2 .button_group .pay_hover { 61 | background-color: #ffffff; 62 | color: #909399; 63 | } -------------------------------------------------------------------------------- /pages/payDeposit/payDeposit.js: -------------------------------------------------------------------------------- 1 | // pages/payDeposit/payDeposit.js 2 | //获取应用实例 3 | const app = getApp(); 4 | const api = require('../../utils/api.js'); 5 | 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | 13 | }, 14 | 15 | // 点击了确定支付 16 | handlePay: () => { 17 | const that = this; 18 | wx.showLoading({ 19 | title: '正在获取数据', 20 | }); 21 | api.payDeposit(app.globalData.token).then(res => { 22 | wx.hideLoading(); 23 | wx.showModal({ 24 | title: '温馨提示', 25 | content: '交纳押金成功', 26 | showCancel: false, 27 | success: function (res) { 28 | wx.redirectTo({ 29 | url: '../index/index' 30 | }) 31 | } 32 | }) 33 | }); 34 | }, 35 | 36 | /** 37 | * 生命周期函数--监听页面加载 38 | */ 39 | onLoad: function (options) { 40 | 41 | }, 42 | 43 | /** 44 | * 生命周期函数--监听页面初次渲染完成 45 | */ 46 | onReady: function () { 47 | 48 | }, 49 | 50 | /** 51 | * 生命周期函数--监听页面显示 52 | */ 53 | onShow: function () { 54 | 55 | }, 56 | 57 | /** 58 | * 生命周期函数--监听页面隐藏 59 | */ 60 | onHide: function () { 61 | 62 | }, 63 | 64 | /** 65 | * 生命周期函数--监听页面卸载 66 | */ 67 | onUnload: function () { 68 | 69 | }, 70 | 71 | /** 72 | * 页面相关事件处理函数--监听用户下拉动作 73 | */ 74 | onPullDownRefresh: function () { 75 | 76 | }, 77 | 78 | /** 79 | * 页面上拉触底事件的处理函数 80 | */ 81 | onReachBottom: function () { 82 | 83 | }, 84 | 85 | /** 86 | * 用户点击右上角分享 87 | */ 88 | onShareAppMessage: function () { 89 | 90 | } 91 | }) -------------------------------------------------------------------------------- /pages/balance/balance.wxss: -------------------------------------------------------------------------------- 1 | /* pages/balance/balance.wxss */ 2 | .balanceView { 3 | position: absolute; 4 | display: inline-block; 5 | margin-left: 80rpx; 6 | padding-top: 100rpx; 7 | width: 100%; 8 | height: 22%; 9 | border-bottom: 1rpx solid #E7E7EB; 10 | } 11 | .balanceView .title { 12 | font-size: 55rpx; 13 | } 14 | .balanceView .text { 15 | padding-top: 5rpx; 16 | color: #707880; 17 | } 18 | 19 | .payView { 20 | position: absolute; 21 | display: inline-block; 22 | top: 30%; 23 | margin-left: 80rpx; 24 | width: calc(100% - 80rpx); 25 | height: 70%; 26 | } 27 | .payView .title { 28 | font-size: 40rpx; 29 | padding-top: 100rpx; 30 | } 31 | .payView .content { 32 | padding-right: 80rpx; 33 | } 34 | .active { 35 | display: inline-block; 36 | width: 40%; 37 | margin-left: 7%; 38 | margin-top: 20rpx; 39 | height: 150rpx; 40 | line-height: 150rpx; 41 | text-align: center; 42 | background: #707880; 43 | color: #ffffff; 44 | border: 1rpx solid #707880; 45 | border-radius: 15rpx; 46 | } 47 | .normal { 48 | display: inline-block; 49 | width: 40%; 50 | margin-left: 7%; 51 | margin-top: 30rpx; 52 | height: 150rpx; 53 | line-height: 150rpx; 54 | text-align: center; 55 | border: 1rpx solid #707880; 56 | border-radius: 15rpx; 57 | } 58 | 59 | .buttonView { 60 | margin-top: 100rpx; 61 | margin-right: 80rpx; 62 | } 63 | .pay { 64 | width: 100%; 65 | background-color: #707880; 66 | color: #ffffff; 67 | border-radius: 50rpx; 68 | border: 2rpx solid #707880; 69 | } 70 | .pay_hover { 71 | background-color: #ffffff; 72 | color: #707880; 73 | border: 2rpx solid #707880; 74 | } -------------------------------------------------------------------------------- /pages/inputLock/inputLock.js: -------------------------------------------------------------------------------- 1 | // pages/inputLock/inputLock.js 2 | const app = getApp(); 3 | const api = require("../../utils/api.js"); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | inputValue: null, 12 | }, 13 | 14 | // 根据输入框更新值 15 | bindKeyInput: function (e) { 16 | this.setData({ 17 | inputValue: e.detail.value 18 | }) 19 | }, 20 | // 点击了立即用伞按钮 21 | handleRent: function() { 22 | const that = this; 23 | // 如果输入的不为空 24 | if(that.data.inputValue) { 25 | wx.showLoading({ 26 | title: '正在获取数据', 27 | }); 28 | api.placeOrder(app.globalData.token, that.data.inputValue) 29 | .then(res => { 30 | wx.hideLoading(); 31 | wx.redirectTo({ 32 | url: '../order/order' 33 | }) 34 | }) 35 | .catch(err => { 36 | wx.hideLoading(); 37 | wx.showModal({ 38 | title: '操作失败', 39 | content: err.data.message, 40 | showCancel: false, 41 | success: function (res) { 42 | if (res.confirm) { 43 | // console.log('用户点击确定'); 44 | } 45 | } 46 | }); 47 | }) 48 | } 49 | else { 50 | wx.showModal({ 51 | title: '温馨提示', 52 | content: '请输入雨伞号', 53 | showCancel: false, 54 | success: function (res) { 55 | if (res.confirm) { 56 | // console.log('用户点击确定'); 57 | } 58 | } 59 | }); 60 | } 61 | }, 62 | 63 | 64 | /** 65 | * 生命周期函数--监听页面加载 66 | */ 67 | onLoad: function (options) { 68 | 69 | }, 70 | 71 | /** 72 | * 生命周期函数--监听页面初次渲染完成 73 | */ 74 | onReady: function () { 75 | 76 | }, 77 | 78 | /** 79 | * 生命周期函数--监听页面显示 80 | */ 81 | onShow: function () { 82 | 83 | }, 84 | 85 | /** 86 | * 生命周期函数--监听页面隐藏 87 | */ 88 | onHide: function () { 89 | 90 | }, 91 | 92 | /** 93 | * 生命周期函数--监听页面卸载 94 | */ 95 | onUnload: function () { 96 | 97 | }, 98 | 99 | /** 100 | * 页面相关事件处理函数--监听用户下拉动作 101 | */ 102 | onPullDownRefresh: function () { 103 | 104 | }, 105 | 106 | /** 107 | * 页面上拉触底事件的处理函数 108 | */ 109 | onReachBottom: function () { 110 | 111 | }, 112 | 113 | /** 114 | * 用户点击右上角分享 115 | */ 116 | onShareAppMessage: function () { 117 | 118 | } 119 | }) -------------------------------------------------------------------------------- /pages/balance/balance.js: -------------------------------------------------------------------------------- 1 | // pages/balance/balance.js 2 | const app = getApp(); 3 | const api = require("../../utils/api.js"); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | balance: null, 12 | balanceOption: [ 13 | { name: '充100元', value: 100 }, 14 | { name: '充50元', value: 50 }, 15 | { name: '充20元', value: 20 }, 16 | { name: '充10元', value: 10 } 17 | ], 18 | currentValue: 50, 19 | }, 20 | // 获取余额数据 21 | getBalanceData: function() { 22 | const that = this; 23 | wx.showLoading({ 24 | title: '正在获取数据', 25 | }); 26 | api.myWallet(app.globalData.token).then(res => { 27 | let myData = res.data.data; 28 | that.setData({ 29 | balance: myData.balance 30 | }) 31 | wx.hideLoading(); 32 | }); 33 | }, 34 | // 点击了某个充值金额 35 | changeValue: function (e) { 36 | this.setData({ 37 | currentValue: e.currentTarget.dataset.value 38 | }) 39 | }, 40 | // 点击了立即支付 41 | handlePay: function() { 42 | const that = this; 43 | wx.showLoading({ 44 | title: '正在充值中', 45 | }); 46 | console.log("我要充值", this.data.currentValue, "元"); 47 | api.payBalance(app.globalData.token, that.data.currentValue).then(res => { 48 | wx.hideLoading(); 49 | wx.showModal({ 50 | title: '温馨提示', 51 | content: '充值成功', 52 | showCancel: false, 53 | success: function (res) { 54 | if (res.confirm) { 55 | that.getBalanceData(); 56 | } 57 | } 58 | }) 59 | }); 60 | }, 61 | 62 | /** 63 | * 生命周期函数--监听页面加载 64 | */ 65 | onLoad: function (options) { 66 | this.getBalanceData(); 67 | }, 68 | 69 | /** 70 | * 生命周期函数--监听页面初次渲染完成 71 | */ 72 | onReady: function () { 73 | 74 | }, 75 | 76 | /** 77 | * 生命周期函数--监听页面显示 78 | */ 79 | onShow: function () { 80 | 81 | }, 82 | 83 | /** 84 | * 生命周期函数--监听页面隐藏 85 | */ 86 | onHide: function () { 87 | 88 | }, 89 | 90 | /** 91 | * 生命周期函数--监听页面卸载 92 | */ 93 | onUnload: function () { 94 | 95 | }, 96 | 97 | /** 98 | * 页面相关事件处理函数--监听用户下拉动作 99 | */ 100 | onPullDownRefresh: function () { 101 | 102 | }, 103 | 104 | /** 105 | * 页面上拉触底事件的处理函数 106 | */ 107 | onReachBottom: function () { 108 | 109 | }, 110 | 111 | /** 112 | * 用户点击右上角分享 113 | */ 114 | onShareAppMessage: function () { 115 | 116 | } 117 | }) -------------------------------------------------------------------------------- /pages/order/order.js: -------------------------------------------------------------------------------- 1 | // pages/order/order.js 2 | //获取应用实例 3 | const app = getApp(); 4 | const api = require('../../utils/api.js'); 5 | 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | umbrellaId: null, 13 | startTime: null, 14 | orderId: null, 15 | rentId: null 16 | }, 17 | // 获取当前用户的订单信息 18 | getOrderData() { 19 | const that = this; 20 | wx.showLoading({ 21 | title: '正在获取数据', 22 | }); 23 | api.proceedOrder(app.globalData.token).then(res => { 24 | wx.hideLoading(); 25 | const orderData = res.data.data; 26 | that.setData({ 27 | umbrellaId: orderData.umbrellaId, 28 | startTime: orderData.startTime, 29 | orderId: orderData.id 30 | }); 31 | }); 32 | }, 33 | // 根据输入框更新值 34 | bindKeyInput: function (e) { 35 | this.setData({ 36 | rentId: e.detail.value 37 | }); 38 | }, 39 | // 点击了结束用伞按钮 40 | handleEnd() { 41 | const that = this; 42 | wx.showLoading({ 43 | title: '正在获取数据', 44 | }); 45 | api.finishOrder(app.globalData.token, that.data.orderId, that.data.rentId) 46 | .then(res => { 47 | wx.hideLoading(); 48 | wx.redirectTo({ 49 | url: '../pay/pay' 50 | }); 51 | }) 52 | .catch(err => { 53 | wx.hideLoading(); 54 | wx.showModal({ 55 | title: '操作失败', 56 | content: err.data.message, 57 | showCancel: false, 58 | success: function (res) { 59 | if (res.confirm) { 60 | // console.log('用户点击确定'); 61 | } 62 | } 63 | });1 64 | }) 65 | }, 66 | 67 | /** 68 | * 生命周期函数--监听页面加载 69 | */ 70 | onLoad: function (options) { 71 | this.getOrderData(); 72 | }, 73 | 74 | /** 75 | * 生命周期函数--监听页面初次渲染完成 76 | */ 77 | onReady: function () { 78 | 79 | }, 80 | 81 | /** 82 | * 生命周期函数--监听页面显示 83 | */ 84 | onShow: function () { 85 | 86 | }, 87 | 88 | /** 89 | * 生命周期函数--监听页面隐藏 90 | */ 91 | onHide: function () { 92 | 93 | }, 94 | 95 | /** 96 | * 生命周期函数--监听页面卸载 97 | */ 98 | onUnload: function () { 99 | 100 | }, 101 | 102 | /** 103 | * 页面相关事件处理函数--监听用户下拉动作 104 | */ 105 | onPullDownRefresh: function () { 106 | 107 | }, 108 | 109 | /** 110 | * 页面上拉触底事件的处理函数 111 | */ 112 | onReachBottom: function () { 113 | 114 | }, 115 | 116 | /** 117 | * 用户点击右上角分享 118 | */ 119 | onShareAppMessage: function () { 120 | 121 | } 122 | }) -------------------------------------------------------------------------------- /pages/pay/pay.js: -------------------------------------------------------------------------------- 1 | // pages/pay/pay.js 2 | //获取应用实例 3 | const app = getApp(); 4 | const api = require('../../utils/api.js'); 5 | 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | cost_str: null, 13 | orderId: null 14 | }, 15 | 16 | // 获取当前用户的订单信息 17 | getOrderData() { 18 | const that = this; 19 | wx.showLoading({ 20 | title: '正在获取数据', 21 | }); 22 | api.unpaidOrder(app.globalData.token).then(res => { 23 | wx.hideLoading(); 24 | const orderData = res.data.data; 25 | that.setData({ 26 | cost_str: orderData.cost.toFixed(2), 27 | orderId: orderData.id 28 | }); 29 | }); 30 | }, 31 | // 点击了立即支付按钮 32 | handlePay() { 33 | const that = this; 34 | wx.showLoading({ 35 | title: '正在获取数据', 36 | }); 37 | api.payOrder(app.globalData.token, that.data.orderId) 38 | .then(res => { 39 | wx.hideLoading(); 40 | wx.showModal({ 41 | title: '支付成功', 42 | content: res.data.message, 43 | showCancel: false, 44 | success: function (res) { 45 | if (res.confirm) { 46 | wx.navigateTo({ 47 | url: '../index/index', 48 | }) 49 | } 50 | } 51 | }); 52 | }) 53 | .catch(err => { 54 | if(err.data.code === 11000) { 55 | wx.hideLoading(); 56 | wx.showModal({ 57 | title: '支付失败', 58 | content: err.data.message, 59 | showCancel: false, 60 | success: function (res) { 61 | if (res.confirm) { 62 | wx.navigateTo({ 63 | url: '../balance/balance', 64 | }) 65 | } 66 | } 67 | }); 68 | } 69 | }) 70 | }, 71 | /** 72 | * 生命周期函数--监听页面加载 73 | */ 74 | onLoad: function (options) { 75 | this.getOrderData(); 76 | }, 77 | 78 | /** 79 | * 生命周期函数--监听页面初次渲染完成 80 | */ 81 | onReady: function () { 82 | 83 | }, 84 | 85 | /** 86 | * 生命周期函数--监听页面显示 87 | */ 88 | onShow: function () { 89 | 90 | }, 91 | 92 | /** 93 | * 生命周期函数--监听页面隐藏 94 | */ 95 | onHide: function () { 96 | 97 | }, 98 | 99 | /** 100 | * 生命周期函数--监听页面卸载 101 | */ 102 | onUnload: function () { 103 | 104 | }, 105 | 106 | /** 107 | * 页面相关事件处理函数--监听用户下拉动作 108 | */ 109 | onPullDownRefresh: function () { 110 | 111 | }, 112 | 113 | /** 114 | * 页面上拉触底事件的处理函数 115 | */ 116 | onReachBottom: function () { 117 | 118 | }, 119 | 120 | /** 121 | * 用户点击右上角分享 122 | */ 123 | onShareAppMessage: function () { 124 | 125 | } 126 | }) -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 基于微信小程序的共享雨伞租借系统 2 | --- 3 | > 一个微信小程序项目 4 | 5 | ### 摘要 6 | 7 | 共享雨伞由于符合节省资源、绿色出行、环保理念，得到了政府的极力提倡和支持。而微信小程序是一种不需要安装即可打开使用的应用。用户只需要通过进入本系统的微信小程序,交纳押金后扫描某把雨伞的二维码或者手动输入雨伞号，就能租借使用。还伞时，只需要把雨伞插回可归还的地方，然后确认付款就完成了所有操作。（由于无法模拟雨伞插回伞座，所以是要自己点击还伞的） 8 | 9 | 10 | ### 功能模块 11 | + 自动注册登录 12 | 13 | + 缴纳（退还）押金 14 | 15 | + 获取当前位置和定位 16 | 17 | + 使用扫描二维码用伞、手动输入伞号借伞 18 | 19 | + 查询余额、充值余额 20 | 21 | + 结束用伞 22 | 23 | + 支付订单 24 | 25 | ### 关于登录与注册 26 | 27 | + 这里使用的是用户无感的注册或者登录。 28 | 29 | + 当用户授权使用本小程序的时候，调用微信官方登录接口，获取到``code``、``encryptedData``、``iv``发送给后台，后台判断是否已经注册过。 30 | 31 | + 如果没有，立即注册，返回``token``；如果已经注册过，登录，返回``token``。 32 | 33 | 34 | ### 页面展示 35 | 36 | 1.授权登录 37 | 38 | ![](https://upload-images.jianshu.io/upload_images/7016617-1a2e03c94327bc33.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 39 | 40 | 2.初次进来，先提醒交押金，已经交过直接到界面3 41 | 42 | ![](https://upload-images.jianshu.io/upload_images/7016617-5d365a14e668b7b0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 43 | 44 | 3.定位到当前位置显示在地图上，还有刷新定位按钮、立即用伞按钮、我的钱包按钮 45 | 46 | ![](https://upload-images.jianshu.io/upload_images/7016617-b4854c55e0bca521.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 47 | 48 | 4.点击了钱包按钮，进入到我的钱包页面，可查看余额和押金情况 49 | 50 | ![](https://upload-images.jianshu.io/upload_images/7016617-9b34dee075b1ae22.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 51 | 52 | 5.点击了充值按钮后，有四个充值金额可选 53 | 54 | ![](https://upload-images.jianshu.io/upload_images/7016617-692f372f804694e4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 55 | 56 | 6.如果界面3点击了立即用伞按钮，则进来解锁用伞页面，有两个方式，扫码或者手动输入 57 | 58 | ![](https://upload-images.jianshu.io/upload_images/7016617-6fd5b05c69ddeacb.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 59 | 60 | 7.扫码用伞 61 | 62 | ![](https://upload-images.jianshu.io/upload_images/7016617-a19c918ec54b4b9e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 63 | 64 | 8.手动输入雨伞号 65 | 66 | ![](https://upload-images.jianshu.io/upload_images/7016617-bbfb94ea98648854.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 67 | 68 | 9.借伞后的页面 69 | 70 | ![](https://upload-images.jianshu.io/upload_images/7016617-c780e40b6e1639ad.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 71 | 72 | 10.结束用伞后 73 | 74 | ![](https://upload-images.jianshu.io/upload_images/7016617-2de9d653b6ba4962.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 75 | 76 | ### 交互api 77 | > 本小程序的后台接口，由[Hertz大佬](http://leewaiho.com)提供。 78 | 79 | 目录位置： 80 | - config 81 | - config.js // 封装了api域名 82 | - utils 83 | - api.js // 都在这里了 84 | 85 | ### 页面目录 86 | - pages 87 | - balance // 余额充值 88 | - index // 有地图的 89 | - inputLock // 手动输入雨伞号 90 | - logs // 没用到，查看启动日志 91 | - order // 订单详情 92 | - pay // 支付 93 | - payDeposit // 交纳押金 94 | - wallet // 我的钱包 95 | - welcome // 选择解锁方式 96 | -------------------------------------------------------------------------------- /pages/wallet/wallet.js: -------------------------------------------------------------------------------- 1 | // pages/wallet/wallet.js 2 | const app = getApp(); 3 | const api = require("../../utils/api.js"); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | balance: null, 12 | balance_str: null, 13 | deposit: null, 14 | deposit_str: null, 15 | }, 16 | // 获取余额和押金数据 17 | getData() { 18 | const that = this; 19 | wx.showLoading({ 20 | title: '正在获取数据', 21 | }); 22 | api.myWallet(app.globalData.token).then(res => { 23 | let myData = res.data.data; 24 | const balance_str = Number(myData.balance).toFixed(2); 25 | const deposit_str = Number(myData.deposit).toFixed(2); 26 | that.setData({ 27 | balance: myData.balance, 28 | deposit: myData.deposit, 29 | balance_str: balance_str, 30 | deposit_str: deposit_str 31 | }) 32 | wx.hideLoading(); 33 | }); 34 | }, 35 | // 点击了充值按钮 36 | handlePay: function() { 37 | wx.navigateTo({ 38 | url: '../balance/balance' 39 | }) 40 | }, 41 | // 点击了取押金按钮 42 | returnDeposit: function(){ 43 | const that = this; 44 | wx.showModal({ 45 | title: '温馨提示', 46 | content: '取走押金之后将无法继续租用伞,请确定是否支取押金', 47 | success: function (res) { 48 | if (res.confirm) { 49 | console.log('用户点击确定'); 50 | api.returnDeposit(app.globalData.token).then(res => { 51 | console.log(res); 52 | wx.showToast({ 53 | title: '押金退还成功', 54 | icon: 'success', 55 | duration: 2000 56 | }); 57 | that.getData(); 58 | }); 59 | 60 | } else if (res.cancel) { 61 | console.log('用户点击取消'); 62 | } 63 | } 64 | }) 65 | }, 66 | // 点击了交押金按钮 67 | payDeposit: function(){ 68 | wx.redirectTo({ 69 | url: '../payDeposit/payDeposit' 70 | }) 71 | }, 72 | 73 | /** 74 | * 生命周期函数--监听页面加载 75 | */ 76 | onLoad: function (options) { 77 | this.getData(); 78 | }, 79 | 80 | /** 81 | * 生命周期函数--监听页面初次渲染完成 82 | */ 83 | onReady: function () { 84 | 85 | }, 86 | 87 | /** 88 | * 生命周期函数--监听页面显示 89 | */ 90 | onShow: function () { 91 | 92 | }, 93 | 94 | /** 95 | * 生命周期函数--监听页面隐藏 96 | */ 97 | onHide: function () { 98 | 99 | }, 100 | 101 | /** 102 | * 生命周期函数--监听页面卸载 103 | */ 104 | onUnload: function () { 105 | 106 | }, 107 | 108 | /** 109 | * 页面相关事件处理函数--监听用户下拉动作 110 | */ 111 | onPullDownRefresh: function () { 112 | 113 | }, 114 | 115 | /** 116 | * 页面上拉触底事件的处理函数 117 | */ 118 | onReachBottom: function () { 119 | 120 | }, 121 | 122 | /** 123 | * 用户点击右上角分享 124 | */ 125 | onShareAppMessage: function () { 126 | 127 | } 128 | }) -------------------------------------------------------------------------------- /pages/welcome/welcome.js: -------------------------------------------------------------------------------- 1 | // pages/welcome/welcome.js 2 | //获取应用实例 3 | const app = getApp(); 4 | const api = require('../../utils/api.js'); 5 | 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | 13 | }, 14 | // 点击了扫码用伞 15 | openScan: function() { 16 | wx.scanCode({ 17 | onlyFromCamera: true, 18 | success: (res) => { 19 | console.log(res); 20 | const umbrellaId = res.result; 21 | if (umbrellaId) { 22 | wx.showLoading({ 23 | title: '正在获取数据', 24 | }); 25 | api.placeOrder(app.globalData.token, umbrellaId) 26 | .then(res => { 27 | wx.hideLoading(); 28 | wx.redirectTo({ 29 | url: '../order/order' 30 | }) 31 | }) 32 | .catch(err => { 33 | wx.hideLoading(); 34 | wx.showModal({ 35 | title: '操作失败', 36 | content: err.data.message, 37 | showCancel: false, 38 | success: function (res) { 39 | if (res.confirm) { 40 | // console.log('用户点击确定'); 41 | } 42 | } 43 | }); 44 | }) 45 | } 46 | else { 47 | wx.showModal({ 48 | title: '温馨提示', 49 | content: '请重新扫描二维码', 50 | showCancel: false, 51 | success: function (res) { 52 | if (res.confirm) { 53 | // console.log('用户点击确定'); 54 | } 55 | } 56 | }); 57 | } 58 | } 59 | }) 60 | }, 61 | // 跳转去手动输入解锁界面 62 | goToInputLock: function() { 63 | wx.navigateTo({ 64 | url: '../inputLock/inputLock' 65 | }) 66 | }, 67 | 68 | /** 69 | * 生命周期函数--监听页面加载 70 | */ 71 | onLoad: function (options) { 72 | const that = this; 73 | api.checkDeposit(app.globalData.token).then(res => { 74 | //没交押金跳转去交押金界面 75 | if(!res.data.data){ 76 | wx.redirectTo({ 77 | url: '../payDeposit/payDeposit' 78 | }); 79 | } 80 | }); 81 | }, 82 | 83 | /** 84 | * 生命周期函数--监听页面初次渲染完成 85 | */ 86 | onReady: function () { 87 | 88 | }, 89 | 90 | /** 91 | * 生命周期函数--监听页面显示 92 | */ 93 | onShow: function () { 94 | 95 | }, 96 | 97 | /** 98 | * 生命周期函数--监听页面隐藏 99 | */ 100 | onHide: function () { 101 | 102 | }, 103 | 104 | /** 105 | * 生命周期函数--监听页面卸载 106 | */ 107 | onUnload: function () { 108 | 109 | }, 110 | 111 | /** 112 | * 页面相关事件处理函数--监听用户下拉动作 113 | */ 114 | onPullDownRefresh: function () { 115 | 116 | }, 117 | 118 | /** 119 | * 页面上拉触底事件的处理函数 120 | */ 121 | onReachBottom: function () { 122 | 123 | }, 124 | 125 | /** 126 | * 用户点击右上角分享 127 | */ 128 | onShareAppMessage: function () { 129 | 130 | } 131 | }) -------------------------------------------------------------------------------- /pages/index/index.js: -------------------------------------------------------------------------------- 1 | //index.js 2 | //获取应用实例 3 | const app = getApp(); 4 | const api = require('../../utils/api.js'); 5 | 6 | Page({ 7 | data: { 8 | // 用于地图组件显示的数据 9 | latitude: null, 10 | longitude: null, 11 | controls: [], 12 | }, 13 | // 点击地图上的控件触发的事件 14 | controltap: function(e) { 15 | switch (e.controlId) { 16 | case 1: this.toWelcomePage();break; 17 | case 2: this.refreshLocation();break; 18 | case 3: this.toWalletPage();break; 19 | } 20 | }, 21 | // 获取屏幕信息函数 22 | getSystemInfoData: function () { 23 | const that = this; 24 | wx.getSystemInfo({ 25 | success: function (res) { 26 | that.setData({ 27 | controls: [ 28 | { 29 | id: 1, 30 | iconPath: '/utils/icons/use.png', 31 | position: { 32 | left: (res.windowWidth - 80) / 2, 33 | top: res.windowHeight - 100, 34 | width: 80, 35 | height: 80 36 | }, 37 | clickable: true 38 | }, 39 | { 40 | id: 2, 41 | iconPath: '/utils/icons/refresh.png', 42 | position: { 43 | left: res.windowWidth/4 - 20, 44 | top: res.windowHeight - 100 + 20, 45 | width: 40, 46 | height: 40 47 | }, 48 | clickable: true 49 | }, 50 | { 51 | id: 3, 52 | iconPath: '/utils/icons/wallet.png', 53 | position: { 54 | left: res.windowWidth / 2 + res.windowWidth / 4 - 20, 55 | top: res.windowHeight - 100 + 20, 56 | width: 40, 57 | height: 40 58 | }, 59 | clickable: true 60 | }, 61 | ] 62 | }) 63 | } 64 | }) 65 | }, 66 | // 重新刷新获取位置 67 | refreshLocation() { 68 | const that = this; 69 | wx.showLoading({ 70 | title: '正在刷新位置', 71 | }); 72 | api.getLocation().then(res => { 73 | that.setData({ 74 | latitude: res.latitude, 75 | longitude: res.longitude 76 | }); 77 | wx.hideLoading(); 78 | }); 79 | }, 80 | // 跳转去欢迎使用页面 81 | toWelcomePage() { 82 | wx.navigateTo({ 83 | url: '../welcome/welcome' 84 | }) 85 | }, 86 | // 跳转去我的钱包页面 87 | toWalletPage() { 88 | wx.navigateTo({ 89 | url: '../wallet/wallet' 90 | }) 91 | }, 92 | // 页面初始化先执行的方法 93 | onLoad: function () { 94 | const that = this; 95 | wx.showLoading({ 96 | title: '正在登录中', 97 | }); 98 | // 1.登录,获取用户token 99 | api.login().then(res => { 100 | wx.hideLoading(); 101 | const token = `bearer ${res.data.data['access_token']}`; 102 | // 放到全局app里去 103 | app.globalData.token = token; 104 | console.log(`首页token: ${token}`); 105 | wx.showLoading({ 106 | title: '正在查询押金', 107 | }); 108 | // 2.判断当前用户是否交了押金 109 | api.checkDeposit(token).then(res2 => { 110 | wx.hideLoading(); 111 | if(res2.data.data) { 112 | console.log("判断有没交押金：有"); 113 | wx.showLoading({ 114 | title: '正在查询订单1', 115 | }); 116 | // 3.判断当前用户是否有正在进行的订单 117 | api.proceedOrder(token).then(res3 => { 118 | wx.hideLoading(); 119 | // 没有进行中的订单 120 | if (res3.data.code === 23011) { 121 | console.log("判断有没进行中的订单：没有"); 122 | wx.showLoading({ 123 | title: '正在查询订单2', 124 | }); 125 | // 4. 判断当前用户是否有待支付的订单 126 | api.unpaidOrder(token).then(res4 => { 127 | wx.hideLoading(); 128 | if(res4.data.code === 23013) { 129 | console.log("判断有没待支付的订单：没有"); 130 | // 5.获取屏幕信息 131 | that.getSystemInfoData(); 132 | // 6.获取到当前用户的位置,定位在地图上 133 | wx.showLoading({ 134 | title: '正在获取位置', 135 | }); 136 | api.getLocation().then(res6 => { 137 | that.setData({ 138 | latitude: res6.latitude, 139 | longitude: res6.longitude 140 | }); 141 | wx.hideLoading(); 142 | }); 143 | } 144 | else if (res4.data.code === 23012) { 145 | wx.redirectTo({ 146 | url: '../pay/pay' 147 | }); 148 | } 149 | }); 150 | 151 | } 152 | // 有进行中的订单，应跳转到订单详情页面 153 | else if (res3.data.code === 23010) { 154 | wx.redirectTo({ 155 | url: '../order/order' 156 | }) 157 | } 158 | }) 159 | } 160 | else { 161 | console.log("你没交押金"); 162 | wx.redirectTo({ 163 | url: '../payDeposit/payDeposit' 164 | }) 165 | } 166 | }) 167 | }) 168 | 169 | 170 | 171 | 172 | // if (app.globalData.userInfo) { 173 | // this.setData({ 174 | // userInfo: app.globalData.userInfo, 175 | // hasUserInfo: true 176 | // }) 177 | // } else if (this.data.canIUse) { 178 | // // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回 179 | // // 所以此处加入 callback 以防止这种情况 180 | // app.userInfoReadyCallback = res => 181 | // { 182 | // this.setData({ 183 | // userInfo: res.userInfo, 184 | // hasUserInfo: true 185 | // }) 186 | // } 187 | // } else { 188 | // // 在没有 open-type=getUserInfo 版本的兼容处理 189 | // wx.getUserInfo({ 190 | // success: res => { 191 | // app.globalData.userInfo = res.userInfo 192 | // this.setData({ 193 | // userInfo: res.userInfo, 194 | // hasUserInfo: true 195 | // }) 196 | // } 197 | // }) 198 | // } 199 | } 200 | }) 201 | -------------------------------------------------------------------------------- /utils/api.js: -------------------------------------------------------------------------------- 1 | const config = require('../config/config.js'); 2 | const app = getApp(); 3 | 4 | module.exports = { 5 | // 登录的接口(POST) 6 | login: () => { 7 | return new Promise((resolve, reject) => { 8 | // 登录 9 | wx.login({ 10 | success: r => { 11 | let code = r.code 12 | // 登录成功后获取用户详情信息 13 | if (code) { 14 | wx.getUserInfo({ 15 | success: res => { 16 | // 成功则发送 code, encryptedData, iv 数据到 后端业务服务器 完成登录操作 获得token 17 | wx.setStorageSync('userInfo', res.userInfo) 18 | wx.request({ 19 | url: `${config.api}/auth/wechat/login`, 20 | method: 'post', 21 | header: { 22 | 'content-type': 'application/x-www-form-urlencoded' 23 | }, 24 | data: { 25 | 'wechat_code': code, 26 | 'encryptedData': res.encryptedData, 27 | 'iv': res.iv 28 | }, 29 | success: res => { 30 | // 得到业务服务器返回后判断是否成功登录 31 | let result = res.data; 32 | if (result.success) { 33 | // 成功时的操作 34 | const apiToken = 'bearer ' + result.data['access_token']; 35 | wx.setStorageSync('token', apiToken); 36 | resolve(res); 37 | } else { 38 | // 失败时的操作 39 | reject(res) 40 | } 41 | }, 42 | fail: res => { 43 | wx.showToast('服务器繁忙, 请稍后再试') 44 | } 45 | }) 46 | } 47 | }) 48 | } 49 | } 50 | }) 51 | }); 52 | }, 53 | // 获取用户经纬度的接口(GET) 54 | getLocation: () => { 55 | return new Promise((resolve, reject) => { 56 | // 获取用户当前位置 57 | wx.getLocation({ 58 | type: 'gcj02', //返回可以用于wx.openLocation的经纬度 59 | success: res => { 60 | resolve(res); 61 | } 62 | }) 63 | }) 64 | }, 65 | // 查询有没交押金的接口(GET) 66 | checkDeposit: token => { 67 | return new Promise((resolve, reject) => { 68 | wx.request({ 69 | url: `${config.api}/users/checkDeposit`, 70 | method: 'get', 71 | header: { 72 | 'Authorization': token 73 | }, 74 | success: res => { 75 | resolve(res); 76 | }, 77 | fail: res => { 78 | reject(res); 79 | } 80 | }) 81 | }); 82 | }, 83 | // 交纳押金的接口(PUT) 84 | payDeposit: token => { 85 | return new Promise((resolve, reject) => { 86 | wx.request({ 87 | url: `${config.api}/users/payDeposit`, 88 | method: 'put', 89 | header: { 90 | 'Authorization': token 91 | }, 92 | data: {}, 93 | success: res => { 94 | // 得到业务服务器返回后判断是否成功登录 95 | let result = res.data; 96 | if (result.success) { 97 | // 成功时的操作 98 | resolve(res); 99 | } else { 100 | // 失败时的操作 101 | reject(res); 102 | } 103 | }, 104 | fail: res => { 105 | wx.showToast('服务器繁忙, 请稍后再试'); 106 | } 107 | }) 108 | }) 109 | }, 110 | // 退押金的接口(PUT) 111 | returnDeposit: token => { 112 | return new Promise((resolve, reject) => { 113 | wx.request({ 114 | url: `${config.api}/users/backDeposit`, 115 | method: 'put', 116 | header: { 117 | 'Authorization': token 118 | }, 119 | data: {}, 120 | success: res => { 121 | // 得到业务服务器返回后判断是否成功登录 122 | let result = res.data; 123 | if (result.success) { 124 | // 成功时的操作 125 | resolve(res); 126 | } else { 127 | // 失败时的操作 128 | reject(res); 129 | } 130 | }, 131 | fail: res => { 132 | wx.showToast('服务器繁忙, 请稍后再试'); 133 | } 134 | }) 135 | }) 136 | }, 137 | // 查询进行中的订单的接口(GET) 138 | proceedOrder: token => { 139 | return new Promise((resolve, reject) => { 140 | wx.request({ 141 | url: `${config.api}/orders/proceedOrder`, 142 | method: 'get', 143 | header: { 144 | 'Authorization': token 145 | }, 146 | success: res => { 147 | resolve(res); 148 | }, 149 | fail: res => { 150 | reject(res); 151 | } 152 | }) 153 | }); 154 | }, 155 | // 查询待支付的订单接口(GET) 156 | unpaidOrder: token => { 157 | return new Promise((resolve, reject) => { 158 | wx.request({ 159 | url: `${config.api}/orders/unpaidOrder`, 160 | method: 'get', 161 | header: { 162 | 'Authorization': token 163 | }, 164 | success: res => { 165 | resolve(res); 166 | }, 167 | fail: res => { 168 | reject(res); 169 | } 170 | }) 171 | }); 172 | }, 173 | // 查询当前用户的余额和押金的接口(GET) 174 | myWallet: token => { 175 | return new Promise((resolve, reject) => { 176 | wx.request({ 177 | url: `${config.api}/my/wallet`, 178 | method: 'get', 179 | header: { 180 | 'Authorization': token 181 | }, 182 | success: res => { 183 | resolve(res); 184 | }, 185 | fail: res => { 186 | reject(res); 187 | } 188 | }) 189 | }); 190 | }, 191 | // 充值余额的接口(POST) 192 | payBalance: (token, amount) => { 193 | return new Promise((resolve, reject) => { 194 | wx.request({ 195 | url: `${config.api}/users/payAccount`, 196 | method: 'post', 197 | header: { 198 | 'content-type': 'application/x-www-form-urlencoded', 199 | 'Authorization': token 200 | }, 201 | data: { 202 | payAmount: amount 203 | }, 204 | success: res => { 205 | // 得到业务服务器返回后判断是否成功登录 206 | let result = res.data; 207 | if (result.success) { 208 | // 成功时的操作 209 | resolve(res); 210 | } else { 211 | // 失败时的操作 212 | reject(res); 213 | } 214 | }, 215 | fail: res => { 216 | wx.showToast('服务器繁忙, 请稍后再试'); 217 | } 218 | }) 219 | }) 220 | }, 221 | // 租用伞下单的接口(POST) 222 | placeOrder: (token, umbrellaId) => { 223 | return new Promise((resolve, reject) => { 224 | wx.request({ 225 | url: `${config.api}/orders/placeOrder`, 226 | method: 'post', 227 | header: { 228 | 'content-type': 'application/x-www-form-urlencoded', 229 | 'Authorization': token 230 | }, 231 | data: { 232 | umbrellaId: umbrellaId 233 | }, 234 | success: res => { 235 | // 得到业务服务器返回后判断是否成功登录 236 | let result = res.data; 237 | if (result.success) { 238 | // 成功时的操作 239 | resolve(res); 240 | } else { 241 | // 失败时的操作 242 | reject(res); 243 | } 244 | }, 245 | fail: res => { 246 | wx.showToast('服务器繁忙, 请稍后再试'); 247 | } 248 | }) 249 | }) 250 | }, 251 | // 归还伞结束订单的接口(POST) 252 | finishOrder: (token, orderId, rentId) => { 253 | return new Promise((resolve, reject) => { 254 | wx.request({ 255 | url: `${config.api}/orders/finish`, 256 | method: 'post', 257 | header: { 258 | 'content-type': 'application/x-www-form-urlencoded', 259 | 'Authorization': token 260 | }, 261 | data: { 262 | orderId: orderId, 263 | rentId: rentId 264 | }, 265 | success: res => { 266 | // 得到业务服务器返回后判断是否成功登录 267 | let result = res.data; 268 | if (result.success) { 269 | // 成功时的操作 270 | resolve(res); 271 | } else { 272 | // 失败时的操作 273 | reject(res); 274 | } 275 | }, 276 | fail: res => { 277 | wx.showToast('服务器繁忙, 请稍后再试'); 278 | } 279 | }) 280 | }) 281 | }, 282 | // 支付雨伞的接口(POST) 283 | payOrder: (token, orderId) => { 284 | return new Promise((resolve, reject) => { 285 | wx.request({ 286 | url: `${config.api}/orders/pay`, 287 | method: 'post', 288 | header: { 289 | 'content-type': 'application/x-www-form-urlencoded', 290 | 'Authorization': token 291 | }, 292 | data: { 293 | orderId: orderId 294 | }, 295 | success: res => { 296 | // 得到业务服务器返回后判断是否成功登录 297 | let result = res.data; 298 | if (result.success) { 299 | // 成功时的操作 300 | resolve(res); 301 | } else { 302 | // 失败时的操作 303 | reject(res); 304 | } 305 | }, 306 | fail: res => { 307 | wx.showToast('服务器繁忙, 请稍后再试'); 308 | } 309 | }) 310 | }) 311 | }, 312 | } --------------------------------------------------------------------------------