You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
570 lines
14 KiB
570 lines
14 KiB
<template> |
|
<view class="oil_body"> |
|
<view class="oil_header">请选择分油类型</view> |
|
<view class="sele_car"> |
|
<view @tap="seleFn(1)" |
|
:style=" {zIndex: seleindex!=1? '1':'',transform:seleindex!=1? 'scale(0.9)':'',backgroundColor: seleindex!=1?'#66AFFF':''} " |
|
class="car_itme car_itme_left"> |
|
<view v-if="seleindex==1" style="width: 100%;" class="car_body"> |
|
<view class="car_itme_title"> |
|
接收方:个人 |
|
</view> |
|
<view class="img"> |
|
<view style="width: 79rpx; height: 81rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/cargs.png"></image> |
|
</view> |
|
<view style="width: 61rpx; height: 34rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/arrow.png"></image> |
|
</view> |
|
<view style="height: 81rpx;width: 73rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/carUser.png"></image> |
|
</view> |
|
</view> |
|
<view class="car_itme_title">企业对个人</view> |
|
</view> |
|
<view v-if="seleindex!=1" style="left: 0; position: absolute;" class="hideTip"> |
|
接收方:个人 |
|
<image style="height: 141rpx; width: 100rpx; margin-top: 31rpx;" src="@/static/carsz.png"></image> |
|
</view> |
|
</view> |
|
<view @tap="seleFn(2)" |
|
:style="{zIndex: seleindex!=2? '1':'',transform:seleindex!=2? 'scale(0.9)':'',backgroundColor: seleindex!=2?'#66AFFF':''}" |
|
class="car_itme car_itme_right"> |
|
<view v-if="seleindex==2" style="width: 100%;" class="car_body"> |
|
<view class="car_itme_title"> |
|
接收方:企业 |
|
</view> |
|
<view class="img"> |
|
<view style="width: 79rpx; height: 81rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/cargs.png"></image> |
|
</view> |
|
<view style="width: 61rpx; height: 34rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/arrow.png"></image> |
|
</view> |
|
<view style="width: 79rpx; height: 81rpx;"> |
|
<image style="width: 100%;height: 100%;" src="@/static/cargs.png"></image> |
|
</view> |
|
</view> |
|
<view class="car_itme_title">企业对企业</view> |
|
</view> |
|
<view v-if="seleindex!=2" style="right: 0; position: absolute;" class="hideTip"> |
|
接收方:企业 |
|
<image style="height: 141rpx; width: 100rpx; margin-top: 31rpx;" src="@/static/carsz.png"></image> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<view class="sele_Bar"> |
|
<view :style="{transform: barIndex==2? 'translateX( calc(100% - 20rpx) )' :'' ,background:barIndex==2? '#EC4645' :'' }" |
|
class="move_item"></view> |
|
<view @tap="seleBarFn(1)" :style="{color:barIndex==1? 'white' : ''}" class="sele_Bar_item">分油</view> |
|
<view @tap="seleBarFn(2)" :style="{color:barIndex==2? 'white' : ''}" class="sele_Bar_item">圈回</view> |
|
</view> |
|
<view class="oli_list"> |
|
<view @tap='jump(1)' class="oli_list_item"> |
|
<view class="oli_list_item_body"> |
|
<view class="oli_list_item_body_left"> |
|
<view class="oli_list_item_body_left_img"> |
|
<image style="width: 100%; height: 100%;" src="@/static/fyjt.png"></image> |
|
</view> |
|
<view style="font-size: 28rpx;color: #333333;"> |
|
<view v-if="sendData!=null"> |
|
<view>{{sendData.name}}</view> |
|
<view style="margin-top: 26rpx;color: #999999;">可用余额：¥{{ sendData.balance }}</view> |
|
</view> |
|
<view v-if="sendData==null">发起方</view> |
|
</view> |
|
</view> |
|
<view> |
|
<uni-icons type="right" size="20" color="#bbbbbb"></uni-icons> |
|
</view> |
|
</view> |
|
</view> |
|
<view @tap='jump(2)' class="oli_list_item"> |
|
<view class="oli_list_item_body"> |
|
<view class="oli_list_item_body_left"> |
|
<view class="oli_list_item_body_left_img"> |
|
<image style="width: 100%; height: 100%;" src="@/static/jsjt.png"></image> |
|
</view> |
|
<view style="font-size: 28rpx;color: #333333;"> |
|
<view style="font-size: 28rpx;color: #333333;"> |
|
<view v-if="receiveData!=null"> |
|
<view> |
|
{{receiveData.name?receiveData.name?receiveData.name:'未设置':receiveData.userName?receiveData.userName:'未设置'}} |
|
</view> |
|
<view style="margin-top: 26rpx;color: #999999;">可用余额：¥{{receiveData.balance }} |
|
</view> |
|
</view> |
|
<view v-if="receiveData==null">接收方</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view> |
|
<uni-icons type="right" size="20" color="#bbbbbb"></uni-icons> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="oilInput"> |
|
<text class="oliPrice" style=""> 金额 </text> |
|
<view |
|
style="flex: 1; background-color: #F1F1F1; margin-left: 23rpx; height: 74rpx;align-items: center; display: flex; padding: 0 33rpx ;"> |
|
<input @input="inputFn" type="digit" v-model="postData.disAmount" style="flex: 1; margin-left: 47rpx; " |
|
placeholder="请输入金额" /> |
|
<view |
|
@tap=' barIndex==2? postData.disAmount = receiveData.balance : postData.disAmount = sendData.balance' |
|
class="oilInputMax">MAX</view> |
|
</view> |
|
</view> |
|
<button @tap='postFn' :style="{background:barIndex==2? '#EC4645' :''}" |
|
class="oliButten">{{barIndex==2?'圈回':'分油'}}</button> |
|
|
|
<popup @confirmFn='confirmFn' @closeFn='closeFn' v-model="iShow.seting"> |
|
<view slot="coment"> |
|
<view class="tiptext"> 是否{{barIndex==2?'圈回':'分油'}}给该司机/企业?</view> |
|
</view> |
|
</popup> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import oilDistribution from '@/api/oilDistribution' |
|
import popup from '@/components/customPopup' |
|
export default { |
|
components: { |
|
popup |
|
}, |
|
data() { |
|
return { |
|
postData: { |
|
disCompanyId: '', |
|
disTagType: '', |
|
disType: '', |
|
customerId: '', |
|
companyId: '', |
|
disAmount: '' |
|
}, |
|
iShow: { |
|
seting: false |
|
}, |
|
sendData: null, |
|
receiveData: null, |
|
seleindex: 1, |
|
barIndex: 1, |
|
transition: { |
|
zIndex: '1', |
|
// height: '323rpx', |
|
// width: '397rpx', |
|
transform: "scale(0.9)", |
|
backgroundColor: '#66AFFF' |
|
} |
|
} |
|
}, |
|
onLoad() { |
|
let that = this |
|
uni.$on('driverfn', function(e) { |
|
console.log(e, '司机参数更新') |
|
that.receiveData = e |
|
that.postData.customerId = e.id |
|
that.postData.companyId = '' |
|
that.postData.disTagType = e.companyCustomerNature == 0 ? 'OUTSIDE' : 'ESELF_SUPPORT' |
|
}) |
|
uni.$on('company', function(e) { |
|
console.log(e.type, e) |
|
that.receiveData = null |
|
if (e.type == 'send') { |
|
that.sendData = e |
|
that.postData.disCompanyId = e.id |
|
} else if (e.type == 'receive') { |
|
that.receiveData = e |
|
that.postData.companyId = e.id |
|
that.postData.customerId = '' |
|
that.postData.disTagType = 'SUBCOMPANY' |
|
} |
|
console.log(e, '公司参数更新') |
|
}) |
|
}, |
|
methods: { |
|
inputFn(e) { |
|
// this.postData.disAmount = Number(this.postData.disAmount).toFixed(2) |
|
if (this.postData.disAmount.indexOf('.') != -1) { |
|
if (this.postData.disAmount.split('.')[1].length > 2) { |
|
uni.showToast({ |
|
title: '最多保留小数点后两位', |
|
icon: 'none' |
|
}) |
|
this.$nextTick(function() { |
|
this.postData.disAmount = Number(this.postData.disAmount).toFixed(2) |
|
console.log(this.postData.disAmount) |
|
}) |
|
} |
|
} |
|
}, |
|
confirmFn() { |
|
if (this.barIndex == 2) { |
|
if (Number(this.receiveData.balance) == 0) { |
|
uni.showToast({ |
|
title: '圈回对象账户不能为零', |
|
icon: "none" |
|
}) |
|
return |
|
} |
|
if (Number(this.postData.disAmount) > Number(this.receiveData.balance)) { |
|
uni.showToast({ |
|
title: '输入金额不能大于圈回对象总余额', |
|
icon: "none" |
|
}) |
|
return |
|
} |
|
} else { |
|
if (Number(this.postData.disAmount) > Number(this.sendData.balance)) { |
|
uni.showToast({ |
|
title: '输入金额不能大于总余额', |
|
icon: "none" |
|
}) |
|
return |
|
} |
|
if (Number(this.sendData.balance) == 0) { |
|
uni.showToast({ |
|
title: '转账方金额不能为零', |
|
icon: "none" |
|
}) |
|
return |
|
} |
|
} |
|
if (Number(this.postData.disAmount) == 0) { |
|
uni.showToast({ |
|
title: '操作金额不能为零', |
|
icon: "none" |
|
}) |
|
return |
|
} |
|
// if (this.seleindex == 2 && this.sendData.id == this.receiveData) { |
|
// uni.showToast({ |
|
// title: '双方账户不能重复', |
|
// icon: "none" |
|
// }) |
|
// return |
|
// } |
|
let that = this |
|
this.postData.disType = this.barIndex == 1 ? 1 : -1 |
|
console.log(this.postData) |
|
oilDistribution.oilDistributions(that.postData).then(res => { |
|
if (res.code !== 20000) return |
|
uni.showToast({ |
|
title: '操作成功', |
|
icon: 'none' |
|
}) |
|
this.iShow.seting = false |
|
setTimeout(() => { |
|
uni.redirectTo({ |
|
url: '../index/index' |
|
}) |
|
}, 500) |
|
}); |
|
}, |
|
closeFn() { |
|
this.iShow.seting = false |
|
console.log('取消') |
|
}, |
|
postFn() { |
|
if (this.sendData == null || this.receiveData == null) { |
|
return |
|
} |
|
if (this.postData.disAmount == '' || this.postData.disAmount == 0) { |
|
uni.showToast({ |
|
title: '金额不能为零', |
|
icon: 'none' |
|
}) |
|
return |
|
} |
|
this.iShow.seting = true |
|
}, |
|
jump(e) { |
|
switch (e) { |
|
case 1: |
|
// clc 写 clc 注 |
|
// uni.navigateTo({ |
|
// url: '/driverManagement/company/company?jsData=' + JSON.stringify({ |
|
// type:'send', |
|
// data:'' |
|
// }) |
|
// }) |
|
uni.navigateTo({ |
|
url: '../newSeleCompany/newSeleCompany?jsData=' + JSON.stringify({ |
|
type: 'send', |
|
data: '' |
|
}) |
|
}) |
|
break |
|
case 2: |
|
// uni.navigateTo({ |
|
// url: '../newSeleDirver/newSeleDirver' |
|
// }) |
|
if (this.sendData == null && this.seleindex == 1) { |
|
uni.showToast({ |
|
title: '请先选择企业', |
|
icon: 'none' |
|
}) |
|
return |
|
} |
|
if (this.seleindex == 1) { |
|
uni.navigateTo({ |
|
url: '../newSeleDirver/newSeleDirver?jsData=' + JSON.stringify(this.sendData), |
|
fail(e) { |
|
console.log(e) |
|
} |
|
}) |
|
// uni.navigateTo({ |
|
// url: '/driverManagement/seleDriver/seleDriver?jsData=' + JSON.stringify(this |
|
// .sendData) |
|
// }) |
|
} else { |
|
// console.log(this.sendData,'66666') |
|
// uni.navigateTo({ |
|
// url: '../newSeleCompany/newSeleCompany?jsData=' + JSON.stringify( |
|
// { |
|
// type:'receive', |
|
// id:this.sendData.id |
|
// }) |
|
// }) |
|
uni.navigateTo({ |
|
url: '../newSeleCompany/newSeleCompany?jsData=' + JSON.stringify({ |
|
type: 'receive', |
|
data: this.sendData |
|
}), |
|
fail(e) { |
|
console.log(e) |
|
} |
|
}) |
|
} |
|
break |
|
} |
|
}, |
|
seleBarFn(e) { |
|
this.barIndex = e |
|
}, |
|
seleFn(e) { |
|
this.seleindex = e |
|
this.postData.disAmount = '' |
|
this.receiveData = null |
|
|
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style> |
|
.tiptext { |
|
font-size: 32rpx; |
|
font-family: PingFang SC; |
|
font-weight: bold; |
|
color: #999999; |
|
text-align: center; |
|
margin: 64rpx 0; |
|
} |
|
|
|
.oliButten { |
|
margin-top: 48rpx; |
|
background: #2866FF; |
|
border-radius: 10rpx; |
|
font-size: 36rpx; |
|
font-family: PingFang SC; |
|
font-weight: 500; |
|
color: #FFFFFF; |
|
} |
|
|
|
.oilInputMax { |
|
background: #BBBBBB; |
|
border-radius: 21rpx; |
|
padding: 11rpx 17rpx; |
|
font-size: 28rpx; |
|
font-family: Source Han Sans CN; |
|
font-weight: 500; |
|
color: #FFFFFF; |
|
margin-left: 25rpx; |
|
|
|
} |
|
|
|
.oliPrice { |
|
font-size: 30rpx; |
|
font-family: PingFang SC; |
|
font-weight: bold; |
|
color: #000000; |
|
|
|
} |
|
|
|
.oilInput { |
|
height: 133rpx; |
|
background: #FFFFFF; |
|
border-radius: 20rpx; |
|
display: flex; |
|
padding: 0 20rpx; |
|
align-items: center; |
|
margin-top: 20rpx; |
|
} |
|
|
|
.car_itme_title { |
|
font-size: 32rpx; |
|
font-family: Source Han Sans CN; |
|
font-weight: 500; |
|
color: #FFFFFF; |
|
} |
|
|
|
.oli_list_item_body_left_img { |
|
width: 80rpx; |
|
height: 73rpx; |
|
margin-right: 33rpx; |
|
} |
|
|
|
.oli_list_item_body_left { |
|
display: flex; |
|
align-items: center; |
|
flex: 1; |
|
} |
|
|
|
.oli_list_item_body { |
|
border-bottom: 1px #F0F2FF solid; |
|
height: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
align-items: center; |
|
padding-left: 20rpx; |
|
/* padding: 20rpx 0; */ |
|
|
|
} |
|
|
|
.oli_list_item { |
|
flex: 1; |
|
padding: 0 20rpx; |
|
} |
|
|
|
.oli_list { |
|
height: 333rpx; |
|
background: #FFFFFF; |
|
border-radius: 20rpx; |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
.img { |
|
width: 100%; |
|
height: 81rpx; |
|
margin-top: 43rpx; |
|
margin-bottom: 30rpx; |
|
display: flex; |
|
justify-content: space-between; |
|
align-items: center; |
|
padding: 0 83rpx; |
|
} |
|
|
|
.car_body { |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
height: 100%; |
|
} |
|
|
|
.move_item { |
|
position: absolute; |
|
left: 10rpx; |
|
width: 50%; |
|
height: 60rpx; |
|
background: #2866FF; |
|
border-radius: 10rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
color: #999999; |
|
z-index: 0; |
|
transition: all .3s; |
|
} |
|
|
|
.sele_Bar_item { |
|
|
|
/* width: 287rpx; */ |
|
flex: 1; |
|
height: 60rpx; |
|
/* background: #2866FF; */ |
|
border-radius: 10rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
color: #999999; |
|
z-index: 1; |
|
transition: color .4s; |
|
} |
|
|
|
.sele_Bar { |
|
/* background-color: #18B566; */ |
|
margin: 31rpx 40rpx; |
|
padding: 10rpx; |
|
display: flex; |
|
position: relative; |
|
background-color: #FFFFFF; |
|
border-radius: 10px; |
|
} |
|
|
|
.hideTip { |
|
/* background-color: #E43D33; */ |
|
width: calc(100% - (882rpx - (100vw - 62rpx))); |
|
/* width: calc( 100vw - 62rpx - 441rpx ); */ |
|
height: 100%; |
|
padding: 29rpx 38rpx; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
|
|
.car_itme_right { |
|
right: 0; |
|
/* top:0; |
|
bottom: 0; |
|
margin: auto; */ |
|
} |
|
|
|
.car_itme_left { |
|
left: 0; |
|
/* top:0; |
|
bottom: 0; |
|
margin: auto; */ |
|
} |
|
|
|
.car_itme { |
|
/* opacity: .3; */ |
|
height: 359rpx; |
|
width: 441rpx; |
|
border-radius: 20rpx; |
|
overflow: hidden; |
|
position: absolute; |
|
/* transition: width .4s,height .4s ,background .4s,z-index 0s ; */ |
|
transition: transform .4s, background .8s; |
|
z-index: 2; |
|
background-color: #2866FF; |
|
box-shadow: 0px 3px 9px 0px rgba(88, 88, 88, 0.2); |
|
color: white; |
|
display: flex; |
|
justify-content: center; |
|
} |
|
|
|
.sele_car { |
|
margin-top: 25rpx; |
|
display: flex; |
|
flex-wrap: wrap; |
|
position: relative; |
|
height: 359rpx; |
|
} |
|
|
|
.oil_body { |
|
padding: 42rpx 31rpx; |
|
} |
|
|
|
.oil_header { |
|
font-size: 34rpx; |
|
font-family: PingFang SC; |
|
font-weight: bold; |
|
color: #333333; |
|
} |
|
</style>
|
|
|