|
|
@@ -7,7 +7,8 @@
|
|
|
<u-icon name="arrow-down" color="#7B7B7B" size="30"></u-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <u-select v-model="isShowCarLicense" :list="carLicenseList" :default-value="carLicenseDefaultValue" @confirm="carLicenseListConfirm"></u-select>
|
|
|
+ <u-select v-model="isShowCarLicense" :list="carLicenseList" :default-value="carLicenseDefaultValue"
|
|
|
+ @confirm="carLicenseListConfirm"></u-select>
|
|
|
<view class="handle-monthly-item">
|
|
|
<view>车辆信息</view>
|
|
|
<view>{{form.carLicense.value | verifyStatusFilter}}</view>
|
|
|
@@ -36,16 +37,12 @@
|
|
|
<u-parse :html="monthlyContent"></u-parse>
|
|
|
</view>
|
|
|
<view class="handle-monthly-confirm-button">
|
|
|
- <button type="default"@click="submit(roadNo)">确认包月</button>
|
|
|
+ <button type="default" @click="submit(roadNo)">确认包月</button>
|
|
|
</view>
|
|
|
- <u-modal
|
|
|
- v-model="payWayPop"
|
|
|
- :title-style="{color: '#404040'}"
|
|
|
- title="缴费方式"
|
|
|
- :show-confirm-button="false"
|
|
|
+ <u-modal v-model="payWayPop" :title-style="{color: '#404040'}" title="缴费方式" :show-confirm-button="false"
|
|
|
:show-cancel-button="false">
|
|
|
- <view class="slot-content">
|
|
|
- <!-- <view class="pay-way">
|
|
|
+ <view class="slot-content">
|
|
|
+ <!-- <view class="pay-way">
|
|
|
<view class="pay-way-item" @click="gyBankPay">
|
|
|
<image src="../../static/img/gy-bank-pay-icon.png" mode=""></image>
|
|
|
<view>贵州银行</view>
|
|
|
@@ -55,61 +52,68 @@
|
|
|
<view>微信支付</view>
|
|
|
</view>
|
|
|
</view> -->
|
|
|
- <view class="pay-way-new">
|
|
|
- <view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
|
|
|
- <image src="../../static/img/guiyang-bank-icon.png" mode=""></image>
|
|
|
- <view class="title">贵州银行</view>
|
|
|
- <view class="subtitle">前三个月每天首次一分钱<br/>长期八折优惠</view>
|
|
|
- </view>
|
|
|
- <view class="pay-way-item pay-way-item-jh" @click="wechatPay">
|
|
|
- <image src="../../static/img/juhe-icon.png" mode=""></image>
|
|
|
- <view class="title">聚合支付</view>
|
|
|
- </view>
|
|
|
+ <view class="pay-way-new">
|
|
|
+ <view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
|
|
|
+ <image src="../../static/img/guiyang-bank-icon.png" mode=""></image>
|
|
|
+ <view class="title">贵州银行</view>
|
|
|
+ <view class="subtitle">前三个月每天首次一分钱<br />长期八折优惠</view>
|
|
|
+ </view>
|
|
|
+ <view class="pay-way-item pay-way-item-jh" @click="wechatPay">
|
|
|
+ <image src="../../static/img/juhe-icon.png" mode=""></image>
|
|
|
+ <view class="title">聚合支付</view>
|
|
|
</view>
|
|
|
- <button class="pay-way-close-btn" @click="payWayPop = false">关闭</button>
|
|
|
</view>
|
|
|
- </u-modal>
|
|
|
+ <view class="pay-way-subtitle">
|
|
|
+ <view class="pay-way-subtitle-item">前三个月每天首次一分钱，长期八折优惠</view>
|
|
|
+ <view class="pay-way-subtitle-item"> </view>
|
|
|
+ </view>
|
|
|
+ <button class="pay-way-close-btn" @click="payWayPop = false">关闭</button>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
<u-toast ref="uToast" />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import getUrlParams from "../../utils/getUrlParams.js";
|
|
|
- // import {
|
|
|
- // getEnvIsWx
|
|
|
- // } from '@/utils/judgEnvironment.js'
|
|
|
+ import {
|
|
|
+ getEnvIsWx
|
|
|
+ } from '@/utils/judgEnvironment.js';
|
|
|
+ import $wxPay from '@/utils/wxPay.js'
|
|
|
import {
|
|
|
monthlyWxPay
|
|
|
} from '@/common/http.api.js'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- startTime:'',
|
|
|
- endTime:'',
|
|
|
- payUrl:'',
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+ payUrl: '',
|
|
|
monthId: '',
|
|
|
- vehicleNo:'',
|
|
|
- monthEndTime:'',
|
|
|
- monthStartTime:'',
|
|
|
- lastActiveDate:null,
|
|
|
- roadNo:null,
|
|
|
+ vehicleNo: '',
|
|
|
+ monthEndTime: '',
|
|
|
+ monthStartTime: '',
|
|
|
+ lastActiveDate: null,
|
|
|
+ roadNo: null,
|
|
|
carLicenseList: [],
|
|
|
isShowCarLicense: false,
|
|
|
form: {
|
|
|
- energyType:[],
|
|
|
+ energyType: [],
|
|
|
monthAmount: [],
|
|
|
carLicense: {},
|
|
|
month: 1,
|
|
|
- dateRange:""
|
|
|
+ dateRange: ""
|
|
|
},
|
|
|
- label:"",
|
|
|
+ label: "",
|
|
|
payWayPop: false,
|
|
|
jumpUrl: undefined,
|
|
|
monthlyContent: '',
|
|
|
- carLicenseDefaultValue: [0]
|
|
|
+ carLicenseDefaultValue: [0],
|
|
|
+ wxEnv: false
|
|
|
}
|
|
|
},
|
|
|
- onLoad (page) {
|
|
|
+ onLoad(page) {
|
|
|
+ this.wxEnv = getEnvIsWx();
|
|
|
this.getSysterms(0)
|
|
|
if (page.vehicleNo && page.vehicleNo) {
|
|
|
this.roadNo = page.roadNo;
|
|
|
@@ -123,22 +127,22 @@
|
|
|
let jumpUrl = baseUrl + '#/pages/center/monthly/monthly'
|
|
|
this.jumpUrl = jumpUrl
|
|
|
},
|
|
|
- mounted(){
|
|
|
+ mounted() {
|
|
|
// console.log(this.lastActiveDate)
|
|
|
// this.form.dateRange=this.getMonthRange(new Date(this.lastActiveDate),1)
|
|
|
},
|
|
|
methods: {
|
|
|
/**
|
|
|
- * 获取几个月的日期范围
|
|
|
- * {date} Date 起始日期,往后推一天
|
|
|
- * {monthNum} Number 往后月数
|
|
|
- * */
|
|
|
- getMonthRange (date, monthNum) {
|
|
|
+ * 获取几个月的日期范围
|
|
|
+ * {date} Date 起始日期,往后推一天
|
|
|
+ * {monthNum} Number 往后月数
|
|
|
+ * */
|
|
|
+ getMonthRange(date, monthNum) {
|
|
|
let Date1 = this.lastActiveDate;
|
|
|
// Date1 = Date1.valueOf() + 24 * 60 * 60 * 1000
|
|
|
Date1 = new Date(Date1)
|
|
|
const year = Date1.getFullYear()
|
|
|
- const month = Date1.getMonth()+1
|
|
|
+ const month = Date1.getMonth() + 1
|
|
|
const day = Date1.getDate()
|
|
|
const hours = Date1.getHours();
|
|
|
const minutes = Date1.getMinutes();
|
|
|
@@ -162,16 +166,17 @@
|
|
|
}
|
|
|
const t1 = year + '.' + (month > 9 ? month : '0' + month) + '.' + (day > 9 ? day : '0' + day)
|
|
|
const t2 = year2 + '.' + month2 + '.' + (day2 > 9 ? day2 : '0' + day2)
|
|
|
- this.startTime=t1
|
|
|
- this.endTime=t2
|
|
|
- this.monthStartTime=year + '-' + (month > 9 ? month : '0' + month) + '-' + (day > 9 ? day : '0' + day) + ' ' + hours + ':' + minutes + ':' +seconds
|
|
|
- this.monthEndTime=year2 + '-' + month2 + '-' + day2 + ' ' + hours + ':' + minutes + ':' +seconds
|
|
|
+ this.startTime = t1
|
|
|
+ this.endTime = t2
|
|
|
+ this.monthStartTime = year + '-' + (month > 9 ? month : '0' + month) + '-' + (day > 9 ? day : '0' + day) +
|
|
|
+ ' ' + hours + ':' + minutes + ':' + seconds
|
|
|
+ this.monthEndTime = year2 + '-' + month2 + '-' + day2 + ' ' + hours + ':' + minutes + ':' + seconds
|
|
|
return t1 + '-' + t2
|
|
|
},
|
|
|
/**
|
|
|
* 月操作 减1
|
|
|
- * */
|
|
|
- reduceMonthNum () {
|
|
|
+ * */
|
|
|
+ reduceMonthNum() {
|
|
|
if (this.form.month > 1) {
|
|
|
this.form.month -= 1
|
|
|
this.form.dateRange = this.getMonthRange(new Date, this.form.month)
|
|
|
@@ -179,75 +184,79 @@
|
|
|
},
|
|
|
/**
|
|
|
* 月操作 加1
|
|
|
- * */
|
|
|
- addMonthNum () {
|
|
|
- if(this.form.month >=24){
|
|
|
+ * */
|
|
|
+ addMonthNum() {
|
|
|
+ if (this.form.month >= 24) {
|
|
|
this.$refs.uToast.show({
|
|
|
title: '最多24月',
|
|
|
type: 'warning',
|
|
|
})
|
|
|
- return
|
|
|
+ return
|
|
|
}
|
|
|
this.form.month += 1
|
|
|
-
|
|
|
+
|
|
|
this.form.dateRange = this.getMonthRange(new Date, this.form.month)
|
|
|
},
|
|
|
- carLicenseListConfirm (item) {
|
|
|
+ carLicenseListConfirm(item) {
|
|
|
this.form.carLicense = item[0]
|
|
|
this.vehicleNo = item[0].label
|
|
|
this.getMonthInfo(this.roadNo, this.vehicleNo)
|
|
|
},
|
|
|
- getMonthInfo(roadNo, vehicleNo){
|
|
|
- this.$u.api.monthInfo({roadNo: roadNo, vehicleNo: vehicleNo})
|
|
|
- .then(res => {
|
|
|
- if (res.code === 200){
|
|
|
- this.lastActiveDate = res.data.lastActiveDate;
|
|
|
- this.form.monthAmount=res.data.monthAmount;
|
|
|
- this.carLicenseList = [];
|
|
|
- let vehicleNoItem = null
|
|
|
- res.data.vehicleList.forEach((item, index) => {
|
|
|
- const obj = {
|
|
|
- value: item.energyType,
|
|
|
- label: item.vehicleNo,
|
|
|
- energyType:item.energyType
|
|
|
- }
|
|
|
- if (this.vehicleNo == item.vehicleNo) {
|
|
|
- vehicleNoItem = obj
|
|
|
- this.carLicenseDefaultValue = [index]
|
|
|
+ getMonthInfo(roadNo, vehicleNo) {
|
|
|
+ this.$u.api.monthInfo({
|
|
|
+ roadNo: roadNo,
|
|
|
+ vehicleNo: vehicleNo
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.lastActiveDate = res.data.lastActiveDate;
|
|
|
+ this.form.monthAmount = res.data.monthAmount;
|
|
|
+ this.carLicenseList = [];
|
|
|
+ let vehicleNoItem = null
|
|
|
+ res.data.vehicleList.forEach((item, index) => {
|
|
|
+ const obj = {
|
|
|
+ value: item.energyType,
|
|
|
+ label: item.vehicleNo,
|
|
|
+ energyType: item.energyType
|
|
|
+ }
|
|
|
+ if (this.vehicleNo == item.vehicleNo) {
|
|
|
+ vehicleNoItem = obj
|
|
|
+ this.carLicenseDefaultValue = [index]
|
|
|
+ }
|
|
|
+ this.carLicenseList.push(obj)
|
|
|
+ });
|
|
|
+ // 判断是否url存在车牌号,存在则选中项默认选中
|
|
|
+ if (vehicleNoItem) {
|
|
|
+ this.form.carLicense = vehicleNoItem
|
|
|
+ } else {
|
|
|
+ this.form.carLicense = this.carLicenseList[0]
|
|
|
}
|
|
|
- this.carLicenseList.push(obj)
|
|
|
- });
|
|
|
- // 判断是否url存在车牌号,存在则选中项默认选中
|
|
|
- if (vehicleNoItem) {
|
|
|
- this.form.carLicense = vehicleNoItem
|
|
|
- } else {
|
|
|
- this.form.carLicense = this.carLicenseList[0]
|
|
|
}
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
+
|
|
|
+ })
|
|
|
},
|
|
|
- submit(roadNo){
|
|
|
+ submit(roadNo) {
|
|
|
this.$u.api.createMonth({
|
|
|
- roadNo:this.roadNo,
|
|
|
- vehicleNo:this.form.carLicense.label,
|
|
|
- energyType:this.form.carLicense.energyType,
|
|
|
- monthStartTime:this.monthStartTime,
|
|
|
- monthEndTime:this.monthEndTime,
|
|
|
- monthCount:this.form.month})
|
|
|
+ roadNo: this.roadNo,
|
|
|
+ vehicleNo: this.form.carLicense.label,
|
|
|
+ energyType: this.form.carLicense.energyType,
|
|
|
+ monthStartTime: this.monthStartTime,
|
|
|
+ monthEndTime: this.monthEndTime,
|
|
|
+ monthCount: this.form.month
|
|
|
+ })
|
|
|
.then(res => {
|
|
|
- console.log("createMonth",res)
|
|
|
- if(res.code === 200){
|
|
|
+ console.log("createMonth", res)
|
|
|
+ if (res.code === 200) {
|
|
|
this.monthId = res.data.monthId
|
|
|
console.log(this.monthId)
|
|
|
this.payWayPop = true
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.$refs.uToast.show({
|
|
|
title: res.msg,
|
|
|
type: 'error',
|
|
|
});
|
|
|
}
|
|
|
- }).catch(err=>{
|
|
|
+ }).catch(err => {
|
|
|
this.$refs.uToast.show({
|
|
|
title: '程序错误!',
|
|
|
type: 'error',
|
|
|
@@ -260,7 +269,7 @@
|
|
|
monthId: this.monthId,
|
|
|
jumpUrl: this.jumpUrl
|
|
|
}).then(res => {
|
|
|
- if(res.code === 200){
|
|
|
+ if (res.code === 200) {
|
|
|
window.location.href = res.data.url
|
|
|
} else {
|
|
|
this.$refs.uToast.show({
|
|
|
@@ -287,19 +296,52 @@
|
|
|
// }
|
|
|
this.getWXPayByJava()
|
|
|
},
|
|
|
+ /**
|
|
|
+ * 微信支付
|
|
|
+ */
|
|
|
+ wechatPay() {
|
|
|
+ this.$u.api.wechatPayApi({
|
|
|
+ orderList: this.curOrderList,
|
|
|
+ openid: this.vuex_wxinfo.openId
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ $wxPay.wexinPay(res.data.wx).then(res1 => {
|
|
|
+ switch (Number(res1.code)) {
|
|
|
+ case 0: // 成功
|
|
|
+ //#ifdef H5
|
|
|
+ window.location.reload();
|
|
|
+ //#endif
|
|
|
+ break;
|
|
|
+ case 1: // 取消
|
|
|
+ this.$refs.uToast.show({
|
|
|
+ title: '已取消支付',
|
|
|
+ type: 'info'
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 2: // 支付失败
|
|
|
+ this.$refs.uToast.show({
|
|
|
+ title: '支付失败，请检查!',
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
/**
|
|
|
* 调起微信支付接口
|
|
|
* @param {Array} list 需要支付的订单组合数组
|
|
|
* @param {Number} deviceNo 设备编号(在停车锁部分需要)
|
|
|
* */
|
|
|
- async getWXPay(){
|
|
|
+ async getWXPay() {
|
|
|
// 支付成功跳转到包月页面
|
|
|
let params = {
|
|
|
monthId: this.monthId,
|
|
|
openid: this.$store.state.vuex_wxinfo.openId
|
|
|
};
|
|
|
await this.$wxApi.config();
|
|
|
- this.$pay.wechatPay(params, '/client/monthpay/wechat', this.jumpUrl).then(res =>{
|
|
|
+ this.$pay.wechatPay(params, '/client/monthpay/wechat', this.jumpUrl).then(res => {
|
|
|
switch (Number(res.code)) {
|
|
|
case 0: // 成功
|
|
|
//#ifdef H5
|
|
|
@@ -362,7 +404,7 @@
|
|
|
* 1 微信登录获取code
|
|
|
* 2 url中截取
|
|
|
* */
|
|
|
- getCode () {
|
|
|
+ getCode() {
|
|
|
// 获取页面完整url
|
|
|
const local = window.location.href
|
|
|
// 获取url后面的参数
|
|
|
@@ -371,7 +413,8 @@
|
|
|
this.code = getUrlParams(locationLocaturl, "code");
|
|
|
// 如果没有code，则去请求
|
|
|
if (this.code == null || this.code === '') {
|
|
|
- window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.config.wxAppid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&scope=snsapi_userinfo&#wechat_redirect`
|
|
|
+ window.location.href =
|
|
|
+ `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.config.wxAppid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&scope=snsapi_userinfo&#wechat_redirect`
|
|
|
} else {
|
|
|
// 把code传给后台获取用户信息
|
|
|
this.handleGetWXInfo(this.code)
|
|
|
@@ -381,10 +424,10 @@
|
|
|
* 通过code获取openId等用户信息
|
|
|
* 拿到用户信息后再调起微信支付
|
|
|
* */
|
|
|
- handleGetWXInfo (code) {
|
|
|
+ handleGetWXInfo(code) {
|
|
|
let _this = this
|
|
|
this.$u.api.getWXInfo(code).then((res) => {
|
|
|
- if (res.code === 200 ) {
|
|
|
+ if (res.code === 200) {
|
|
|
this.$u.vuex('vuex_wxinfo', res.data);
|
|
|
this.getWXPay(this.currentItem)
|
|
|
}
|
|
|
@@ -420,21 +463,21 @@
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
- computed:{
|
|
|
- dateRange:function(){
|
|
|
- return this.getMonthRange(this.lastActiveDate,this.form.month)
|
|
|
+ computed: {
|
|
|
+ dateRange: function() {
|
|
|
+ return this.getMonthRange(this.lastActiveDate, this.form.month)
|
|
|
},
|
|
|
},
|
|
|
- filters:{
|
|
|
+ filters: {
|
|
|
verifyStatusFilter(value) {
|
|
|
if (value === 0) {
|
|
|
- return '';
|
|
|
- } else if(value === 1){
|
|
|
- return '汽油车';
|
|
|
- } else if(value === 2){
|
|
|
- return '新能源';
|
|
|
+ return '';
|
|
|
+ } else if (value === 1) {
|
|
|
+ return '汽油车';
|
|
|
+ } else if (value === 2) {
|
|
|
+ return '新能源';
|
|
|
} else {
|
|
|
- return '';
|
|
|
+ return '';
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
@@ -442,6 +485,6 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-@import './handleMonthly.scss';
|
|
|
-@import '../paymentMethod/paymentMethod.scss'
|
|
|
+ @import './handleMonthly.scss';
|
|
|
+ @import '../paymentMethod/paymentMethod.scss'
|
|
|
</style>
|
空白格