@@ -1,32 +1,44 @@ | |||||
{ | { | ||||
"pages": [ | "pages": [ | ||||
"pages/park/park", | |||||
"pages/index/index", | "pages/index/index", | ||||
"pages/coupons/details/index", | |||||
"pages/shop/details/index", | |||||
"pages/coupons/details/index", | |||||
"pages/shop/details/index", | |||||
"pages/rushToBuy/index", | "pages/rushToBuy/index", | ||||
"pages/shop/index/index", | |||||
"pages/market/index", | |||||
"pages/coupons/index/index", | |||||
"pages/order/details/index", | |||||
"pages/order/index/index", | |||||
"pages/user/index", | |||||
"pages/success/index", | |||||
"pages/login/index" | |||||
"pages/shop/index/index", | |||||
"pages/market/index", | |||||
"pages/coupons/index/index", | |||||
"pages/order/details/index", | |||||
"pages/order/index/index", | |||||
"pages/user/index", | |||||
"pages/success/index", | |||||
"pages/login/index", | |||||
"pages/addPark/addPark", | |||||
"pages/passCar/passCar" | |||||
], | ], | ||||
"tabBar": { | "tabBar": { | ||||
"color":"#9F9F9F", | |||||
"selectedColor":"#00C0FF", | |||||
"list": [{ | |||||
"pagePath": "pages/index/index", | |||||
"iconPath":"assets/img/home-n.png", | |||||
"selectedIconPath":"assets/img/home-y.png", | |||||
"text": "首页" | |||||
}, { | |||||
"pagePath": "pages/user/index", | |||||
"iconPath":"assets/img/user-n.png", | |||||
"selectedIconPath":"assets/img/user-y.png", | |||||
"text": "我的" | |||||
}] | |||||
"color": "#9F9F9F", | |||||
"selectedColor": "#00C0FF", | |||||
"list": [ | |||||
{ | |||||
"pagePath": "pages/index/index", | |||||
"iconPath": "assets/img/home-n.png", | |||||
"selectedIconPath": "assets/img/home-y.png", | |||||
"text": "首页" | |||||
}, | |||||
{ | |||||
"pagePath": "pages/addPark/addPark", | |||||
"iconPath": "assets/img/pass1.png", | |||||
"selectedIconPath": "assets/img/pass0.png", | |||||
"text": "停车" | |||||
}, | |||||
{ | |||||
"pagePath": "pages/user/index", | |||||
"iconPath": "assets/img/user-n.png", | |||||
"selectedIconPath": "assets/img/user-y.png", | |||||
"text": "我的" | |||||
} | |||||
] | |||||
}, | }, | ||||
"window": { | "window": { | ||||
"backgroundTextStyle": "light", | "backgroundTextStyle": "light", | ||||
@@ -0,0 +1,62 @@ | |||||
// pages/park/addPark/addPark.js | |||||
const app = getApp(); | |||||
Page({ | |||||
/** | |||||
* 页面的初始数据 | |||||
*/ | |||||
data: { | |||||
title: '京', | |||||
numFir: '', | |||||
numSco: '', | |||||
numThr: '', | |||||
numFor: '', | |||||
numFive: '', | |||||
numSix: '', | |||||
numSource: '', | |||||
titleShow: true, | |||||
englishShow: '', | |||||
numShow: '', | |||||
specShow: '', | |||||
chooseClass: '京', | |||||
choose: 'carData.title', | |||||
chooseTop: 'carData.title', | |||||
buttonStatus: false, | |||||
chooseTitle: [ | |||||
['京', '津', '冀', '晋', '蒙', '辽', '吉'], | |||||
['黑', '沪', '苏', '浙', '皖', '闽', '赣'], | |||||
['鲁', '豫', '鄂', '湘', '粤', '桂', '琼'], | |||||
['渝', '川', '贵', '云', '藏', '陕', '甘'], | |||||
['青', '宁', '新', '台', '', '', 'DEL'] | |||||
], | |||||
chooseNumFir: [ | |||||
['A', 'B', 'C', 'D', 'E', 'F', 'G'], | |||||
['H', 'I', 'J', 'K', 'L', 'M', 'N'], | |||||
['O', 'P', 'Q', 'R', 'S', 'T', 'U'], | |||||
['V', 'W', 'X', 'Y', 'Z', '', ''], | |||||
['', '', '', '', '', '', 'DEL'] | |||||
], | |||||
chooseNumSco: [ | |||||
['A', 'B', 'C', 'D', 'E', 'F', 'G'], | |||||
['H', 'I', 'J', 'K', 'L', 'M', 'N'], | |||||
['O', 'P', 'Q', 'R', 'S', 'T', 'U'], | |||||
['V', 'W', 'X', 'Y', 'Z', '1', '2'], | |||||
['3', '4', '5', '6', '7', '8', '9'], | |||||
['0', '', '', '', '', '', 'DEL'] | |||||
], | |||||
chooseSpec: [ | |||||
['A', 'B', 'C', 'D', 'E', 'F', 'G'], | |||||
['H', 'I', 'J', 'K', 'L', 'M', 'N'], | |||||
['O', 'P', 'Q', 'R', 'S', 'T', 'U'], | |||||
['V', 'W', 'X', 'Y', 'Z', '港', '澳'], | |||||
['1', '2', '3', '4', '5', '6', '7'], | |||||
['8', '9', '0', '', '', '', 'DEL'] | |||||
], | |||||
}, | |||||
jumpTo: function () { | |||||
wx.redirectTo({ | |||||
url: '/pages/passCar/passCar' | |||||
}); | |||||
} | |||||
}) | |||||
@@ -0,0 +1,3 @@ | |||||
{ | |||||
"navigationBarTitleText": "绑定车牌" | |||||
} |
@@ -0,0 +1,65 @@ | |||||
<view class="addpark-title">请输入车牌号(新能源选填)</view> | |||||
<view class="addpark-num" capture-bind:touchstart="handleTap"> | |||||
<view class="addpark-num-head"> | |||||
<view class="{{chooseTop == 'carData.title' ? 'choose-title' : ''}}" data-carData="carData.title" data-msg="{{title}}">{{title}}</view> | |||||
<view class="addpark-num-head-border {{chooseTop == 'carData.numFir' ? 'choose-title' : ''}}" data-carData="carData.numFir" data-msg="{{numFir}}">{{numFir}}</view> | |||||
</view> | |||||
<view class="addpark-num-center"> | |||||
<view class="{{chooseTop == 'carData.numSco' ? 'choose-title' : ''}}" data-carData="carData.numSco" data-msg="{{numThr}}">{{numSco}}</view> | |||||
<view class="addpark-num-center-border {{chooseTop == 'carData.numThr' ? 'choose-title' : ''}}" data-carData="carData.numThr" data-msg="{{numThr}}">{{numThr}}</view> | |||||
<view class="addpark-num-center-border {{chooseTop == 'carData.numFor' ? 'choose-title' : ''}}" data-carData="carData.numFor" data-msg="{{numFor}}">{{numFor}}</view> | |||||
<view class="addpark-num-center-border {{chooseTop == 'carData.numFive' ? 'choose-title' : ''}}" data-carData="carData.numFive" data-msg="{{numFive}}">{{numFive}}</view> | |||||
<view class="addpark-num-center-border {{chooseTop == 'carData.numSix' ? 'choose-title' : ''}}" data-carData="carData.numSix" data-msg="{{numSix}}">{{numSix}}</view> | |||||
</view> | |||||
<view class="addpark-num-new"> | |||||
<view data-carData="carData.numSource">{{numSource}}</view> | |||||
</view> | |||||
<view class='newsource'>新能源</view> | |||||
</view> | |||||
<view class='addpark-choose' wx:if="{{titleShow}}" capture-bind:touchstart="chooseNum"> | |||||
<view class="addpark-choose-line" wx:for="{{chooseTitle}}" wx:for-item="items" wx:key="chooseNum"> | |||||
<view style="display:flex;"> | |||||
<view class="addpark-choose-font{{chooseClass==item? ' choose' : ''}}" wx:for="{{items}}" wx:key="chooseNumFist" wx:for-item="item" > | |||||
<p wx:if="{{item=='DEL'}}" data-msg="{{item}}"><image data-msg="{{item}}" src="../../assets/img/shanchu-gray.png"></image></p> | |||||
<p wx:else data-msg="{{item}}">{{item}}</p> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class='addpark-choose' wx:if="{{englishShow}}" capture-bind:touchstart="chooseNum"> | |||||
<view class="addpark-choose-line" wx:for="{{chooseNumFir}}" wx:for-item="items" wx:key="chooseNum"> | |||||
<view style="display:flex;"> | |||||
<view class="addpark-choose-font{{chooseClass==item? ' choose' : ''}}" wx:for="{{items}}" wx:key="chooseNumFist" wx:for-item="item"> | |||||
<p wx:if="{{item=='DEL'}}" data-msg="{{item}}"><image data-msg="{{item}}" src="../../assets/img/shanchu.png"></image></p> | |||||
<p wx:elif="{{item =='I'}}" style="color:#ccc;" data-msg="{{item}}">{{item}}</p> | |||||
<p wx:else data-msg="{{item}}">{{item}}</p> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class='addpark-choose-num' wx:if="{{numShow}}" capture-bind:touchstart="chooseNum"> | |||||
<view class="addpark-choose-line" wx:for="{{chooseNumSco}}" wx:for-item="items" wx:key="chooseNum"> | |||||
<view style="display:flex;"> | |||||
<view class="addpark-choose-font{{chooseClass==item? ' choose' : ''}}" wx:for="{{items}}" wx:key="chooseNumFist" wx:for-item="item"> | |||||
<p wx:if="{{item=='DEL'}}" data-msg="{{item}}"><image data-msg="{{item}}" src="../../assets/img/shanchu.png"></image></p> | |||||
<p wx:elif="{{item =='I'}}" style="color:#ccc;" data-msg="{{item}}">{{item}}</p> | |||||
<p wx:else data-msg="{{item}}">{{item}}</p> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class='addpark-choose-num' wx:if="{{specShow}}" capture-bind:touchstart="chooseNum"> | |||||
<view class="addpark-choose-line" wx:for="{{chooseSpec}}" wx:for-item="items" wx:key="chooseNum"> | |||||
<view style="display:flex;"> | |||||
<view class="addpark-choose-font{{chooseClass==item? ' choose' : ''}}" wx:for="{{items}}" wx:key="chooseNumFist" wx:for-item="item"> | |||||
<p wx:if="{{item=='DEL'}}" data-msg="{{item}}"><image data-msg="{{item}}" src="../../assets/img/shanchu.png"></image></p> | |||||
<p wx:elif="{{item =='I'}}" style="color:#ccc;" data-msg="{{item}}">{{item}}</p> | |||||
<p wx:else data-msg="{{item}}">{{item}}</p> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<button class="{{buttonStatus?'addpark-button-submit':'addpark-button-gray'}}" bindtap='submit'> 完成绑定 </button> | |||||
<label class="addpark-back" bindtap="jumpTo">返回</label> | |||||
@@ -0,0 +1,494 @@ | |||||
/* pages/park/addPark/addPark.wxss */ | |||||
.addpark-title { | |||||
margin-top: 48rpx; | |||||
text-align: center; | |||||
font-size: 30rpx; | |||||
color: #9a9b9c; | |||||
} | |||||
.addpark-num { | |||||
display: flex; | |||||
justify-content: center; | |||||
width: 100%; | |||||
margin-top: 33rpx; | |||||
height: 90rpx; | |||||
} | |||||
.addpark-num-head { | |||||
display: flex; | |||||
width: 164rpx; | |||||
background: #58abfa; | |||||
border-radius: 10rpx; | |||||
color: #fff; | |||||
text-align: center; | |||||
align-items: center; | |||||
} | |||||
.addpark-num-head view, .addpark-num-center view, .addpark-num-new view { | |||||
width: 88rpx; | |||||
height: 82rpx; | |||||
line-height: 82rpx; | |||||
} | |||||
.addpark-num-center { | |||||
display: flex; | |||||
margin-left: 20rpx; | |||||
width: 392rpx; | |||||
border: 2rpx solid #58abfa; | |||||
border-radius: 10rpx; | |||||
text-align: center; | |||||
align-items: center; | |||||
} | |||||
.addpark-num-head-border { | |||||
border-left: 2rpx solid #fff; | |||||
} | |||||
.addpark-num-center-border { | |||||
border-left: 2rpx solid #58abfa; | |||||
} | |||||
.addpark-num-new { | |||||
display: flex; | |||||
width: 82rpx; | |||||
text-align: center; | |||||
align-items: center; | |||||
margin-left: 20rpx; | |||||
border: 2rpx solid #12c67a; | |||||
border-radius: 10rpx; | |||||
} | |||||
.newsource{ | |||||
font-size: 16rpx; | |||||
position: absolute; | |||||
top: 100rpx; | |||||
left: 670rpx; | |||||
height: 30rpx; | |||||
width: 60rpx; | |||||
background: #11c67b; | |||||
color: #fff; | |||||
border: 1px solid #11c67b; | |||||
border-radius: 14rpx; | |||||
text-align: center; | |||||
line-height: 30rpx; | |||||
} | |||||
.addpark-choose { | |||||
width: 672rpx; | |||||
margin: 34rpx auto; | |||||
height: 440rpx; | |||||
border: 2rpx solid #58abfa; | |||||
border-radius: 16rpx; | |||||
padding: 30rpx 15rpx; | |||||
} | |||||
.addpark-choose-line { | |||||
display: flex; | |||||
justify-content: center; | |||||
} | |||||
.addpark-choose-font { | |||||
width: 66rpx; | |||||
height: 66rpx; | |||||
background: #f8f8f8; | |||||
text-align: center; | |||||
line-height: 66rpx; | |||||
border: 1 px solid #f8f8f8; | |||||
border-radius: 8rpx; | |||||
margin: 10rpx; | |||||
} | |||||
.addpark-choose-font p image{ | |||||
width:5vmin; | |||||
height:3.5vmin; | |||||
vertical-align: middle; | |||||
} | |||||
.addpark-choose-num { | |||||
width: 672rpx; | |||||
margin: 34rpx auto; | |||||
height: 510rpx; | |||||
border: 2rpx solid #58abfa; | |||||
border-radius: 16rpx; | |||||
padding: 30rpx 15rpx; | |||||
} | |||||
.choose { | |||||
color:#58abfa; | |||||
} | |||||
.choose-title{ | |||||
border:6rpx solid #ffd255; | |||||
} | |||||
.addpark-button-submit{ | |||||
width: 710rpx; | |||||
height: 80rpx; | |||||
margin: 0 auto; | |||||
background: #60b4fc; | |||||
color: #ffffff; | |||||
border-radius: 10rpx; | |||||
line-height: 80rpx; | |||||
} | |||||
.addpark-button-gray{ | |||||
width: 710rpx; | |||||
height: 80rpx; | |||||
margin: 0 auto; | |||||
background: #cbcccd; | |||||
color: #ffffff; | |||||
border-radius: 10rpx; | |||||
line-height: 80rpx; | |||||
} | |||||
.addpark-back{ | |||||
font-size: 25rpx; | |||||
color: #5aadfb; | |||||
float: right; | |||||
margin: 25rpx 25rpx; | |||||
} | |||||
.plaza-parking-info { | |||||
box-sizing: border-box; | |||||
height: 235rpx; | |||||
margin: 20rpx 30rpx 0 30rpx !important; | |||||
background: #fff; | |||||
padding: 20rpx 30rpx 30rpx 30rpx; | |||||
border-radius: 10rpx; | |||||
display: flex; | |||||
} | |||||
.plaza-parking-info image { | |||||
height: 147rpx; | |||||
width: 147rpx; | |||||
margin-top: 15rpx; | |||||
margin-right: 30rpx; | |||||
} | |||||
.plaza-parking-info .flex-item { | |||||
flex: 1; | |||||
} | |||||
.plaza-parking-info .flex-item p:first-child { | |||||
font-size: 30rpx; | |||||
margin-bottom: 10rpx; | |||||
text-overflow: hidden; | |||||
overflow: hidden; | |||||
white-space: nowrap; | |||||
width: 100%; | |||||
} | |||||
.plaza-parking-info .plaza-tip { | |||||
color: rgb(153, 153, 153); | |||||
font-size: 24rpx; | |||||
} | |||||
.plaza-parking-info span { | |||||
color: rgb(153, 153, 153); | |||||
font-size: 24rpx; | |||||
width: 50%; | |||||
display: inline-block; | |||||
} | |||||
.plaza-parking-info span:last-child { | |||||
color: rgb(88, 171, 251); | |||||
} | |||||
.addCar { | |||||
/* margin-top:1vmin!important; */ | |||||
text-align: center; | |||||
} | |||||
.addCar .add-btn { | |||||
color: rgb(88, 171, 251); | |||||
font-size: 32rpx; | |||||
} | |||||
.addCar .tip { | |||||
margin-top: 3vmin; | |||||
font-size: 24rpx; | |||||
color: rgb(153, 153, 153); | |||||
} | |||||
.addCar i { | |||||
color: rgb(88, 171, 251); | |||||
} | |||||
.bottom-nav { | |||||
padding: 3vmin 5vmin; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
} | |||||
.bottom-nav button.parking-log { | |||||
border: rgb(88, 171, 251) 1rpx solid; | |||||
color: rgb(88, 171, 251); | |||||
width: 330rpx; | |||||
line-height: 68rpx; | |||||
height: 68rpx; | |||||
font-size: 32rpx; | |||||
} | |||||
.bottom-nav button.parking-coupon { | |||||
border: rgb(253, 50, 83) 1rpx solid; | |||||
background: rgb(253, 50, 83); | |||||
color: #fff; | |||||
width: 330rpx; | |||||
height: 68rpx; | |||||
line-height: 68rpx; | |||||
font-size: 32rpx; | |||||
} | |||||
/*绑定车辆列表*/ | |||||
.car-list { | |||||
padding: 30rpx; | |||||
} | |||||
.car-list .item { | |||||
box-sizing: border-box; | |||||
background: #fff; | |||||
border-radius: 15rpx; | |||||
height: 100rpx; | |||||
line-height: 100rpx; | |||||
padding: 0 20rpx 0 40rpx; | |||||
margin-bottom: 20rpx; | |||||
position: relative; | |||||
} | |||||
.car-list .item span { | |||||
line-height: 50rpx; | |||||
display: inline-block; | |||||
width: 257rpx; | |||||
border: 1rpx solid rgb(88, 171, 251); | |||||
padding-left: 30rpx; | |||||
border-radius: 10rpx; | |||||
color: rgb(88, 171, 251); | |||||
font-size: 32rpx; | |||||
font-weight: bold; | |||||
} | |||||
.car-list .item image { | |||||
position: absolute; | |||||
right: 23rpx; | |||||
top: 26rpx; | |||||
} | |||||
.car-list .oTitle { | |||||
font-size: 3.5vmin; | |||||
color: rgb(153, 153, 153); | |||||
line-height: 8vmin; | |||||
height: 8vmin; | |||||
display: block; | |||||
margin-left: 1vmin; | |||||
} | |||||
.car-list .oTitle image { | |||||
display: block; | |||||
width: 4.3vmin; | |||||
height: 4.1vmin; | |||||
background-size: 100%; | |||||
float: left; | |||||
margin-right: 1vmin; | |||||
vertical-align: middle; | |||||
} | |||||
.footer { | |||||
text-align: right; | |||||
padding-right: 30rpx; | |||||
color: rgb(88, 171, 251); | |||||
font-size: 24rpx; | |||||
} | |||||
.wrap { | |||||
padding: 10rpx 30rpx 30rpx 30rpx; | |||||
} | |||||
.out { | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-bottom: 20rpx; | |||||
height: 180rpx; | |||||
padding: 20rpx 30rpx; | |||||
border-radius: 20rpx; | |||||
box-shadow: 6rpx 6rpx 6rpx rgba(0, 0, 0, 0.06); | |||||
} | |||||
.bg-blue { | |||||
background: linear-gradient(45deg, rgb(98, 216, 253), rgb(89, 178, 251)); | |||||
} | |||||
.bg-blue .car-name { | |||||
background-color: #fff; | |||||
color: rgb(88, 177, 251); | |||||
text-align: center; | |||||
} | |||||
.bg-blue .name-border { | |||||
border: 1px solid rgb(88, 177, 251); | |||||
border-radius: 15rpx; | |||||
font-size: 27rpx; | |||||
} | |||||
.bg-white { | |||||
background-color: #fff; | |||||
} | |||||
.bg-white .name-border { | |||||
border: 1px solid #fff; | |||||
border-radius: 15rpx; | |||||
font-size: 27rpx; | |||||
} | |||||
.car { | |||||
flex: 1; | |||||
} | |||||
.car text { | |||||
display: block; | |||||
} | |||||
.car-name { | |||||
margin-bottom: 25rpx; | |||||
background-color: rgb(88, 177, 251); | |||||
color: #fff; | |||||
box-sizing: border-box; | |||||
padding: 7rpx 10rpx; | |||||
border-radius: 20rpx; | |||||
width: 246rpx; | |||||
height: 54rpx; | |||||
text-align: center; | |||||
} | |||||
.parking-time { | |||||
font-size: 30rpx; | |||||
color: rgb(182, 182, 182); | |||||
margin-bottom: 10rpx; | |||||
} | |||||
.need-pay { | |||||
display: block; | |||||
height: 80rpx; | |||||
text-align: right; | |||||
color: #fff; | |||||
font-size: 64rpx; | |||||
} | |||||
.go-pay { | |||||
box-sizing: border-box; | |||||
border: 5rpx solid #fff; | |||||
text-align: center; | |||||
position: absolute; | |||||
bottom: 0; | |||||
width: 130rpx; | |||||
line-height: 50rpx; | |||||
right: 0; | |||||
color: #fff; | |||||
border-radius: 20rpx; | |||||
font-size: 28rpx; | |||||
} | |||||
.address { | |||||
font-size: 30rpx; | |||||
color: rgb(182, 182, 182); | |||||
} | |||||
.bg-blue .parking-time { | |||||
color: #fff; | |||||
} | |||||
.bg-blue .address { | |||||
color: #fff; | |||||
} | |||||
.cost>text { | |||||
display: block; | |||||
margin-bottom: 12rpx; | |||||
} | |||||
.time { | |||||
font-size: 25rpx; | |||||
background: red; | |||||
color: white; | |||||
padding: 0 7rpx; | |||||
margin-right: 10rpx; | |||||
} | |||||
.dot { | |||||
color: red; | |||||
margin-right: 10rpx; | |||||
} | |||||
.time-tip { | |||||
font-size: 24rpx; | |||||
color: rgb(182, 182, 182); | |||||
text-align: center; | |||||
} | |||||
.already-pay { | |||||
color: rgb(88, 171, 251); | |||||
font-size: 30rpx; | |||||
} | |||||
.out-cars { | |||||
position: relative; | |||||
} | |||||
.out-car { | |||||
margin-top: 10rpx; | |||||
display: block; | |||||
font-size: 24rpx; | |||||
margin-bottom: 30rpx; | |||||
color: rgb(182, 182, 182); | |||||
} | |||||
.go-pay-disabled { | |||||
display: inline-block; | |||||
position: absolute; | |||||
border: 5rpx solid rgb(204, 204, 204); | |||||
bottom: 0; | |||||
right: 0; | |||||
text-align: center; | |||||
background: rgb(204, 204, 204); | |||||
color: #fff; | |||||
border-radius: 20rpx; | |||||
width: 130rpx; | |||||
line-height: 50rpx; | |||||
font-size: 28rpx; | |||||
} | |||||
.oTitle { | |||||
font-size: 3.5vmin; | |||||
color: rgb(153, 153, 153); | |||||
line-height: 8vmin; | |||||
height: 8vmin; | |||||
display: block; | |||||
margin-left: 1vmin; | |||||
} | |||||
.oTitle image { | |||||
display: block; | |||||
width: 4.3vmin; | |||||
height: 4.1vmin; | |||||
background-size: 100%; | |||||
float: left; | |||||
margin-right: 1vmin; | |||||
margin-top: 2vmin; | |||||
} | |||||
.info-right { | |||||
width: 30vmin; | |||||
text-align: right; | |||||
position: relative; | |||||
} | |||||
.car-outting { | |||||
background: #fff; | |||||
} | |||||
.car-outting .car-name { | |||||
color: #fff; | |||||
} | |||||
@@ -0,0 +1,150 @@ | |||||
// pages/park/park.js | |||||
Page({ | |||||
/** | |||||
* 页面的初始数据 | |||||
*/ | |||||
data: { | |||||
item1: ["京", "沪", "浙", "苏", "粤", "鲁", "晋", "冀", | |||||
"豫", "川", "渝", "辽", "吉", "黑", "皖", "鄂", | |||||
"津", "贵", "云", "桂", "琼", "青", "新", "藏", | |||||
"蒙", "宁", "甘", "陕", "闽", "赣", "湘"], | |||||
item2: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", | |||||
"Q", "W", "E", "R", "T", "Y", "U", "I", "O", "P", | |||||
"A", "S", "D", "F", "G", "H", "J", "K", "L", | |||||
"Z", "X", "C", "V", "B", "N", "M"], | |||||
hidden1: true, | |||||
hidden2: true, | |||||
carNo: '', | |||||
}, | |||||
//车牌输入获取焦点 | |||||
d1: function () { | |||||
var that = this; | |||||
if (that.data.carNo == '') { | |||||
that.setData({ | |||||
hidden1: false, | |||||
hidden2: true | |||||
}) | |||||
} else { | |||||
that.setData({ | |||||
hidden1: true, | |||||
hidden2: false | |||||
}) | |||||
} | |||||
}, | |||||
//车牌输入失去焦点 | |||||
d2: function () { | |||||
var that = this; | |||||
that.setData({ | |||||
hidden1: true, | |||||
hidden2: true | |||||
}) | |||||
}, | |||||
//获取车牌省份 | |||||
sheng: function (e) { | |||||
var that = this; | |||||
console.log(e.currentTarget.dataset.sh); | |||||
that.setData({ | |||||
carNo: e.currentTarget.dataset.sh | |||||
}) | |||||
if (that.data.carNo != '') { | |||||
that.setData({ | |||||
hidden1: true, | |||||
hidden2: false | |||||
}) | |||||
} | |||||
}, | |||||
//获取车牌号码 | |||||
other: function (e) { | |||||
var that = this; | |||||
console.log(e.currentTarget.dataset.ot); | |||||
var carNo = that.data.carNo + e.currentTarget.dataset.ot; | |||||
that.setData({ | |||||
carNo: carNo | |||||
}) | |||||
}, | |||||
//回删车牌 | |||||
del: function () { | |||||
var that = this; | |||||
var ss = that.data.carNo; | |||||
console.log(ss); | |||||
var s = ss.split(''); | |||||
console.log(s); | |||||
console.log(s.slice(0, -1)); | |||||
if (s.slice(0, -1).length == 0) { | |||||
that.setData({ | |||||
hidden1: false, | |||||
hidden2: true | |||||
}) | |||||
} | |||||
console.log(s.join('').slice(0, -1)); | |||||
var s = s.join('').slice(0, -1); | |||||
that.setData({ | |||||
carNo: s | |||||
}) | |||||
console.log(that.data.carNo.length); | |||||
}, | |||||
//确认输入 | |||||
ok: function () { | |||||
wx.navigateTo({ | |||||
url: '/pages/passCar/passCar', | |||||
}) | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面加载 | |||||
*/ | |||||
onLoad: function (options) { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面初次渲染完成 | |||||
*/ | |||||
onReady: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面显示 | |||||
*/ | |||||
onShow: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面隐藏 | |||||
*/ | |||||
onHide: function () { | |||||
}, | |||||
/** | |||||
* 生命周期函数--监听页面卸载 | |||||
*/ | |||||
onUnload: function () { | |||||
}, | |||||
/** | |||||
* 页面相关事件处理函数--监听用户下拉动作 | |||||
*/ | |||||
onPullDownRefresh: function () { | |||||
}, | |||||
/** | |||||
* 页面上拉触底事件的处理函数 | |||||
*/ | |||||
onReachBottom: function () { | |||||
}, | |||||
/** | |||||
* 用户点击右上角分享 | |||||
*/ | |||||
onShareAppMessage: function () { | |||||
} | |||||
}) |
@@ -0,0 +1,4 @@ | |||||
{ | |||||
"component": true, | |||||
"usingComponents": {} | |||||
} |
@@ -0,0 +1,22 @@ | |||||
<!--pages/park/park.wxml--> | |||||
<!--pages/jp_cp/jp_cp.wxml--> | |||||
<view class="container"> | |||||
<view>请输入车牌号码:</view> | |||||
<view class="chepai"> | |||||
<view class="tel" bindtap="d1">{{carNo}}</view> | |||||
</view> | |||||
<!-- 省 --> | |||||
<view class="provinces" hidden='{{hidden1}}'> | |||||
<view class="pro_li lf" wx:for="{{item1}}" wx:key='{{index}}' bindtap='sheng' data-sh="{{item}}">{{item}}</view> | |||||
<view class="pro_del lf" bindtap='null'>清空</view> | |||||
<view class="pro_close lf" bindtap='d2'>关闭</view> | |||||
</view> | |||||
<!-- 号码 --> | |||||
<view class="keyNums" hidden='{{hidden2}}'> | |||||
<view class="pro_li lf" wx:for="{{item2}}" wx:key='{{index}}' bindtap='other' data-ot="{{item}}">{{item}}</view> | |||||
<view class="bot"> | |||||
<view class="pro_ok lf" bindtap='ok'>OK</view> | |||||
<view class="pro_d lf" bindtap='del'>Del</view> | |||||
</view> | |||||
</view> | |||||
</view> |
@@ -0,0 +1,86 @@ | |||||
/* pages/park/park.wxss */ | |||||
/* pages/jp_cp/jp_cp.wxss */ | |||||
.lf{ | |||||
float: left; | |||||
} | |||||
.rt{ | |||||
float: right; | |||||
} | |||||
.tel{ | |||||
border-bottom: 2rpx solid #ddd; | |||||
height: 100rpx; | |||||
line-height:100rpx; | |||||
} | |||||
.chepai{ | |||||
height: 200rpx; | |||||
line-height:200rpx; | |||||
} | |||||
.provinces{ | |||||
overflow: hidden; | |||||
background-color: #CED3D9; | |||||
padding:30rpx 0; | |||||
position: absolute; | |||||
bottom: 0; | |||||
left: 0; | |||||
z-index: 10000; | |||||
} | |||||
.pro_li{ | |||||
font-size: 36rpx; | |||||
height: 70rpx; | |||||
width: 70rpx; | |||||
line-height: 70rpx; | |||||
text-align: center; | |||||
border: 2rpx solid #ddd; | |||||
margin: 5rpx; | |||||
background-color:#fff; | |||||
} | |||||
.pro_close{ | |||||
width: 100rpx; | |||||
height: 70rpx; | |||||
line-height: 70rpx; | |||||
font-size: 32rpx; | |||||
text-align: center; | |||||
background-color: #fff; | |||||
border: 2rpx solid #ddd; | |||||
margin: 5rpx ; | |||||
} | |||||
.pro_del{ | |||||
width: 100rpx; | |||||
height: 70rpx; | |||||
line-height: 70rpx; | |||||
font-size: 32rpx; | |||||
text-align: center; | |||||
background-color: #fff; | |||||
border: 2rpx solid #ddd; | |||||
margin: 5rpx; | |||||
} | |||||
.keyNums{ | |||||
overflow: hidden; | |||||
background-color: #CED3D9; | |||||
padding:30rpx 0; | |||||
position: absolute; | |||||
bottom: 0; | |||||
left: 0; | |||||
z-index: 10000; | |||||
} | |||||
.pro_ok{ | |||||
width: 100rpx; | |||||
height: 70rpx; | |||||
line-height: 70rpx; | |||||
font-size: 32rpx; | |||||
text-align: center; | |||||
background-color: #fff; | |||||
border: 2rpx solid #ddd; | |||||
margin: 5rpx ; | |||||
/* margin-left: 35%; */ | |||||
} | |||||
.pro_d{ | |||||
width: 100rpx; | |||||
height: 70rpx; | |||||
line-height: 70rpx; | |||||
font-size: 32rpx; | |||||
text-align: center; | |||||
background-color: #fff; | |||||
border: 2rpx solid #ddd; | |||||
margin: 5rpx; | |||||
} |
@@ -0,0 +1,36 @@ | |||||
// pages/passCar/passCar.js | |||||
Component({ | |||||
properties: { | |||||
}, | |||||
data: { | |||||
}, | |||||
methods: { | |||||
jumpToAdd: function() { | |||||
wx.redirectTo({ | |||||
url: '/pages/addPark/addPark' | |||||
}); | |||||
}, | |||||
jumpToPay: function() { | |||||
wx.redirectTo({ | |||||
url: '/pages/pay/pay', | |||||
}) | |||||
}, | |||||
passb: function() { | |||||
wx.showToast({ | |||||
title: '货物在路上~', | |||||
}) | |||||
}, | |||||
passc: function() { | |||||
wx.showToast({ | |||||
title: '宝宝最可爱~', | |||||
}) | |||||
}, | |||||
orderPay: function() { | |||||
wx.redirectTo({ | |||||
url: '/pages/pay/pay' | |||||
}); | |||||
} | |||||
} | |||||
}) |
@@ -0,0 +1,5 @@ | |||||
{ | |||||
"component": true, | |||||
"usingComponents": {}, | |||||
"navigationBarTitleText": "车辆管理" | |||||
} |
@@ -0,0 +1,56 @@ | |||||
<view class='container'> | |||||
<view class='headBox'> | |||||
<image src='../../assets/img/timg.jpg'></image> | |||||
<view class='numberBox'> | |||||
<view class='titleName'>万达停车场</view> | |||||
<view class='carLocation'>总车位: | |||||
<label class='locationNumber'> 8888个</label> | |||||
</view> | |||||
<view class='carLocation'>停车费: | |||||
<label class='locationNumber'>大班车 ¥5/小时</label> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class='borderBox'> | |||||
<view class='borderUp'>我的爱车 | |||||
<label class='carNumber'>最多可添加3辆,点选车牌号完成付款</label> | |||||
</view> | |||||
<view class='passNumberBox'> | |||||
<view class='passNumber' bindtap='orderPay'>京C·21457</view> | |||||
<button class='deleteButton' bindtap='delete'>删除</button> | |||||
</view> | |||||
<view class='addBox'> | |||||
<view class='add' bindtap="jumpToAdd">点击添加我的爱车</view> | |||||
</view> | |||||
</view> | |||||
<view class='bottonBox'> | |||||
<view class='textStyle'> | |||||
<image src='../../assets/img/quan.png'></image> | |||||
我的停车券 | |||||
<view class='detail'> | |||||
<image src='../../assets/img/down.png'></image> | |||||
</view> | |||||
</view> | |||||
<view class='voucher'> | |||||
<text class='textV1'>2小时免费停车券</text> | |||||
<text class='textV2'>¥10.00元</text> | |||||
<view class='choice'> | |||||
<image src='../../assets/img/choiced.png'></image> | |||||
</view> | |||||
</view> | |||||
<view class='textStyle' bindtap='passb'> | |||||
<image src='../../assets/img/jilu.png'></image> | |||||
停车记录 | |||||
<view class='detail'> | |||||
<image src='../../assets/img/right.png'></image> | |||||
</view> | |||||
</view> | |||||
<view class='textStyle' bindtap='passc'> | |||||
<image src='../../assets/img/wenti.png'></image> | |||||
常见问题 | |||||
<view class='detail'> | |||||
<image src='../../assets/img/right.png'></image> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> |
@@ -0,0 +1,182 @@ | |||||
/**passCar.wxss**/ | |||||
page{ | |||||
background-color: #f8f8f8; | |||||
} | |||||
.headBox{ | |||||
margin-top: 13rpx; | |||||
width: 750rpx; | |||||
height: 210rpx; | |||||
box-sizing: border-box; | |||||
padding: 30rpx 40rpx; | |||||
display: flex; | |||||
background-color: white | |||||
} | |||||
.headBox image{ | |||||
width: 150rpx; | |||||
height: 150rpx; | |||||
margin-right: 62rpx; | |||||
border: 1px #cbcbcb solid; | |||||
} | |||||
.numberBox{ | |||||
width: 400rpx; | |||||
height: 150rpx | |||||
} | |||||
.titleName{ | |||||
line-height: 60rpx; | |||||
height:60rpx; | |||||
color: #333; | |||||
font-size: 36rpx; | |||||
width: 400rpx; | |||||
word-break:break-all; | |||||
text-align: justify; | |||||
} | |||||
::-webkit-scrollbar{ | |||||
width: 0; | |||||
height: 0; | |||||
color: transparent; | |||||
} | |||||
.carLocation,.locationNumber{ | |||||
width: 400rpx; | |||||
height: 50rpx; | |||||
color: #333; | |||||
font-size: 28rpx; | |||||
line-height: 50rpx; | |||||
} | |||||
.borderBox{ | |||||
width: 750rpx; | |||||
margin-top: 26rpx; | |||||
} | |||||
.borderUp{ | |||||
padding: 50rpx; | |||||
width: 750rpx; | |||||
height: 50rpx; | |||||
line-height: 50rpx; | |||||
font-size: 36rpx; | |||||
color: #333; | |||||
border-bottom: 1rpx #f8f8f8 solid; | |||||
background-color: white; | |||||
} | |||||
.carNumber{ | |||||
padding: 50rpx; | |||||
height: 50rpx; | |||||
line-height: 50rpx; | |||||
font-size: 28rpx; | |||||
color: #cbcbcb; | |||||
background-color: white; | |||||
} | |||||
.addBox{ | |||||
width: 750rpx; | |||||
height: 220rpx; | |||||
position: relative; | |||||
background-color: white; | |||||
} | |||||
.add{ | |||||
position: absolute; | |||||
left: 50%; | |||||
top: 50%; | |||||
transform: translate(-50%,-50%); | |||||
font-size: 36rpx; | |||||
color: #333; | |||||
} | |||||
.bottonBox{ | |||||
width: 750rpx; | |||||
margin-top: 75rpx; | |||||
background-color: white; | |||||
} | |||||
.textStyle{ | |||||
height: 90rpx; | |||||
line-height: 90rpx; | |||||
padding-left: 130rpx; | |||||
color: #333; | |||||
font-size: 28rpx; | |||||
letter-spacing: 1rpx; | |||||
margin-top: 30rpx; | |||||
border-bottom: 1rpx #f8f8f8 solid; | |||||
position: relative; | |||||
} | |||||
.textStyle image{ | |||||
width: 50rpx; | |||||
height: 50rpx; | |||||
top: 20rpx; | |||||
left: 50rpx; | |||||
position: absolute; | |||||
} | |||||
.passNumberBox{ | |||||
width: 750rpx; | |||||
height: 150rpx; | |||||
position: relative; | |||||
background-color: white; | |||||
border-bottom: 1rpx #f8f8f8 solid; | |||||
} | |||||
.passNumber{ | |||||
width: 400rpx; | |||||
height: 150rpx; | |||||
font-size: 32rpx; | |||||
font-weight: 600; | |||||
line-height: 150rpx; | |||||
left: 55rpx; | |||||
position: absolute; | |||||
} | |||||
.deleteButton{ | |||||
font-size: 28rpx; | |||||
line-height: 50rpx; | |||||
top: 50rpx; | |||||
right: 30rpx; | |||||
position: absolute; | |||||
} | |||||
.detail{ | |||||
width: 32rpx; | |||||
height: 32rpx; | |||||
right: 50rpx; | |||||
top: 32rpx; | |||||
position: absolute; | |||||
} | |||||
.detail image{ | |||||
width: 32rpx; | |||||
height: 32rpx; | |||||
position: absolute; | |||||
left: 0; | |||||
top: 0; | |||||
} | |||||
.voucher{ | |||||
width: 88%; | |||||
margin-left: 6%; | |||||
height: 80rpx; | |||||
background-color: #cbcbcb; | |||||
position: relative; | |||||
} | |||||
.textV1,.textV2{ | |||||
line-height: 80rxp; | |||||
font-size: 28rpx; | |||||
color: white; | |||||
} | |||||
.textV1{ | |||||
position: absolute; | |||||
left: 10rpx; | |||||
top: 22rpx; | |||||
} | |||||
.textV2{ | |||||
position: absolute; | |||||
top: 22rpx; | |||||
right: 80rpx; | |||||
} | |||||
.choice{ | |||||
width: 80rpx; | |||||
height: 80rpx; | |||||
position: absolute; | |||||
top: 0; | |||||
right: 0; | |||||
} | |||||
.choice image{ | |||||
position: absolute; | |||||
left: 50%; | |||||
top: 50%; | |||||
transform: translate(-50%,-50%); | |||||
width: 30rpx; | |||||
height: 30rpx; | |||||
} |
@@ -12,7 +12,7 @@ | |||||
}, | }, | ||||
"compileType": "miniprogram", | "compileType": "miniprogram", | ||||
"libVersion": "2.2.2", | "libVersion": "2.2.2", | ||||
"appid": "wx649b3be73c1afe47", | |||||
"appid": "wx8eb8275b78db4ede", | |||||
"projectname": "C4", | "projectname": "C4", | ||||
"isGameTourist": false, | "isGameTourist": false, | ||||
"condition": { | "condition": { | ||||