<template>
<view class="page3_content">
<TopBar title="采购分期"/>
<view class="page3_tips">其他补充信息（选填）</view>
<view class="apply_data_content">
<view :style="{'margin-top':'40rpx'}">
<view class="apply_title">资产证明补充</view>
<view class="apply_desc">上传更多的资产证明可以更快认证您的资质</view>
</view>
<view class="apply_data_item">
<view v-if="!params.house_property" class="apply_upload" @click="uploadImage('house_property')">
<text class="eosfont icons"></text>
<text class="upload_font">房产证明照片</text>
</view>
<view v-if="params.house_property" class="apply_upload">
<text class="close_icon" @click="clearParams('house_property')"></text>
<image class="preview_img" :src="params.house_property"></image>
</view>
<view v-if="!params.deposit_certificate" class="apply_upload" @click="uploadImage('deposit_certificate')">
<text class="eosfont icons"></text>
<text class="upload_font">存款或理财照片/截图</text>
</view>
<view v-if="params.deposit_certificate" class="apply_upload">
<text class="close_icon" @click="clearParams('deposit_certificate')"></text>
<image class="preview_img" :src="params.deposit_certificate"></image>
</view>
<view v-if="!params.user_sesame_level" class="apply_upload" @click="uploadImage('user_sesame_level')">
<text class="eosfont icons"></text>
<text class="upload_font">法人芝麻信用照片/截图</text>
</view>
<view v-if="params.user_sesame_level" class="apply_upload">
<text class="close_icon" @click="clearParams('user_sesame_level')"></text>
<image class="preview_img" :src="params.user_sesame_level"></image>
</view>
<view v-if="!params.business_sesame_level" class="apply_upload" @click="uploadImage('business_sesame_level')">
<text class="eosfont icons"></text>
<text class="upload_font">企业芝麻信用照片/截图</text>
</view>
<view v-if="params.business_sesame_level" class="apply_upload">
<text class="close_icon" @click="clearParams('business_sesame_level')"></text>
<image class="preview_img" :src="params.business_sesame_level"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">其他补充证明</view>
</view>
<view class="apply_data_item">
<view v-if="!params.vehicle_license" class="apply_upload" @click="uploadImage('vehicle_license')">
<text class="eosfont icons"></text>
<text class="upload_font">机动车驾驶证照片</text>
</view>
<view v-if="params.vehicle_license" class="apply_upload">
<text class="close_icon" @click="clearParams('vehicle_license')"></text>
<image class="preview_img" :src="params.vehicle_license"></image>
</view>
</view>
<view class="apply_btn_box">
<view class="apply_btn" @click="backup()">上一步</view>
<view class="apply_btn next_btn" @click="submit()">下一步</view>
</view>
</view>
</view>
</template>
<script>
import TopBar from '@/components/TopBar/TopBar.vue';
export default {
data() {
return {
params: {
house_property: '', //房产证
deposit_certificate: '', //存款理财
user_sesame_level: '', //法人芝麻信用
business_sesame_level: '', //企业芝麻信用
vehicle_license: '', //机动车
},
submitFlag: true,
data: null,
qualification_id: ''
}
},
onLoad(option) {
const d = uni.getStorageSync('installment');
uni.request({
url: `/uni/api/userqualification/GetUserQualification/${d.property_id}/${d.equipment_id}`,
method: 'GET',
success: (res) => {
const d = res.data.data;
Object.keys(this.params).forEach((item, index) => {
this.params[item] = d[item]
});
this.data = {
contract_no: option.contract_no,
equipment_id: d.equipment_id,
property_id: d.property_id
},
this.qualification_id = d.qualification_id
uni.setStorage({
key: 'installment',
data: this.data
});
}
});
},
methods: {
uploadImage(key) {
uni.chooseImage({
sizeType: ['compress'],
count:1,
success: (res) => {
uni.showLoading({
title: '上传中'
})
const tempFilePaths = res.tempFilePaths
uni.uploadFile({
url: '/uni/api/resources',
filePath: tempFilePaths[0],
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
uni.hideLoading();
}
});
}
})
},
clearParams(key) {
this.params[key] = '';
},
backup() {
this.$backup();
},
submit() {
if(!this.submitFlag) return
this.submitFlag = false;
uni.showToast({
title: '提交中',
icon: 'none',
duration: 90000
})
uni.request({
url: '/uni/api/userqualification/EditUserQualification/third',
method: 'PUT',
data: {
...this.params,
...this.data,
qualification_id: this.qualification_id
},
success: (res) => {
this.submitFlag = true;
if(res.data.code === 0) {
uni.navigateTo({
url: `/pages/theRights/theRights`
});
} else {
uni.hideToast();
uni.showToast({
icon: 'none',
title: res.data.message
})
}
}
});
}
},
components: {
TopBar
}
}
</script>
<style lang="less" scoped>
.page3_content {
background: #fff;
padding-top: 80rpx;
.apply_data_content {
background: #fff;
padding: 0 36rpx;
box-sizing: border-box;
width: 100%;
.apply_data_item {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.apply_upload {
margin-top: 40rpx;
width: 328rpx;
height: 200rpx;
background: rgba(248,248,248,1);
border-radius: 16rpx;
.icons {
width: 36rpx;
height: 36rpx;
color: #AEAEAE;
display: block;
margin: 72rpx auto 10rpx;
}
.upload_font {
font-size: 24rpx;
color: #AEAEAE;
display: block;
text-align: center;
}
.preview_img {
width: 100%;
height: 100%;
}
.close_icon {
width: 28rpx;
height: 28rpx;
position: absolute;
top: -14rpx;
right: -14rpx;
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAYFBMVEUhISFVSRlWSRlpWBZxXxWfgw6jhg30xAH38Ob38ef38ej49O369vH69vL7+PT8+/n+/v3+/v7/zQD/zQL/1Cb/2T7/4GT/43H/43L/54f/88P/9Mj/+eX//ff//v7///+7HAjXAAAA3ElEQVQoz4XSWRKDIAwAUKFW4tIqQS2uvf8tK4iAojZ/5DFMEhJ9byLyD9M4TufYy1ogilr2AQ4N2miGHc6dQC9ENzucWzxEO1vsMIhuw0GEKAaDupYkZmuaxYmuasVe5+KIaGUkinWi1yjRJJUyai6h1FijU2dYK5y2cpQSayimBUdb4aLOEMc/yP1n6eFZ7hVEGSO7gkrXCmW2I9NKYYdAtyE87BAyHozvaccH75vBQ1pdfxlAzi8/GwBel2sCSvnFgimEvHKr+fFWUyOkb3621GAiK0q+XOA+/gCtlj2I+YoKDQAAAABJRU5ErkJggg==') no-repeat;
background-size: 100% 100%;
z-index: 10;
}
}
}
.apply_btn_box {
display: flex;
justify-content: space-between;
width: 678rpx;
margin: 60rpx 0;
.apply_btn {
width:328rpx;
height:80rpx;
background:rgba(245,245,245,1);
border-radius:16rpx;
background: #f5f5f5;
line-height: 80rpx;
font-size: 28rpx;
text-align: center;
}
.next_btn {
background: #FFCD00;
}
}
}
.page3_tips {
color: #7C7C7C;
font-size: 32rpx;
width: 678rpx;
margin: 36rpx auto 0;
}
.apply_title {
font-size:32rpx;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
line-height: 44rpx;
color: #212121;
}
.apply_desc {
font-size:24rpx;
line-height: 34rpx;
color: #979797;
margin-top: 8rpx;
}
}
</style>