caoliancun/wx_oms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

第一次提交

Browse Source
This commit is contained in:
caolc
2023-03-14 15:39:40 +08:00
parent d659190a9e
commit 0708de8d86
354 changed files with 15675 additions and 2683 deletions
Download Patch File Download Diff File Expand all files Collapse all files

593
oilAccount/page/companyRecharge/add.vue Normal file
View File

@@ -0,0 +1,593 @@
<template>
<!-- 布局 flex 组件 view -->
<view class="addDiver_body">
<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="addDiver_card">
<uni-list :border="false">
<uni-list-item @click="isShowFn('companyAccount')" link>
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
企业打款账户
</view>
<view slot="body" class="list_right list_nosele textOverflow">
{{postData.paymentCompanyIds[0]? companyAccountData.filter(item=>item.value== postData.paymentCompanyIds[0])[0].label :'请选择企业打款账户'}}
</view>
</uni-list-item>
<uni-list-item @click="isShowFn('companyAccountBank')" link>
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
企业打款银行
</view>
<view slot="body" class="list_right list_nosele textOverflow">
{{postData.paymentCompanyIds[1]? companyAccountBankData.filter(item=>item.value== postData.paymentCompanyIds[1])[0].label :'请选择企业打款银行'}}
</view>
</uni-list-item>
</uni-list>
</view>
<view class="addDiver_card">
<uni-list :border="false">
<uni-list-item @click="isShow.picker=true" link >
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
油站公司
</view>
<view slot="body" class="list_right list_nosele textOverflow">
{{postData.companyName?postData.companyName :'请选择油站公司'}}
</view>
</uni-list-item>
<uni-list-item @click="isShowFn('oilCompanyBank')" link >
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
油站公司银行
</view>
<view slot="body" class="list_right list_nosele textOverflow">
{{postData.bankCardName?postData.bankCardName :'请选择油站公司银行'}}
</view>
</uni-list-item>
</uni-list>
</view>
<view class="addDiver_card">
<uni-list :border="false">
<uni-list-item>
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
交易金额
</view>
<view style="padding-right: 16px !important;" slot="body" class="list_right">
<input type="digit" @input="inputFn('transactionAmount')" v-model="postData.transactionAmount" placeholder="请输入交易金额"
class="list_right_input" />
</view>
</uni-list-item>
</uni-list>
</view>
<!-- 卡片 -->
<view class="addDiver_card">
<view class="summary">
<view class="list_header" style="margin-bottom: 12px;">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
交易摘要
</view>
<uni-easyinput :autoHeight="true" type="textarea" v-model="postData.reverseRemark" placeholder="请输入交易摘要"></uni-easyinput>
</view>
</view>
<view class="addDiver_card">
<uni-list :border="false">
<uni-list-item link>
<view class="list_header" slot="header">交易凭证</view>
<view @click="clickfn" slot="body" :style="{color:postData.offlineTransactionProof?'#333333':''}"
class="list_right list_nosele">
{{postData.offlineTransactionProof?'已上传':'请上传'}}
</view>
</uni-list-item>
</uni-list>
</view>
<!-- 卡片 -->
<view v-if="barIndex==2" class="addDiver_card">
<uni-list :border="false">
<uni-list-item >
<view class="list_header" slot="header">
<image src="@/static/bt.png" style="width: 12rpx;position: absolute;left: 0;" mode="widthFix">
</image>
操作码
</view>
<view style="padding-right: 16px !important;" slot="body" class="list_right">
<input v-model="postData.operationCode" placeholder="请输入操作码" class="list_right_input" />
<!-- <text style="color: #007AFF;" v-if="!countdown" @click="getCode">获取操作码</text>
<text v-else >
{{`${postData.operationCode } `}}
<text class="codeTip">{{`${countdown}秒后失效`}}</text>
</text> -->
</view>
</uni-list-item>
</uni-list>
</view>
<view v-if="barIndex==2" class="cue">
请向财务或技术部门索取操作码。<br />
注意：操作码时间有限，超过时间，请重新获取
</view>
<!-- 底部按钮 -->
<view class="list_footer">
<button @tap="postFn" class="list_butten ">保存</button>
</view>
<!-- 企业打款账户选择器 -->
<u-select v-model="isShow.companyAccount" :list="companyAccountData" @confirm="companyAccountConfirm">
</u-select>
<!-- 企业打款银行选择器 -->
<u-select v-model="isShow.companyAccountBank" :list="companyAccountBankData" @confirm="companyAccountBankConfirm"></u-select>
<!-- 油站公司选择器 -->
<cpicker ref ='cpicker' @localSeach='localSeach' @chargeChange='chargeChange' v-model="isShow.picker" />
<u-select v-model="isShow.oilCompanyBank" :list="oilCompanyBankData" @confirm="oilCompanyBankConfirm">
</u-select>
</view>
</template>
<script>
import tool from '@/utils/tool'
import account from '@/api/oilAccount'
import md5 from 'js-md5'
import cpicker from '../../components/picker.vue'
export default {
components: {
cpicker
},
data() {
return {
barIndex:1,
countdown:0,
companyAccountData: [],
companyAccountBankData: [],
oilCompanyData: [],
oilCompanyBankData: [],
isShow: {
picker: false,
companyAccount: false,
companyAccountBank: false,
oilCompanyBank: false
},
timer:null,
disabled: false,
postData: {
companyName:'',
offlineTransactionProof:'',//凭证
bankCardName: "", //银行卡账户名
bankCardNo: "", //银行卡号
bankDeposit: "", //开户所属银行
bankName: "", //开户行银行名称
companyId: "", //公司ID
createSource: "OMS-MINIAPP",
interBankCode: null, //联行号
operationCode: "", //操作码
paymentCompanyIds: [], //付款银行信息ID（内部银行信息ID）
reverseRemark: "", //交易摘要
transactionAmount: "", //交易金额
// 交易类型
// RECHARGE：充值
// RECHARGE_REBETE：充值返利
// CONSUME_REBATE: 消费返利
// TURN 圈回(暂无)
transactionType: "RECHARGE"
}
}
},
created() {
this.init()
},
onLoad() {},
onUnload() {
(!this.timer)&&clearInterval(this.timer);
},
methods: {
seleBarFn(e) {
this.barIndex = e
},
localSeach(e){
account.getLikeBySiteComNameNew({companyName:e}).then(res=>{
this.$refs.cpicker.upDateList(res.data)
})
console.log('seach')
},
countdownFn(e){
this.countdown = e
this.timer = setInterval(()=>{
if(!this.countdown){
clearInterval(this.timer);
this.timer = null;
this.operationCode = ''
}else{
this.countdown-=1
}
},1000)
},
getCode(){
account.getRechargeCode({type:3}).then(res=>{
(res.code==20000)&&(this.postData.operationCode = res.data.code);
this.countdownFn(60)
})
},
isShowFn(e){
switch(e){
case 'companyAccount':
this.isShow[e] = !this.isShow[e]
break
case 'companyAccountBank':
if(this.postData.paymentCompanyIds.length!==0){
this.isShow[e] = !this.isShow[e]
}else{
uni.showToast({
title:'请先选择企业打款账户',
icon:'none'
})
return
}
break
case 'oilCompanyBank':
if(this.postData.companyName&&this.postData.companyId){
this.isShow[e] = !this.isShow[e]
}else{
uni.showToast({
title:'请先选择油站公司',
icon:'none'
})
return
}
break
}
},
//图片上传方法
clickfn(e) {
if (typeof e !== "object") {
this.postData.offlineTransactionProof = e;
uni.showToast({
title: '上传成功'
})
return
}
tool.chooseImage(this.clickfn)
},
oilCompanyBankConfirm(e) {
let a = this.oilCompanyBankData.filter(item => item.value == e[0].value);
(a.length)&&({
bankCardName:this.postData.bankCardName,
bankCardNo:this.postData.bankCardNo,
bankDeposit:this.postData.bankDeposit,
bankName:this.postData.bankName,
interBankCode:this.postData.interBankCode
}=a[0]);
console.log(a,'11111')
},
//企业打款银行回调
companyAccountBankConfirm(e) {
let a = this.companyAccountBankData.filter(item => item.value == e[0].value);
(a.length)&&(this.postData.paymentCompanyIds.push(a[0].value))
console.log(this.postData.paymentCompanyIds,this.companyAccountBankData,'companyAccountBankConfirm');
},
// 企业打款账户回调
companyAccountConfirm(e) {
this.companyAccountBankData = [];
this.postData.paymentCompanyIds = [];
let a = this.companyAccountData.filter(item => item.value == e[0].value);
(a.length) && (this.companyAccountBankData = a[0].children)&&this.postData.paymentCompanyIds.push(a[0].value);
console.log(this.postData.paymentCompanyIds,this.companyAccountBankData,'companyAccountConfirm');
},
//油站公司选择器回调
chargeChange(e) {
if (e) {
this.oilCompanyBankData = [];
this.clearFn(this.postData,['bankCardName','bankCardNo','bankDeposit','bankName','interBankCode']);
this.postData.companyId = e['id'];
this.postData.companyName = e['companyName']
account.getBySiteCompanyId(e.id).then(res => {
(res.code == 20000) && (this.oilCompanyBankData = res.data);
(this.oilCompanyBankData.length) && (this.oilCompanyBankData.forEach(item => {
item['value'] = item.bankCardNo;
item['label'] = item.bankCardName + `(${item.bankCardNo})`;
}));
})
}
},
clearFn(e,w){
if(e&&w){
w.forEach(item=>{e[item]=''})
}
},
init() {
this.getAccounts()
},
getAccounts() {
account.getCascaderList().then(res => {
if (res.code == 20000) {
this.companyAccountData = res.data
}
})
},
confirm(e) {
console.log('confirm', e)
},
inputFn(e) {
console.log(e)
if(this.postData[e].indexOf('.')!=-1){
if(this.postData[e].split('.')[1].length>2){
uni.showToast({
title:'最多保留小数点后两位',
icon:'none'
})
this.$nextTick(function(){
this.postData[e] = Number(this.postData[e]).toFixed(2)
})
}
}
},
postFn() {
let that = this
let olicheck = null
let check = null
let checkPage = {
paymentCompanyIds: {
tacitly: '',
minLength: 2,
WrongText: '请完善企业打款信息'
},
companyName:{
tacitly:'',
WrongText:'请完善油站公司信息'
},
companyId:{
tacitly:'',
WrongText:'请完善油站公司信息'
},
bankCardName:{
tacitly:'',
WrongText:'请完善油站公司信息'
},
transactionAmount:{
tacitly:'',
WrongText:'交易金额不能为空'
},
reverseRemark:{
tacitly:'',
WrongText:'交易摘要不能为空'
},
operationCode:{
tacitly:'',
WrongText:'操作码不能为空'
},
};
(this.barIndex==1)&&(delete checkPage.operationCode);
check = tool.checkFn(this.postData, [], checkPage)
if (!check.result) {
uni.showToast({
title: check.WrongText,
icon: 'none'
})
return
}
this.saveFn()
},
saveFn(){
let data = JSON.parse(JSON.stringify(this.postData));
(this.barIndex==1)&&(delete data.operationCode);
account.save(data).then(res=>{
(res.code==20000)&& uni.showToast({
title: '操作成功',
icon: 'none'
})&&(setTimeout(()=>{uni.navigateBack()},500))
})
},
open() {
this.show = !this.show
},
change() {
this.aboutEnterprise.shareCompanyQuota = this.switchOpen ? 1 : 0
console.log(this.switchOpen)
},
radioChange(e) {
console.log(e)
},
}
}
</script>
<style scoped>
.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;
}
.codeTip{
color: #007AFF;
font-size: 20rpx;
}
.textOverflow{
overflow: hidden;/*超出部分隐藏*/
white-space: nowrap;/*不换行*/
text-overflow:ellipsis;/*超出部分文字以...显示*/
}
>>>.uni-easyinput__content {
border-radius: 15px !important;
margin-top: 15rpx;
}
</style>
<style lang="scss">
.cue {
color: #666666;
font-size: 24rpx;
margin-top: 20rpx;
}
.summary {
padding: 12px 0;
}
.clear {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #BBBBBB;
display: flex;
align-items: center;
}
.yuan {
font-size: 28rpx;
margin-left: 10rpx;
}
.popup_body {
padding: 20rpx;
}
.list_right_input {
font-size: 28rpx;
}
.list_footer {
padding-bottom: 57rpx;
margin-top: 57rpx;
}
.list_butten {
// height: 100rpx;
background: #2866FF;
border-radius: 10rpx;
color: #FFFFFF;
font-size: 36pxr;
}
.fg {
.uni-list-item__container {
padding-bottom: 0px !important;
}
}
.list_nosele {
font-size: 28rpx;
font-family: PingFang SC;
color: #999999;
}
.uni-icon-wrapper {
padding: 0px !important;
}
.uni-list-item__container {
padding: 12px 0 !important;
}
.tiao {
width: 8rpx;
height: 34rpx;
background: #2866FF;
}
.card_title_text {
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
margin-left: 10rpx;
}
.card_title {
display: flex;
border-bottom: 1px solid #F0F0F0;
align-items: center;
padding-bottom: 17rpx;
height: 86rpx;
}
.list_header {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
display: flex;
align-items: center;
padding-left: 16px;
position: relative;
height: fit-content;
}
.list_right_input {
width: 100%;
color: #333333;
text-align: end !important;
font-size: 28rpx;
text-align: right !important;
padding-left: 90rpx;
box-sizing: border-box;
}
.list_right {
flex: 1;
// display: flex;
// justify-content: flex-end;
text-align: end;
overflow: hidden;
box-sizing: border-box;
padding-left: 20rpx;
}
.addDiver_body {
padding: 0 40rpx;
}
.addDiver_card {
background: #FFFFFF;
box-shadow: 0px 3px 9px 0px rgba(88, 88, 88, 0.2);
border-radius: 20rpx;
margin-top: 38rpx;
overflow: hidden;
/* padding-top: 19rpx; */
padding: 0rpx 20rpx 0 20rpx;
box-sizing: border-box;
}
</style>