You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
728 lines
22 KiB
728 lines
22 KiB
<template> |
|
<view class="page-content"> |
|
<view class v-show="beforePay"> |
|
<cu-custom class="main-topbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
|
<block slot="backText">返回</block> |
|
<block slot="content">{{siteData.siteName}}</block> |
|
</cu-custom> |
|
<view class="cu-list menu-avatar"> |
|
<view class="cu-item margin-sm margin-left margin-right radius"> |
|
<view v-if="siteData.headUrl" class="cu-avatar round lg" |
|
:style="'background-image:url('+siteData.headUrl+');'"></view> |
|
<view v-else class="cu-avatar round lg">星</view> |
|
<view class="content money-container"> |
|
<view class="color-333"> |
|
<view class="text-cut" v-if="type!= 'rrs'">{{siteData.customerName}}</view> |
|
<view class="text-cut" v-else> |
|
{{'日日顺司机'}} |
|
</view> |
|
</view> |
|
<view class="text-gray text-sm flex"> |
|
<view class="text-cut" v-if="type!= 'rrs'">{{siteData.customerPhone}}</view> |
|
<view class="text-cut" v-else> |
|
{{'保密'}} |
|
</view> |
|
</view> |
|
</view> |
|
<view class="action"> |
|
<view class="text-white money-position padding-left-lg padding-xs bg-main-oil text-lg"> |
|
<text class="text-xs">余额</text> |
|
￥{{siteData.userBalance}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="cu-form-group margin margin-top-0 radius" v-if="type!= 'rrs'"> |
|
<view class="title mini-label text-black">车牌号</view> |
|
<input :maxlength="7" @tap="showModel='show'" v-model="carNumber" disabled placeholder="请输入车牌号" |
|
name="input" /> |
|
<text class="cuIcon-write text-orange"></text> |
|
</view> |
|
<view class="my-cell margin-left margin-right padding-top padding-bottom radius"> |
|
<view class="strong padding-bottom-xs">{{siteData.siteName}}</view> |
|
<view class="font-12 color-999"> |
|
<text class="text-cut">{{siteData.siteAddress}}</text> |
|
</view> |
|
</view> |
|
<view class="padding-top-xs margin margin-top-xs margin-bottom-0 padding-bottom radius"> |
|
<view class="bg-white padding padding-bottom-sm"> |
|
<view class="padding-bottom-sm text-lg">油号选择：</view> |
|
<view class="padding-top-xs"> |
|
<text class="strong padding-right-xs font-16">{{insertResult.oilProductCode}}</text> |
|
<text class="padding-right-xs"> |
|
星油价格: |
|
<text class="text-blod oil-main-color" |
|
v-if="(insertResult.sitePrice -1+1)>0">￥{{(insertResult.sitePrice-1+1)|numberFilter}}</text> |
|
<text class="text-blod oil-main-color" v-else>无价格</text> |
|
</text> |
|
<text class="s-rich">市场价￥{{insertResult.oilSitePrice|numberFilter}}/L</text> |
|
</view> |
|
<view class="grid col-5 padding-top justify-start"> |
|
<view class="padding-xs" v-for="(item,index) in siteData.oilSitePriceDetailsVos" @tap="oilNameSel(item)" |
|
:key="item.priceId"> |
|
<button class="cu-btn" |
|
:class="[insertResult.oilProductCode===item.oilProductCode?'bg-main-oil':'line-gray']">{{item.oilProductCode}}</button> |
|
</view> |
|
</view> |
|
</view> |
|
<!-- **** 抢号选择 --> |
|
<view class="padding padding-bottom-0 padding-top-xs bg-white"> |
|
<view style="color: #333333;font-size: 30rpx;" class="padding-bottom-sm text-lg">枪号选择：</view> |
|
<view class="grid col-5 justify-start"> |
|
<view style="width: calc(100% / 4);" class="padding-xs" v-for="(item,index) in ColorList" :key="index"> |
|
<button @tap="gunIdSel(index)" :style="{width: '100%',color:insertResult.bar===index+1?'':'#333333'}" class="cu-btn" |
|
:class="[insertResult.bar===index+1?'bg-main-oil':'line-gray']">{{index+1}}</button> |
|
</view> |
|
</view> |
|
</view> |
|
<!-- ***油品金额区域 insertResult.oilProductCode 动态控制显示加注的类型和单位 KG/L --> |
|
<view class=" padding bg-white"> |
|
<view class="shadow-warp bg-white"> |
|
<view class="cu-form-group"> |
|
<view class="title newtitle"> {{siteData.siteType=='2'?'加气升数':'加油金额'}}</view> |
|
<input class="newtitle" :placeholder="`请输入${siteData.siteType=='2'?'加气升数':'加油金额'}`" @input="checkNumber" type="digit" |
|
v-model="insertResult.vol" name="input" /> |
|
<view style="width: 170rpx;text-align: end;" class="textEllipsis"> |
|
<text class=""> |
|
<text v-if="siteData.siteType!='2'">{{vlom?'约' + ( (Math.round(vlom*100)/100).toFixed(2) ) + (siteData.siteType=='2'?'元':'L'):''}}</text> |
|
<text v-if="siteData.siteType=='2'">{{vlom?'约' + ( insertResult.vDoMoney ? insertResult.vDoMoney+insertResult.discountMoney:'') + (siteData.siteType=='2'?'元':'L'):''}}</text> |
|
</text> |
|
</view> |
|
</view> |
|
<view class="my-cell"> |
|
<text class="font-12">星卡优惠金额</text> |
|
<text |
|
class="fr">-￥{{insertResult.discountMoney ?insertResult.discountMoney :'' |numberFilter}}</text> |
|
</view> |
|
<view class="my-cell"> |
|
<text class="font-12">实际支付金额</text> |
|
<text |
|
class="oil-main-color fr">￥{{insertResult.vDoMoney ?insertResult.vDoMoney :''|numberFilter}}</text> |
|
</view> |
|
</view> |
|
</view> |
|
<button class="margin round bg-main-oil" @tap="charge">确定</button> |
|
</view> |
|
</view> |
|
<view class v-show="!beforePay&&isG7"> |
|
<cu-custom class="main-topbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
|
<block slot="backText">返回</block> |
|
<block slot="content">{{payState|payStateFormat}}</block> |
|
</cu-custom> |
|
<view class="margin-sm bg-white padding-lg"> |
|
<view class="padding-top margin-bottom"></view> |
|
<view class="text-xsl text-center"> |
|
<text class="cuIcon-rechargefill oil-main-color"></text> |
|
</view> |
|
<view class="text-center text-bold"> |
|
{{payState|payStateFormat}} |
|
</view> |
|
<view class="padding margin-sm"> |
|
<text v-if="payErrorMessage">{{ payErrorMessage }} </text> |
|
<text v-else>{{ payState==0?'请勿离开当前页面，等待扣款状态查询确认后，页面会自动跳转......':'' }} </text> |
|
</view> |
|
<view class="text-center"> |
|
<button style="width: 500upx;" class="round large cu-btn bg-main-oil" |
|
@tap="getPayStatus(orderId)">手动刷新</button> |
|
</view> |
|
</view> |
|
<view class="margin-sm bg-white padding"> |
|
<view class="margin-bottom-sm" @tap="copyId(driverMsg.driverName,'加油司机')"> |
|
加油司机 |
|
<text class="fr"> |
|
{{driverMsg.driverName}} |
|
<text class="flex-sub padding-left-sm text-right cuIcon-copy text-lg text-red"></text> |
|
</text> |
|
</view> |
|
|
|
<view class="margin-bottom-sm" @tap="copyId(carNumber,'司机车牌')"> |
|
司机车牌 |
|
<text class="fr"> |
|
{{carNumber}} |
|
<text class="flex-sub padding-left-sm text-right cuIcon-copy text-lg text-red"></text> |
|
</text> |
|
</view> |
|
|
|
<view class="margin-bottom-sm"> |
|
油枪油号 |
|
<text class="fr">{{insertResult.bar}}号枪{{insertResult.oilName}}</text> |
|
</view> |
|
<view class="margin-bottom-sm"> |
|
加油总金额 |
|
<text class="fr">¥ {{insertResult.vMoney|numberFilter}}</text> |
|
</view> |
|
<view class="margin-bottom-sm"> |
|
加油升数 |
|
<text class="fr">{{insertResult.vol|numberFilter}} 升</text> |
|
</view> |
|
<view class="margin-bottom-sm"> |
|
星卡优惠 |
|
<text class="fr">¥ {{(insertResult.vMoney-insertResult.vDoMoney)|numberFilter}}</text> |
|
</view> |
|
|
|
<view class="margin-bottom-sm"> |
|
实扣款 |
|
<text class="fr oil-main-color">¥ {{insertResult.vDoMoney|numberFilter}}</text> |
|
</view> |
|
</view> |
|
</view> |
|
<PlateNumberPicker @newPlate="showPlateModal(false,true)" @onDeleteInput="onDeleteInput" |
|
:showInputList="showInputList" :showPlateList="showPlateList" @selectNo="selectNo" |
|
@clearAll="clearPlateNumber" @selectName="selectText" @hideModal="showModel=''" :modalName="showModel" /> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import cloudSiteApi from '@/api/cloud-site.js' |
|
import oliSiteApi from '@/api/oli-site.js' |
|
import g7Api from '@/api/g7.js' |
|
import PlateNumberPicker from '@/components/plate-number-picker/plate-number-picker.vue' |
|
export default { |
|
components: { |
|
PlateNumberPicker |
|
}, |
|
data() { |
|
return { |
|
changTypes:0, |
|
vlom: '', |
|
siteData: { |
|
|
|
}, |
|
zyInfo: { |
|
qrCode: uni.getStorageSync('qrCode'), //类型：String 必有字段 备注：二维码字符串 |
|
oilsStationId: uni.getStorageSync('oilSite').oilSiteCode //类型：String 必有字段 备注：加油站id |
|
}, |
|
isG7: false, |
|
beforePay: true, |
|
testResult: false, |
|
showPlateList: true, |
|
showInputList: false, |
|
carNumber: '', |
|
plateNo: '', |
|
plateText: '', |
|
imgList: [], |
|
plateName: '', |
|
orderId: '', |
|
showModel: '', |
|
// 车牌号，上 |
|
radio: 'B', |
|
active: 0, |
|
plateNumber: '', |
|
ColorList: [1, 2, 3, 4, 5], |
|
qrCode: uni.getStorageSync('qrCode'), |
|
driverMsg: { |
|
balance: '', |
|
plateNumber: '' |
|
}, |
|
oilGunList: {}, |
|
oilTypeList: [], |
|
stationMsg: { |
|
|
|
}, |
|
payErrorMessage: '', |
|
timer: null, |
|
selected: {}, |
|
insertResult: { |
|
bar: 1, |
|
oilName: '', |
|
discountMoney: '0.00', |
|
oilCode: "", |
|
realPrice: "", |
|
standardPrice: '', |
|
vDoMoney: "0.00", |
|
vMoney: "0.00", |
|
vol: "" |
|
}, |
|
orderKey: '', |
|
payState: '0', |
|
type : '' |
|
} |
|
}, |
|
|
|
|
|
onLoad(option) { |
|
console.log("option============",option) //接收option.type |
|
if(option.type =='rrs'){ |
|
console.log('这里是日日顺') |
|
this.type = 'rrs' //根据option.type 进行本地赋值 |
|
} |
|
if (this.qrCode) { |
|
if (this.qrCode.substr(0, 2) == 'HT' || this.qrCode.substr(0, 2) == 'G7') { |
|
this.isG7 = true |
|
console.log('G7加油站') |
|
} |
|
} |
|
this.verifyQrCode() |
|
}, |
|
onUnload() { |
|
if (this.timer) { |
|
clearInterval(this.timer); |
|
this.timer = null; |
|
} |
|
}, |
|
watch: { |
|
oilTypeList: { |
|
handler(newVal, oldVal) { |
|
console.log('深度监听', newVal, oldVal) |
|
this.oilTypeList = newVal |
|
if (!this.insertResult.oilCode) { |
|
this.initForm() |
|
} |
|
}, |
|
deep: true |
|
}, |
|
selected: function(newVal, oldVal){ |
|
if (newVal) { |
|
this.selected = newVal |
|
console.log('selected发生变化',this.insertResult.oilSitePrice,this.selected.oilSitePrice,this.insertResult.realPrice,this.selected.xkPrice) |
|
// oilSitePrice 市场价格 sitePrice 实际加油价格 |
|
if (this.selected.oilSitePrice) { |
|
this.insertResult.oilSitePrice = this.selected.oilSitePrice |
|
} else if (this.selected.lvPrice) { |
|
this.insertResult.realPrice = this.selected.xkPrice |
|
} |
|
this.insertResult.priceId = this.selected.priceId |
|
this.insertResult.sitePrice = this.selected.sitePrice |
|
this.insertResult.oilProductCode = this.selected.oilProductCode |
|
this.changeMoney() |
|
} |
|
}, |
|
plateNo: { |
|
immediate: true, |
|
handler(newVal, oldVal) { |
|
this.plateNo = newVal |
|
if (newVal) { |
|
this.text() |
|
} |
|
} |
|
} |
|
|
|
}, |
|
methods: { |
|
changeType(){ |
|
this.changTypes = 1 |
|
}, |
|
backType(){ |
|
this.changTypes = 0 |
|
}, |
|
checkNumber(e) { |
|
e.detail.value = e.detail.value.match(/^\d*(\.?\d{0,2})/g)[0] || null; |
|
this.$nextTick(() => { |
|
this.insertResult.vol = e.detail.value |
|
this.getMoney(e) |
|
}) |
|
}, |
|
oilNameSel(item) { |
|
console.log(item, 'item') |
|
this.selected = { |
|
...item |
|
} |
|
this.activeSitePrice = item.priceId |
|
console.log(this.insertResult.vol) |
|
let e = { |
|
detail:{ |
|
|
|
} |
|
} |
|
e.detail.value = this.insertResult.vol |
|
this.getMoney(e) |
|
console.log('选择你/n', this.selected, '/n') |
|
}, |
|
isNumber(value) { // 判断是否为正常数字 |
|
const regPos = /^\d+(\.\d+)?$/; //非负浮点数 |
|
const regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数 |
|
if (value.indexOf('-') != -1) { |
|
return false |
|
} |
|
if (regPos.test(value) || regNeg.test(value)) { |
|
return true |
|
} else { |
|
return false |
|
} |
|
}, |
|
getMoney(e) { |
|
console.log(e) |
|
if (e.detail.value == '') { |
|
// uni.showToast({ |
|
// title: '请输入金额', |
|
// icon: 'none' |
|
// }) |
|
return |
|
} |
|
let isNumber = this.isNumber(e.detail.value) |
|
if (!isNumber) { |
|
uni.showToast({ |
|
title: '请输入正确金额', |
|
icon: 'none' |
|
}) |
|
return |
|
} |
|
this.InputNumber = e |
|
if (this.siteData.oilCardNature == 1) { |
|
var uerTyps = '0' // 0是个人 1是企业 |
|
} else { |
|
console.log('当前为企业') |
|
var uerTyps = '1' // 0是个人 1是企业 |
|
} |
|
if (this.type == 'ZEYI' || this.type == 'RIRISHUN') { |
|
var number = { |
|
payType: 'SITE_SCAN', |
|
userType: uerTyps, |
|
xoilAmountGun: e.detail.value, |
|
priceId: this.activeSitePrice, |
|
companyId: this.siteData.companyId, |
|
createSource: this.type |
|
} |
|
} else { |
|
var number = { |
|
payType: 'SITE_SCAN', |
|
userType: uerTyps, |
|
xoilAmountGun: e.detail.value, |
|
priceId: this.activeSitePrice, |
|
companyId: this.siteData.companyId, |
|
createSource:this.siteData.createSource |
|
} |
|
} |
|
this.xoilAmountGun = e.detail.value |
|
let _that = this |
|
oliSiteApi.getOrderDiscountInfo(number).then(res => { |
|
this.insertResult.vDoMoney = res.data.payRealAmount |
|
this.insertResult.discountMoney = res.data.oilDiscountAmount |
|
_that.vlom = res.data.volume.toFixed(2) |
|
}) |
|
}, |
|
charge() { |
|
this.tsetPlate() |
|
console.log(this.plateText) |
|
console.log(this.plateNo) |
|
console.log(this.carNumber) |
|
console.log(this.testResult) |
|
if ((this.insertResult.sitePrice - 1 + 1) > 0) { |
|
this.saveOrder() |
|
} else { |
|
uni.showToast({ |
|
title: '您选择的油品没有油价，不能加油', |
|
icon: 'none' |
|
}); |
|
} |
|
}, |
|
|
|
// 支付订单 |
|
saveOrder() { |
|
console.log("加油升数：",this.vlom) |
|
console.log("加油金额：",this.insertResult.vol) |
|
const orderParams = { |
|
siteId: this.siteData.siteId, |
|
oilsId: this.insertResult.priceId, |
|
volume: this.siteData.siteType=='2'?this.insertResult.vol:this.vlom, |
|
orderNum:this.siteData.otherSerialNumber, |
|
customerOrderId: this.siteData.customerOrderId, |
|
money: this.siteData.siteType=='2'?this.insertResult.vDoMoney+this.insertResult.discountMoney:this.insertResult.vol, |
|
createSource: "WECHAT_MINIAPPS", //类型：String 必有字段 备注：创建来源 |
|
orderSource: "WECHAT_MINIAPPS", |
|
driverName:this.siteData.customerName, |
|
driverPhone:this.siteData.customerPhone, |
|
plateNumber: this.carNumber, |
|
customerId: this.siteData.customerId, //类型：String 必有字段 备注：司机id |
|
companyId: this.siteData.companyId, //类型：String 必有字段 备注：企业id |
|
gunId: this.insertResult.bar, |
|
oilsCode: this.insertResult.oilProductCode, |
|
orderMethod: "SITE_SCAN", //类型：String 必有字段 备注：订单产生方式 |
|
suppleMark: 0, |
|
orderType: "REAL_ORDER", //类型：String 必有字段 备注：订单类型 ( REAL_ORDER：真实订单 VIRTUAL_ORDER：虚拟订单) |
|
payChannel: "BALANCE_PAYMENT", //类型：String 必有字段 备注：支付渠道 |
|
oilCardType: this.siteData.oilCardNature, //类型：String 必有字段 备注：油卡性质 1：个人 2：企业 3：外请 |
|
accountCardCode: this.siteData.accountCardCode, //类型：String 必有字段 备注：油卡卡号 |
|
siteUserName: "1" //类型：String 必有字段 备注：加油员名称 |
|
} |
|
|
|
console.log(orderParams) |
|
if (!orderParams.oilsCode) { |
|
uni.showToast({ |
|
title: '请选择油品', |
|
icon: 'none' |
|
}); |
|
return false |
|
} |
|
if (!orderParams.volume) { |
|
uni.showToast({ |
|
title: '请输入加油升数', |
|
icon: 'none' |
|
}); |
|
return false |
|
} |
|
|
|
oliSiteApi.payOfQrCode(orderParams).then(res => { |
|
if (res.code === 20000) { |
|
uni.showToast({ |
|
title: '下单成功！' |
|
}); |
|
uni.setStorageSync('formQr', true) |
|
uni.setStorageSync('orderSource', 'mpxoil') |
|
if (!this.isG7) { |
|
setTimeout(() => { |
|
this.toDetails(res.data.orderId) |
|
}, 400) |
|
} else { |
|
this.beforePay = false |
|
setTimeout(() => { |
|
this.orderId = res.data.orderId |
|
this.queryTimer() |
|
this.getPayStatus(this.orderId) |
|
}, 400) |
|
} |
|
|
|
} |
|
}) |
|
|
|
}, |
|
|
|
getPayStatus(id) { |
|
// 获取订单支付状态 |
|
console.log('获取支付状态', id) |
|
g7Api.getPayStatus(id).then(res => { |
|
if (res.code == 20000) { |
|
this.payState = res.data.payState |
|
if (res.data.payState == -1) { |
|
this.payErrorMessage = res.data.payErrorMessage |
|
clearInterval(this.timer) |
|
uni.showToast({ |
|
icon: 'none', |
|
title: res.data.payErrorMessage |
|
}) |
|
} |
|
if (res.data.payState == 1) { |
|
clearInterval(this.timer) |
|
this.toDetails(res.data.payOrderId) |
|
} |
|
} |
|
}) |
|
}, |
|
toDetails(id) { |
|
uni.setStorageSync('orderId', id) |
|
console.log('id', id) |
|
uni.redirectTo({ |
|
url: '/packageOrders/pages/orderList/OrderDetail/OrderDetail' |
|
}) |
|
|
|
}, |
|
gunIdSel(index) { |
|
this.insertResult.bar = index + 1 |
|
}, |
|
initForm() { |
|
if (!this.insertResult.realPrice) { |
|
this.selected = this.siteData.oilSitePriceDetailsVos[0] |
|
} |
|
this.insertResult.bar = 1 |
|
}, |
|
verifyQrCode() { |
|
oliSiteApi.verifyQrCode(this.zyInfo).then(res => { |
|
if (res.code === 20000) { |
|
this.siteData = res.data |
|
if(res.data.oilSitePriceDetailsVos){ |
|
this.insertResult = Object.assign(this.insertResult,res.data.oilSitePriceDetailsVos[0]) |
|
console.log(this.insertResult) |
|
} |
|
this.carNumber = res.data.plateNumber; |
|
this.selected = res.data.oilSitePriceDetailsVos[0] |
|
this.activeSitePrice = this.selected.priceId |
|
} else { |
|
console.log('此处为verifyQrCode false') |
|
uni.showToast({ |
|
title: res.msg ? res.msg : '请确认是否油站二维码', |
|
icon: 'none' |
|
}) |
|
setTimeout(() => { |
|
uni.navigateBack() |
|
}, 800) |
|
} |
|
}) |
|
}, |
|
tRadio() { |
|
this.radio === 'A' ? this.radio = '' : this.radio = 'A' |
|
}, |
|
changeMoney(){ |
|
this.insertResult.vMoney = this.insertResult.vol * this.selected.oilSitePrice |
|
this.insertResult.discountMoney = this.insertResult.vol * (this.selected.oilSitePrice - this.insertResult.sitePrice) |
|
this.insertResult.vDoMoney = this.insertResult.vol * this.selected.sitePrice |
|
}, |
|
calcMoney(e) { |
|
// console.log(e) |
|
if(this.changTypes = 1){ |
|
let rrs = e.target.value.match(/^\d*(\.?\d{0,2})/g)[0]; // 处理输入油升数 只保留小数点后两位 |
|
this.$nextTick(() => { //重新赋值给input |
|
this.insertResult.vol= rrs |
|
}) |
|
} |
|
// oilSitePrice 市场价格 sitePrice 实际加油价格 |
|
this.insertResult.vMoney = this.insertResult.vol * this.selected.oilSitePrice |
|
this.insertResult.discountMoney = this.insertResult.vol * (this.selected.oilSitePrice - this.insertResult.sitePrice) |
|
this.insertResult.vDoMoney = this.insertResult.vol * this.selected.sitePrice |
|
}, |
|
queryTimer() { |
|
var count = 5 |
|
this.timer = setInterval(() => { |
|
console.log('查询次', count) |
|
count-- |
|
this.getPayStatus(this.orderId) |
|
}, 5000); |
|
if (!count) { |
|
clearInterval(this.timer) |
|
} |
|
}, |
|
copyId(id, name) { |
|
uni.setClipboardData({ |
|
data: id, |
|
success: () => { |
|
uni.showToast({ |
|
title: name + '已复制', |
|
icon: 'none' |
|
}) |
|
} |
|
}) |
|
}, |
|
clearPlateNumber() { |
|
this.plateText = '' |
|
this.plateNo = "" |
|
this.carNumber = '' |
|
this.showPlateList = true |
|
this.showInputList = false |
|
}, |
|
text() { |
|
this.carNumber = this.plateText + this.plateNo |
|
this.tsetPlate() |
|
}, |
|
tsetPlate() { |
|
this.testResult = |
|
/^(([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳使领]))$/ |
|
.test(this.carNumber) |
|
}, |
|
onDeleteInput() { |
|
this.carNumber = this.carNumber.slice(0, -1) |
|
if (this.carNumber.length > 1) { |
|
this.plateNo = this.plateNo.slice(0, -1) |
|
} |
|
if (this.carNumber.length == 1) { |
|
this.plateText = '' |
|
} |
|
if (this.plateNo.length == 1) { |
|
this.plateNo = '' |
|
} |
|
if (!this.carNumber) { |
|
this.plateText = '' |
|
this.plateNo = '' |
|
this.showPlateList = false |
|
this.showInputList = true |
|
this.text() |
|
} |
|
}, |
|
selectText(item) { |
|
this.plateText = item |
|
this.showPlateList = false |
|
this.showInputList = true |
|
this.text() |
|
}, |
|
selectNo(item) { |
|
if (this.plateNo.length >= 5) { |
|
this.showModel = '' |
|
} |
|
this.plateNo = this.plateNo + item |
|
this.text() |
|
}, |
|
showPlateModal(val1, val2) { |
|
this.showPlateList = val1 |
|
this.showInputList = val2 |
|
this.showModel = 'show' |
|
} |
|
}, |
|
filters: { |
|
toT(value) { |
|
if (value) { |
|
return value / 1000 |
|
} |
|
}, |
|
dateFormat(value) { |
|
if (value) { |
|
return value.substring(5, 16) |
|
} |
|
}, |
|
|
|
numberFilter(value) { |
|
value = value - 1 + 1 |
|
return Number(value).toFixed(2) |
|
}, |
|
payStateFormat(value) { |
|
switch (parseInt(value)) { |
|
case 1: |
|
return '支付成功' |
|
case -1: |
|
return '支付失败' |
|
case 0: |
|
return '等待支付' |
|
default: |
|
return '' |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
.page-content { |
|
background-color: #f1f2f7; |
|
min-height: 100%; |
|
position: relative; |
|
} |
|
|
|
.navigation { |
|
position: absolute; |
|
right: 16px; |
|
top: 10px; |
|
} |
|
|
|
.icon-self { |
|
width: 1rem; |
|
height: 1rem; |
|
} |
|
|
|
.oil-price { |
|
position: relative; |
|
} |
|
|
|
.oil-price radio { |
|
position: absolute; |
|
left: 0rem; |
|
top: 10px; |
|
} |
|
|
|
.qr-icon { |
|
font-size: 2rem; |
|
} |
|
|
|
.pay-desc { |
|
line-height: 2rem; |
|
} |
|
|
|
.bottom-pay { |
|
min-height: 100rpx; |
|
width: 750upx; |
|
} |
|
|
|
.pay-bar { |
|
width: 750upx; |
|
position: absolute; |
|
bottom: 0; |
|
} |
|
|
|
.money-container { |
|
position: relative; |
|
} |
|
|
|
.money-position { |
|
position: absolute; |
|
top: 0; |
|
right: 0; |
|
display: block; |
|
border-radius: 0 0 0 100upx; |
|
} |
|
</style>
|
|
|