|
|
<template>
|
|
|
<view class="section">
|
|
|
<view class=" padding-lr-sm padding-top-sm text-bold"><text class="cuIcon-titles textBlue"></text>上传认证资料</view>
|
|
|
<view class="flex flex-wrap ">
|
|
|
<view class="flex-sub padding-sm margin-xs radius listPic" @click="chooseImgIdFront">
|
|
|
<image v-if="has_id_front" class="sizeBox" :src="imgs_id_front" mode="scaleToFill"></image>
|
|
|
<!-- <image v-else class="sizeBox" src="../../../static/user/idcard_front.png" mode="scaleToFill"></image> -->
|
|
|
<image v-else class="sizeBox" src="../../../static/user/drive_upload.png" mode="scaleToFill"></image>
|
|
|
<view class="badge-box" v-if="imgs_id_front_url"></view>
|
|
|
</view>
|
|
|
<view class="flex-sub padding-sm margin-xs radius listPic" @click="chooseImgIdBack">
|
|
|
<image v-if="has_id_back" class="sizeBox" :src="imgs_id_back" mode="scaleToFill"></image>
|
|
|
<!-- <image v-else class="sizeBox" src="../../../static/user/idcard_back.png" mode="scaleToFill"></image> -->
|
|
|
<image v-else class="sizeBox" src="../../../static/user/drive_upload.png" mode="scaleToFill"></image>
|
|
|
<view class="badge-box" v-if="imgs_id_back_url"></view>
|
|
|
</view>
|
|
|
<view class="flex-sub padding-sm margin-xs radius listPic" @click="chooseImgDrive">
|
|
|
<image v-if="has_drive" class="sizeBox" :src="imgs_drive" mode="scaleToFill"></image>
|
|
|
<image v-else class="sizeBox" src="../../../static/user/travel_upload.png" mode="scaleToFill"></image>
|
|
|
<view class="badge-box" v-if="imgs_drive_url"></view>
|
|
|
</view>
|
|
|
<view class="flex-sub padding-sm margin-xs radius listPic" @click="chooseImgTravel">
|
|
|
<image v-if="has_travel" class="sizeBox" :src="imgs_travel" mode="scaleToFill"></image>
|
|
|
<image v-else class="sizeBox" src="../../../static/user/travel_upload.png" mode="scaleToFill"></image>
|
|
|
<view class="badge-box" v-if="imgs_travel_url"></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- -->
|
|
|
<view class=" padding-lr-sm padding-top-sm text-bold"><text class="cuIcon-titles textBlue"></text>车辆信息</view>
|
|
|
<view class="cu-card ">
|
|
|
<view class="cu-item shadow padding-lr-sm">
|
|
|
<!-- <view class="flex solids-bottom justify-between">
|
|
|
<view class="orderNumber">
|
|
|
<u-form>
|
|
|
<u-form-item label="驾驶证姓名" label-width="100"></u-form-item>
|
|
|
</u-form>
|
|
|
</view>
|
|
|
<view class="padding-top-xs inputTop">
|
|
|
<u-input border="none" v-model.trim="userName" placeholder="上传行驶证自动识别" inputAlign='right'>
|
|
|
</u-input>
|
|
|
</view>
|
|
|
</view> -->
|
|
|
<view class="flex solids-bottom justify-between">
|
|
|
<view class="orderNumber">
|
|
|
<u-form>
|
|
|
<u-form-item label="车牌号" label-width="100"></u-form-item>
|
|
|
</u-form>
|
|
|
</view>
|
|
|
<view class="padding-top-xs inputTop">
|
|
|
<u-input border="none" v-model.trim="licensePlate" placeholder="请输入" inputAlign='right'>
|
|
|
</u-input>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="flex justify-between">
|
|
|
<view class="orderNumber">
|
|
|
<u-form>
|
|
|
<u-form-item label="车辆VIN码" label-width="100"></u-form-item>
|
|
|
</u-form>
|
|
|
</view>
|
|
|
<view class="padding-top-xs inputTop">
|
|
|
<u-input border="none" :required="true" v-model.trim="carVin" placeholder="请输入"
|
|
|
inputAlign='right'>
|
|
|
</u-input>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="comeUp">
|
|
|
<u-button @click="comeUp" :customStyle="customStyle" iconColor="red" shape='circle'>提交审核</u-button>
|
|
|
</view>
|
|
|
<u-modal :show="show" :title="title" :showCancelButton="true" :content="content" @confirm="confirm"
|
|
|
@cancel="cancel">
|
|
|
</u-modal>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import config from '@/common/config/config.js';
|
|
|
import {
|
|
|
reactive,
|
|
|
ref
|
|
|
} from "vue";
|
|
|
import {
|
|
|
onLoad,
|
|
|
onShow,
|
|
|
} from "@dcloudio/uni-app";
|
|
|
|
|
|
const has_id_front = ref()
|
|
|
const imgs_id_front = ref()
|
|
|
const has_id_back = ref()
|
|
|
const imgs_id_back = ref()
|
|
|
const has_drive = ref()
|
|
|
const imgs_drive = ref()
|
|
|
const has_travel = ref()
|
|
|
const imgs_travel = ref()
|
|
|
|
|
|
const imgs_id_front_url = ref()
|
|
|
const imgs_id_back_url = ref()
|
|
|
const imgs_drive_url = ref()
|
|
|
const imgs_travel_url = ref()
|
|
|
|
|
|
const licensePlate = ref() //车牌号
|
|
|
const carVin = ref() //vin码
|
|
|
const editId = ref()
|
|
|
const customerId = ref()
|
|
|
|
|
|
const userName = ref() //驾驶证姓名
|
|
|
|
|
|
const customStyle = reactive({
|
|
|
backgroundColor: '#4C91FF',
|
|
|
color: '#fff'
|
|
|
});
|
|
|
const show = ref(false)
|
|
|
const title = ref('温馨提示')
|
|
|
const content = ref('修改后将重新进入审核状态，确定要继续吗？')
|
|
|
// const provinceArray=reactive(['京', '津', '皖', '苏', '沪', '浙', '闵', '黑', '湘', '赣', '川', '渝', '贵', '云', '粤', '桂', '琼', '港', '澳', '台', '鄂', '藏', '青', '新', '甘', '宁', '蒙', '陕', '晋', '鲁', '豫', '冀', '辽', '吉'])
|
|
|
onLoad((params) => {
|
|
|
if (params.data) {
|
|
|
var options = JSON.parse(params.data)
|
|
|
console.log(options, 'options');
|
|
|
if (options.id != '' && options.id != null) {
|
|
|
if (options.driverLicense != null && options.driverLicense != "") {
|
|
|
imgs_drive_url.value = options.driverLicense
|
|
|
imgs_drive.value = options.driverLicense
|
|
|
has_drive.value = true
|
|
|
|
|
|
}
|
|
|
|
|
|
if (options.vehicleLicense != null && options.vehicleLicense != "") {
|
|
|
imgs_travel_url.value = options.vehicleLicense
|
|
|
imgs_travel.value = options.vehicleLicense
|
|
|
has_travel.value = true
|
|
|
}
|
|
|
|
|
|
if (options.idBack != null && options.idBack != "") {
|
|
|
imgs_id_back_url.value = options.idBack
|
|
|
imgs_id_back.value = options.idBack
|
|
|
has_id_back.value = true
|
|
|
|
|
|
}
|
|
|
|
|
|
if (options.idFront != null && options.idFront != "") {
|
|
|
imgs_id_front_url.value = options.idFront
|
|
|
imgs_id_front.value = options.idFront
|
|
|
has_id_front.value = true
|
|
|
}
|
|
|
|
|
|
// proviceIndex: index,
|
|
|
// province: that.data.provinceArray[index],
|
|
|
editId.value = parseInt(options.id), //编辑时的认证id
|
|
|
licensePlate.value = options.carNo
|
|
|
carVin.value = options.vin
|
|
|
userName.value = options.userName
|
|
|
// engineNo: options.engineNo,
|
|
|
// auditStatus: parseInt(options.auditStatus),
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
})
|
|
|
onShow(() => {
|
|
|
|
|
|
customerId.value = uni.getStorageSync('userInfo').customerId
|
|
|
})
|
|
|
const chooseImgIdFront = () => {
|
|
|
uni.chooseImage({
|
|
|
count: 1,
|
|
|
sizeType: ['original', 'compressed'],
|
|
|
sourceType: ['camera', 'album'], //这要注意，camera掉拍照，album是打开手机相册
|
|
|
success: (res) => {
|
|
|
const tempFilePaths = res.tempFilePaths;
|
|
|
// console.log(tempFilePaths, 'ppppppppppppppppppppppppppppp');
|
|
|
if (tempFilePaths.length >= 1) {
|
|
|
has_id_front.value = true,
|
|
|
imgs_id_front.value = tempFilePaths[0]
|
|
|
} else {
|
|
|
return;
|
|
|
}
|
|
|
//身份证人像面上传
|
|
|
uplodFile(1)
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
const chooseImgIdBack = () => {
|
|
|
uni.chooseImage({
|
|
|
count: 1, // 默认9
|
|
|
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
|
success: function(res) {
|
|
|
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
|
|
|
const tempFilePaths = res.tempFilePaths;
|
|
|
if (tempFilePaths.length >= 1) {
|
|
|
|
|
|
has_id_back.value = true
|
|
|
imgs_id_back.value = tempFilePaths[0]
|
|
|
|
|
|
} else {
|
|
|
return;
|
|
|
}
|
|
|
//身份证人像面上传
|
|
|
uplodFile(2)
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
const chooseImgDrive = () => {
|
|
|
uni.chooseImage({
|
|
|
count: 1, // 默认9
|
|
|
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
|
success: function(res) {
|
|
|
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
|
|
|
let tempFilePaths = res.tempFilePaths;
|
|
|
if (tempFilePaths.length >= 1) {
|
|
|
|
|
|
has_drive.value = true
|
|
|
imgs_drive.value = tempFilePaths[0]
|
|
|
|
|
|
} else {
|
|
|
return;
|
|
|
}
|
|
|
//驾驶证上传
|
|
|
uplodFile(3)
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
const chooseImgTravel = () => {
|
|
|
uni.chooseImage({
|
|
|
count: 1, // 默认9
|
|
|
//sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
|
sizeType: ['compressed'], // 指定压缩图
|
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
|
success: function(res) {
|
|
|
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
|
|
|
var tempFilePaths = res.tempFilePaths;
|
|
|
if (tempFilePaths.length >= 1) {
|
|
|
has_travel.value = true
|
|
|
imgs_travel.value = tempFilePaths[0]
|
|
|
} else {
|
|
|
return;
|
|
|
}
|
|
|
//行驶证上传
|
|
|
uplodFile(4)
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
// 上传图片验证
|
|
|
const uplodFile = (type) => {
|
|
|
let filePath = null;
|
|
|
if (type == 1) {
|
|
|
filePath = imgs_id_front.value
|
|
|
} else if (type == 2) {
|
|
|
filePath = imgs_id_back.value
|
|
|
} else if (type == 3) {
|
|
|
filePath = imgs_drive.value
|
|
|
} else if (type == 4) {
|
|
|
filePath = imgs_travel.value
|
|
|
} else {
|
|
|
uni.$u.toast("无效的图片类型！")
|
|
|
}
|
|
|
|
|
|
if (filePath == null || filePath == "") {
|
|
|
uni.$u.toast("无效的图片,请重新选择！")
|
|
|
}
|
|
|
|
|
|
uni.uploadFile({
|
|
|
filePath: filePath,
|
|
|
name: 'file',
|
|
|
header: {
|
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
|
'Authorization': 'Bearer ' + uni.getStorageSync('token'),
|
|
|
'tenant-id': 1
|
|
|
},
|
|
|
url: config.upload,
|
|
|
formData: {},
|
|
|
success: function(res) {
|
|
|
// console.log("--------uplodFile---------", res)
|
|
|
let data = JSON.parse(res.data);
|
|
|
// console.log("--------uplodFile.data---------", data)
|
|
|
if (data.code === 0) {
|
|
|
uni.$u.toast('上传成功');
|
|
|
if (type == 1) {
|
|
|
imgs_id_front_url.value = data.data
|
|
|
} else if (type == 2) {
|
|
|
imgs_id_back_url.value = data.data
|
|
|
} else if (type == 3) {
|
|
|
imgs_drive_url.value = data.data
|
|
|
} else if (type == 4) {
|
|
|
imgs_travel_url.value = data.data
|
|
|
// console.log('ddddddddddddddddddddddd');
|
|
|
}
|
|
|
} else {
|
|
|
uni.$u.toast("上传失败！")
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
// 点击提交审核
|
|
|
const comeUp = () => {
|
|
|
if (!carVin.value || !licensePlate.value || !imgs_drive_url.value ||
|
|
|
!imgs_travel_url.value || !imgs_id_front_url.value || !imgs_id_back_url.value) {
|
|
|
uni.$u.toast('请填写必填项与全部认证资料')
|
|
|
return
|
|
|
}
|
|
|
//有id时是编辑 无是新增
|
|
|
if (editId.value != null && editId.value != "") {
|
|
|
show.value = true
|
|
|
return
|
|
|
}
|
|
|
submit()
|
|
|
}
|
|
|
// 修改弹窗取消
|
|
|
const cancel = () => {
|
|
|
show.value = false
|
|
|
}
|
|
|
// 修改弹窗确认
|
|
|
const confirm = () => {
|
|
|
submit()
|
|
|
}
|
|
|
// 提交接口调用
|
|
|
const submit = () => {
|
|
|
var param = {
|
|
|
vehicleNo: licensePlate.value,
|
|
|
vehicleLicense: [imgs_drive_url.value,
|
|
|
imgs_travel_url.value
|
|
|
],
|
|
|
driverLicense: [imgs_id_front_url.value,
|
|
|
imgs_id_back_url.value
|
|
|
],
|
|
|
vehicleVin: carVin.value
|
|
|
}
|
|
|
// console.log(param, "---------updateVehicle---------", JSON.stringify(param))
|
|
|
|
|
|
let bindUrl = config.baseUrl + 'app-api/cloud/personal/personalVel/apply'
|
|
|
uni.$request({
|
|
|
url: bindUrl,
|
|
|
method: "POST",
|
|
|
data: param,
|
|
|
}).then((res) => {
|
|
|
// console.log(res,'提交');
|
|
|
if (res.data.code == 0) {
|
|
|
uni.$u.toast('保存成功')
|
|
|
setTimeout(function() {
|
|
|
uni.navigateBack({
|
|
|
delta: 1,
|
|
|
});
|
|
|
}, 1000)
|
|
|
|
|
|
} else {
|
|
|
// console.log(res);
|
|
|
uni.$u.toast(res.data.msg)
|
|
|
}
|
|
|
|
|
|
}).catch((err) => {
|
|
|
uni.$u.toast(res.data.msg)
|
|
|
})
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang='scss' scoped>
|
|
|
.section {
|
|
|
width: 100%;
|
|
|
height: 100vh;
|
|
|
background: #F7F8FA;
|
|
|
}
|
|
|
|
|
|
.textBlue {
|
|
|
color: #4C91FF;
|
|
|
}
|
|
|
|
|
|
.sizeBox {
|
|
|
width: 335rpx;
|
|
|
height: 190rpx;
|
|
|
}
|
|
|
|
|
|
.listPic {
|
|
|
width: 40%;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
.badge-box {
|
|
|
text-align: right;
|
|
|
background-color: #373737;
|
|
|
height: 48rpx;
|
|
|
width: 48rpx;
|
|
|
position: absolute;
|
|
|
right: 20rpx;
|
|
|
top: 18rpx;
|
|
|
color: #fff;
|
|
|
border-radius: 0 0 0 100%;
|
|
|
background: url('../../../static/user/upSucceed.svg') no-repeat 100% 100%;
|
|
|
}
|
|
|
|
|
|
.comeUp {
|
|
|
width: 80%;
|
|
|
position: absolute;
|
|
|
bottom: 50rpx;
|
|
|
left: 10%;
|
|
|
}
|
|
|
|
|
|
.inputTop {
|
|
|
margin-top: 5rpx;
|
|
|
}
|
|
|
</style> |
