[抖火申请支付]

This commit is contained in:
2023-05-15 13:33:00 +08:00
commit c503bff7d2
294 changed files with 25144 additions and 0 deletions

View File

@@ -0,0 +1,550 @@
<template>
<view class="content">
<view class="top">
<view class="top-text">
您好{{userData.nickname}}{{userData.sex == '男' ? '先生' : '女士'}}
</view>
您名下的XXX账户商务停止第三方催收洽谈协商服务已完成
</view>
<view class="white">
<view class="list">
<view class="label">
<view class="labelTop">
<view class="labelTop-name" v-if="schemesData.institution">
{{schemesData.institution.title}}
</view>
<view class="labelTop-tips" v-if="schemesData.business_type">
{{schemesData.business_type.title}}
</view>
</view>
<view class="labelPlan-list">
<view class="labelPlan-item" v-for="(items, index) in schemesData.params" :key="index">
<view class="labelPlan-item-name">{{items.title}}</view>
<view class="nowrap labelPlan-item-text">
<block v-if="items.key === 'price'">
{{items.value}}
</block>
<block v-else-if="items.key === 'number'">
{{items.value}}
</block>
<block v-else>
{{items.value}}
</block>
</view>
</view>
</view>
</view>
</view>
<!-- start 驳回原因 弹出 -->
<view class="reasonBack" v-if="popNo"></view>
<view class="reasonCont" v-if="popNo">
<image class="reasonCont-img" src="/static/imgs/payClose.png" mode="aspectFill" @click="popNo = false"></image>
<view class="reasonCont-title">
不同意原因
</view>
<view class="reasonCont-text">
<textarea name="remark" placeholder-style="color:#999999; font-size: 14px" placeholder="请输入您不同意的原因" maxlength="500" @input="remarkInput"></textarea>
<text>{{cursor}}/500</text>
</view>
<button class="reasonCont-btn" size="mini" :disabled="disabled" @click="clickNo">确定</button>
</view>
<!-- end 驳回原因 弹出 -->
<view class="reminder">
<image class="reminder-img" src="@/static/imgs/reminderIcon.png"></image>
<view class="reminder-text">
<text>温馨提示</text>
{{reminder}}
</view>
</view>
<view class="idcardBtn">
<view class="idcardBtn-go active" @click="popNo = true">
不同意
</view>
<button class="idcardBtn-go" size="mini" :disabled="disabled" @click="clickYes">同意并确认</button>
</view>
</view>
</view>
</template>
<script>
import { myModifyInfo, modifyYes, modifyNo, userBasic } from '@/apis/interfaces/user'
export default {
data() {
return {
disabled : false, // 按钮状态
popNo : false, // 不同意
schemesData : '', // 预估方案
reminder : '', // 温馨提示
remark : '',
cursor : 0,
userData : ''
}
},
onShow() {
// 获取方案
this.schemesInfo();
// 获取用户姓名手机号性别
userBasic().then(res => {
this.userData = res
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
methods: {
// 方案
schemesInfo() {
myModifyInfo(this.$Route.query.id).then(res => {
this.reminder = res.tips
this.schemesData = res.close_scheme
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 备注信息
remarkInput(val) {
this.remark = val.detail.value
this.cursor = val.detail.cursor
},
// 同意方案
clickYes() {
uni.showModal({
title : '温馨提示',
content : '是否确认?',
cancelText : "取消", // 取消按钮的文字
confirmText : "确认", // 确认按钮的文字
showCancel : true, // 是否显示取消按钮,默认为 true
confirmColor: '#D4155A',
cancelColor : '#999999',
success: res => {
if(res.confirm) {
modifyYes(this.schemesData.business_order_close_scheme_id, {
remark: this.remark
}).then(res => {
uni.showToast({
title: '操作成功',
icon: "none"
})
this.disabled = true
setTimeout(()=>{
this.$Router.replace({name: 'User'})
uni.hideLoading()
},2000)
}).catch( err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
} else {}
}
})
},
// 不同意方案
clickNo() {
if(this.remark) {
modifyNo(this.schemesData.business_order_close_scheme_id, {
remark: this.remark
}).then(res => {
uni.showToast({
title: '提交成功',
icon: "none"
})
this.popNo = true
this.disabled = true
setTimeout(()=>{
this.$Router.replace({name: 'User'})
uni.hideLoading()
},2000)
}).catch( err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
} else {
uni.showToast({
title: '请输入您不同意的原因',
icon: "none"
})
}
},
}
}
</script>
<style lang="scss" scoped>
.content {
background-color: #f6f6f6;
overflow-y: scroll;
height: 100vh;
}
.top {
background-color: $mian-color;
color: #ffffff;
padding: $padding * 2 $padding 280rpx;
box-sizing: border-box;
font-size: $title-size-m;
line-height: 42rpx;
opacity: .9;
text-align: justify;
.top-text {
margin-bottom: $margin;
}
}
.white {
position: relative;
top: -200rpx;
left: 0;
width: 100%;
padding: $padding;
box-sizing: border-box;
z-index: 9;
border-bottom: transparent 200rpx solid;
.list {
padding: $padding;
box-sizing: border-box;
background-color: #ffffff;
border-radius: $radius - 4;
position: relative;
margin-top: $margin * 3;
box-shadow: 0 0 20rpx rgba(0, 0, 0, .05);
&::after,
&::before {
position: absolute;
content: '';
background-color: rgba(255, 255, 255, .4);
left: 20rpx;
border-radius: $radius - 4 $radius - 4 0 0;
}
&::after {
z-index: 2;
width: calc(100% - 40rpx);
left: 20rpx;
top: -25rpx;
height: 25px;
}
&::before {
z-index: 1;
width: calc(100% - 80rpx);
left: 40rpx;
top: -50rpx;
height: 50rpx;
}
&:first-child {
margin-top: 0;
}
.label {
position: relative;
overflow: hidden;
&.active {
height: auto;
}
&::after,
&::before {
position: absolute;
content: '';
width: 30rpx;
height: 30rpx;
border-radius: 50%;
background-color: #f6f6f6;
top: 33%;
}
&::after {
left: -45rpx;
}
&::before {
right: -45rpx;
}
.labelTop {
line-height: 80rpx;
margin-bottom: $margin - 20;
display: flex;
.labelTop-name {
flex: 1;
font-size: $title-size + 2;
font-weight: 600;
}
.labelTop-tips {
margin-left: 20rpx;
background-color: #FBE7EE;
color: $mian-color;
font-size: $title-size-sm;
font-weight: normal;
padding: 0 15rpx;
border: 2rpx solid $mian-color;
border-radius: $radius * 2;
height: 44rpx;
line-height: 44rpx;
display: inline-block;
margin-top: 18rpx;
}
}
.labelPlan {
border-top: 2rpx dotted #e7e7e7;
padding-top: $padding;
margin-top: $margin;
.labelPlan-top {
display: flex;
line-height: 54rpx;
color: $mian-color;
margin-bottom: $margin;
.labelPlan-name {
flex: 1;
font-size: $title-size + 4;
font-weight: 600;
}
.labelPlan-tips {
opacity: .2;
font-size: $title-size + 2;
}
}
}
.labelPlan-item {
line-height: 40rpx;
margin-bottom: $margin + 10;
display: flex;
font-size: $title-size-m;
color: #111111;
&:last-child {
margin-bottom: 10rpx;
}
.labelPlan-item-name {
color: #999999;
flex: 1;
margin-right: $margin;
}
.labelPlan-item-text {
width: 30%;
text-align: right;
}
.labelPlan-item-btn {
color: $mian-color;
border: $mian-color 2rpx solid;
width: 80rpx;
text-align: center;
border-radius: $radius-m;
height: 40rpx;
line-height: 40rpx;
margin-left: 20rpx;
font-size: $title-size-sm - 2;
}
}
.labelNotice {
font-size: $title-size-m;
background-color: #F6F6F6;
border-radius: $radius-m;
margin-top: $margin;
height: 240rpx;
overflow: hidden;
position: relative;
&.active {
height: auto;
}
.labelNotice-top {
padding: $padding $padding 0;
box-sizing: border-box;
.labelNotice-name {
color: #111111;
margin-bottom: $margin - 10;
font-weight: 600;
}
.labelNotice-text {
color: #666666;
line-height: 52rpx;
text-align: justify;
}
}
.labelNotice-btn {
text-align: center;
line-height: 100rpx;
color: #999999;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-color: #F6F6F6;
.labelNotice-img {
width: 24rpx;
height: 24rpx;
margin-right: 10rpx;
transition: .2s;
&.active {
transform:rotate(180deg)
}
}
}
}
}
.open {
text-align: center;
margin-top: $margin - 10;
width: 100%;
background-color: #ffffff;
.open-text {
background-color: #FBE7EE;
display: inline-block;
color: $mian-color;
padding: 0 $padding - 10;
line-height: 58rpx;
font-size: $title-size-m;
border-radius: $radius-sm;
image {
width: 22rpx;
height: 22rpx;
margin-right: 10rpx;
transition: .2s;
&.active {
transform:rotate(180deg)
}
}
}
}
}
}
.reasonBack {
position: fixed;
left: 0;
bottom: 0;
z-index: 98;
background-color: rgba(0, 0, 0, .5);
width: 100%;
height: 100vh;
}
.reasonCont {
position: fixed;
left: 0;
bottom: 0;
z-index: 99;
width: 100%;
background-color: #ffffff;
border-radius: $radius $radius 0 0;
padding: $padding;
box-sizing: border-box;
.reasonCont-title {
text-align: center;
font-size: $title-size + 4;
}
.reasonCont-img {
width: 44rpx;
height: 44rpx;
position: absolute;
top: $padding;
right: $padding;
}
.reasonCont-text {
background-color: #F6F6F6;
width: 100%;
padding: $padding;
box-sizing: border-box;
margin: $margin + 10 0 $margin*2;
border-radius: $radius;
textarea {
width: 100%;
}
text {
text-align: right;
display: block;
font-size: $title-size-sm;
color: $text-gray;
}
}
.reasonCont-btn {
width: 100%;
line-height: 90rpx;
text-align: center;
border-radius: $radius * 3;
background-color: #D4155A;
font-size: $title-size + 2;
color: #ffffff;
&[disabled] {
background-color: #eba5a5;
}
}
}
.reminder {
position: fixed;
left: 0;
bottom: 150rpx;
background-color: #f6f6f6;
z-index: 10;
width: 100%;
height: 240rpx;
overflow: hidden;
padding: $padding;
box-sizing: border-box;
display: flex;
color: #FEA044;
font-size: $title-size-m;
border-bottom: 2rpx solid #f5f5f5;
.reminder-img {
width: 32rpx;
height: 32rpx;
margin-top: 8rpx;
}
.reminder-text {
overflow-y: scroll;
height: 200rpx;
width: calc(100% - 52rpx);
margin-left: 20rpx;
line-height: 40rpx;
text-align: justify;
font-size: $title-size-sm;
text {
display: block;
}
}
}
.idcardBtn {
position: fixed;
left: 0;
bottom: 0;
background-color: #ffffff;
z-index: 9;
width: 100%;
height: 150rpx;
padding: 0 20rpx;
box-sizing: border-box;
display: flex;
.idcardBtn-go {
width: calc(50% - 20rpx);
margin: $margin 10rpx;
background-color: $mian-color;
color: #ffffff;
border-radius: $radius-lg;
height: 90rpx;
line-height: 90rpx;
font-size: $title-size;
text-align: center;
border: 2rpx solid #ffffff;
&.active {
background-color: #ffffff;
border-color: $mian-color;
color: $mian-color;
}
&[disabled] {
background-color: #eba5a5;
}
}
}
</style>