Przeglądaj źródła

欠费补缴

修改样式逻辑
yangteng 1 miesiąc temu
rodzic
commit
fb3daabec2

+ 972
- 0
subpackage/after-sale/arrears/arrears - 副本.vue Wyświetl plik

<template>
<view class="content-box" style="margin-top: 30rpx;">
<view class="list" v-if="state.list.length>0">
<u-checkbox-group @change="checkboxGroupChange" ref="checkbox">
<view class="item" v-for="(item, index) in state.list" :key="index"
:class="item.suppleStatus=='PAY'?'finished':''">
<view class="head">
<view class="name">
<image :src="`${$imgUrl}user/icon-ETC.png`" class="icon"></image>
<text class="title m-10">{{item.cardId}}</text>
<text class="tag-green" v-if="item.suppleStatus=='NOTPAY'">待支付</text>
<text class="tag-green" v-else-if="item.suppleStatus=='PAY'">已支付</text>
<text class="tag-green" v-else>已下支付单</text>
</view>
<view class="status text-black">{{item.vehiclePlate}}</view>
</view>
<view class="detail">
<view class="orders">
<view class="order-text">
<text class="type">补缴类型:</text>
<text class="value">{{item.suppleType=='TRAFFIC'?'流水欠费补缴':'卡账欠费补缴'}}</text>
</view>
<view class="order-text">
<text class="type">补缴单号:</text>
<text class="value">{{item.suppleNo}}</text>
</view>
<view class="order-text">
<text class="type">补缴单生成时间:</text>
<text class="value">{{item.insertTime}}</text>
</view>
</view>
<u-checkbox @change="checkboxChange" v-model="item.checked" :name="item.suppleNo"
v-if="item.suppleStatus=='NOTPAY'">
</u-checkbox>
</view>
<view class="detail1">
<view class="order-text1">
<text class="type">{{item.extolllaneName}}</text>
<text class="value">{{item.exTime}}</text>
</view>
<view class="order-text1">
<text class="type">{{item.entolllaneName}}</text>
<text class="value">{{item.enTime}}</text>
</view>
</view>
<view class="bottom">
<view class="bottom-left"><text class="tit1">通行金额:¥</text><text
class="amount1">{{item.fee}}</text>
</view>
<view class="bottom-left"><text class="tit1">服务费用:¥</text><text
class="amount1">{{item.serviceFee}}</text>
</view>
<view class="bottom-left"><text class="tit">欠费总金额:¥</text><text
class="amount">{{item.totalFee}}</text>
</view>
</view>
</view>
</u-checkbox-group>

</view>
<view class="tips" v-else>
~暂无数据~
</view>
<view class="footer">
<u-checkbox-group>
<u-checkbox @change="checkboxChangeAll" v-model="item.checked" v-for="(item, index) in list2"
:key="index" :name="item.name">{{item.name}}</u-checkbox>
</u-checkbox-group>
<view class="footer-right">
<view class="row1">
合计:¥{{allPrice}}
</view>
<view class="btn" @click="wxPayment">
支付
</view>
</view>
</view>
</view>
</template>

<script lang="ts" setup>
import {
getItem
} from "@/utils/storage.ts"
import {
wechatPayConfigId,
aliPayConfigId,
trafficsupplObtainuserid,
trafficsuppleQueryList,
trafficsuppleApply,
trafficsupplePayQuery,getOpenId
} from "@/utils/network/api.js";
import {
request,requestNew
} from "@/utils/network/request.js";

import {
stringToJson
} from "@/utils/network/encryption";
import {
onLoad,
onPullDownRefresh
} from "@dcloudio/uni-app";
import {
ref,
reactive
} from "vue"
import {
confirm,
msg
} from "@/utils/utils";
const state = reactive({
list: [],
suppleNoList: [],
openid: '',
orderId: ''

})
const checkbox = ref()
const list2 = reactive([{
name: '全选',
checked: false,
disabled: false
}])
const allPrice = ref(0)
const all = ref(true)
// 获取列表数据
const getlist = () => {
allPrice.value = 0

const options = {
type: 2,
data: {
opId: getItem('openId')
},
method: "POST",
showLoading: true,
};
requestNew(trafficsuppleQueryList, options).then((res) => {
const data = res;
console.log(data);
data.data = data.data.map(val => {
val.checked = false
val.fee = val.fee / 100
val.totalFee = val.totalFee / 100
val.serviceFee = val.serviceFee / 100
return val
})
state.list = data.data
console.log(state.list, "我是处理后得列表");
});
}

const checkboxChangeAll = (e) => {
console.log(e);
allPrice.value = 0
state.suppleNoList = []
if (e.value) {
state.list.map(val => {
val.checked = true;
if (val.suppleStatus == 'NOTPAY') {
allPrice.value += val.totalFee
state.suppleNoList.push(val.suppleNo)
}
})
} else {
state.list.map(val => {
val.checked = false;
})
}
console.log(state.suppleNoList, "支付集合");
}

const checkboxChange = (e) => {
console.log(e);
}
const checkboxGroupChange = (e) => {
console.log(e);
state.suppleNoList = e
let arr = []
allPrice.value = 0
state.suppleNoList.forEach((item, i) => {
state.list.forEach((val, index) => {
if (item == val.suppleNo) {
arr.push(val.totalFee)
}
})
})
arr.forEach(item => {
allPrice.value += item
})

console.log(state.suppleNoList, "支付集合");
}


//获取微信小程序openid
const getOpenID = () => {
uni.login({
provider: "weixin",
success: function (e) {
getOpenid(e.code)
},
});
};
const getOpenid = (code) => {
const options = {
type: 2,
data: {
"jsCode": code
},
method: "POST",
showLoading: true,
};
// #ifdef MP-WEIXIN
requestNew(getOpenId, options).then((res) => {
const result = res;
console.log("获取微信小程序openid", result);
const openidData = result.data;
state.openid = openidData.openid
});
// #endif
}

//掉起微信支付
const wxPayment = () => {
if (state.suppleNoList.length > 0) {
// #ifdef MP-WEIXIN
const options = {
type: 2,
data: {
openid: state.openid,
suppleNoList: state.suppleNoList,
totalFee: allPrice.value * 100,
payConfigId: wechatPayConfigId,
},
method: "POST",
showLoading: true,
};
requestNew(trafficsuppleApply, options).then((res) => {
const data =res;
state.orderId = data.orderId
uni.requestPayment({
provider: "wxpay",
orderInfo: "",
timeStamp: data.timestamp,
nonceStr: data.noncestr,
package: data.wxPackage ? data.wxPackage : "",
signType: data.signType,
paySign: data.sign,
success: function (e) {
console.log("支付成功", e);
const dataaa = stringToJson(res.bizContent);
checkOrder(dataaa.orderId);
},
fail: function (err) {
confirm(err, () => { }, "支付失败", false);
},
});
});
// #endif
// #ifdef MP-ALIPAY
my.getAuthCode({
scopes: 'auth_base',
success: res => {
const optionsUser = {
type: 2,
data: {
payConfigId: aliPayConfigId,
code: res.authCode
},
method: "POST",
showLoading: true,
};
console.log('支付宝用户编号请求:', optionsUser)
requestNew(trafficsupplObtainuserid, optionsUser).then((res) => {
console.log('支付宝用户编号返回:', res)
const data = stringToJson(res.bizContent);
const optionsali = {
type: 2,
data: {
openid: data.openId,
suppleNoList: state.suppleNoList,
totalFee: allPrice.value * 100,
payConfigId: "6a9a54123456578934edfre132b1234",
},
method: "POST",
showLoading: true,
};
console.log('支付下单请求:', optionsali)
requestNew(trafficsuppleApply, optionsali).then((res) => {
console.log('支付下单返回:', res)
const data = res;
my.tradePay({
// 调用统一收单交易创建接口(alipay.trade.create),获得返回字段支付宝交易号 trade_no
tradeNO: data.tranPackage,
success: res => {
console.log("支付成功", res);

allPrice.value = 0

const options = {
type: 2,
data: {
opId: getItem('openId')
},
method: "POST",
showLoading: true,
};
requestNew(trafficsuppleQueryList, options).then((res) => {
const data = res;
console.log(data);
data.data = data.data.map(val => {
val.checked = false
val.fee = val.fee / 100
val.totalFee = val.totalFee / 100
val.serviceFee = val.serviceFee / 100
return val
})
state.list = data.data
console.log(state.list, "我是处理后得列表");
})
},
fail: res => {
console.log("支付失败", res);
},
});

});
});
},
fail: err => {
console.log('my.getAuthCode 调用失败', err)
}
});

// #endif
} else {
msg("未勾选补缴订单!")
}


};


//支付成功改变订单状态
const checkOrder = (orderId) => {
const options = {
type: 2,
data: {
orderId: orderId,
},
method: "POST",
showLoading: true,
};

requestNew(trafficsupplePayQuery, options).then((res) => {
msg("支付成功!");
getlist()
});
};

onLoad(() => {
getlist()
getOpenID()
console.log("state");
})

onPullDownRefresh(() => {
getlist()
})
</script>

<style lang="scss">
page {
background: #eef7f7;
}

.content-box {
padding-bottom: 115rpx;

.tips {
font-size: 25rpx;
color: #d2d2d2;
text-align: center;
}

.footer {
display: flex;
align-items: center;
padding: 0 30rpx;
background: #fff;
height: 100rpx;
border-top: 1rpx solid #cdcdcd;
position: fixed;
bottom: 0;
width: 100%;
box-sizing: border-box;

.footer-right {
align-items: center;
display: flex;
justify-content: flex-end;
flex: 1;

.row1 {
font-size: 29rpx;
}

.btn {
text-align: center;
width: 150rpx;
height: 60rpx;
background: #13E7C1;
line-height: 60rpx;
border-radius: 10rpx;
font-size: 29rpx;
color: #fff;
margin-left: 30rpx;
}
}
}
}

.search-btn {
color: white;
background-color: #00B38B;
width: 140rpx;
height: 75rpx;
line-height: 75rpx;
font-size: 32rpx;
border-radius: 40rpx;
text-align: center;
margin-right: 30rpx;
margin-top: 10rpx;
}

.search-box {
margin: 30rpx 30rpx 20rpx 30rpx;
height: 72rpx;
height: 81rpx;
background: #FFFFFF;
border: 1px solid #DCDCDC;
border-radius: 40rpx;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
flex: 1;
}

.search-box .icon {
width: 48rpx;
height: 48rpx;
margin: 0 20rpx;
}

.search-box .search {
flex: 1;
margin-right: 20rpx;
height: 100%;
padding: 0 10rpx;
font-size: 28rpx;
color: #00b38b;

}

.scroll-view {
white-space: nowrap;
position: sticky;
top: 0;
background: #ffffff;
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8);
}

.top-menu {
display: flex;
}

.top-menu .tab {
font-size: 26rpx;
padding: 38rpx 30rpx;
color: #333;
position: relative;
}

.top-menu .active .border {
position: absolute;
width: 70%;
height: 16rpx;
background: #00b38b;
opacity: 0.3;
bottom: 40rpx;
z-index: -99;
left: 15%;
border-radius: 6rpx;
}

.top-menu .active {
font-weight: bold;
font-size: 28rpx;
}

.top-menu .active::before {
width: 100%;
height: 16rpx;
background: #00b38b;
opacity: 0.3;
}

.search-time {
display: flex;
margin: 20rpx 30rpx 48rpx 30rpx;
justify-content: space-between;

.time-btn {
width: 130rpx;
height: 80rpx;
background: #00B38B;
border-radius: 40rpx;
color: #FFFFFF;
font-size: 32rpx;
line-height: 80rpx;
text-align: center;
}

.show-info {
width: 260rpx;
height: 80rpx;
padding: 0 31rpx;
background: #FFFFFF;
border: 1px solid #DCDCDC;
border-radius: 40rpx;
display: flex;
justify-content: space-between;
align-items: center;

.show-text {
display: flex;
align-items: center;
}

.date-text {
color: #999999;
font-size: 28rpx;
}

.text-val {
color: #333
}

.line {
width: 25rpx;
height: 1rpx;
background: #999999;
margin: 0 24rpx;
}
}

.show-info2 {
width: 541rpx;
height: 80rpx;
padding: 0 31rpx;
background: #FFFFFF;
border: 1px solid #DCDCDC;
border-radius: 40rpx;
display: flex;
justify-content: space-between;
align-items: center;

.show-text {
display: flex;
align-items: center;
flex: 1;
justify-content: space-evenly;
}

.date-text {
color: #999999;
font-size: 28rpx;
}

.text-val {
color: #333
}

.line {
width: 25rpx;
height: 1rpx;
background: #999999;
margin: 0 24rpx;
}
}
}

.count {
margin: 0 30rpx 25rpx 30rpx;
font-size: 28rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #999999;
line-height: 36rpx;
}

.search-payment-box {
width: 260rpx;
height: 80rpx;
padding: 0 31rpx;
background: #FFFFFF;
border: 1px solid #DCDCDC;
border-radius: 40rpx;
display: flex;
justify-content: space-between;
align-items: center;
color: #999999;
}

.list {
padding: 0 30rpx;
display: flex;
flex-direction: column;
}

.bg-white {
background: #FFFFFF;
border-radius: 30rpx 30rpx 0 0;
}

.bg-white .sub-tabs {
display: flex;
justify-content: space-evenly;
align-items: center;
}

.bg-white .sub-item {
padding: 10rpx 0;
margin: 20rpx 0 30rpx;
border-bottom: 6rpx solid #fff;
font-size: 26rpx;
}

.bg-white .active {
border-bottom: 6rpx solid #00B38B;
color: #00B38B;
font-size: 30rpx;
font-weight: bold;
}

.bg-none {
background: none;
border-radius: 30rpx 30rpx 0 0;
}

.list .item {
background: #ffffff;
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8);
border-radius: 20rpx;
box-sizing: border-box;
display: flex;
flex-direction: column;
margin-bottom: 30rpx;
}

.list.bg-white .item {
box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223, 223, 223, 0.8);
}

.list .item .head {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx 28rpx;
border-bottom: 1px solid #dcdcdc;
}

.list .item .head {
.head-row {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}

.name {}

.name>text {
font-size: 25rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #999999;
line-height: 36rpx;
}
}

.list .item .head .icon {
width: 48rpx;
height: 48rpx;
}

.list .item .head .name {
display: flex;
align-items: center;
}

.list .text-green {
font-size: 26rpx;
color: #00b38b;
}

.list .text-orange {
font-size: 26rpx;
color: #ff8000;
}

.list .text-black {
font-size: 28rpx;
color: #333;
font-weight: 500;
}

.list .title {
font-size: 30rpx;
color: #333;
}

.list .tag-green {
font-size: 22rpx;
height: 40rpx;
line-height: 40rpx;
padding: 0 12rpx;
border-radius: 6rpx;
background: #d9f4ee;
color: #00b38b;
}

.list .tag-grey {
font-size: 22rpx;
height: 40rpx;
line-height: 40rpx;
padding: 0 12rpx;
border-radius: 6rpx;
background: #e8e8e8;
color: #666;
}

.list .detail {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 32rpx;

}

.list .detail1 {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0rpx 32rpx 30rpx 32rpx;

.order-text1 {
display: flex;
flex-direction: column;
width: 50%;

.type {
font-size: 26rpx;
color: #999;
}

.value {
font-size: 26rpx;
color: #333;
}
}
}


.list .detail .type {
font-size: 26rpx;
color: #999;
}

.list .detail .value {
font-size: 26rpx;
color: #333;
}

.list .finished .detail .value {
color: #999;
}

.list .detail .odd {
margin: 20rpx 0;
}

.list .cny {
font-size: 26rpx;
color: #333;
}

.list .finished .cny {
color: #999;
}

.list .amount {
font-size: 40rpx;
font-weight: bold;
}

.list .bottom .amount {
color: #ff8000;
}

.list .finished .amount {
color: #999;
}

.list .btns {
position: relative;
display: flex;
align-items: center;
justify-content: flex-end;
border-top: 1px solid #dcdcdc;
margin: 0 30rpx;
padding: 20rpx 0;
}

.list .bottom {
display: flex;
border-top: 1px solid #dcdcdc;
margin: 0 30rpx;
padding: 20rpx 0;
flex-direction: column;
align-items: flex-start;

.tit {
font-size: 30rpx;
}

.tit1 {
font-size: 26rpx;
color: #999;
}

.amount1 {
font-size: 26rpx;
color: #333;
}
}

.list .btn {
height: 60rpx;
line-height: 58rpx;
border-radius: 30rpx;
padding: 0 24rpx;
font-size: 26rpx;
box-sizing: border-box;
margin-right: 20rpx;
}



.list .btns .btn:last-child {
margin: 0;
}

.list .btns .state {
position: absolute;
left: 0;
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #999999;
line-height: 58rpx;

text {
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #00B38B;
line-height: 58rpx;
}
}

.list .btn-primary {
border: 1px solid #00b38b;
color: #00b38b;
}

.list .btn-disable {
border: 1px solid #999;
color: #999;

}

.list .btn-normal {
border: 1px solid #dcdcdc;
color: #333;
}

.m-10 {
margin: 0 10rpx;
}

//
.detail2 {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 32rpx;
position: relative;

view {
text-align: center;

text {
display: block;
margin: 20rpx 0;
}

view {
font-size: 24rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #999999;
line-height: 36rpx;

text {
margin: 0;

}
}
}

.indicator {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;

text {
margin: 0;
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #666666;
line-height: 36rpx;
}

image {
width: 186rpx;
height: 12rpx;
}
}

.state {
position: absolute;
left: 0;
font-size: 26rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
color: #999999;
line-height: 58rpx;
}
}

.emptyView {
margin-top: 120rpx;
}
</style>

+ 136
- 928
subpackage/after-sale/arrears/arrears.vue
Plik diff jest za duży
Wyświetl plik


+ 18
- 15
subpackage/personal-center/vehicle-change/vehicle-change-cheliangmsg-write.vue Wyświetl plik

<u-input inputAlign="right" placeholder="请输入车轴数" v-model="state.form.axleCount"/> <u-input inputAlign="right" placeholder="请输入车轴数" v-model="state.form.axleCount"/>
</u-form-item> </u-form-item>
<u-form-item label="外廓尺寸(mm)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'> <u-form-item label="外廓尺寸(mm)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入外廓尺寸" v-model="state.form.vehicleDimensions" />
<u-input inputAlign="right" placeholder="请输入外廓尺寸" v-model="state.form.outsideDimensions" />
</u-form-item> </u-form-item>
<u-form-item label="核定载人数(人)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'> <u-form-item label="核定载人数(人)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入核定载人数" v-model="state.form.approvedCount" <u-input inputAlign="right" placeholder="请输入核定载人数" v-model="state.form.approvedCount"
totalMass:"", totalMass:"",
maintenanceMass:"", maintenanceMass:"",
axleCount:"", axleCount:"",
vehicleDimensions:"",
outsideDimensions:"",
approvedCount:"", approvedCount:"",
engineNum:"", engineNum:"",
vin:"", vin:"",
vehFrontUrl:"",//车头照图片地址 vehFrontUrl:"",//车头照图片地址
vehBodyUrl:"",//车身45度照图片地址 vehBodyUrl:"",//车身45度照图片地址
roadTransportPermitPicUrl:"",//道路运输许可证图片地址(牵引车才提供) roadTransportPermitPicUrl:"",//道路运输许可证图片地址(牵引车才提供)
vehicleCustomerType: 0, //车辆用户类型
vehicleCustomerType: "", //车辆用户类型
vehicleCustomerTypeName: "普通车", vehicleCustomerTypeName: "普通车",
vanType:1,//客货类型,1-客车 2-货车 3-作业车 vanType:1,//客货类型,1-客车 2-货车 3-作业车
vehicleTypeNew:1,//收费车型(按新输入的值计算)[变更车辆类型] vehicleTypeNew:1,//收费车型(按新输入的值计算)[变更车辆类型]
vehNegImgOcrId:"",//行驶证反面orcId vehNegImgOcrId:"",//行驶证反面orcId
userType:1,//1个人 2单位 userType:1,//1个人 2单位
permittedTowWeight:"",//准牵引总质量 permittedTowWeight:"",//准牵引总质量
useCharacter:"",//车辆使用性质
}, },
ownerIdTypeRange: [], ownerIdTypeRange: [],
isTakePhotoModeShow: false, //选择拍照方式是否出来 isTakePhotoModeShow: false, //选择拍照方式是否出来
state.form.totalMass=res.info.totalMass state.form.totalMass=res.info.totalMass
state.form.maintenanceMass=res.info.maintenanceMass state.form.maintenanceMass=res.info.maintenanceMass
state.form.axleCount=res.info.axleCount state.form.axleCount=res.info.axleCount
state.form.vehicleDimensions=res.info.vehicleDimensions.slice(0,-2)
state.form.outsideDimensions=res.info.vehicleDimensions.slice(0,-2)
state.form.approvedCount=res.info.approvedCount state.form.approvedCount=res.info.approvedCount
state.form.engineNum=res.info.engineNum state.form.engineNum=res.info.engineNum
state.form.vin=res.info.vin state.form.vin=res.info.vin
state.form.userType=res.userType state.form.userType=res.userType
// 计算收费车型 // 计算收费车型
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.vehicleDimensions,state.form.totalMass,state.form.vanType, function (res) {
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.outsideDimensions,state.form.totalMass,state.form.vanType, function (res) {
state.form.vehicleTypeNew=res state.form.vehicleTypeNew=res
}); });
// 判断车辆用户类型 // 判断车辆用户类型
'label':"普通车" 'label':"普通车"
} }
] ]
state.form.vehicleCustomerType = "0"
state.form.vehicleCustomerTypeName = "普通车"
}else{ }else{
state.vehicleCustomerTypeRange=[ state.vehicleCustomerTypeRange=[
{ {
'label':"普通车" 'label':"普通车"
}, },
{ {
'value': "道路运输证经营范围仅有“货物专用运输(集装箱) ”的牵引车办理J类型集装箱",
'label': 24,
'label': "道路运输证经营范围仅有“货物专用运输(集装箱) ”的牵引车办理J类型集装箱",
'value': 24,
}, },
{ {
'value': "道路运输证经营范围不含“货物专用运输(集装箱)”的牵引车",
'label': 27,
'label': "道路运输证经营范围不含“货物专用运输(集装箱)”的牵引车",
'value': 27,
}, },
{ {
'value': '道路运输证经营范围除“货物专用运输 (集装 箱)"外,还有“普通货运”等其他项目的牵引车办理J2类型集装箱',
'label': 28,
'label': '道路运输证经营范围除“货物专用运输 (集装 箱)"外,还有“普通货运”等其他项目的牵引车办理J2类型集装箱',
'value': 28,
} }
] ]
msg("请输入车轴数"); msg("请输入车轴数");
return; return;
} }
if(!state.form.vehicleDimensions){
if(!state.form.outsideDimensions){
msg("请输入外廓尺寸"); msg("请输入外廓尺寸");
return; return;
} }
state.form.engineNum = data.engine; state.form.engineNum = data.engine;
state.form.vehPosImgUrl = data.imageUrl; state.form.vehPosImgUrl = data.imageUrl;
state.form.vehPosImgOcrId = data.ocrResultId; state.form.vehPosImgOcrId = data.ocrResultId;
state.form.useCharacter = data.character;
// 判断客货类型 // 判断客货类型
judgeVanType() judgeVanType()
} else { } else {
state.form.approvedCount = data.apc.slice(0,-1); state.form.approvedCount = data.apc.slice(0,-1);
state.form.maintenanceMass = data.unladen.slice(0,-2); state.form.maintenanceMass = data.unladen.slice(0,-2);
let overall=data.overall.replaceAll("x", "X") let overall=data.overall.replaceAll("x", "X")
state.form.vehicleDimensions = overall.slice(0,-2);
state.form.outsideDimensions = overall.slice(0,-2);
state.form.totalMass = data.gross ? data.gross.slice(0,-2) : 0; state.form.totalMass = data.gross ? data.gross.slice(0,-2) : 0;
state.form.vehNegImgUrl = data.imageUrl; state.form.vehNegImgUrl = data.imageUrl;
state.form.vehNegImgOcrId = data.ocrResultId; state.form.vehNegImgOcrId = data.ocrResultId;
state.form.permittedTowWeight=data.towing.slice(0,-2) state.form.permittedTowWeight=data.towing.slice(0,-2)
// 计算收费车型 // 计算收费车型
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.vehicleDimensions,state.form.totalMass,state.form.vanType, function (res) {
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.outsideDimensions,state.form.totalMass,state.form.vanType, function (res) {
state.form.vehicleTypeNew=res state.form.vehicleTypeNew=res
}); });
// 判断车辆用户类型 // 判断车辆用户类型

+ 62
- 27
subpackage/personal-center/vehicle-change/vehicle-change-chepai-write.vue Wyświetl plik

<u-form-item label="车轴数(轴)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'> <u-form-item label="车轴数(轴)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入车轴数" v-model="state.form.axleCount" @blur="changeAxleCount"/> <u-input inputAlign="right" placeholder="请输入车轴数" v-model="state.form.axleCount" @blur="changeAxleCount"/>
</u-form-item> </u-form-item>
<u-form-item label="车轮数" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入车轮数" v-model="state.form.wheelCount"/>
</u-form-item>
<u-form-item label="外廓尺寸(mm)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'> <u-form-item label="外廓尺寸(mm)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入外廓尺寸" v-model="state.form.vehicleDimensions" />
<u-input inputAlign="right" placeholder="请输入外廓尺寸" v-model="state.form.outsideDimensions" />
</u-form-item> </u-form-item>
<u-form-item label="核定载人数(人)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'> <u-form-item label="核定载人数(人)" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入核定载人数" v-model="state.form.approvedCount" /> <u-input inputAlign="right" placeholder="请输入核定载人数" v-model="state.form.approvedCount" />
totalMass:"", totalMass:"",
maintenanceMass:"", maintenanceMass:"",
axleCount:"", axleCount:"",
vehicleDimensions:"",
outsideDimensions:"",
approvedCount:"", approvedCount:"",
vin:"", vin:"",
engineNum:"", engineNum:"",
vehicleType:"",//行驶证车辆类型 vehicleType:"",//行驶证车辆类型
vehicleCustomerType:"", vehicleCustomerType:"",
vehicleCustomerTypeName:"", vehicleCustomerTypeName:"",
issueDate:""
issueDate:"",
wheelCount:"",//车轮数
useCharacter:"",//车辆使用性质
registerDate:"",
vehicleModel:"",//行驶证品牌型号
}, },
isTakePhotoModeShow: false, //选择拍照方式是否出来 isTakePhotoModeShow: false, //选择拍照方式是否出来
choiceIndex: 1, // 1 身份证正面 2 身份证反面 choiceIndex: 1, // 1 身份证正面 2 身份证反面
}], }],
ownerIdTypeRange: [], ownerIdTypeRange: [],
code:"", code:"",
vehicleCustomerTypeRange:[]
vehicleCustomerTypeRange:[
{
'value':0,
'label':"普通车"
},
{
'label': "道路运输证经营范围仅有“货物专用运输(集装箱) ”的牵引车办理J类型集装箱",
'value': 24,
},
{
'label': "道路运输证经营范围不含“货物专用运输(集装箱)”的牵引车",
'value': 27,
},
{
'label': '道路运输证经营范围除“货物专用运输 (集装 箱)"外,还有“普通货运”等其他项目的牵引车办理J2类型集装箱',
'value': 28,
}
]
}) })
onLoad((option : any) => { onLoad((option : any) => {
let type = getItem('key')['CERTIFICATE_TYPE']; let type = getItem('key')['CERTIFICATE_TYPE'];
} }
// 判断车辆用户类型 // 判断车辆用户类型
const judgeUseUserType=()=>{ const judgeUseUserType=()=>{
if(state.form.vanType=='1'){
state.vehicleCustomerTypeRange=[
{
'value':0,
'label':"普通车"
}
]
}else{
// if(state.form.vanType=='1'){
// state.vehicleCustomerTypeRange=[
// {
// 'value':0,
// 'label':"普通车"
// }
// ]
// state.form.vehicleCustomerType = "0"
// state.form.vehicleCustomerTypeName = "普通车"
// }else{
state.vehicleCustomerTypeRange=[ state.vehicleCustomerTypeRange=[
{ {
'value':0, 'value':0,
'label':"普通车" 'label':"普通车"
}, },
{ {
'value': "道路运输证经营范围仅有“货物专用运输(集装箱) ”的牵引车办理J类型集装箱",
'label': 24,
'label': "道路运输证经营范围仅有“货物专用运输(集装箱) ”的牵引车办理J类型集装箱",
'value': 24,
}, },
{ {
'value': "道路运输证经营范围不含“货物专用运输(集装箱)”的牵引车",
'label': 27,
'label': "道路运输证经营范围不含“货物专用运输(集装箱)”的牵引车",
'value': 27,
}, },
{ {
'value': '道路运输证经营范围除“货物专用运输 (集装 箱)"外,还有“普通货运”等其他项目的牵引车办理J2类型集装箱',
'label': 28,
'label': '道路运输证经营范围除“货物专用运输 (集装 箱)"外,还有“普通货运”等其他项目的牵引车办理J2类型集装箱',
'value': 28,
} }
] ]
}
// }
} }
//车牌号输入 //车牌号输入
const carNumber = (val : any) => { const carNumber = (val : any) => {
msg("请输入车轴数"); msg("请输入车轴数");
return; return;
} }
if(!state.form.vehicleDimensions){
if(!state.form.wheelCount){
msg("请输入车轮数");
return;
}
if(!state.form.outsideDimensions){
msg("请输入外廓尺寸"); msg("请输入外廓尺寸");
return; return;
} }
msg("请输入车辆识别号"); msg("请输入车辆识别号");
return; return;
} }
if(!state.form.vehicleCustomerType){
if(state.form.vehicleCustomerType==""){
msg("请选择车辆用户类型"); msg("请选择车辆用户类型");
return; return;
} }
requestNew(licenseInforChangeApply, options) requestNew(licenseInforChangeApply, options)
.then((res) => { .then((res) => {
console.log("res",res) console.log("res",res)
msg(res.msg)
// msg(res.msg)
msg('车牌变更信息提交成功')
setTimeout(() => { setTimeout(() => {
uni.navigateBack({ uni.navigateBack({
delta: 2
delta: 3
}) })
}, 2000) }, 2000)
}) })
state.form.vehPosImgUrl = data.imageUrl; state.form.vehPosImgUrl = data.imageUrl;
state.form.vehPosImgOcrId = data.ocrResultId; state.form.vehPosImgOcrId = data.ocrResultId;
state.form.issueDate = data.issue; state.form.issueDate = data.issue;
state.form.useCharacter = data.character;
state.form.registerDate = data.register;
state.form.vehicleModel = data.model;
} else { } else {
state.form.approvedCount = data.apc.slice(0,-1); state.form.approvedCount = data.apc.slice(0,-1);
state.form.maintenanceMass = data.unladen.slice(0,-2); state.form.maintenanceMass = data.unladen.slice(0,-2);
let overall=data.overall.replaceAll("x", "X") let overall=data.overall.replaceAll("x", "X")
state.form.vehicleDimensions = overall.slice(0,-2);
state.form.outsideDimensions = overall.slice(0,-2);
state.form.totalMass = data.gross ? data.gross.slice(0,-2) : 0; state.form.totalMass = data.gross ? data.gross.slice(0,-2) : 0;
state.form.vehNegImgUrl = data.imageUrl; state.form.vehNegImgUrl = data.imageUrl;
state.form.vehNegImgOcrId = data.ocrResultId; state.form.vehNegImgOcrId = data.ocrResultId;
state.form.permittedTowWeight=data.towing.slice(0,-2) state.form.permittedTowWeight=data.towing.slice(0,-2)
// 计算收费车型 // 计算收费车型
if(state.form.axleCount){ if(state.form.axleCount){
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.vehicleDimensions,state.form.totalMass,state.form.vanType, function (res) {
calculateVehicleType(state.form.approvedCount,state.form.axleCount,state.form.outsideDimensions,state.form.totalMass,state.form.vanType, function (res) {
state.form.vehicleTypeNew=res state.form.vehicleTypeNew=res
}); });
} }
const changeAxleCount=(e)=>{ const changeAxleCount=(e)=>{
console.log("e",e) console.log("e",e)
calculateVehicleType(state.form.approvedCount,e,state.form.vehicleDimensions,state.form.totalMass,state.form.vanType, function (res) {
calculateVehicleType(state.form.approvedCount,e,state.form.outsideDimensions,state.form.totalMass,state.form.vanType, function (res) {
state.form.vehicleTypeNew=res state.form.vehicleTypeNew=res
}); });
} }

Ładowanie…
Anuluj
Zapisz