| | |
| | | <view class="cert-details-page__upload-group"> |
| | | <text class="cert-details-page__upload-title">身份证正反面</text> |
| | | <view class="cert-details-page__upload-list"> |
| | | <view class="cert-details-page__upload-card"> |
| | | |
| | | </view> |
| | | <view class="cert-details-page__upload-card"> |
| | | |
| | | <view v-for="(img, index) in idcardImgs" :key="index" class="cert-details-page__upload-card"> |
| | | <image class="cert-details-page__upload-image" :src="img" mode="aspectFill" @click="previewImage(img)"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | <view class="cert-details-page__upload-group"> |
| | | <text class="cert-details-page__upload-title">车辆照片</text> |
| | | <view class="cert-details-page__upload-list"> |
| | | <view class="cert-details-page__upload-img"> |
| | | |
| | | </view> |
| | | <view class="cert-details-page__upload-img"> |
| | | |
| | | <view v-for="(img, index) in carImgs" :key="index" class="cert-details-page__upload-img"> |
| | | <image class="cert-details-page__upload-image" :src="img" mode="aspectFill" @click="previewImage(img)"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | <view class="cert-details-page__upload-group"> |
| | | <text class="cert-details-page__upload-title">驾驶证照片</text> |
| | | <view class="cert-details-page__upload-list cert-details-page__upload-list--single"> |
| | | <view class="cert-details-page__upload-img"> |
| | | |
| | | <view v-for="(img, index) in licenseImgs" :key="index" class="cert-details-page__upload-img"> |
| | | <image class="cert-details-page__upload-image" :src="img" mode="aspectFill" @click="previewImage(img)"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="cert-details-page__upload-group"> |
| | | <text class="cert-details-page__upload-title">其它材料</text> |
| | | <view class="cert-details-page__upload-list cert-details-page__upload-list--single"> |
| | | <view v-for="(img, index) in otherImgs" :key="index" class="cert-details-page__upload-img"> |
| | | <image class="cert-details-page__upload-image" :src="img" mode="aspectFill" @click="previewImage(img)"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <button v-if="statusType === 'rejected'" class="cert-details-page__rebtn" @click="goRecertify">重新认证</button> |
| | | <view style="width: 100%; height: 30rpx;" v-if="statusType === 'rejected'"></view> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | data() { |
| | | return { |
| | | statusType: 'review', |
| | | basicInfo: [ |
| | | { label: '注册手机号', value: '18155114565' }, |
| | | { label: '司机姓名', value: '苏熙熙' }, |
| | | { label: '婚姻状况', value: '未婚' }, |
| | | { label: '居住城市', value: '安徽省/合肥市/庐阳区' }, |
| | | { label: '详细地址', value: '九华山路201号' }, |
| | | { label: '支付宝账号', value: '18155114565' }, |
| | | { label: '身份证号', value: '3482938472937838902' } |
| | | ], |
| | | vehicleInfo: [ |
| | | { label: '车牌号', value: '皖BD23189' }, |
| | | { label: '车辆类型', value: '面包车' }, |
| | | { label: '车辆颜色', value: '白色' }, |
| | | { label: '驾驶证有效期', value: '2016年1月1日至2036年1月1日' } |
| | | ] |
| | | detailData: null, |
| | | basicInfo: [], |
| | | vehicleInfo: [], |
| | | idcardImgs: [], |
| | | carImgs: [], |
| | | licenseImgs: [], |
| | | otherImgs: [] |
| | | } |
| | | }, |
| | | computed: { |
| | |
| | | const descMap = { |
| | | review: '审核结果将通过短信/订单消息通知您', |
| | | approved: '', |
| | | rejected: '驾驶证过期,请重新提交审核' |
| | | rejected: this.detailData?.auditRemark || '认证信息有误,请重新提交审核' |
| | | } |
| | | |
| | | return descMap[this.statusType] || '' |
| | |
| | | return iconMap[this.statusType] || iconMap.review |
| | | } |
| | | }, |
| | | onLoad(options) { |
| | | this.statusType = options && options.status ? options.status : 'review' |
| | | onShow() { |
| | | this.getVerifyDetail() |
| | | }, |
| | | methods: { |
| | | getVerifyDetail() { |
| | | console.log('1111111') |
| | | this.$u.api.verifyDetail().then(res => { |
| | | uni.hideLoading() |
| | | if (res.code === 200) { |
| | | this.detailData = res.data |
| | | this.setStatusType(res.data.auditStatus) |
| | | this.formatBasicInfo(res.data) |
| | | this.formatVehicleInfo(res.data) |
| | | this.formatImages(res.data) |
| | | } |
| | | }) |
| | | }, |
| | | setStatusType(auditStatus) { |
| | | console.log(auditStatus) |
| | | const map = { 0: 'review', 1: 'approved', 2: 'rejected', 3: 'approved' } |
| | | this.statusType = map[auditStatus] || 'review' |
| | | }, |
| | | getMaritalStatusText(status) { |
| | | const map = { 0: '未婚', 1: '已婚', 2: '离异', 3: '丧偶' } |
| | | return map[status] || '未知' |
| | | }, |
| | | formatBasicInfo(data) { |
| | | this.basicInfo = [ |
| | | { label: '注册手机号', value: data.telephone || '' }, |
| | | { label: '司机姓名', value: data.name || '' }, |
| | | { label: '婚姻状况', value: this.getMaritalStatusText(data.maritalStatus) }, |
| | | { label: '居住城市', value: [data.provinceName, data.cityName, data.districtName].filter(Boolean).join('/') || '' }, |
| | | { label: '详细地址', value: data.livePlace || '' }, |
| | | { label: '支付宝账号', value: data.aliAccount || '' }, |
| | | { label: '支付宝姓名', value: data.aliName || '' }, |
| | | { label: '身份证号', value: data.idcard || '' } |
| | | ] |
| | | }, |
| | | formatVehicleInfo(data) { |
| | | const startDate = data.cardStartDate ? data.cardStartDate.split(' ')[0].replace(/-/g, '年').replace(/月/g, '').replace(/日/g, '') : '' |
| | | const endDate = data.cardEndDate ? data.cardEndDate.split(' ')[0].replace(/-/g, '年').replace(/月/g, '').replace(/日/g, '') : '' |
| | | this.vehicleInfo = [ |
| | | { label: '车牌号', value: data.carCode || '' }, |
| | | { label: '车辆类型', value: data.carTypeName || '' }, |
| | | { label: '车辆颜色', value: data.carColor || '' }, |
| | | { label: '驾驶证有效期', value: startDate && endDate ? `${startDate}至${endDate}` : '' } |
| | | ] |
| | | }, |
| | | previewImage(current) { |
| | | uni.previewImage({ |
| | | current: current, |
| | | urls: [...this.idcardImgs, ...this.carImgs, ...this.licenseImgs, ...this.otherImgs] |
| | | }) |
| | | }, |
| | | goRecertify() { |
| | | uni.navigateTo({ |
| | | url: '/pages/driver-certification/driver-certification' |
| | | }) |
| | | }, |
| | | formatImages(data) { |
| | | this.idcardImgs = [data.idcardImg, data.idcardImgBack].filter(Boolean).map(item => data.imgPrefix + item) |
| | | this.carImgs = data.carImgList.map(item => data.imgPrefix + item.fileurl) |
| | | this.licenseImgs = data.licenseImgList.map(item => data.imgPrefix + item.fileurl) |
| | | this.otherImgs = data.otherImgList.map(item => data.imgPrefix + item.fileurl) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | font-size: 30rpx; |
| | | color: #777777; |
| | | flex-shrink: 0; |
| | | margin-right: 30rpx; |
| | | } |
| | | |
| | | &__info-value { |
| | |
| | | } |
| | | |
| | | &__upload-group { |
| | | padding-top: 24rpx; |
| | | padding: 30rpx 0; |
| | | box-sizing: border-box; |
| | | border-bottom: 1rpx solid #E5E5E5; |
| | | } |
| | | |
| | | &__upload-title { |
| | |
| | | height: 124rpx; |
| | | } |
| | | } |
| | | |
| | | |
| | | &__upload-img { |
| | | width: 144rpx; |
| | | height: 144rpx; |
| | | background-color: #333333; |
| | | background-color: #f7f8fa; |
| | | border-radius: 10rpx; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | &__upload-image { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | &__id-avatar { |
| | |
| | | height: 144rpx; |
| | | background: linear-gradient(180deg, #f5f7fa 0%, #eff2f7 100%); |
| | | } |
| | | |
| | | &__rebtn { |
| | | width: calc(100% - 60rpx); |
| | | height: 88rpx; |
| | | line-height: 88rpx; |
| | | background: #10B2FA; |
| | | color: #ffffff; |
| | | font-size: 32rpx; |
| | | border-radius: 44rpx; |
| | | border: none; |
| | | |
| | | &::after { |
| | | border: none; |
| | | } |
| | | } |
| | | } |
| | | </style> |