|
@@ -1,13 +1,26 @@
|
|
|
<template>
|
|
|
- <zj-page-layout :hasFooter="true" :isScroll="true" :refresherTriggered="refresherTriggered"
|
|
|
- @refresherrefresh="refresherrefresh">
|
|
|
+ <zj-page-layout
|
|
|
+ :hasFooter="true"
|
|
|
+ :isScroll="true"
|
|
|
+ :refresherTriggered="refresherTriggered"
|
|
|
+ @refresherrefresh="refresherrefresh"
|
|
|
+ >
|
|
|
<template slot="header">
|
|
|
<view class="tab-container">
|
|
|
- <u-tabs :scrollable="true" :list="tabList" :current="curTab" @click="changeTab" lineColor="#3D8FFD" :activeStyle="{
|
|
|
- color: '#3D8FFD'
|
|
|
- }" :inactiveStyle="{
|
|
|
- color: '#666666'
|
|
|
-}" itemStyle="height: 88rpx;">
|
|
|
+ <u-tabs
|
|
|
+ :scrollable="true"
|
|
|
+ :list="tabList"
|
|
|
+ :current="curTab"
|
|
|
+ @click="changeTab"
|
|
|
+ lineColor="#3D8FFD"
|
|
|
+ :activeStyle="{
|
|
|
+ color: '#3D8FFD'
|
|
|
+ }"
|
|
|
+ :inactiveStyle="{
|
|
|
+ color: '#666666'
|
|
|
+ }"
|
|
|
+ itemStyle="height: 88rpx;"
|
|
|
+ >
|
|
|
</u-tabs>
|
|
|
</view>
|
|
|
</template>
|
|
@@ -15,11 +28,15 @@
|
|
|
<view class="list-container">
|
|
|
<view class="mode" @click.prevent="toOrderDetail(item.id)" v-for="(item, index) in orderList" :key="index">
|
|
|
<view class="flex_asb order">
|
|
|
- <view class="title">制单时间: <text class="text">{{ item.createTime }}</text></view>
|
|
|
+ <view class="title"
|
|
|
+ >制单时间: <text class="text">{{ item.createTime }}</text></view
|
|
|
+ >
|
|
|
<view :class="item.payStatus">{{ statusFilter(item.payStatus) }}</view>
|
|
|
</view>
|
|
|
<view class="flex_asb order" v-if="item.payStatus == 'PAID' || item.payStatus == 'EXPIRE'">
|
|
|
- <view class="title">延保期限: <text class="text">{{ item.serviceEndTime.substring(0, 10) }}</text></view>
|
|
|
+ <view class="title"
|
|
|
+ >延保期限: <text class="text">{{ item.serviceEndTime.substring(0, 10) }}</text></view
|
|
|
+ >
|
|
|
<view class="status">延保</view>
|
|
|
</view>
|
|
|
<view class="flex">
|
|
@@ -43,32 +60,48 @@
|
|
|
<view class="text"> {{ item.amount }}</view>
|
|
|
</view>
|
|
|
<view class="flex_end">
|
|
|
- <view v-if="item.payStatus == 'WAIT'" @click.stop="cancelOrder(item.id)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'WAIT'"
|
|
|
+ @click.stop="cancelOrder(item.id)"
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="取消订单"></u-button>
|
|
|
</view>
|
|
|
- <view v-if="item.payStatus == 'PAID'"
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'PAID'"
|
|
|
@click.stop="navToPage('/packageWorkorder/pages/userWorkorderList?pgIncreOrderId=' + item.id)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="使用记录"></u-button>
|
|
|
</view>
|
|
|
|
|
|
- <view v-if="item.payStatus == 'PAID' && item.orderTaxId" @click.stop="toInvoiceDetail(item.orderTaxId)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'PAID' && item.orderTaxId"
|
|
|
+ @click.stop="toInvoiceDetail(item.orderTaxId)"
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="查看发票"></u-button>
|
|
|
</view>
|
|
|
- <view v-if="item.payStatus == 'PAID' && !item.orderTaxId" @click.stop="toInvoiceForm(item.id)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'PAID' && !item.orderTaxId"
|
|
|
+ @click.stop="toInvoiceForm(item.id)"
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="开发票"></u-button>
|
|
|
</view>
|
|
|
|
|
|
- <view v-if="item.payStatus == 'PAID'"
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'PAID'"
|
|
|
@click.stop="navToPage('/packageHome/pages/addvalue/serviceUse?id=' + item.id)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="去使用"></u-button>
|
|
|
</view>
|
|
|
- <view v-if="item.payStatus == 'WAIT'" @click.stop="toPay(item)"
|
|
|
- style="width: 160rpx;height: 60rpx;margin-left: 20rpx;">
|
|
|
+ <view
|
|
|
+ v-if="item.payStatus == 'WAIT'"
|
|
|
+ @click.stop="toPay(item)"
|
|
|
+ style="width: 160rpx; height: 60rpx; margin-left: 20rpx"
|
|
|
+ >
|
|
|
<u-button :plain="true" type="primary" text="去支付"></u-button>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -81,12 +114,8 @@
|
|
|
<view class="pay">
|
|
|
<image class="close" @click="closePay()" src="/static/icon/close.png" mode="aspectFill"></image>
|
|
|
<view class="title">请支付</view>
|
|
|
- <view class="item">
|
|
|
- 服务类型: <text class="text">延保</text>
|
|
|
- </view>
|
|
|
- <view class="item">
|
|
|
- 使用类型: <text class="text">按使用年限</text>
|
|
|
- </view>
|
|
|
+ <view class="item"> 服务类型: <text class="text">延保</text> </view>
|
|
|
+ <view class="item"> 使用类型: <text class="text">按使用年限</text> </view>
|
|
|
<view class="item">
|
|
|
产品品牌: <text class="text">{{ detail.brandName }}</text>
|
|
|
</view>
|
|
@@ -102,9 +131,9 @@
|
|
|
<view class="item">
|
|
|
服务金额: <text class="text">{{ detail.amount }}</text>
|
|
|
</view>
|
|
|
- <view class="title" style="text-align: left;">选择支付方式</view>
|
|
|
+ <view class="title" style="text-align: left">选择支付方式</view>
|
|
|
<view class="payType">
|
|
|
- <view style="margin-bottom: 20rpx;">
|
|
|
+ <view style="margin-bottom: 20rpx">
|
|
|
<u-button type="primary" @click="scanCode" text="扫码支付 (推荐)"></u-button>
|
|
|
</view>
|
|
|
<u-button type="primary" @click="workerPay" :plain="true" text="代客支付"></u-button>
|
|
@@ -115,7 +144,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { weixinPay, mini_env, wxScanCode } from '@/common/utils/util.js';
|
|
|
+import { weixinPay, mini_env, wxScanCode } from '@/common/utils/util.js'
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
@@ -125,7 +154,7 @@ export default {
|
|
|
{ key: 'WAIT', name: '待支付(0)' },
|
|
|
{ key: 'PAID', name: '已支付(0)' },
|
|
|
{ key: 'EXPIRE,CANCEL', name: '过期/取消(0)' },
|
|
|
- { key: 'REFUND', name: '已退款(0)' },
|
|
|
+ { key: 'REFUND', name: '已退款(0)' }
|
|
|
],
|
|
|
tabCurrent: '', // 当前tab状态
|
|
|
orderList: [], // 订单列表
|
|
@@ -136,13 +165,13 @@ export default {
|
|
|
detail: {},
|
|
|
canScanCode: 0,
|
|
|
timeout: null,
|
|
|
- timeoutNum: 0,
|
|
|
+ timeoutNum: 0
|
|
|
}
|
|
|
},
|
|
|
|
|
|
computed: {
|
|
|
curTab() {
|
|
|
- return this.tabList.map(item => item.key).indexOf(this.tabCurrent) || 0;
|
|
|
+ return this.tabList.map(item => item.key).indexOf(this.tabCurrent) || 0
|
|
|
},
|
|
|
statusFilter() {
|
|
|
return function (val) {
|
|
@@ -159,7 +188,7 @@ export default {
|
|
|
deadline() {
|
|
|
return function (time, num) {
|
|
|
let date = new Date(time)
|
|
|
- date.setFullYear(date.getFullYear() + num);
|
|
|
+ date.setFullYear(date.getFullYear() + num)
|
|
|
let y = date.getFullYear(),
|
|
|
m = date.getMonth() + 1,
|
|
|
d = date.getDate()
|
|
@@ -169,55 +198,59 @@ export default {
|
|
|
},
|
|
|
|
|
|
onLoad() {
|
|
|
- this.getOrderList();
|
|
|
+ this.getOrderList()
|
|
|
},
|
|
|
|
|
|
onUnload() {
|
|
|
- clearTimeout(this.timeout);
|
|
|
+ clearTimeout(this.timeout)
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
getOrderList() {
|
|
|
this.getCount()
|
|
|
- this.loadStatus = 1;
|
|
|
- let url = '';
|
|
|
- this.$api.post('/increConfig/listIncre', {
|
|
|
- pageNum: this.pageNum,
|
|
|
- pageSize: 10,
|
|
|
- payStatus: this.tabCurrent,
|
|
|
- // userId: this.$store.state.user.userId
|
|
|
- }).then(res => {
|
|
|
- this.loadStatus = 0;
|
|
|
- let list = res.data.records;
|
|
|
- if (list.length < 10) {
|
|
|
- this.loadStatus = 2;
|
|
|
- }
|
|
|
- this.orderList = this.orderList.concat(list);
|
|
|
- }).catch(() => {
|
|
|
- this.loadStatus = 2;
|
|
|
- }).finally(res => {
|
|
|
- this.refresherTriggered = false;
|
|
|
- })
|
|
|
+ this.loadStatus = 1
|
|
|
+ let url = ''
|
|
|
+ this.$api
|
|
|
+ .post('/increConfig/listIncre', {
|
|
|
+ pageNum: this.pageNum,
|
|
|
+ pageSize: 10,
|
|
|
+ payStatus: this.tabCurrent
|
|
|
+ // userId: this.$store.state.user.userId
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.loadStatus = 0
|
|
|
+ let list = res.data.records
|
|
|
+ if (list.length < 10) {
|
|
|
+ this.loadStatus = 2
|
|
|
+ }
|
|
|
+ this.orderList = this.orderList.concat(list)
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.loadStatus = 2
|
|
|
+ })
|
|
|
+ .finally(res => {
|
|
|
+ this.refresherTriggered = false
|
|
|
+ })
|
|
|
},
|
|
|
|
|
|
// 滚动到底部
|
|
|
scrolltolower(e) {
|
|
|
if (this.loadStatus === 0) {
|
|
|
- this.pageNum++;
|
|
|
- this.getOrderList();
|
|
|
+ this.pageNum++
|
|
|
+ this.getOrderList()
|
|
|
}
|
|
|
},
|
|
|
|
|
|
// 触发下拉刷新
|
|
|
async refresherrefresh(e) {
|
|
|
- this.refresherTriggered = true;
|
|
|
- this.refreshList();
|
|
|
+ this.refresherTriggered = true
|
|
|
+ this.refreshList()
|
|
|
},
|
|
|
|
|
|
refreshList() {
|
|
|
- this.orderList = [];
|
|
|
- this.pageNum = 1;
|
|
|
- this.getOrderList();
|
|
|
+ this.orderList = []
|
|
|
+ this.pageNum = 1
|
|
|
+ this.getOrderList()
|
|
|
},
|
|
|
|
|
|
getCount() {
|
|
@@ -232,8 +265,8 @@ export default {
|
|
|
|
|
|
// 切换类型
|
|
|
changeTab(item) {
|
|
|
- this.tabCurrent = item.key;
|
|
|
- this.refreshList();
|
|
|
+ this.tabCurrent = item.key
|
|
|
+ this.refreshList()
|
|
|
},
|
|
|
|
|
|
// 去订单详情
|
|
@@ -247,14 +280,18 @@ export default {
|
|
|
cancelOrder(id) {
|
|
|
this.$modal({
|
|
|
content: '确定要取消订单吗?'
|
|
|
- }).then(() => {
|
|
|
- this.$api.post('/increConfig/cancel', {
|
|
|
- id
|
|
|
- }).then(res => {
|
|
|
- this.refreshList();
|
|
|
- this.$successToast();
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$api
|
|
|
+ .post('/increConfig/cancel', {
|
|
|
+ id
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ this.refreshList()
|
|
|
+ this.$successToast()
|
|
|
+ })
|
|
|
})
|
|
|
- }).catch(() => { })
|
|
|
+ .catch(() => {})
|
|
|
},
|
|
|
|
|
|
navToPage(url) {
|
|
@@ -270,84 +307,92 @@ export default {
|
|
|
|
|
|
// 扫码
|
|
|
async scanCode() {
|
|
|
- if (this.canScanCode > 0) return this.$toast(`请等待${this.canScanCode}秒后重试`);
|
|
|
- var codeVal = await wxScanCode();
|
|
|
- this.userPay(codeVal);
|
|
|
+ if (this.canScanCode > 0) return this.$toast(`请等待${this.canScanCode}秒后重试`)
|
|
|
+ var codeVal = await wxScanCode(['qrCode'])
|
|
|
+ this.userPay(codeVal)
|
|
|
},
|
|
|
|
|
|
// 用户支付
|
|
|
userPay(code) {
|
|
|
- this.$api.post('/increConfig/paid', {
|
|
|
- authCode: code,
|
|
|
- id: this.detail.id,
|
|
|
- }).then((res) => {
|
|
|
- // 返回true,则支付成功
|
|
|
- if (res.data) {
|
|
|
- this.timeoutNum = 0;
|
|
|
- clearTimeout(this.timeout);
|
|
|
- this.getOrderList()
|
|
|
- }
|
|
|
- // 返回false,轮询3次
|
|
|
- else {
|
|
|
- if (this.timeoutNum < 4) {
|
|
|
- this.timeoutNum = this.timeoutNum + 1;
|
|
|
- this.timeout = setTimeout(() => {
|
|
|
- this.userPay(code);
|
|
|
- }, 1000);
|
|
|
- } else {
|
|
|
- this.timeoutNum = 0;
|
|
|
- clearTimeout(this.timeout);
|
|
|
+ this.$api
|
|
|
+ .post('/increConfig/paid', {
|
|
|
+ authCode: code,
|
|
|
+ id: this.detail.id
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ // 返回true,则支付成功
|
|
|
+ if (res.data) {
|
|
|
+ this.timeoutNum = 0
|
|
|
+ clearTimeout(this.timeout)
|
|
|
this.getOrderList()
|
|
|
}
|
|
|
- }
|
|
|
- }).catch((res) => {
|
|
|
- this.timeoutNum = 0;
|
|
|
- clearTimeout(this.timeout);
|
|
|
- this.$tips(res.message);
|
|
|
- }).finally(() => {
|
|
|
- this.canScanCode = 15;
|
|
|
- let time = setInterval(() => {
|
|
|
- if (this.canScanCode > 0) {
|
|
|
- this.canScanCode = this.canScanCode - 1;
|
|
|
- } else {
|
|
|
- clearInterval(time);
|
|
|
+ // 返回false,轮询3次
|
|
|
+ else {
|
|
|
+ if (this.timeoutNum < 4) {
|
|
|
+ this.timeoutNum = this.timeoutNum + 1
|
|
|
+ this.timeout = setTimeout(() => {
|
|
|
+ this.userPay(code)
|
|
|
+ }, 1000)
|
|
|
+ } else {
|
|
|
+ this.timeoutNum = 0
|
|
|
+ clearTimeout(this.timeout)
|
|
|
+ this.getOrderList()
|
|
|
+ }
|
|
|
}
|
|
|
- }, 1000);
|
|
|
- });
|
|
|
+ })
|
|
|
+ .catch(res => {
|
|
|
+ this.timeoutNum = 0
|
|
|
+ clearTimeout(this.timeout)
|
|
|
+ this.$tips(res.message)
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.canScanCode = 15
|
|
|
+ let time = setInterval(() => {
|
|
|
+ if (this.canScanCode > 0) {
|
|
|
+ this.canScanCode = this.canScanCode - 1
|
|
|
+ } else {
|
|
|
+ clearInterval(time)
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
+ })
|
|
|
},
|
|
|
|
|
|
//代客支付
|
|
|
workerPay() {
|
|
|
- mini_env((bool) => {
|
|
|
+ mini_env(bool => {
|
|
|
const that = this
|
|
|
- this.$api.post('/increConfig/pay', {
|
|
|
- id: this.detail.id,
|
|
|
- ...(() => {
|
|
|
- if (bool) {
|
|
|
- return {
|
|
|
- miniPay: true,
|
|
|
- openId: this.$store.state.user.miniOpenId
|
|
|
+ this.$api
|
|
|
+ .post('/increConfig/pay', {
|
|
|
+ id: this.detail.id,
|
|
|
+ ...(() => {
|
|
|
+ if (bool) {
|
|
|
+ return {
|
|
|
+ miniPay: true,
|
|
|
+ openId: this.$store.state.user.miniOpenId
|
|
|
+ }
|
|
|
}
|
|
|
+ return {}
|
|
|
+ })()
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (!res.data) return false
|
|
|
+ if (bool) {
|
|
|
+ uniWebview.navigateTo({
|
|
|
+ url: `/pages/pay/pay?${Object.entries({
|
|
|
+ ...res.data,
|
|
|
+ payPackage: res.data.payPackage.split('=')[0] || '',
|
|
|
+ payPackageVal: res.data.payPackage.split('=')[1] || ''
|
|
|
+ })
|
|
|
+ .map(item => item.join('='))
|
|
|
+ .join('&')}`
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ weixinPay(res.data, function (res) {
|
|
|
+ that.$successToast('支付成功')
|
|
|
+ that.getOrderList()
|
|
|
+ })
|
|
|
}
|
|
|
- return {}
|
|
|
- })()
|
|
|
- }).then((res) => {
|
|
|
- if (!res.data) return false;
|
|
|
- if (bool) {
|
|
|
- uniWebview.navigateTo({
|
|
|
- url: `/pages/pay/pay?${Object.entries({
|
|
|
- ...res.data,
|
|
|
- payPackage: res.data.payPackage.split("=")[0] || "",
|
|
|
- payPackageVal: res.data.payPackage.split("=")[1] || ""
|
|
|
- }).map(item => item.join("=")).join("&")}`
|
|
|
- })
|
|
|
- } else {
|
|
|
- weixinPay(res.data, function (res) {
|
|
|
- that.$successToast('支付成功');
|
|
|
- that.getOrderList()
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
+ })
|
|
|
})
|
|
|
},
|
|
|
|
|
@@ -357,20 +402,20 @@ export default {
|
|
|
|
|
|
// 开发票
|
|
|
toInvoiceForm(orderId = '') {
|
|
|
- this.navToPage('/packageMine/pages/invoice/form?orderType=INCRE&orderId=' + orderId);
|
|
|
+ this.navToPage('/packageMine/pages/invoice/form?orderType=INCRE&orderId=' + orderId)
|
|
|
},
|
|
|
|
|
|
// 发票详情
|
|
|
toInvoiceDetail(orderTaxId = '') {
|
|
|
- this.navToPage('/packageMine/pages/invoice/detail?orderTaxId=' + orderTaxId);
|
|
|
- },
|
|
|
+ this.navToPage('/packageMine/pages/invoice/detail?orderTaxId=' + orderTaxId)
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.tab-container {
|
|
|
- background: #FFFFFF;
|
|
|
+ background: #ffffff;
|
|
|
}
|
|
|
|
|
|
.flex {
|
|
@@ -431,7 +476,7 @@ export default {
|
|
|
|
|
|
.status {
|
|
|
font-size: 28rpx;
|
|
|
- color: #0379FF;
|
|
|
+ color: #0379ff;
|
|
|
}
|
|
|
|
|
|
.PAID {
|
|
@@ -448,7 +493,6 @@ export default {
|
|
|
}
|
|
|
|
|
|
.zhihui {
|
|
|
-
|
|
|
.text,
|
|
|
.hui,
|
|
|
.title,
|
|
@@ -499,4 +543,5 @@ export default {
|
|
|
top: 30rpx;
|
|
|
right: 30rpx;
|
|
|
}
|
|
|
-}</style>
|
|
|
+}
|
|
|
+</style>
|