Commit 86984d7a authored by lijiongliang's avatar lijiongliang

页面修改

parent 9ecba1f5
// const baseUrl = 'https://r.ucaret.cn/test-api'; // 开发地址 // const baseUrl = 'https://r.ucaret.cn/test-api'; // 开发地址
const baseUrl = 'https://jduniapp.uzosp.com'; // 线上地址 const baseUrl = 'http://4v7u6z.natappfree.cc'; // 开发地址
// const baseUrl = 'https://jduniapp.uzosp.com'; // 线上地址
const httpRequest = (opts, data) => { const httpRequest = (opts, data) => {
let httpDefaultOpts = { let httpDefaultOpts = {
url: baseUrl + opts.url, url: baseUrl + opts.url,
......
...@@ -57,6 +57,9 @@ ...@@ -57,6 +57,9 @@
<view class="pooup-get-coupon" v-if="pooupCoupon"> <view class="pooup-get-coupon" v-if="pooupCoupon">
<view class="coupon-box"> <view class="coupon-box">
<image src="../../../static/index/coupon3.png"></image> <image src="../../../static/index/coupon3.png"></image>
<view class="close" @click="pooupCoupon = false">
X
</view>
<view class="title"> <view class="title">
<view style="margin-bottom:10rpx;font-weight: bold;"> <view style="margin-bottom:10rpx;font-weight: bold;">
您无优惠券可用 您无优惠券可用
...@@ -475,6 +478,11 @@ ...@@ -475,6 +478,11 @@
width:100%;height:100%; width:100%;height:100%;
z-index:-11; z-index:-11;
} }
.close{
font-size:32rpx;
position: absolute;
top:20rpx;right:30rpx;
}
.title{ .title{
width:100%; width:100%;
position: absolute; position: absolute;
......
...@@ -110,6 +110,11 @@ ...@@ -110,6 +110,11 @@
} else { } else {
that.gotoBindMoveCar(scene) that.gotoBindMoveCar(scene)
} }
}else{
uni.showToast({
title: res.data.msg,
icon: 'none',
});
} }
}) })
} else { } else {
...@@ -124,6 +129,11 @@ ...@@ -124,6 +129,11 @@
icon: 'none', icon: 'none',
}) })
} }
}else{
uni.showToast({
title: res.data.msg,
icon: 'none',
});
} }
}) })
} }
......
...@@ -97,6 +97,11 @@ ...@@ -97,6 +97,11 @@
}) })
} }
}); });
}else{
uni.showToast({
title: res.data.msg,
icon: 'none',
});
} }
}) })
// uni.showToast({ // uni.showToast({
......
...@@ -15,8 +15,40 @@ ...@@ -15,8 +15,40 @@
感谢您使用挪车二维码,请完成车牌号与手机的绑定以便享受挪车服务 感谢您使用挪车二维码,请完成车牌号与手机的绑定以便享受挪车服务
</div> </div>
</div> </div>
<div class="moveCarMsg"> <div class="car_info" v-if="carInfo">
<div class="scan__tips"> <view class="info_list">
<view class="left">
品牌
</view>
<view class="right">
{{carInfo.brand}}
</view>
</view>
<view class="info_list">
<view class="left">
车型
</view>
<view class="right">
{{carInfo.carModel}}
</view>
</view>
<view class="info_list">
<view class="left">
车牌号
</view>
<view class="right">
{{carInfo.carNo}}
</view>
</view>
<view class="info_list">
<view class="left">
行驶里程
</view>
<view class="right">
{{carInfo.mileage || 0}}KM
</view>
</view>
<!-- <div class="scan__tips">
<div>请填写以下信息</div> <div>请填写以下信息</div>
<div @click="goLoveCar">从爱车选择<span> <div @click="goLoveCar">从爱车选择<span>
<image src="@/static/move-car/scan_right.png" /></span></div> <image src="@/static/move-car/scan_right.png" /></span></div>
...@@ -32,12 +64,85 @@ ...@@ -32,12 +64,85 @@
<u-checkbox :checked='checked' @change="changeBtn"></u-checkbox> <u-checkbox :checked='checked' @change="changeBtn"></u-checkbox>
</u-checkbox-group> </u-checkbox-group>
请先阅读并同意<span @click="goArticle(2)">《京东挪车牌隐私权政策》</span> 请先阅读并同意<span @click="goArticle(2)">《京东挪车牌隐私权政策》</span>
</div> </div> -->
</div> </div>
<view class="no-car-info" v-else>
<view class="title">
请完成以下操作
</view>
<image src="../../../static/move-car/none.png"></image>
<view class="no-content">
暂无爱车信息,请先添加爱车
</view>
<view class="no-car-btn" @click="getCarList">
从爱车选择
</view>
</view>
<view class="form-data">
<view class="form-item">
<view class="item-text">
联系方式:
</view>
<view class="item-input">
<input type="number" placeholder="请输入" v-model="model1.userMobile">
</view>
</view>
<view class="form-item">
<view class="item-text">
验证码:
</view>
<view class="item-input flex align-center">
<input type="number" placeholder="请输入" v-model="model1.verificationCode">
<view class="code text-red" v-if="!smsbtn.status" @click="sendCode">
{{smsbtn.text}}
</view>
<view class="code" v-else>
{{smsbtn.text}}({{smsbtn.codeTime+'s'}})
</view>
</view>
</view>
</view>
<div class="view__btn view__no__bind" @click="confirmBinding"> <div class="view__btn view__no__bind" @click="confirmBinding">
确认绑定 绑定车辆
</div> </div>
<div class="use__text" @click="gotoExplanation">使用说明</div> <div class="use__text" @click="gotoExplanation">使用说明</div>
<!-- 爱车选择弹框 -->
<u-popup :show="selectCar" mode="bottom" round="10" @close="selectCar = false">
<view class="love_car_list">
<view class="love_title">
选择车辆
<text @click.stop="selectCar = false">x</text>
</view>
<view class="love_list">
<view v-if="carList.length != 0">
<view class="love_item" v-for="(item,i) in carList" :key="i" @click="radioChange(i)">
<image src="../../../static/move-car/love-car6.png"></image>
<view class="love_info">
<view>
{{item.brand + "-" + item.seriesName}}
</view>
<view>
{{item.carModel}}
</view>
</view>
<view class="radio">
<image src="../../../static/move-car/radio-active.png" v-if="i === radioValue"></image>
<image src="../../../static/move-car/radio.png" v-else></image>
</view>
</view>
</view>
<view class="text-center" style="padding-top:140rpx;" v-else>
暂时没有车辆,请添加!
</view>
</view>
<view class="love_btn">
<button type="primary" @click="addCar">添加车辆</button>
</view>
</view>
</u-popup>
</div> </div>
</view> </view>
</template> </template>
...@@ -51,8 +156,13 @@ export default { ...@@ -51,8 +156,13 @@ export default {
data() { data() {
return { return {
model1: { model1: {
carInfo: {}, moveCode:"",
carNo:"",
userMobile:"",
verificationCode:"",
carId:""
}, },
carInfo: null,
formData: [ formData: [
// { // {
// id: "kjjns", //id必须唯一 可以是数字 // id: "kjjns", //id必须唯一 可以是数字
...@@ -119,10 +229,19 @@ export default { ...@@ -119,10 +229,19 @@ export default {
//挪车码 //挪车码
moveCode: '', moveCode: '',
//绑定挪车码信息 //绑定挪车码信息
moveCodeInfo: {}, moveCodeInfo: null,
//选择车辆id //选择车辆id
carId: '', carId: '',
checked:false carList:[],
checked:false,
selectCar:false,
radioValue:"",
smsbtn:{
text:'发送验证码',
status:false,
codeTime:60
}, // 验证码
clickStatus:false, // 节流
} }
}, },
methods: { methods: {
...@@ -140,39 +259,105 @@ export default { ...@@ -140,39 +259,105 @@ export default {
url: '/pagesB/pages/move-car/loveCar?price=1' url: '/pagesB/pages/move-car/loveCar?price=1'
}); });
}, },
// 选择爱车
radioChange(index){
this.carInfo = this.carList[index]
this.radioValue = index
this.selectCar = false
this.model1.carNo = this.carList[index].carNo
this.model1.carId = this.carList[index].id
},
// 获取爱车列表
getCarList(){
uni.showLoading({
title: '加载中'
});
let opts = { url: '/app/vehicleAdmin/list', method: 'get' };
this.http.httpTokenRequest(opts, {}).then(res => {
if (res.statusCode == 200) {
uni.hideLoading()
this.carList = res.data
this.selectCar = true
}
})
},
// 添加车辆
addCar() {
this.selectCar = false
uni.navigateTo({
url: '/pages/transitionPage'
});
},
// 发送验证码
sendCode(){
if(this.model1.userMobile.length == 0){
uni.showToast({
title: "联系方式不能为空!",
icon: "none",
});
return;
}
uni.showLoading({
title: '加载中'
});
let opts = { url: '/app/smsCode/binding/', method: 'post' };
this.http.httpTokenRequest(opts,{phone: this.model1.userMobile}).then(res => {
if (res.statusCode == 200) {
uni.showToast({
title: "别着急!短信已经发送了~",
icon: 'none',
duration: 1500
});
uni.hideLoading()
if(this.clickStatus == false){
this.clickStatus = true
let timer = setInterval(() => {
if (this.smsbtn.codeTime > 0) {
this.smsbtn.status = true
this.smsbtn.text = "已发送";
this.smsbtn.codeTime--;
} else if (this.smsbtn.codeTime <= 0) {
this.smsbtn.codeTime = 60;
this.smsbtn.text = "重新获取";
this.smsbtn.status = false
this.clickStatus = false
clearInterval(timer);
}
}, 1000);
}
}
})
},
confirmBinding() { confirmBinding() {
for (let i in this.formData) { if(this.model1.userMobile.length == 0){
let name = this.formData[i].rules.name uni.showToast({
if (name == 'yzm') { title: "联系方式不能为空!",
this.moveCodeInfo.verificationCode = this.formData[i].rules.value icon: "none",
} else if (name == 'phone') { });
this.moveCodeInfo.userMobile = this.formData[i].rules.value return;
} else { }
this.moveCodeInfo[name] = this.formData[i].rules.value if(this.model1.verificationCode.length == 0){
} uni.showToast({
} title: "验证码不能为空!",
this.moveCodeInfo.carId = this.model1.carInfo.carId icon: "none",
this.moveCodeInfo.carNo = this.model1.carInfo.carNo });
this.moveCodeInfo.moveCode = this.moveCode return;
if (!this.checked) {
uni.showToast({
title: "请同意京东挪车牌隐私权政策",
icon: 'none',
duration: 2000,
});
return
} }
uni.showLoading({
title: '加载中'
});
let opts = { let opts = {
url: '/app/moveCode/binding/', url: '/app/moveCode/binding/',
method: 'put' method: 'put'
}; };
this.http.httpTokenRequest(opts, this.moveCodeInfo).then(res => { this.http.httpTokenRequest(opts, this.model1).then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
//展示绑定成功 //展示绑定成功
uni.showToast({ uni.showToast({
title: "绑定成功", title: "绑定成功",
icon: "success", icon: "success",
}); });
uni.hideLoading()
uni.navigateTo({ uni.navigateTo({
url: '/pagesB/pages/move-car/myMoveCar' url: '/pagesB/pages/move-car/myMoveCar'
}) })
...@@ -233,6 +418,7 @@ export default { ...@@ -233,6 +418,7 @@ export default {
}, },
onLoad(option) { onLoad(option) {
this.moveCode = option.moveCode this.moveCode = option.moveCode
this.model1.moveCode = option.moveCode
}, },
onShow:function(){ onShow:function(){
this.getCarInfo() this.getCarInfo()
...@@ -301,7 +487,7 @@ export default { ...@@ -301,7 +487,7 @@ export default {
.contentMoveCar { .contentMoveCar {
padding: 40rpx; padding:40rpx 40rpx 0;
.item__label { .item__label {
font-size: 34rpx; font-size: 34rpx;
...@@ -405,5 +591,180 @@ export default { ...@@ -405,5 +591,180 @@ export default {
} }
} }
} }
// 已绑定车辆信息
.car_info{
background: #FFFFFF;
background-color: #fff;
padding:0 40rpx;
position: relative;
top:-6rpx;
.info_list{
line-height:90rpx;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom:2rpx solid rgba(0,0,0,.1);
.left{
font-size: 32rpx;
}
.right{
font-size: 28rpx;
color: #666;
}
}
.car_btn{
width: 400rpx;
line-height: 76rpx;
background: #FFFFFF;
border: 2rpx solid #DDDDDD;
border-radius: 10rpx;
text-align: center;
margin:30rpx auto 0;
font-size: 32rpx;
color: #666;
}
}
.no-car-info{
width:100%;
background-color: #fff;
text-align: center;
padding:30rpx;
.title{
font-size:28rpx;
color: #666;
}
image{
width:130rpx;height:130rpx;
margin:40rpx 0 20rpx;
}
.content{
font-size:28rpx;
}
.no-car-btn{
width:480rpx;
font-size:32rpx;
color: #E1251B;
text-align: center;
line-height:80rpx;
border-radius:50rpx;
border: 2rpx solid #F4B1AD;
margin:30rpx auto 0;
}
}
.form-data{
position: relative;
top:-6rpx;
background-color: #fff;
margin-bottom:40rpx;
box-sizing: border-box;
padding:0 40rpx;
.form-item{
height:100rpx;
line-height: 100rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
&:first-child{
border-bottom:2rpx solid rgba(0,0,0,.1);
}
.item-text{
font-size: 32rpx;
}
.item-input{
font-size: 28rpx;
text-align: right;
color: #333;
display: flex;
justify-content: space-around;
align-items: center;
.code{
height:50rpx;
line-height:50rpx;
font-size: 26rpx;
padding-left:20rpx;
border-left: 2rpx solid rgba(0,0,0,.1);
margin-left:20rpx;
color: #BBBBBB;
}
}
.car-num{
width:500rpx;
}
}
}
// 爱车列表
.love_car_list{
padding:30rpx 40rpx;
.love_title{
text-align: center;
font-size: 36rpx;
font-weight: bold;
margin-bottom:30rpx;
position: relative;
text{
position: absolute;
right:20rpx;
top:-4rpx;
font-size:40rpx;
font-weight:500;
color: #666;
}
}
.love_list{
height:400rpx;
overflow: auto;
.love_item{
padding:20rpx 0;
display: flex;
align-items: center;
justify-content: space-between;
border-top: 2rpx solid #E8E8E8;
&:first-child{
border:none;
}
image{
width:100rpx;height:100rpx;
}
.love_info{
width:450rpx;
>view{
&:first-child{
font-size:34rpx;
font-weight: bold;
margin-bottom:10rpx;
}
&:last-child{
font-size: 28rpx;
color:#666;
}
}
}
.radio{
width:60rpx;
>image{
width:48rpx;height:48rpx;
}
}
}
}
.love_btn{
padding:50rpx;
button {
height:80rpx;
line-height:80rpx;
border-radius:50rpx;
background: linear-gradient(150deg, #E1251B, #E14A1B);
box-shadow: 0 6rpx 13rpx 2rpx rgba(225, 50, 27, 0.17);
border:0;
font-size:32rpx !important;
}
}
}
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment