Files
dou_fire/pages/synthesize/difference.vue
2023-05-23 17:20:12 +08:00

290 lines
7.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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>
<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" />
</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 } = obj
if(can.pay_status == 2 || can.pay_status == 4){
uni.showToast({
title: '补差价信息正在审核中',
icon : 'none'
})
return
}
if(can.pay_status == 3 || can.pay_status == 6){
uni.showModal({
title : '提示',
content : '驳回原因:' + remark,
showCancel : false,
success : res => {
if(res.confirm && can.pay_status == 3){
this.$Router.push({
name: 'BankPay',
params: {
payId : payId,
orderId : offline_pays.offline_pay_id,
orderType : order_type.replace(/\\/g, '-'),
price : price,
type : 'edit'
},
})
}
}
})
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-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>