parent
ae0fa499c6
commit
40b141b041
@ -0,0 +1,66 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<!-- 菜单功能 --> |
||||||
|
<view class="backcor6 all-container pd-main" > |
||||||
|
<view class="funcss" v-for="(item,index) in funcList" :key="index" @click="jumpdesfun(item)"> |
||||||
|
<image :src="item.img" mode="widthFix" class="funicon"></image> |
||||||
|
<view class="width100 font14 mart5">{{item.title}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data(){ |
||||||
|
return{ |
||||||
|
funcList:[ |
||||||
|
{ |
||||||
|
title: '申请分期', |
||||||
|
url: './applyPeriod', |
||||||
|
img: '/static/img/home4.png' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: '贴息列表', |
||||||
|
url: './feePaidList', |
||||||
|
img: '/static/img/home4.png' |
||||||
|
} |
||||||
|
|
||||||
|
], |
||||||
|
merNo:'' |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(option){ |
||||||
|
this.merNo = option.merNo; |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
/** |
||||||
|
* 跳转功能 |
||||||
|
*/ |
||||||
|
jumpdesfun(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: item.url+"?merNo="+this.merNo |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
// 菜单 |
||||||
|
.funcss { |
||||||
|
width: 33%; |
||||||
|
height: 100px; |
||||||
|
border-right: 1px solid #e8e8e8; |
||||||
|
border-bottom: 1px solid #e8e8e8; |
||||||
|
background-color: #FFFFFF; |
||||||
|
text-align: center; |
||||||
|
display: inline-block; |
||||||
|
|
||||||
|
.funicon { |
||||||
|
width: 35px; |
||||||
|
padding-top: 15px; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,554 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<!-- tabs栏 --> |
||||||
|
<view class=" mart10 marb20 alijus" v-if="showItem"> |
||||||
|
<view class="font16 fcor333 paddtop5 paddbotm5 margle20 marRight20" |
||||||
|
v-for="(item,index) in listData" @click="switchid(index)" |
||||||
|
:class="[showItem.platformType == item.platformType ? 'fcor089 borbtom fontwig6' : ' borb ']" |
||||||
|
:key="index"> |
||||||
|
{{item.platformTypeName}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width100 line1"></view> |
||||||
|
|
||||||
|
|
||||||
|
<view class="form-gorup backcorfff font15" style="padding-bottom: 60px;" v-if="showItem"> |
||||||
|
|
||||||
|
<!-- 开通银联分期 --> |
||||||
|
<view class="dis-flex pd-main bor-botm1 flex-sp"> |
||||||
|
<view class=" fontwig6 flex-s0">开通银联分期: |
||||||
|
</view> |
||||||
|
<switch disabled :checked="periodData.openUnionpay" @change="switch1Change" /> |
||||||
|
</view> |
||||||
|
<!-- 银联贴息方式，可多选 --> |
||||||
|
<view class=" pd-main bor-botm1 "> |
||||||
|
<view class=" fontwig6 marb10 ">银联贴息方式(可多选): |
||||||
|
</view> |
||||||
|
<checkbox-group @change="checkBoxChange"> |
||||||
|
<view class="dis-flex flex-sp flex-wrap"> |
||||||
|
<label v-for="(item,index) in unionpayFeePaidList" class=" marb5"> |
||||||
|
<checkbox :value="item.id+''" :checked="item.isSelect" :disabled="!isShowMethodToUpdate" />{{item.name}} |
||||||
|
</label> |
||||||
|
</view> |
||||||
|
</checkbox-group> |
||||||
|
</view> |
||||||
|
<!-- 银联分期费率 --> |
||||||
|
<view class=" pd-main bor-botm1 "> |
||||||
|
<view class=" fontwig6 marb10 ">银联分期费率(1类银行):<text class="fn">范围(0~20)</text> |
||||||
|
</view> |
||||||
|
<view class="dis-flex flex-center marb10" v-for="(item,index) in periodData.unionpayRate1" :key="index"> |
||||||
|
<view class="paddtright10">{{item.periodNum}}期</view> |
||||||
|
<input type="number" v-model.trim="item.rate" :disabled="!isShowMethodToUpdate" placeholder-class="corf6 font15" |
||||||
|
placeholder="请输入费率"> |
||||||
|
<!-- <view v-else class="corf6 font15 rate">{{item.rate}}</view> --> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class=" pd-main bor-botm1 "> |
||||||
|
<view class=" fontwig6 marb10 ">银联分期费率(2类银行):<text class="fn">范围(0~20)</text> |
||||||
|
</view> |
||||||
|
<view class="dis-flex flex-center marb10" v-for="(item,index) in periodData.unionpayRate2" :key="index"> |
||||||
|
<view class=" paddtright10">{{item.periodNum}}期</view> |
||||||
|
|
||||||
|
<input type="number" v-model.trim="item.rate" :disabled="!isShowMethodToUpdate" placeholder-class="corf6 font15" |
||||||
|
placeholder="请输入费率"> |
||||||
|
<!-- <view v-else class="corf6 font15 rate">{{item.rate}}</view> --> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- 协议图片 --> |
||||||
|
<view class=" pd-main bor-botm1 "> |
||||||
|
<view class="dis-flex"> |
||||||
|
<view class=" fontwig6 marb10 ">协议照片:</view> |
||||||
|
<view class="flex-1"> |
||||||
|
<view class="dis-flex flex-center"><image class="iconw40 height40p marRight10" mode="aspectFill" v-for="(item,index) in imgExampleValue" :key="index" :src="imgUrl+item" @click="previewImage(index,imgExampleValue)"></image></view> |
||||||
|
<view class="corf6 font13 fotct">(示例照片)</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="imageUploadContainer flex-1"> |
||||||
|
<view class="imageUploadList"> |
||||||
|
<template v-if="periodData.agreementPics!=''"> |
||||||
|
<view class="imageItem" v-for="(item,index) in imgValue" :key="index"> |
||||||
|
<image :src="imgUrl+item" mode="aspectFill" @click="previewImage(index,imgValue)" |
||||||
|
:data-index="index"></image> |
||||||
|
<view v-if="isShowMethodToUpdate" class="imageDel" @click="deleteImage(item)">x</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
<view v-if="isShowMethodToUpdate" class="imageUpload" @click="upload">+</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="footer-btn" v-if="isShowMethodToUpdate" > |
||||||
|
<button class="backcor89 fcorfff" @click="apply">保存</button> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getDictionaryByCodeType, |
||||||
|
apply, |
||||||
|
getMerPlatformPeriodDetail, |
||||||
|
|
||||||
|
updateFeePaid, |
||||||
|
} from '@/Utils/Api.js'; |
||||||
|
|
||||||
|
let app = getApp(); |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
reqUrl: app.globalData.url, //请求地址 |
||||||
|
imgUrl: app.globalData.imgUrl, //图片访问地址 |
||||||
|
merNo: '', //商户号 |
||||||
|
platformPeriodIndex: 0,//平台类型下标 |
||||||
|
listData:[], |
||||||
|
showItem:null, |
||||||
|
|
||||||
|
periodData: { |
||||||
|
merNo: '', //商户号 |
||||||
|
platformPeriodType: '', //平台类型 1：零零购 |
||||||
|
openUnionpay: true, //开通银联分期 true：是 false：否 |
||||||
|
unionpayFeePaid: '', // 银联贴息方式 ‘1,2,3’ |
||||||
|
unionpayRate1: [], //银联分期费率（1类银行） |
||||||
|
unionpayRate2: [], //银联分期费率（2类银行） |
||||||
|
agreementPics: '', // 协议照片（多张） |
||||||
|
}, |
||||||
|
periodNumList:[],//分期数列表 |
||||||
|
|
||||||
|
|
||||||
|
unionpayFeePaidList: [ //支持多选 |
||||||
|
{ |
||||||
|
id: 1, |
||||||
|
name: '商户贴息', |
||||||
|
isSelect: false |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 2, |
||||||
|
name: '用户贴息', |
||||||
|
isSelect: false |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 3, |
||||||
|
name: '商户用户各一半', |
||||||
|
isSelect: false |
||||||
|
}, |
||||||
|
], |
||||||
|
imgValue: [], //协议照片 |
||||||
|
imgExampleValue: ["/merchant/62/1694595101306.jpeg", "/merchant/62/1694595101306.jpeg"], //协议示例照片 |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(option) { |
||||||
|
this.merNo = option.merNo; |
||||||
|
this.periodData.merNo = option.merNo; |
||||||
|
|
||||||
|
this.getDictionaryByCodeType(); //查询分期树 |
||||||
|
|
||||||
|
}, |
||||||
|
computed:{ |
||||||
|
/* 是否展示提供修改的按钮 */ |
||||||
|
isShowMethodToUpdate(){ |
||||||
|
if(this.showItem){ |
||||||
|
return !this.showItem.platformPeriod||(this.showItem.platformPeriod&&this.showItem.platformPeriod.status==3) |
||||||
|
}else{ |
||||||
|
return false |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
/* 平台类型change切换 */ |
||||||
|
switchid(index) { |
||||||
|
this.platformPeriodIndex = index; |
||||||
|
this.showItem = this.listData[this.platformPeriodIndex]; |
||||||
|
this.periodData.platformPeriodType = this.showItem.platformType; |
||||||
|
|
||||||
|
if(this.showItem.platformPeriod){ |
||||||
|
this.periodData.openUnionpay = this.showItem.platformPeriod.openUnionpay; |
||||||
|
this.periodData.unionpayFeePaid = this.showItem.platformPeriod.unionpayFeePaid; |
||||||
|
this.periodData.unionpayRate1 =this.handleUnionpayRate(this.showItem.unionpayRate1); |
||||||
|
this.periodData.unionpayRate2 = this.handleUnionpayRate(this.showItem.unionpayRate2); |
||||||
|
this.periodData.agreementPics = this.showItem.platformPeriod.agreementPics; |
||||||
|
this.imgValue =this.periodData.agreementPics.split(','); |
||||||
|
}else{ |
||||||
|
this.periodData.openUnionpay = true; |
||||||
|
this.periodData.unionpayFeePaid = ""; |
||||||
|
this.periodData.unionpayRate1 = this.handleUnionpayRate(this.periodNumList); |
||||||
|
this.periodData.unionpayRate2 =this.handleUnionpayRate(this.periodNumList); |
||||||
|
this.periodData.agreementPics = ""; |
||||||
|
this.imgValue =[]; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
let arr = this.periodData.unionpayFeePaid.split(","); |
||||||
|
this.unionpayFeePaidList.forEach(item => { |
||||||
|
item.isSelect = false; |
||||||
|
arr.forEach(item2 => { |
||||||
|
if (item.id == item2) { |
||||||
|
item.isSelect = true; |
||||||
|
} |
||||||
|
}) |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
handleUnionpayRate(arr){ |
||||||
|
let result = arr.map((item)=>{ |
||||||
|
let rate = item.rate===''? '' : item.rate ; |
||||||
|
return {"periodNum": item.periodNum,"rate":rate}; |
||||||
|
}) |
||||||
|
return result |
||||||
|
}, |
||||||
|
/* 开通银联分期切换 */ |
||||||
|
switch1Change(e) { |
||||||
|
this.periodData.openUnionpay = e.detail.value; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
/* 贴息方式change */ |
||||||
|
checkBoxChange(e) { |
||||||
|
let selectArr = e.detail.value; |
||||||
|
this.periodData.unionpayFeePaid = selectArr.join(','); |
||||||
|
}, |
||||||
|
/* 点击申请分期 */ |
||||||
|
apply() { |
||||||
|
if (!this.isVertify()) return; |
||||||
|
|
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中', |
||||||
|
mask: true |
||||||
|
}) |
||||||
|
apply(this.periodData).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_data, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
this.getMerPlatformPeriodDetail(false) |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
}, |
||||||
|
isVertify() { |
||||||
|
if (this.periodData.platformPeriodType === '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请选择平台类型', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return false |
||||||
|
} |
||||||
|
if (this.periodData.unionpayFeePaid === '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请选择银联贴息方式', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return false |
||||||
|
} |
||||||
|
|
||||||
|
var reg = /^(([0-9]|[1][0-9])([.][0-9]{1,2})|([0-9]|1[0-9]|20))$/; |
||||||
|
|
||||||
|
let unionpayRate1Bool = this.periodData.unionpayRate1.every((item) => { |
||||||
|
if (!reg.test(item.rate)) { |
||||||
|
item.rate = '' |
||||||
|
} |
||||||
|
return reg.test(item.rate) |
||||||
|
}) |
||||||
|
let unionpayRate2Bool = this.periodData.unionpayRate2.every((item) => { |
||||||
|
|
||||||
|
if (!reg.test(item.rate)) { |
||||||
|
item.rate = '' |
||||||
|
} |
||||||
|
|
||||||
|
return reg.test(item.rate) |
||||||
|
}) |
||||||
|
if (!unionpayRate1Bool) { |
||||||
|
uni.showToast({ |
||||||
|
title: '银联分期费率(1类银行)费率未填写完整', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return false |
||||||
|
} |
||||||
|
if (!unionpayRate2Bool) { |
||||||
|
uni.showToast({ |
||||||
|
title: '银联分期费率(2类银行)费率未填写完整', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return false |
||||||
|
} |
||||||
|
|
||||||
|
if (this.imgValue.length == 0) { |
||||||
|
uni.showToast({ |
||||||
|
title: '请上传协议照片', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return false |
||||||
|
} else { |
||||||
|
this.periodData.agreementPics = this.imgValue.join(","); |
||||||
|
} |
||||||
|
|
||||||
|
return true; |
||||||
|
}, |
||||||
|
|
||||||
|
/* 查询分期详情 */ |
||||||
|
getMerPlatformPeriodDetail(bool=true) { |
||||||
|
let params = { |
||||||
|
merNo: this.merNo |
||||||
|
} |
||||||
|
if(bool){ |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中', |
||||||
|
mask: true |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
getMerPlatformPeriodDetail(params).then(res => { |
||||||
|
if(bool){ |
||||||
|
uni.hideLoading(); |
||||||
|
} |
||||||
|
|
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.listData = res.return_data; |
||||||
|
if(this.listData.length>0){ |
||||||
|
this.switchid(this.platformPeriodIndex); |
||||||
|
} |
||||||
|
|
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
/* 查询分期数 */ |
||||||
|
getDictionaryByCodeType() { |
||||||
|
let params = { |
||||||
|
codeType: 'PERIOD_NUMBER' |
||||||
|
} |
||||||
|
getDictionaryByCodeType(params).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
res.return_data.sort((item1, item2) => { |
||||||
|
return item1.codeValue - item2.codeValue |
||||||
|
}) |
||||||
|
//分期列表 |
||||||
|
this.periodNumList = res.return_data.map(item=>{ |
||||||
|
return {"periodNum": item.codeValue,"rate": ""}; |
||||||
|
}); |
||||||
|
|
||||||
|
this.getMerPlatformPeriodDetail(); //查询分期详情 |
||||||
|
|
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
//上传图片 |
||||||
|
upload() { |
||||||
|
let that = this; |
||||||
|
uni.chooseImage({ |
||||||
|
count: 1, |
||||||
|
sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有 |
||||||
|
sourceType: ['camera', 'album'], |
||||||
|
success: function(res) { |
||||||
|
const tempFilePaths = res.tempFilePaths; |
||||||
|
that.uploadFile(tempFilePaths[0]); |
||||||
|
}, |
||||||
|
error: function(e) { |
||||||
|
console.log(e); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
//上传 |
||||||
|
uploadFile(imgURL) { |
||||||
|
const that = this; |
||||||
|
uni.showLoading({ |
||||||
|
title: "加载中...", |
||||||
|
mask: true, |
||||||
|
}) |
||||||
|
uni.uploadFile({ |
||||||
|
url: that.reqUrl + '/fileUpload/uploadfile', |
||||||
|
filePath: imgURL, |
||||||
|
header: { |
||||||
|
"Authorization": app.globalData.token |
||||||
|
}, |
||||||
|
name: 'files', |
||||||
|
success: function(uploadFileRes) { |
||||||
|
uni.hideLoading() |
||||||
|
that.getImgSignedUrl(JSON.parse(uploadFileRes.data).return_data[0]); |
||||||
|
}, |
||||||
|
fail: function(err) { |
||||||
|
uni.hideLoading() |
||||||
|
uni.showToast({ |
||||||
|
title: err, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
//查看临时图片路径 |
||||||
|
getImgSignedUrl(item1) { |
||||||
|
this.imgValue.push(item1); |
||||||
|
}, |
||||||
|
// 删除图片 |
||||||
|
deleteImage(data) { |
||||||
|
let arr = this.imgValue.filter((item) => item != data); |
||||||
|
this.imgValue = arr; |
||||||
|
}, |
||||||
|
// 预览 |
||||||
|
previewImage(index,list) { |
||||||
|
let arr = list.map(item=>{ |
||||||
|
return this.imgUrl+item |
||||||
|
}) |
||||||
|
uni.previewImage({ |
||||||
|
current: index, |
||||||
|
indicator: "number", |
||||||
|
loop: "true", |
||||||
|
urls:arr |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.borbtom { |
||||||
|
border-bottom: 3px solid #089bf5; |
||||||
|
} |
||||||
|
|
||||||
|
.borb { |
||||||
|
border-bottom: 3px solid transparent; |
||||||
|
} |
||||||
|
|
||||||
|
i { |
||||||
|
border: solid #000000; |
||||||
|
border-width: 0 2px 2px 0; |
||||||
|
display: inline-block; |
||||||
|
padding: 4px; |
||||||
|
margin-left: 10px; |
||||||
|
vertical-align: 3px; |
||||||
|
} |
||||||
|
|
||||||
|
.fn { |
||||||
|
font-weight: normal; |
||||||
|
} |
||||||
|
|
||||||
|
.down { |
||||||
|
-webkit-transform: rotate(45deg); |
||||||
|
} |
||||||
|
|
||||||
|
/* 表单 */ |
||||||
|
.form-gorup { |
||||||
|
padding: 20rpx; |
||||||
|
margin-bottom: 20rpx; |
||||||
|
border-radius: 20rpx; |
||||||
|
|
||||||
|
input,.rate { |
||||||
|
height: 20px; |
||||||
|
line-height: 20px; |
||||||
|
border-radius: 10px; |
||||||
|
border: 1px solid #089bf5; |
||||||
|
padding: 5px 5px; |
||||||
|
width:50%; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.flex-wrap { |
||||||
|
flex-wrap: wrap; |
||||||
|
} |
||||||
|
|
||||||
|
/* 底部按钮 */ |
||||||
|
.footer-btn { |
||||||
|
position: fixed; |
||||||
|
bottom: 0; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
z-index: 99; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
button { |
||||||
|
margin: 0 20px; |
||||||
|
border-radius: 25px; |
||||||
|
flex: 1; |
||||||
|
height: 50px; |
||||||
|
line-height: 50px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
/* 上传图片 */ |
||||||
|
/* 图片 */ |
||||||
|
.imageUploadContainer { |
||||||
|
padding: 10upx 5upx; |
||||||
|
margin: 10upx 5upx; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.imageUploadList { |
||||||
|
display: flex; |
||||||
|
flex-wrap: wrap; |
||||||
|
} |
||||||
|
|
||||||
|
.imageItem, |
||||||
|
.imageUpload { |
||||||
|
width: 200upx; |
||||||
|
height: 200upx; |
||||||
|
margin: 30upx 15upx 30upx; |
||||||
|
} |
||||||
|
|
||||||
|
.imageDel { |
||||||
|
position: relative; |
||||||
|
left: 180upx; |
||||||
|
bottom: 225upx; |
||||||
|
background-color: rgba(0, 0, 0, 0.5); |
||||||
|
width: 36upx; |
||||||
|
text-align: center; |
||||||
|
line-height: 35upx; |
||||||
|
border-radius: 17upx; |
||||||
|
color: white; |
||||||
|
font-size: 30upx; |
||||||
|
padding-bottom: 2upx; |
||||||
|
} |
||||||
|
|
||||||
|
.imageItem image { |
||||||
|
width: 200upx; |
||||||
|
height: 200upx; |
||||||
|
border-radius: 8upx; |
||||||
|
} |
||||||
|
|
||||||
|
.imageUpload { |
||||||
|
line-height: 200upx; |
||||||
|
text-align: center; |
||||||
|
font-size: 150upx; |
||||||
|
color: #D9D9D9; |
||||||
|
border: 1px solid #D9D9D9; |
||||||
|
border-radius: 8upx; |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,267 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<!-- tabs栏 --> |
||||||
|
<view class=" mart10 marb20 alijus"> |
||||||
|
<view class="font16 fcor333 paddtop5 paddbotm5 margle20 marRight20" v-for="(item,index) in feePaidList" |
||||||
|
@click="switchid(index)" :class="[showPaidItem.platformType == item.platformType ? 'fcor089 borbtom fontwig6' : ' borb ']" |
||||||
|
:key="index"> |
||||||
|
{{item.platformTypeName}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width100 line1"></view> |
||||||
|
|
||||||
|
<view class="mart20 marb20"> |
||||||
|
<view class="dis-flex height40 bor-botm1 backcor6"> |
||||||
|
<view class="flex-1 fotct fontwig6">支付方式</view> |
||||||
|
<view class="flex-1 fotct fontwig6">贴息方式</view> |
||||||
|
<view class="flex-1 fotct fontwig6">操作</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="dis-flex bor-botm1 paddtop10 paddbotm10 " v-for="(item,index) in showPaidItem.payTypeList" |
||||||
|
:key="index"> |
||||||
|
|
||||||
|
<view class="flex-1 fotct text1"> |
||||||
|
{{item.payTypeName}} |
||||||
|
</view> |
||||||
|
<view class="flex-1 fotct "> |
||||||
|
{{item.feePaidList | filterStatus}} |
||||||
|
</view> |
||||||
|
<view class="flex-1 fotct fcor089" > |
||||||
|
<view v-if="showPaidItem.platformPeriod" @click.stop="openPupup(item)">编辑</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
<!-- 编辑桌台 --> |
||||||
|
<uni-popup ref="popupUpdateFeePaid" type="center"> |
||||||
|
<view style="width: 80vw;" class="backcorfff border-10r pd-main font16" v-if="updatePaidDetail"> |
||||||
|
<view class="dis-flex mart20 marb10 paddbotm10 bor-botm1"> |
||||||
|
<view class=" marRight10 fontwig6 padleft15 paddtright10">平台类型: |
||||||
|
</view> |
||||||
|
<view class=" flex-1 "> |
||||||
|
{{showPaidItem.platformTypeName}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="dis-flex mart20 marb10 paddbotm10 bor-botm1"> |
||||||
|
<view class=" marRight10 fontwig6 padleft15 paddtright10">支付方式: |
||||||
|
</view> |
||||||
|
<view class=" flex-1 "> |
||||||
|
{{updatePaidDetail.payTypeName}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class=" mart20 marb10 paddbotm10 bor-botm1"> |
||||||
|
<view class=" marRight10 fontwig6 padleft15 paddtright10 marb10">贴息方式: |
||||||
|
</view> |
||||||
|
<radio-group @change="radioChange"> |
||||||
|
<view class="dis-flex flex-sp flex-wrap "> |
||||||
|
<label v-for="(item,index) in updatePaidDetail.feePaidList" class="marb5"> |
||||||
|
<radio :value="item.feePaid+''" :checked="item.currentSettle" />{{item.feePaid | filterFeePaid}} |
||||||
|
</label> |
||||||
|
</view> |
||||||
|
</radio-group> |
||||||
|
</view> |
||||||
|
<button class="btnw50 " @click.stop="updateFeePaid()">保存</button> |
||||||
|
</view> |
||||||
|
</uni-popup> |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getFeePaidList, |
||||||
|
updateFeePaid, |
||||||
|
} from '@/Utils/Api.js'; |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
merNo: '', //商户号 |
||||||
|
platformPeriodIndex: 0, |
||||||
|
feePaidList: [], //数据列表 |
||||||
|
feeList:[ |
||||||
|
{ |
||||||
|
id: 1, |
||||||
|
name: '商户贴息', |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 2, |
||||||
|
name: '用户贴息', |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 3, |
||||||
|
name: '商户用户各一半', |
||||||
|
}, |
||||||
|
], |
||||||
|
updatePaidDetail: null, |
||||||
|
updateParams: { |
||||||
|
merNo: '', //商户号 |
||||||
|
platformPeriodType: '', //平台类型 1：零零购 |
||||||
|
payType: '', //支付方式 1： 银联分期 2：花呗分期 |
||||||
|
feePaid: '', //贴息方式 1：商户贴息 2：用户贴息 3：商户用户各一半 |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
computed: { |
||||||
|
showPaidItem() { |
||||||
|
if (this.feePaidList.length > 0) { |
||||||
|
return this.feePaidList[this.platformPeriodIndex] |
||||||
|
} else { |
||||||
|
return [] |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
filters: { |
||||||
|
/* 1：商户贴息 2：用户贴息 3：商户用户各一半 */ |
||||||
|
filterStatus(typeArr) { |
||||||
|
if (typeArr.length == 0 || !typeArr) { |
||||||
|
return '暂无' |
||||||
|
} else { |
||||||
|
let strArr = typeArr.filter(item => item.currentSettle); |
||||||
|
switch (strArr[0].feePaid) { |
||||||
|
case 1: |
||||||
|
return '商户贴息'; |
||||||
|
case 2: |
||||||
|
return '用户贴息'; |
||||||
|
case 3: |
||||||
|
return '商户用户各一半'; |
||||||
|
default: |
||||||
|
return '未知'; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
filterFeePaid(type) { |
||||||
|
switch (type) { |
||||||
|
case 1: |
||||||
|
return '商户贴息'; |
||||||
|
case 2: |
||||||
|
return '用户贴息'; |
||||||
|
case 3: |
||||||
|
return '商户用户各一半'; |
||||||
|
default: |
||||||
|
return '未知'; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
onLoad(option) { |
||||||
|
this.merNo = option.merNo; |
||||||
|
this.updateParams.merNo = this.merNo; |
||||||
|
this.getFeePaidList(); //查询贴息列表 |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
/*查询贴息列表 */ |
||||||
|
getFeePaidList(bool=true) { |
||||||
|
let params = { |
||||||
|
merNo: this.merNo |
||||||
|
} |
||||||
|
if(bool){ |
||||||
|
uni.showLoading({ |
||||||
|
title: "加载中", |
||||||
|
mask: true |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
getFeePaidList(params).then(res => { |
||||||
|
if(bool){ |
||||||
|
uni.hideLoading(); |
||||||
|
} |
||||||
|
|
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.feePaidList = res.return_data; |
||||||
|
if (this.feePaidList.length > 0) { |
||||||
|
this.switchid(this.platformPeriodIndex) |
||||||
|
} |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
/* 平台类型change切换 */ |
||||||
|
switchid(index) { |
||||||
|
this.platformPeriodIndex = index; |
||||||
|
}, |
||||||
|
openPupup(item) { |
||||||
|
this.updatePaidDetail = item; |
||||||
|
this.updateParams.platformPeriodType = this.showPaidItem.platformType; |
||||||
|
this.updateParams.payType = item.payType; |
||||||
|
this.updateParams.feePaid = item.feePaidList.filter(item => item.currentSettle)[0].feePaid; |
||||||
|
|
||||||
|
this.$refs.popupUpdateFeePaid.open('center'); |
||||||
|
}, |
||||||
|
//点击保存按钮 |
||||||
|
updateFeePaid() { |
||||||
|
if(this.updateParams.feePaid==''){ |
||||||
|
uni.showToast({ |
||||||
|
title:'请选择贴息方式', |
||||||
|
icon:'none' |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
uni.showLoading({ |
||||||
|
title: "加载中", |
||||||
|
mask: true |
||||||
|
}) |
||||||
|
updateFeePaid(this.updateParams).then(res=>{ |
||||||
|
uni.hideLoading() |
||||||
|
|
||||||
|
this.$refs.popupUpdateFeePaid.close(); |
||||||
|
|
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_data, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
|
||||||
|
this.getFeePaidList(false); |
||||||
|
|
||||||
|
|
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
/* 贴息方式change */ |
||||||
|
radioChange(e) { |
||||||
|
this.updateParams.feePaid = e.detail.value |
||||||
|
}, |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.borbtom { |
||||||
|
border-bottom: 3px solid #089bf5; |
||||||
|
} |
||||||
|
|
||||||
|
.borb { |
||||||
|
border-bottom: 3px solid transparent; |
||||||
|
} |
||||||
|
|
||||||
|
.border-10r { |
||||||
|
border-radius: 10px; |
||||||
|
} |
||||||
|
|
||||||
|
.flex-wrap{ |
||||||
|
flex-wrap: wrap; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue