314 lines
8.1 KiB
Vue
314 lines
8.1 KiB
Vue
<template>
|
||
<view class="content">
|
||
<form class="diff-from" @submit="onDiff">
|
||
<label>补差价金额(元)</label>
|
||
<input placeholder="输入补差价金额" name="price" type="digit" />
|
||
<button form-type="submit">确认补差价</button>
|
||
</form>
|
||
<view class="diff-list">
|
||
<view class="diff-title">补差价记录</view>
|
||
<block v-if="diffArr.length > 0">
|
||
<view class="diff-item" v-for="(item, index) in diffArr" :key="index">
|
||
<view class="diff-info">
|
||
<view class="diff-info-item">
|
||
<label>差价金额：</label>
|
||
<view class="nowrap">{{item.price}}</view>
|
||
</view>
|
||
<view class="diff-info-item">
|
||
<label>订单状态：</label>
|
||
<view class="nowrap">{{item.status.text}}</view>
|
||
</view>
|
||
<view class="diff-info-item">
|
||
<label>创建时间：</label>
|
||
<view class="nowrap">{{item.created_at}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="diff-state border-solid" v-if="item.can.pay_status != 5 && item.can.pay_status != 7">
|
||
<view class="diff-btn" v-if="item.can.cancel" @click="onCancel(item.synthesis_diff_price_id, index)">取消订单</view>
|
||
<view class="diff-btn in" @click="onListPay(item)" :class="{'hide': item.can.pay_status == 2 || item.can.pay_status == 4}">
|
||
<text v-if="item.can.pay_status == 1">立即支付</text>
|
||
<text v-if="item.can.pay_status == 2 || item.can.pay_status == 4">审核中</text>
|
||
<text v-if="item.can.pay_status == 3 || item.can.pay_status == 6">被驳回</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 分页 -->
|
||
<u-loadmore v-if="pagesShow" :status="status" />
|
||
</block>
|
||
<view class="diff-null" v-else>
|
||
<u-empty
|
||
mode="history"
|
||
icon="http://cdn.uviewui.com/uview/empty/history.png"
|
||
text="无补差价记录"
|
||
>
|
||
</u-empty>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { orderDiff, orderDiffList, orderDiffCancel, orderDiffInfo } from '@/apis/interfaces/synthesisOrder'
|
||
export default {
|
||
data() {
|
||
return {
|
||
orderId : '', // 支付ID
|
||
orderType : '', // 支付类型
|
||
price : '', // 支付价格
|
||
diffArr : [], // 支付记录
|
||
page : {}, // 分页信息
|
||
pagesShow : false,// 是否显示分页
|
||
status : '' // 分页状态
|
||
};
|
||
},
|
||
onShow() {
|
||
this.getList()
|
||
},
|
||
methods: {
|
||
// 获取补差价列表
|
||
getList(){
|
||
uni.showLoading({
|
||
title: '加载中...',
|
||
mask : true
|
||
})
|
||
// 初始化分页
|
||
this.page = {
|
||
current: 1
|
||
}
|
||
// 获取补差价列表
|
||
let { orderId, ordertype } = this.$Route.query
|
||
orderDiffList(orderId, ordertype.replace(/\-/g, '\\'), this.page.current).then(res => {
|
||
let { data, page } = res
|
||
this.diffArr = page.current == 1 ? data: this.diffArr.concat(data)
|
||
this.page = page
|
||
this.pagesShow = !page.has_more
|
||
this.status = page.has_more ? 'loading' : 'nomore'
|
||
uni.hideLoading()
|
||
}).catch(err => {
|
||
uni.showToast({
|
||
title: err.message,
|
||
icon : 'none'
|
||
})
|
||
}).finally(() => {
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
// 创建补差价订单
|
||
onDiff(e){
|
||
let { price } = e.detail.value
|
||
let { orderId, ordertype } = this.$Route.query
|
||
if( price == '' || price <= 0 ){
|
||
uni.showToast({
|
||
title: '金额需大于0元并不能为空',
|
||
icon : 'none'
|
||
})
|
||
return
|
||
}
|
||
uni.showLoading({
|
||
title: '加载中...',
|
||
mask : true
|
||
})
|
||
orderDiff(ordertype.replace(/\-/g, '\\'), orderId, price ).then(res => {
|
||
let { synthesis_diff_price_id, order_type, can, price } = res;
|
||
this.onPay( synthesis_diff_price_id, order_type, can, price )
|
||
}).catch(err => {
|
||
uni.showToast({
|
||
title: err.message,
|
||
icon : 'none'
|
||
})
|
||
}).finally(() => {
|
||
uni.hideLoading()
|
||
})
|
||
},
|
||
// 取消补差价
|
||
onCancel(id, index){
|
||
uni.showModal({
|
||
title : '提示',
|
||
content : '确认取消当前补差价订单吗？',
|
||
success : res => {
|
||
if(res.confirm){
|
||
uni.showLoading({
|
||
title: '加载中...',
|
||
mask : true
|
||
})
|
||
orderDiffCancel(id).then(res => {
|
||
uni.showToast({
|
||
title: res,
|
||
icon : 'none'
|
||
})
|
||
this.diffArr.splice(index, 1)
|
||
}).catch(err => {
|
||
uni.showToast({
|
||
title: err.message,
|
||
icon : 'none'
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 列表补差价
|
||
onListPay(obj){
|
||
let { synthesis_diff_price_id, order_type, can, price, remark, offline_pays, order_id } = obj
|
||
if(can.pay_status == 2 || can.pay_status == 4){
|
||
uni.showToast({
|
||
title: '补差价信息正在审核中',
|
||
icon : 'none'
|
||
})
|
||
return
|
||
}
|
||
if(can.pay_status == 3){
|
||
uni.showModal({
|
||
title : '驳回提示',
|
||
content : '线下银行打款被驳回，驳回原因：' + offline_pays.remark,
|
||
showCancel : false,
|
||
confirmText : '编辑',
|
||
success : res => {
|
||
if(res.confirm && can.pay_status == 3){
|
||
this.$Router.push({
|
||
name: 'BankPay',
|
||
params: {
|
||
payId : offline_pays.offline_pay_id,
|
||
orderType : order_type.replace(/\\/g, '-'),
|
||
price : price,
|
||
type : 'edit'
|
||
},
|
||
})
|
||
}
|
||
}
|
||
})
|
||
return
|
||
}
|
||
if(can.pay_status == 6){
|
||
uni.showModal({
|
||
title : '驳回提示',
|
||
content : '补差价被驳回，驳回原因：' + remark,
|
||
showCancel : false,
|
||
})
|
||
return
|
||
}
|
||
this.onPay(synthesis_diff_price_id, order_type, can, price)
|
||
},
|
||
// 差价支付
|
||
onPay(id, type, can, price){
|
||
this.orderId = id
|
||
this.orderType = type
|
||
this.price = price
|
||
// 仅支持线下打款
|
||
if(!can.online){
|
||
this.onToBankPay()
|
||
return
|
||
}
|
||
// 选择线上、下支付方式
|
||
uni.showActionSheet({
|
||
itemList: ['线上支付', '线下支付'],
|
||
success: sheetRes => {
|
||
if(sheetRes.tapIndex == 0){
|
||
this.$Router.push({
|
||
name: 'Pay',
|
||
params: {
|
||
paytype : 'synthesize',
|
||
orderId : id,
|
||
orderType : type.replace(/\\/g, '-')
|
||
},
|
||
})
|
||
return
|
||
}
|
||
this.onToBankPay()
|
||
}
|
||
})
|
||
},
|
||
// 去线下打款
|
||
onToBankPay(){
|
||
this.$Router.push({
|
||
name: 'BankPay',
|
||
params: {
|
||
orderId : this.orderId,
|
||
orderType : this.orderType.replace(/\\/g, '-'),
|
||
price : this.price
|
||
},
|
||
})
|
||
}
|
||
},
|
||
onReachBottom() {
|
||
this.pagesShow = true;
|
||
if(this.page.has_more){
|
||
this.page.current++
|
||
this.getList()
|
||
return
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.content{
|
||
background: #f8f8f8;
|
||
min-height: 100vh;
|
||
padding: 1rpx 0;
|
||
box-sizing: border-box;
|
||
}
|
||
// 页面空
|
||
.diff-null{
|
||
height: 40vh;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
// 差价列表
|
||
.diff-list{
|
||
padding: 0 30rpx;
|
||
.diff-title{ font-size: 30rpx; color: gray; line-height: 60rpx; margin-bottom: 20rpx; }
|
||
.diff-item{
|
||
background-color: white;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 30rpx;
|
||
.diff-info{
|
||
padding: 30rpx;
|
||
.diff-info-item{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
line-height: 60rpx;
|
||
font-size: 30rpx;
|
||
label{ color: gray; width: 200rpx; }
|
||
view{ text-align: right; width: calc(100% - 200rpx); }
|
||
}
|
||
}
|
||
.diff-state{
|
||
padding: 20rpx 30rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: flex-end;
|
||
&::after{ top: 0; }
|
||
.diff-btn{
|
||
border:solid 1rpx $main-color;
|
||
color: $main-color;
|
||
font-size: 30rpx;
|
||
line-height: 70rpx;
|
||
padding: 0 30rpx;
|
||
border-radius: 36rpx;
|
||
margin-left: 30rpx;
|
||
&.in{
|
||
background: $main-color;
|
||
color: white;
|
||
}
|
||
&.hide{
|
||
opacity: .7;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// 创建补差价
|
||
.diff-from{
|
||
background: white;
|
||
border-radius: 20rpx;
|
||
margin: 30rpx;
|
||
padding: 50rpx;
|
||
display: block;
|
||
label{ line-height: 70rpx; text-align: center; font-weight: bold; font-size: 30rpx; display: block; }
|
||
input{ text-align: center; font-size: 40rpx; height: 100rpx; @extend .border-solid; margin: 30rpx 0 50rpx; }
|
||
button{ background-color: $main-color; color: white; font-size: 32rpx; height: 90rpx; line-height: 90rpx; border-radius: 10rpx; }
|
||
}
|
||
</style>
|