停车场包月

common/apiurl.js

@@ -46,7 +46,7 @@ const apiurl = {
   // 获取路段收费规则
   roadsChargeRuleUrl: '/client/roadinfo/feeRule/',
   //包月信息
-  monthInfoUrl: '/client/memberinfo/monthInfo/',
+  monthInfoUrl: '/client/memberinfo/monthInfo',
   //创建包月
   createMonthUrl: '/client/memberinfo/createMonth',
   //包月支付
@@ -120,7 +120,7 @@ const apiurl = {
   // 获取参数
   getParamsUrl: '/admin/config/configKey/',
   // 微信包月支付
-  wechatMonthlyPayUrl: '/client/'
+  wechatMonthlyPayUrl: '/client/monthpay/wechat'
 };
 
 export { apiurl };

common/http.interceptor.js

@@ -5,7 +5,7 @@ const install = (Vue, vm) => {
     showLoading: true,
     loadingText: '加载中...',
     loadingMask: true,
-    loadingTime: 100
+    loadingTime: 800
   });
   // 请求拦截，配置Token等参数
   Vue.prototype.$u.http.interceptor.request = (config) => {

pages/center/monthly/monthly.scss

@@ -93,6 +93,10 @@ page {
 						// background-color: red;
 					}
 				}
+				.pay-btn {
+					background-color: #2b85e4;
+					color: #fff;
+				}
 			}
 		}
 	}

pages/center/monthly/monthly.vue

@@ -13,7 +13,7 @@
 					<view class="monthly-list-item-top">
 						<view class="mlit-left">
 							<view>{{monthlyItem.vehicleNo}}</view>
-							<view>{{monthlyItem.roadName}}</view>
+							<view>{{monthlyItem.roadName || monthlyItem.parkName}}</view>
 						</view>
 						<view class="mlit-right u-flex">
 							<view class="mlit-right-item fee-status" v-if="monthlyItem.feeStatus === 0">未缴费</view>
@@ -37,6 +37,8 @@
 					<view v-if="monthlyItem.feeStatus=='0'" class="button-wrap u-flex u-row-right">
 						<view class="tool-btn" :class="{'tool-btn-cancel': monthlyItem.feeStatus=='0'}"
 							v-if="monthlyItem.feeStatus=='0'" @click="cancelMonth(monthlyItem.monthId)">取消订单</view>
+						<view class="tool-btn pay-btn" v-if="monthlyItem.feeStatus=='0'"
+							@click="goMonthPay(monthlyItem)">重新支付</view>
 					</view>
 					<view v-else-if="monthlyItem.feeStatus == 1 && monthlyItem.surplusDays > 2"
 						class="button-wrap u-flex u-row-right">
@@ -74,6 +76,27 @@
 				pageNo: 1
 			}
 		},
+		onLoad(page) {
+			const obj = {
+				road: 0,
+				park: 1
+			}
+			if (page.type) {
+				this.current = obj[page.type]
+			}
+		},
+		onShow() {
+			this.$nextTick(() => {
+				this.$refs.paging.reload()
+			})
+		},
+		onBackPress(options) {
+			this.$u.route({
+				type: 'switchTab',
+				url: 'pages/center/index'
+			});
+			return true;
+		},
 		methods: {
 			//tabs通知swiper切换
 			tabChange(index) {
@@ -81,12 +104,6 @@
 				this.currentValue = this.tabList[index].value
 				this.$refs.paging.reload()
 			},
-			customBack() {
-				this.$u.route({
-					type: 'switchTab',
-					url: 'pages/center/index'
-				});
-			},
 			// 下拉刷新操作
 			queryList(pageNo, pageSize) {
 				const tabObj = {
@@ -96,6 +113,7 @@
 				this.$u.api[tabObj[this.currentValue]]({
 						pageSize: pageSize,
 						pageNum: pageNo,
+						ifPark: this.current
 					})
 					.then(res => {
 						if (res.code === 200) {
@@ -116,6 +134,22 @@
 				this.id = monthId;
 				this.cancelShow = true;
 			},
+			// 重新支付
+			goMonthPay(item) {
+				const params = {
+					vehicleNo: item.vehicleNo,
+					monthId: item.monthId
+				}
+				if (this.current === 0) {
+					params.roadNo = item.roadNo
+				} else {
+					params.parkNo = item.parkNo
+				}
+				this.$u.route({
+					url: 'pages/handleMonthly/handleMonthly',
+					params
+				})
+			},
 			// 确认取消订单
 			confirm() {
 				this.$u.api.cancelMonth({
@@ -145,12 +179,17 @@
 			 * 去续费
 			 * */
 			goRenewal(item) {
+				const params = {
+					vehicleNo: item.vehicleNo
+				}
+				if (this.current === 0) {
+					params.roadNo = item.roadNo
+				} else {
+					params.parkNo = item.parkNo
+				}
 				this.$u.route({
 					url: 'pages/handleMonthly/handleMonthly',
-					params: {
-						roadNo: item.roadNo,
-						vehicleNo: item.vehicleNo
-					}
+					params
 				})
 			}
 		}

pages/handleMonthly/handleMonthly.vue

@@ -1,48 +1,50 @@
 <template>
-  <view class="handle-monthly">
-    <view class="handle-monthly-item">
-      <view>车牌选择</view>
-      <view class="choose-license" @click="isShowCarLicense = true">
-        <view>{{ form.carLicense.label || '未选车牌' }}</view>
-        <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>
-    <view class="handle-monthly-item">
-      <view>车辆信息</view>
-      <view>{{ form.carLicense.value | verifyStatusFilter }}</view>
-    </view>
-    <view class="handle-monthly-item">
-      <view>包月金额</view>
-      <view class="handle-monthly-money">{{ form.monthAmount || 0 }}元</view>
-    </view>
-    <view class="handle-monthly-item">
-      <view>包月时长</view>
-      <view class="handle-monthly-time-long">
-        <button @click="reduceMonthNum()">-</button>
-        <view>{{ form.month || 0 }}个月</view>
-        <button @click="addMonthNum()">+</button>
-      </view>
-    </view>
-    <view class="handle-monthly-item">
-      <view>有效期限</view>
-      <view>{{ dateRange || '-' }}</view>
-    </view>
-    <view class="handle-monthly-explain">
-      <u-parse :html="monthlyContent"></u-parse>
-    </view>
-    <view class="handle-monthly-confirm-button">
-      <template v-if="carLicenseList.length && form.carLicense && form.carLicense.label">
-        <u-button type="primary" :loading="loading" @click="submit(roadNo)">确认包月</u-button>
-      </template>
-      <template v-else>
-        <u-button>未选车牌</u-button>
-      </template>
-    </view>
-    <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-new">
-          <!-- <view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
+	<view class="handle-monthly">
+		<view class="handle-monthly-item">
+			<view>车牌选择</view>
+			<view class="choose-license" @click="isShowCarLicense = true">
+				<view>{{ form.carLicense.label || '未选车牌' }}</view>
+				<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>
+		<view class="handle-monthly-item">
+			<view>车辆信息</view>
+			<view>{{ form.carLicense.value | verifyStatusFilter }}</view>
+		</view>
+		<view class="handle-monthly-item">
+			<view>包月金额</view>
+			<view class="handle-monthly-money">{{ form.monthAmount || 0 }}元</view>
+		</view>
+		<view class="handle-monthly-item">
+			<view>包月时长</view>
+			<view class="handle-monthly-time-long">
+				<button @click="reduceMonthNum()">-</button>
+				<view>{{ form.month || 0 }}个月</view>
+				<button @click="addMonthNum()">+</button>
+			</view>
+		</view>
+		<view class="handle-monthly-item">
+			<view>有效期限</view>
+			<view>{{ dateRange || '-' }}</view>
+		</view>
+		<view class="handle-monthly-explain">
+			<u-parse :html="monthlyContent"></u-parse>
+		</view>
+		<view class="handle-monthly-confirm-button">
+			<template v-if="carLicenseList.length && form.carLicense && form.carLicense.label">
+				<u-button type="primary" :loading="loading" @click="submit(roadNo)">确认包月</u-button>
+			</template>
+			<template v-else>
+				<u-button>未选车牌</u-button>
+			</template>
+		</view>
+		<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-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>
@@ -50,374 +52,423 @@
             <image src="../../static/img/juhe-icon.png" mode=""></image>
             <view class="title">聚合支付</view>
           </view> -->
-          <view class="pay-way-item pay-way-item-hy" @click="$u.debounce(gyBankPay, 1000, (immediate = true))">
-            <image src="/static/img/gyyh-icon.svg" mode=""></image>
-            <view class="title">贵州银行</view>
-          </view>
-          <!-- #ifdef H5 || MP-WEIXIN -->
-          <!-- <view class="pay-way-item pay-way-item-wx" @click="$u.debounce(wechatPay, 1000, (immediate = true))" v-if="wxEnv">
-            <image src="/static/img/weixin-icon.svg" mode=""></image>
-            <view class="title">微信支付</view>
-          </view> -->
-          <!-- #endif -->
-          <view class="pay-way-item pay-way-item-jh" @click="$u.debounce(juhePay, 1000, (immediate = true))">
-            <image src="/static/img/juhe-icon.svg" mode=""></image>
-            <view class="title">聚合支付</view>
-          </view>
-        </view>
-        <view class="pay-way-subtitle">
-          <view class="pay-way-subtitle-item">前三个月每天首次一分钱，长期八折优惠</view>
-          <!-- #ifdef H5 || MP-WEIXIN -->
-          <!-- <view class="pay-way-subtitle-item" v-if="wxEnv">&nbsp;</view> -->
-          <!-- #endif -->
-          <view class="pay-way-subtitle-item">&nbsp;</view>
-        </view>
-        <button class="pay-way-close-btn" @click="payWayPop = false">关闭</button>
-      </view>
-    </u-modal>
-    <u-toast ref="uToast" />
-  </view>
+					<view class="pay-way-item pay-way-item-hy"
+						@click="$u.debounce(gyBankPay, 1000, (immediate = true))">
+						<image src="/static/img/gyyh-icon.svg" mode=""></image>
+						<view class="title">贵州银行</view>
+					</view>
+					<!-- #ifdef H5 || MP-WEIXIN -->
+					<view class="pay-way-item pay-way-item-wx" @click="$u.debounce(wechatPay, 1000, (immediate = true))"
+						v-if="wxEnv">
+						<image src="/static/img/weixin-icon.svg" mode=""></image>
+						<view class="title">微信支付</view>
+					</view>
+					<!-- #endif -->
+					<view class="pay-way-item pay-way-item-jh" @click="$u.debounce(juhePay, 1000, (immediate = true))">
+						<image src="/static/img/juhe-icon.svg" mode=""></image>
+						<view class="title">聚合支付</view>
+					</view>
+				</view>
+				<view class="pay-way-subtitle">
+					<view class="pay-way-subtitle-item">前三个月每天首次一分钱，长期八折优惠</view>
+					<!-- #ifdef H5 || MP-WEIXIN -->
+					<!-- <view class="pay-way-subtitle-item" v-if="wxEnv">&nbsp;</view> -->
+					<!-- #endif -->
+					<view class="pay-way-subtitle-item">&nbsp;</view>
+				</view>
+				<button class="pay-way-close-btn" @click="cancel">关闭</button>
+			</view>
+		</u-modal>
+		<u-toast ref="uToast" />
+	</view>
 </template>
 
 <script>
-import { getEnvIsWx } from '@/utils/judgEnvironment.js';
-import $wxPay from '@/utils/wxPay.js';
-export default {
-  data() {
-    return {
-      startTime: '',
-      endTime: '',
-      payUrl: '',
-      monthId: '',
-      vehicleNo: '',
-      monthEndTime: '',
-      monthStartTime: '',
-      lastActiveDate: null,
-      roadNo: null,
-      carLicenseList: [],
-      isShowCarLicense: false,
-      form: {
-        energyType: [],
-        monthAmount: 0,
-        carLicense: {},
-        month: 1,
-        dateRange: ''
-      },
-      label: '',
-      payWayPop: false,
-      jumpUrl: undefined,
-      monthlyContent: '',
-      carLicenseDefaultValue: [0],
-      wxEnv: false,
-      loading: false
-    };
-  },
-  onLoad(page) {
-    this.wxEnv = getEnvIsWx();
-    this.getSysterms(0);
-    if (page.vehicleNo && page.vehicleNo) {
-      this.roadNo = page.roadNo;
-      this.vehicleNo = page.vehicleNo;
-      this.getMonthInfo(this.roadNo, this.vehicleNo);
-    } else if (page.roadNo) {
-      this.roadNo = page.roadNo;
-      this.getMonthInfo(this.roadNo);
-    }
-    const baseUrl = window.location.href.split('#')[0];
-    let jumpUrl = baseUrl + '#/pages/center/monthly/monthly';
-    this.jumpUrl = jumpUrl;
-  },
-  methods: {
-    /**
-     * 获取几个月的日期范围
-     * {date} Date 起始日期,往后推一天
-     * {monthNum} Number  往后月数
-     * */
-    getMonthRange(date, monthNum) {
-      let Date1 = this.lastActiveDate;
-      Date1 = new Date(Date1);
-      const year = Date1.getFullYear();
-      const month = Date1.getMonth() + 1;
-      const day = Date1.getDate();
-      const hours = Date1.getHours();
-      const minutes = Date1.getMinutes();
-      const seconds = Date1.getSeconds();
-      let days = new Date(year, month, 0);
-      days = days.getDate(); //获取当前日期中的月的天数
-      let year2 = year;
-      let month2 = parseInt(month) + parseInt(monthNum);
-      if (month2 > 12) {
-        year2 = parseInt(year2) + parseInt(parseInt(month2) / 12 == 0 ? 1 : parseInt(month2) / 12);
-        month2 = parseInt(month2) % 12;
-      }
-      let day2 = day;
-      let days2 = new Date(year2, month2, 0);
-      days2 = days2.getDate();
-      if (day2 > days2) {
-        day2 = days2;
-      }
-      if (month2 < 10) {
-        month2 = '0' + month2;
-      }
-      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;
-      return t1 + '-' + t2;
-    },
-    /**
-     * 月操作 减1
-     * */
-    reduceMonthNum() {
-      if (this.form.month > 1) {
-        this.form.month -= 1;
-        this.form.dateRange = this.getMonthRange(new Date(), this.form.month);
-      }
-    },
-    /**
-     * 月操作 加1
-     * */
-    addMonthNum() {
-      if (this.form.month >= 24) {
-        this.$refs.uToast.show({
-          title: '最多24月',
-          type: 'warning'
-        });
-        return;
-      }
-      this.form.month += 1;
-      this.form.dateRange = this.getMonthRange(new Date(), this.form.month);
-    },
-    carLicenseListConfirm(item) {
-      this.form.carLicense = item[0];
-      this.vehicleNo = item[0].label;
-      this.getMonthInfo(this.roadNo, this.vehicleNo);
-    },
-    /**
-     * 获取包月信息
-     * @date 2022-10-09
-     * @param {any} roadNo
-     * @param {any} vehicleNo
-     * @returns {any}
-     */
-    getMonthInfo(roadNo, vehicleNo) {
-      this.$u.api
-        .monthInfo({
-          roadNo: roadNo,
-          vehicleNo: vehicleNo
-        })
-        .then((res) => {
-          if (res.code === 200 && res.data.vehicleList && res.data.vehicleList.length) {
-            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];
-            }
-          }
-        });
-    },
-    /**
-     * 提交包月信息
-     * @date 2022-10-09
-     * @param {any} roadNo
-     * @returns {any}
-     */
-    submit(roadNo) {
-      this.loading = true;
-      this.$u.api
-        .createMonth({
-          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) {
-            this.monthId = res.data.monthId;
-            console.log(this.monthId);
-            this.payWayPop = true;
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg,
-              type: 'error'
-            });
-          }
-          this.loading = false;
-        })
-        .catch((err) => {
-          this.$refs.uToast.show({
-            title: '程序错误!',
-            type: 'error'
-          });
-          this.loading = false;
-        });
-    },
-    /**
-     * 贵州银行包月支付
-     * @date 2022-10-09
-     * @returns {any}
-     */
-    gyBankPay() {
-      this.$u.api
-        .monthPay({
-          monthId: this.monthId,
-          jumpUrl: this.jumpUrl
-        })
-        .then((res) => {
-          if (res.code === 200) {
-            window.location.href = res.data.url;
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg,
-              type: 'error'
-            });
-          }
-        });
-    },
-    /**
-     * 聚合支付直接通过后台获取贵阳银行微信支付地址
-     * @date 2022-10-09
-     * @returns {any}
-     */
-    juhePay() {
-      // 支付成功跳转到包月页面
-      let params = {
-        monthId: this.monthId,
-        openid: '',
-        jumpUrl: this.jumpUrl
-      };
-      this.$u.api
-        .monthlyWxPay(params)
-        .then((res) => {
-          if (res.code === 200) {
-            localStorage.setItem('jumpUrl', this.jumpUrl);
-            location.href = res.data.qrCodeUrl;
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg,
-              type: 'error'
-            });
-          }
-        })
-        .catch((err) => {
-          this.$refs.uToast.show({
-            title: '无法调起微信支付!',
-            type: 'error'
-          });
-        });
-    },
-    /**
-     * 微信支付
-     * @date 2022-10-09
-     * @returns {any}
-     */
-    wechatPay() {
-      this.$u.api
-        .wechatMonthlyPayapi({
-          orderList: this.curOrderList,
-          openid: this.vuex_wxinfo.openId
-        })
-        .then((r) => {
-          if (r.code === 200) {
-            $wxPay.wexinPay(r.data.wx).then((res) => {
-              switch (Number(res.code)) {
-                case 0: // 成功
-                  //#ifdef H5
-                  // window.location.reload();
-                  location.href = this.jumpUrl;
-                  //#endif
-                  break;
-                case 1: // 取消
-                  this.$refs.uToast.show({
-                    title: '已取消支付',
-                    type: 'info'
-                  });
-                  break;
-                case 2: // 支付失败
-                  this.$refs.uToast.show({
-                    title: '支付失败，请检查!',
-                    type: 'error'
-                  });
-                  break;
-              }
-            });
-          }
-        });
-    },
-    /**
-     * 获取包月说明
-     * @date 2022-10-09
-     * @param {any} termsType
-     * @returns {any}
-     */
-    getSysterms(termsType) {
-      this.$u.api
-        .getSysterms({
-          termsType: termsType
-        })
-        .then((res) => {
-          if (res.code === 200) {
-            this.monthlyContent = res.data?.content;
-          } else {
-            this.$refs.uToast.show({
-              title: res.msg,
-              type: 'error'
-            });
-          }
-        })
-        .catch((err) => {
-          this.$refs.uToast.show({
-            title: '系统错误!',
-            type: 'error'
-          });
-        });
-    }
-  },
-  computed: {
-    dateRange: function () {
-      return this.getMonthRange(this.lastActiveDate, this.form.month);
-    }
-  },
-  filters: {
-    verifyStatusFilter(value) {
-      if (value === 0) {
-        return '-';
-      } else if (value === 1) {
-        return '汽油车';
-      } else if (value === 2) {
-        return '新能源';
-      } else {
-        return '-';
-      }
-    }
-  }
-};
+	import {
+		getEnvIsWx
+	} from '@/utils/judgEnvironment.js';
+	import $wxPay from '@/utils/wxPay.js';
+	export default {
+		data() {
+			return {
+				startTime: '',
+				endTime: '',
+				payUrl: '',
+				monthId: '',
+				vehicleNo: '',
+				monthEndTime: '',
+				monthStartTime: '',
+				lastActiveDate: null,
+				roadNo: null,
+				parkNo: null,
+				carLicenseList: [],
+				isShowCarLicense: false,
+				form: {
+					energyType: [],
+					monthAmount: 0,
+					carLicense: {},
+					month: 1,
+					dateRange: ''
+				},
+				label: '',
+				payWayPop: false,
+				jumpUrl: undefined,
+				monthlyContent: '',
+				carLicenseDefaultValue: [0],
+				wxEnv: false,
+				loading: false,
+				type: 'road'
+			};
+		},
+		onLoad(page) {
+			this.wxEnv = getEnvIsWx();
+			this.getSysterms(0);
+			if (page.vehicleNo && page.roadNo) {
+				this.roadNo = page.roadNo;
+				this.vehicleNo = page.vehicleNo;
+				this.type = 'road'
+				this.getMonthInfo(this.roadNo, this.vehicleNo);
+			} else if (page.roadNo) {
+				this.roadNo = page.roadNo;
+				this.type = 'road'
+				this.getMonthInfo(this.roadNo);
+			} else if (page.vehicleNo && page.parkNo) {
+				this.parkNo = page.parkNo;
+				this.vehicleNo = page.vehicleNo;
+				this.type = 'park'
+				this.getMonthInfo(this.parkNo, this.vehicleNo);
+			} else if (page.parkNo) {
+				this.parkNo = page.parkNo;
+				this.type = 'park'
+				this.getMonthInfo(this.parkNo);
+			}
+			if (page.monthId) {
+				this.monthId = page.monthId
+				this.payWayPop = true
+			}
+			const baseUrl = window.location.href.split('#')[0];
+			let jumpUrl = baseUrl + '#/pages/center/monthly/monthly?type=' + this.type;
+			this.jumpUrl = jumpUrl;
+		},
+		methods: {
+			/**
+			 * 获取几个月的日期范围
+			 * {date} Date 起始日期,往后推一天
+			 * {monthNum} Number  往后月数
+			 * */
+			getMonthRange(date, monthNum) {
+				let Date1 = this.lastActiveDate;
+				Date1 = new Date(Date1);
+				const year = Date1.getFullYear();
+				const month = Date1.getMonth() + 1;
+				const day = Date1.getDate();
+				const hours = Date1.getHours();
+				const minutes = Date1.getMinutes();
+				const seconds = Date1.getSeconds();
+				let days = new Date(year, month, 0);
+				days = days.getDate(); //获取当前日期中的月的天数
+				let year2 = year;
+				let month2 = parseInt(month) + parseInt(monthNum);
+				if (month2 > 12) {
+					year2 = parseInt(year2) + parseInt(parseInt(month2) / 12 == 0 ? 1 : parseInt(month2) / 12);
+					month2 = parseInt(month2) % 12;
+				}
+				let day2 = day;
+				let days2 = new Date(year2, month2, 0);
+				days2 = days2.getDate();
+				if (day2 > days2) {
+					day2 = days2;
+				}
+				if (month2 < 10) {
+					month2 = '0' + month2;
+				}
+				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;
+				return t1 + '-' + t2;
+			},
+			/**
+			 * 月操作 减1
+			 * */
+			reduceMonthNum() {
+				if (this.form.month > 1) {
+					this.form.month -= 1;
+					this.form.dateRange = this.getMonthRange(new Date(), this.form.month);
+				}
+			},
+			/**
+			 * 月操作 加1
+			 * */
+			addMonthNum() {
+				if (this.form.month >= 24) {
+					this.$refs.uToast.show({
+						title: '最多24月',
+						type: 'warning'
+					});
+					return;
+				}
+				this.form.month += 1;
+				this.form.dateRange = this.getMonthRange(new Date(), this.form.month);
+			},
+			carLicenseListConfirm(item) {
+				this.form.carLicense = item[0];
+				this.vehicleNo = item[0].label;
+				this.getMonthInfo(this.roadNo, this.vehicleNo);
+			},
+			/**
+			 * 获取包月信息
+			 * @date 2022-10-09
+			 * @param {any} roadNo
+			 * @param {any} vehicleNo
+			 * @returns {any}
+			 */
+			getMonthInfo(roadNo, vehicleNo) {
+				const params = {
+					vehicleNo
+				}
+				if (this.type === 'park') {
+					params.parkNo = roadNo
+				} else {
+					params.roadNo = roadNo
+				}
+				this.$u.api
+					.monthInfo(params)
+					.then((res) => {
+						if (res.code === 200 && res.data.vehicleList && res.data.vehicleList.length) {
+							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];
+							}
+						}
+					}).catch((err) => {
+						console.log(err);
+					})
+			},
+			/**
+			 * 提交包月信息
+			 * @date 2022-10-09
+			 * @param {any} roadNo
+			 * @returns {any}
+			 */
+			submit(roadNo) {
+				this.loading = true;
+				const params = {
+					vehicleNo: this.form.carLicense.label,
+					energyType: this.form.carLicense.energyType,
+					monthStartTime: this.monthStartTime,
+					monthEndTime: this.monthEndTime,
+					monthCount: this.form.month
+				}
+				if (this.type === 'park') {
+					params.parkNo = this.parkNo
+				} else {
+					params.roadNo = this.roadNo
+				}
+				this.$u.api
+					.createMonth(params)
+					.then((res) => {
+						if (res.code === 200) {
+							this.monthId = res.data.monthId;
+							this.payWayPop = true;
+						} else {
+							this.$refs.uToast.show({
+								title: res.msg,
+								type: 'error'
+							});
+						}
+						this.loading = false;
+					})
+					.catch((err) => {
+						this.$refs.uToast.show({
+							title: '程序错误!',
+							type: 'error'
+						});
+						this.loading = false;
+					});
+			},
+			/**
+			 * 贵州银行包月支付
+			 * @date 2022-10-09
+			 * @returns {any}
+			 */
+			gyBankPay() {
+				this.$u.api
+					.monthPay({
+						monthId: this.monthId,
+						jumpUrl: this.jumpUrl
+					})
+					.then((res) => {
+						if (res.code === 200) {
+							window.location.href = res.data.url;
+						} else {
+							this.$refs.uToast.show({
+								title: res.msg,
+								type: 'error'
+							});
+							this.jumpMonthList()
+						}
+					});
+			},
+			/**
+			 * 聚合支付直接通过后台获取贵阳银行微信支付地址
+			 * @date 2022-10-09
+			 * @returns {any}
+			 */
+			juhePay() {
+				// 支付成功跳转到包月页面
+				let params = {
+					monthId: this.monthId,
+					openid: '',
+					jumpUrl: this.jumpUrl
+				};
+				this.$u.api
+					.monthlyWxPay(params)
+					.then((res) => {
+						if (res.code === 200) {
+							localStorage.setItem('jumpUrl', this.jumpUrl);
+							location.href = res.data.qrCodeUrl;
+						} else {
+							this.$refs.uToast.show({
+								title: res.msg,
+								type: 'error'
+							});
+							this.jumpMonthList()
+						}
+					})
+					.catch((err) => {
+						this.$refs.uToast.show({
+							title: '无法调起微信支付!',
+							type: 'error'
+						});
+					});
+			},
+			/**
+			 * 微信支付
+			 * @date 2022-10-09
+			 * @returns {any}
+			 */
+			wechatPay() {
+				this.$u.api
+					.wechatMonthlyPayapi({
+						monthId: this.monthId,
+						openid: this.vuex_wxinfo.openId
+					})
+					.then((r) => {
+						if (r.code === 200) {
+							$wxPay.wexinPay(r.data.wx).then((res) => {
+								switch (Number(res.code)) {
+									case 0: // 成功
+										//#ifdef H5
+										// this.jumpMonthList()
+										location.href = this.jumpUrl
+										//#endif
+										break;
+									case 1: // 取消
+										this.$refs.uToast.show({
+											title: '已取消支付',
+											type: 'info'
+										});
+										this.jumpMonthList()
+										break;
+									case 2: // 支付失败
+										this.$refs.uToast.show({
+											title: '支付失败，请检查!',
+											type: 'error'
+										});
+										this.jumpMonthList()
+										break;
+								}
+							});
+						}
+					});
+			},
+			/**
+			 * 获取包月说明
+			 * @date 2022-10-09
+			 * @param {any} termsType
+			 * @returns {any}
+			 */
+			getSysterms(termsType) {
+				this.$u.api
+					.getSysterms({
+						termsType: termsType
+					})
+					.then((res) => {
+						if (res.code === 200) {
+							this.monthlyContent = res.data?.content;
+						} else {
+							this.$refs.uToast.show({
+								title: res.msg,
+								type: 'error'
+							});
+						}
+					})
+					.catch((err) => {
+						this.$refs.uToast.show({
+							title: '系统错误!',
+							type: 'error'
+						});
+					});
+			},
+			cancel() {
+				this.payWayPop = false
+				this.jumpMonthList()
+			},
+			jumpMonthList() {
+				this.$u.route({
+					url: '/pages/center/monthly/monthly',
+					type: 'redirect',
+					params: {
+						type: this.type
+					}
+				})
+			}
+		},
+		computed: {
+			dateRange: function() {
+				return this.getMonthRange(this.lastActiveDate, this.form.month);
+			}
+		},
+		filters: {
+			verifyStatusFilter(value) {
+				if (value === 0) {
+					return '-';
+				} else if (value === 1) {
+					return '汽油车';
+				} else if (value === 2) {
+					return '新能源';
+				} else {
+					return '-';
+				}
+			}
+		}
+	};
 </script>
 
 <style lang="scss" scoped>
-@import './handleMonthly.scss';
-@import '../paymentMethod/paymentMethod.scss';
+	@import './handleMonthly.scss';
+	@import '../paymentMethod/paymentMethod.scss';
 </style>

pages/searchparking/searchparking.vue

@@ -9,7 +9,7 @@
       :background="{ background: 'linear-gradient(145deg, #41AFF9 0%, #2D8CFB 100%)' }"
     >
     </u-navbar>
-    <!-- <view class="tab-fixed">
+    <view class="tab-fixed">
       <u-tabs-swiper
         activeColor="#008CFF"
         ref="tabs"
@@ -19,7 +19,7 @@
         :is-scroll="false"
         swiperWidth="100%"
       ></u-tabs-swiper>
-    </view> -->
+    </view>
     <mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" height="calc(100vh - 84px)" top="50rpx">
       <view class="parkinglist">
         <view class="parkinglist-item" v-for="(item, index) in parkinglist" :key="index" @click="navigation(item.latitude, item.longitude)">