瀏覽代碼

解除车牌占用

master
@weixixuan 4 天之前
父節點
當前提交
68b8b1430a

+ 22
- 9
components/common/FixedFooter.vue 查看文件

@@ -1,6 +1,15 @@
<template>
<view class="fixed-footer-box" :style="{height: height}">
<view class="fixed-footer" :style="{zIndex: zIndex}">
<view
class="fixed-footer-box"
:style="{
height: height,
}">
<view
class="fixed-footer"
:style="{
zIndex: zIndex,
position: fixed ? 'fixed' : 'static'
}">
<slot></slot>
</view>
</view>
@@ -12,16 +21,20 @@ export default {
options: {
styleIsolation: 'shared' ,
},
props: {
zIndex: {
type: [Number, String],
default: 10
},
height: {
props: {
fixed: {
type: Boolean,
default: true
},
zIndex: {
type: [Number, String],
default: 10
},
height: {
type: [String, Number],
default: '144rpx'
}
}
}
}
</script>


+ 30
- 43
subpackage/after-sale/rescind-carId/rescind-carId-select-details.vue 查看文件

@@ -1,6 +1,6 @@
<template>
<view class="bg">
<view class="title">基本信息</view>
<view class="title">车辆信息</view>
<!-- <u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item label="用户类型" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
用户类型
@@ -17,55 +17,29 @@
</u-form> -->
<view class="detail-option">
<view class="detail-option-item">
<view class="label">用户类型</view>
<view class="value">用户类型</view>
<view class="label">车牌号</view>
<view class="value">{{ state.drivingInfo.plateNum }}</view>
</view>
<view class="detail-option-item">
<view class="label">用户类型</view>
<view class="value">用户类型</view>
<view class="label">车辆颜色</view>
<view class="value">{{ getVehiclePlateColor(state.drivingInfo.plateColor) }}</view>
</view>
<view class="detail-option-item">
<view class="label">用户类型</view>
<view class="value">用户类型</view>
<view class="label">车主姓名</view>
<view class="value">{{ state.drivingInfo.vehicleOwnerName }}</view>
</view>
</view>
</view>
<view class="bg">
<view class="title"> 进度信息 </view>
<view class="dot_wrap">
<view class="dot_wrap_left">
<text class="dot"></text>
<text class="line"></text>
<text class="dot"></text>
<text class="line"></text>
<text class="dot"></text>
<view class="detail-option-item">
<view class="label">提交日期</view>
<view class="value">{{ state.detail.applyTime }}</view>
</view>
<view class="dot_wrap_right">
<view class="item">
<image :src="`${$imgUrl}issuance/direction1.png`"></image>
<view class="destion">
<view class="destion1">已提交申请</view>
<view class="destion2">提交时间2024年12月11日明。</view>
</view>
<!-- <image :src="`${$imgUrl}issuance/direction4.png`"></image> -->
</view>
<view class="item">
<image :src="`${$imgUrl}issuance/direction2.png`"></image>
<view class="destion">
<view class="destion1">资料审核</view>
<view class="destion2">辅助说明</view>
</view>
</view>
<view class="item" style="margin-bottom: 0;">
<image :src="`${$imgUrl}issuance/direction3.png`"></image>
<view class="destion">
<view class="destion1">解除车牌占用</view>
<view class="destion2">辅助说明</view>
</view>
</view>
<view class="detail-option-item">
<view class="label">审核状态</view>
<view class="value">{{ state.detail.auditStatus }}</view>
</view>
</view>
</view>
</template>

<script setup lang="ts">
@@ -73,6 +47,7 @@
import {releasePlateaView} from "@/utils/network/api.js";
import {requestNew} from "@/utils/network/request.js";
import { onLoad } from "@dcloudio/uni-app";
import { getVehiclePlateColor } from "@/datas/vehiclePlateColor.js"

const leftIcon = {
height: '100%',
@@ -87,7 +62,18 @@ const labelStyle = {
}
const state = reactive({
detail: {
plateNum: '',
plateColor: '',
vehicleOwnerName: '',
applyTime: '',
auditStatus: ''
},
drivingInfo: {
plateColor: "",
plateNum: "",
vehNegImgUrl: "",
vehPosImgUrl: "",
vehicleOwnerName: "",
}
})
onLoad((option) => {
@@ -107,7 +93,8 @@ const labelStyle = {
showLoading: true,
};
requestNew(releasePlateaView, options).then((res) => {
state.detail = res.data
state.detail = res
state.drivingInfo = res.drivingInfo
});
};
</script>

+ 39
- 5
subpackage/after-sale/rescind-carId/rescind-carId-select-direction.vue 查看文件

@@ -21,14 +21,32 @@
</image>
</view>
</view>
<view class="user-type">个人</view>
<view class="cailiao">
<view class="list" v-for="(item,index) in person">
<view>{{item.name}}</view>
<image class="icon" :src="`${$imgUrl}${item.img}`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
</view>
</view>
<view class="user-type">单位</view>
<view class="cailiao">
<view class="list" v-for="(item,index) in company">
<view>{{item.name}}</view>
<image class="icon" :src="`${$imgUrl}${item.img}`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
</view>
</view>
</view>
</view>
<view class="bottom-box">
<FixedFooter>
<button type="default" class="ui-btn" style="margin-bottom: 12rpx;" @click="savaHandle()">
解除车牌占用申请
</button>
</view>
</FixedFooter>
</template>

@@ -37,12 +55,21 @@
import {
ref
} from "vue";
import FixedFooter from "@/components/common/FixedFooter.vue";
const list=ref([
{'name':"申请人身份证正面",'img':"issuance/sfz.png"},
{'name':"申请人身份证反面",'img':"issuance/sff.png"},
{'name':"车辆行驶证主页",'img':"issuance/xz.png"},
{'name':"车辆行驶证副页",'img':"issuance/xf.png"},
{'name':"营业执照(单位必传)",'img':"applyCard/zhizhao.png"},
])
const person = ref([
{'name':"车主身份证人像面",'img':"issuance/sfz.png"},
{'name':"车主身份证国徽面",'img':"issuance/sff.png"},
{'name':"授权书",'img':"issuance/weituo.png"},
])
const company = ref([
{'name':"营业执照",'img':"applyCard/zhizhao.png"},
{'name':"授权书",'img':"issuance/weituo.png"},
])
const savaHandle = () => {
navTo(`/subpackage/after-sale/rescind-carId/rescind-carId-select`)
@@ -177,4 +204,11 @@
flex-direction: column;
margin-top: 20rpx;
}
.user-type{
color: #01243A;
margin-top: 24rpx;
.line{
color: #999999;
}
}
</style>

+ 335
- 382
subpackage/after-sale/rescind-carId/rescind-carId-select.vue 查看文件

@@ -1,22 +1,7 @@
<template>
<view class="bg">
<view class="title">基本信息</view>
<view class="car-type">
<view class="car-type-item" :class="{active: state.form.applyType == '1'}" @click="toggleApplyType('1')">个人车辆</view>
<view class="car-type-item" :class="{active: state.form.applyType == '2'}" @click="toggleApplyType('2')">单位车辆</view>
</view>
<u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle' v-if="state.form.applyType == '1'">
<u-form-item label="是否本人" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input v-model="state.form.isSelfStr" type="select" @click="isSelfSelect = true" input-align='right'/>
</u-form-item>
</u-form>
</view>
<view class="bg">
<view class="title"> 身份证信息 </view>
<view class="picture-wrapper" @click="takePhotoMode('1',false)">
<view class="picture-wrapper">
<view class="bg">
<view class="">
<view class="name"> 人像面 </view>
@@ -28,11 +13,11 @@
<image v-if="!state.form.userPosImagesUrl" class="icon" :src="`${$imgUrl}issuance/sfz.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.userPosImagesUrl)"
<image v-else class="icon" :src="state.form.userPosImagesUrl"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<view class="picture-wrapper" @click="takePhotoMode('2',false)">
<view class="picture-wrapper">
<view class="bg">
<view class="">
<view class="name"> 国徽面 </view>
@@ -44,28 +29,28 @@
<image v-if="!state.form.userNegImagesUrl" class="icon" :src="`${$imgUrl}issuance/sff.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.userNegImagesUrl)"
<image v-else class="icon" :src="state.form.userNegImagesUrl"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item label="申请人姓名" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input v-model="state.form.name" placeholder='请输入姓名'
maxlength="20" @blur="replaceInput($event,1)" inputAlign="right"/>
<text class="disabled-text">{{state.form.name}}</text>
<!-- <u-input v-model="" placeholder='请输入姓名' maxlength="20" @blur="replaceInput($event,1)" inputAlign="right"/> -->
</u-form-item>
<u-form-item label="证号号码" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input placeholder='请输入证件号码' type="idcard" v-model="state.form.customerIdNum"
maxlength="18" inputAlign="right"/>
<!-- <u-input placeholder='请输入证件号码' type="idcard" v-model="state.form.customerIdNum" maxlength="18" inputAlign="right"/> -->
<text class="disabled-text">{{state.form.userIdNum}}</text>
</u-form-item>
<u-form-item label="手机号" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input placeholder='请输入手机号' type="number" v-model="state.form.mobile"
maxlength="11" inputAlign="right"/>
<!-- <u-input placeholder='请输入手机号' type="number" v-model="state.form.mobile" maxlength="11" inputAlign="right"/> -->
<text class="disabled-text">{{state.form.mobile}}</text>
</u-form-item>
</u-form>
</view>
<view class="bg">
<view class="title"> 行驶证信息 </view>
<view class="picture-wrapper" @click="takePhotoMode('3')">
<view class="picture-wrapper" @click="takePhotoMode(3)">
<view class="bg">
<view class="">
<view class="name"> 行驶证主页 </view>
@@ -81,7 +66,7 @@
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}"></image>
</view>
</view>
<view class="picture-wrapper" @click="takePhotoMode('4')">
<view class="picture-wrapper" @click="takePhotoMode(4)">
<view class="bg">
<view class="">
<view class="name"> 行驶证副页 </view>
@@ -98,177 +83,160 @@
</view>
</view>
<u-form label-width="200" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item label="车主姓名" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input v-model="state.form.vehicleOwnerName" placeholder="请输入车主姓名" input-align='right'/>
</u-form-item>
<u-form-item label="车牌号" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<car-number-input @numberInputResult="carNumber" :defaultStr="state.form.vehiclePlate"></car-number-input>
</u-form-item>
<u-form-item label="所有人" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<u-input inputAlign="right" placeholder="请输入所有人" v-model="state.form.vehicleOwnerName" maxlength="20" />
</u-form-item>
<u-form-item label="车牌颜色" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon'>
<!-- <uni-data-select v-model="state.form.vehiclePlateColor" :localdata="state.colorRange" @change="changeColor"
:clear="false"></uni-data-select> -->
<u-input v-model="state.form.vehiclePlateColorStr" type="select" @click="show1 = true" input-align='right'/>
<u-input v-model="state.vehiclePlateColorStr" type="select" @click="show1 = true" input-align='right'/>
</u-form-item>
</u-form>
</view>
<template v-if="state.isNeedSubmitCarOwnerInfo">
<view class="bg" v-if="state.form.applyType=='2'">
<view class="title"> 单位资料信息 </view>
<view class="picture-wrapper" @click="cardImageOcrYY()">
<view class="bg">
<view class="">
<view class="name"> 营业执照 </view>
<view class="value"> 上传企业的营业执照 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</view>
</view>
<image v-if="!state.form.unitImagesUrl" class="icon" :src="`${$imgUrl}applyCard/zhizhao.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.unitImagesUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}"></image>
<view class="car-type" id="inputCarOnerInfo">
<view
class="car-type-item"
v-for="(item, index) in carOwnerList"
:key="index"
:class="{active: state.form.ownerIdType == item.value}" @click="toggleApplyType(item)">
{{item.name}}
</view>
</view>
<view class="picture-wrapper" @click="cardFileImageUpdate()">
<view class="bg">
<view class="">
<view class="name"> 授权书 </view>
<view class="value"> 上传授权书 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
<view class="bg">
<view class="title"> {{ labelName.title }} </view>
<template v-if="state.form.ownerIdType === '101'">
<view class="picture-wrapper" @click="takePhotoMode(1)">
<view class="bg">
<view class="">
<view class="name"> 人像面 </view>
<view class="value"> 上传身份证的人像面 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</view>
</view>
<image v-if="!state.form.ownerPosImgUrl" class="icon" :src="`${$imgUrl}issuance/sfz.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.ownerPosImgUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
<!-- <view class="down" @click="downAuthD">模板下载</view> -->
</view>
<image v-if="!state.form.proxyUrl" class="icon" :src="`${$imgUrl}issuance/weituo.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.proxyUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}"></image>
</view>
</view>
<u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item label="单位名称" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' border-bottom=true>
<u-input v-model="state.form.orgName" placeholder='请输入单位名称'
maxlength="20" @blur="replaceInput($event,2)" inputAlign="right"/>
</u-form-item>
<u-form-item label="证号号码" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' border-bottom=true>
<u-input placeholder='请输入证件号码' type="idcard" v-model="state.form.unitId"
maxlength="18" inputAlign="right"/>
</u-form-item>
</u-form>
</view>
<!-- 个人 非本人 展示 -->
<view class="bg" v-if="state.form.applyType=='1' && state.form.isSelf=='2'">
<view class="title"> 车主信息 </view>
<view class="picture-wrapper" @click="takePhotoMode('1',true)">
<view class="bg">
<view class="">
<view class="name"> 车主身份证 </view>
<view class="name"> 人像面 </view>
<view class="value"> 上传身份证的人像面 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
<view class="picture-wrapper" @click="takePhotoMode(2)">
<view class="bg">
<view class="">
<view class="name"> 国徽面 </view>
<view class="value"> 上传身份证的国徽面 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</view>
</view>
<image v-if="!state.form.ownerNegImgUrl" class="icon" :src="`${$imgUrl}issuance/sff.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.ownerNegImgUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<image v-if="!state.form.ownerPosImgUrl" class="icon" :src="`${$imgUrl}issuance/sfz.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.ownerPosImgUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<view class="picture-wrapper" @click="takePhotoMode('2',true)">
<view class="bg">
<view class="">
<view class="name"> 车主身份证 </view>
<view class="name"> 国徽面 </view>
<view class="value"> 上传身份证的国徽面 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</template>
<template v-else-if="state.form.ownerIdType === '203'">
<view class="picture-wrapper" @click="takePhotoMode(5)">
<view class="bg">
<view class="">
<view class="name"> 营业执照 </view>
<view class="value"> 上传营业执照 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</view>
</view>
<image v-if="!state.form.ownerPosImgUrl" class="icon" :src="`${$imgUrl}issuance/sfz.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.ownerPosImgUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<image v-if="!state.form.ownerNegImgUrl" class="icon" :src="`${$imgUrl}issuance/sff.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.ownerNegImgUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
</view>
<u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item label="车主姓名" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' border-bottom=true>
<u-input v-model="state.form.ownerName" placeholder='请输入车主姓名'
maxlength="20" @blur="replaceInput($event,3)" inputAlign="right"/>
</u-form-item>
<u-form-item label="证号号码" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' border-bottom=true>
<u-input placeholder='请输入证件号码' type="idcard" v-model="state.form.ownerIdNum"
maxlength="18" inputAlign="right"/>
</u-form-item>
</u-form>
<view class="picture-wrapper" @click="cardFileImageUpdate()">
<view class="bg">
<view class="">
<view class="name"> 授权书 </view>
<view class="value"> 上传授权书 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</template>
<view class="picture-wrapper" @click="uploadOtherFile">
<view class="bg">
<view class="">
<view class="name"> 授权书 </view>
<view class="value"> 上传授权书 </view>
<view class="tip">
<view class="tip-value"> 拍摄规范 </view>
</view>
</view>
<!-- <view class="down" @click="downAuthD">模板下载</view> -->
<image v-if="!state.form.proxyUrl" class="icon" :src="`${$imgUrl}issuance/weituo.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.proxyUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png`}"></image>
</view>
<image v-if="!state.form.proxyUrl" class="icon" :src="`${$imgUrl}issuance/weituo.png`"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}">
</image>
<image v-else class="icon" :src="getFullImageUrl(state.form.proxyUrl)"
:style="{'--bgimg':`url(${$imgUrl}issuance/bg-border.png)`}"></image>
</view>
<u-form label-width="230" :model="state.form" ref="uForm" :label-style='labelStyle'>
<u-form-item :label="labelName.ownerName" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input v-model="state.form.ownerName" placeholder='请输入' maxlength="20" @blur="replaceInput($event,1)" inputAlign="right"/>
</u-form-item>
<u-form-item :label="labelName.ownerIdNum" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input placeholder='请输入' v-model="state.form.ownerIdNum" maxlength="18" inputAlign="right"/>
</u-form-item>
<u-form-item :label="labelName.ownerIdAddress" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input placeholder='请输入' v-model="state.form.ownerIdAddress" maxlength="18" inputAlign="right"/>
</u-form-item>
<u-form-item label="车主手机号" :left-icon='`${$imgUrl}issuance/point-form.png`' :left-icon-style='leftIcon' borderBottom>
<u-input placeholder='请输入手机号' type="number" v-model="state.form.ownerTel" maxlength="11" inputAlign="right"/>
</u-form-item>
</u-form>
</view>
</view>
</template>
<view class="action">
<button type="default" class="ui-btn" @click="savaHandle()">
提交
</button>
</view>
<view class="choice-takePhoto-wrap" v-if="state.isTakePhotoModeShow" @click="cancle">
<view class="choice-takePhoto">
<view @click.stop="takePhoto(state.choiceIndex)" style="border-radius: 20rpx 20rpx 0 0;">拍照</view>
<view @click.stop="xiangce(state.choiceIndex)">从手机相册选择</view>
<view @click.stop="cancle">取消</view>
</view>
</view>
<viewfinder v-if="state.phoneType" :phoneType="state.phoneType" :images="state.images"
:showStartPhoto="state.showImg" @confirmReturn="confirmReturn" @camera="camera"></viewfinder>
<!--证件照上传 start-->
<uploadOcr
:isTakePhotoModeShow="state.isTakePhotoModeShow"
:phoneType="state.choiceIndex"
@close="close"
@ocrResult="ocrResult">
</uploadOcr>
<!--证件照上传 end-->
<!-- 选择车牌颜色 -->
<u-select v-model="show1" :list="state.colorRange" @confirm="changeColor"></u-select>
<!-- 选择是否是本人 -->
<u-select v-model="isSelfSelect" :list="state.isSelfRange" @confirm="changeIsSelf"></u-select>
</template>

<script setup lang="ts">
import {
reactive,
ref
} from "vue";
import { reactive, ref, computed } from "vue";
import {
onLoad
} from "@dcloudio/uni-app";
import {
idCardOcr,
vehicleLicenseOcr,
releasePlateaApply,
ocrAllQuery
} from "@/utils/network/api.js";
import { idCardOcr, vehicleLicenseOcr, releasePlateaApply, ocrAllQuery, getUserMsg, vehicleUpload } from "@/utils/network/api.js";
import {requestNew} from "@/utils/network/request.js";
import { getItem } from "@/utils/storage.ts"
import viewfinder from "@/components/viewfinder.vue"
import carNumberInput from "@/components/car-number-input/car-number-input.vue";
import {
navTo, uploadFile,msg, getFullImageUrl
} from "@/utils/utils";
import { navTo, uploadFile,msg, getFullImageUrl } from "@/utils/utils";
import uploadOcr from '@/components/uploadOcr';
interface OCRData {
imageUrl: string,
bizContent: string,
screditCode: string,
enddate: string
}
// ########
const labelStyle = {
color: "#004576",
@@ -281,17 +249,17 @@
'align-items': 'center',
'margin-right': '4rpx',
}
const ownerCurrent = ref(0);
const carOwnerList = ref([
{ name: "个人", value: "101" },
{ name: "企业", value: "203" },
])
const show1 = ref(false)
const isSelfSelect = ref(false)
const state = reactive({
applyTypeRange:[{
value: "1",
text: "个人车辆"
}, {
value: "2",
text: "单位车辆"
}],
isSelfRange:[
{
value: "1",
@@ -307,84 +275,68 @@
isTakePhotoModeShow: false, //选择拍照方式是否出来
images: '',
form: {
applyType: "1",//1个人,2单位
isSelf: "1",//是否本人 1是,2否
isSelfStr: '是',
name: "", // 开户人姓名
userPosImagesUrl: '',
userNegImagesUrl: '',
userIdNum: '',
mobile:"",
name: "", //开户人姓名
customerIdNum: "", //用户证件号码
userPosImagesUrl: "", //身份证正面
userNegImagesUrl: "", //身份证反面
vehPosImgUrl: "", //行驶证正面
vehNegImgUrl: "", //行驶证证反面
vehiclePlate:"",
vehiclePlateColor:"",
vehicleOwnerName:"", //车主姓名,ocr识别行驶证
ownerPosImgUrl:"",//车主身份证件人面地址
ownerNegImgUrl:"",//车主身份证件国徽地址
vehiclePlate: "",
vehiclePlateColor: "",
vehicleOwnerName: "", //车主姓名,ocr识别行驶证
ownerName: "",
ownerPosImgUrl: "",
ownerNegImgUrl: "",
ownerIdNum:"",//车主证件号
ownerName:"",//车主姓名
ownerIdAddress: "",
ownerIdType: "",
ownerTel: "",
proxyUrl:"",//授权书图片地址
unitImagesUrl:"",//营业执照图片地址
unitId:"",//单位证件编号
orgName:"",
unitIdType:"", // 单位证件类型,营业执照:字典code:203
vehiclePlateColorStr:""
},
vehiclePlateColorStr: "",
colorRange: [],
ownerInfo:false,//非本人 个人 车主信息true ==== 本人 个人 false
isNeedSubmitCarOwnerInfo: false, // 是否需要上传车主信息
});
const changeapplyType = (e) => {
state.form.applyType = e
console.log("111",e,state.applyTypeRange)
}
const changeColor = (item: any) => {
state.form.vehiclePlateColor = item[0].value
state.form.vehiclePlateColorStr = item[0].label
}
const changeIsSelf = (item: any) => {
if (item && item.length > 0) {
state.form.isSelf = item[0].value
state.form.isSelfStr = item[0].label
// 如果是本人,对非本人信息进行个清空
if (item[0].value == '1') {
state.form.ownerPosImgUrl = ''
state.form.ownerNegImgUrl = ''
state.form.ownerName = ''
state.form.ownerIdNum = ''
state.form.proxyUrl = ''
const labelName = computed(() => {
if (state.form.ownerIdType === '101') {
return {
title: "车主身份证信息",
ownerName: '车主姓名',
ownerIdNum: "车主证件号码",
ownerIdAddress: '证件地址',
}
} else if (state.form.ownerIdType === '203') {
return {
title: "单位证件相关信息",
ownerName: '单位名称',
ownerIdNum: "单位识别码",
ownerIdAddress: '单位地址',
}
} else {
return {
ownerName: '',
ownerIdNum: "",
ownerIdAddress: '',
}
}
})
const changeColor = (item: any) => {
state.form.vehiclePlateColor = item[0].value
state.vehiclePlateColorStr = item[0].label
}
//车牌号输入
const carNumber = (val : any) => {
state.form.vehiclePlate = val.trim();
};
const replaceInput = (event,val) => {
if(val==1){
state.form.name=event.replace(/\s/g, "")
}else if(val==2){
state.form.orgName=event.replace(/\s/g, "")
}else if(val==3){
state.form.ownerName=event.replace(/\s/g, "")
}
console.log("event", event,val,state.form.name)
}
const savaHandle = () => {
if (!paramsVerify()) return;
// 单位
if(state.form.applyType=='2'){
// 非本人办理
state.form.isSelf='2'
state.form.unitIdType='203'
}
let params = state.form
const options = {
@@ -395,65 +347,67 @@
};
requestNew(releasePlateaApply, options).then((res) => {
console.log(res);
navTo(`/subpackage/after-sale/rescind-carId/result`);
// 需不需要上传车主信息,1: 需要 2:不需要
if (res.flag === 2) {
uni.reLaunch({
url: `/subpackage/after-sale/rescind-carId/result`
})
} else {
msg('请上传车主相关信息')
state.form.ownerIdType = carOwnerList.value[0].value
console.log(state.form.ownerIdType)
console.log(carOwnerList.value)
state.isNeedSubmitCarOwnerInfo = true
setTimeout(() => {
scrollToElement()
}, 500)
}
});
};
// 必填字段校验
const paramsVerify = () => {
let isVerify = true;
if(!state.form.applyType){
msg('请选择车辆类型');
isVerify = false;
}
if(state.form.applyType=='1'){
if(!state.form.isSelf){
msg('请选择是否本人');
isVerify = false;
}
}
if(!state.form.userPosImagesUrl){
msg('请上传身份证正面');
isVerify = false;
}
if(!state.form.userNegImagesUrl){
msg('请上传身份证反面');
isVerify = false;
}
if(!state.form.name){
msg('请输入姓名');
isVerify = false;
}
if(!state.form.customerIdNum){
msg('请输入证件号码');
isVerify = false;
}
if(!state.form.mobile){
msg('请输入手机号');
isVerify = false;
}
if(!state.form.vehPosImgUrl){
msg('请上传行驶证主页');
isVerify = false;
}
if(!state.form.vehNegImgUrl){
msg('请上传行驶证副页');
isVerify = false;
}
if(!state.form.vehiclePlate){
msg('请输入车牌号');
isVerify = false;
}
if(!state.form.vehicleOwnerName){
msg('请输入所有人');
isVerify = false;
}
if(!state.form.vehiclePlateColor){
msg('请选择车牌颜色');
if(!state.form.vehPosImgUrl){
msg('请上传行驶证主页');
isVerify = false;
} else if(!state.form.vehNegImgUrl){
msg('请上传行驶证副页');
isVerify = false;
} else if(!state.form.vehiclePlate){
msg('请输入车牌号');
isVerify = false;
} else if(!state.form.vehiclePlateColor){
msg('请选择车牌颜色');
isVerify = false
} else if (state.isNeedSubmitCarOwnerInfo) {
if(state.form.ownerIdType === '101' && !state.form.ownerPosImgUrl){
msg('请上传车主身份证人像面照片');
isVerify = false
} else if(state.form.ownerIdType === '203' && !state.form.ownerPosImgUrl){
msg('请上传公司营业执照');
isVerify = false
} else if(state.form.ownerIdType === '101' && !state.form.ownerNegImgUrl){
msg('请上传车主身份证国徽面照片');
isVerify = false
} else if(!state.form.ownerName){
msg(`请填写${labelName.value.ownerName}`);
isVerify = false
} else if(!state.form.ownerIdNum){
msg(`请填写${labelName.value.ownerIdNum}`);
isVerify = false
} else if(!state.form.ownerIdAddress){
msg(`请填写${labelName.value.ownerIdAddress}`);
isVerify = false
} else if(!state.form.ownerTel){
msg('请填写车主手机号');
isVerify = false
} else if(!state.form.proxyUrl){
msg('请上传授权书');
isVerify = false
}
}
return isVerify;
}
@@ -467,135 +421,124 @@
obj['label'] = getColor[k]['name']
state.colorRange.push(obj)
}
getUserInfo()
});
const cardFileImageUpdate = () => {
uni.chooseImage({
count: 1, //只能选取一张照片
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有
sourceType: ["camera", "album"], //从相册选择
success: function (res) {
uploadFile(res.tempFilePaths[0], "", "").then((data) => {
state.form.proxyUrl = data;
})
},
});
};


const xiangce = (val) => {
console.log("val", val)
var imageType = val;
uni.chooseImage({
count: 1, //只能选取一张照片
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有
sourceType: ["album"], //从相册选择
success: function (res) {
state.showImg = false
state.images = res.tempFilePaths[0]
state.phoneType = state.choiceIndex
state.isTakePhotoModeShow = false
console.log("tempFilePaths[0].startsWith('file://')", res.tempFilePaths[0], res.tempFilePaths[0].startsWith('file://'))

},
})
}
const takePhoto = (val) => {
state.showImg = true
console.log("拍照", val)
state.phoneType = val;
const cancle = () => {
state.isTakePhotoModeShow = false
}
const confirmReturn = (val) => {
const camera = () => {
state.phoneType = 0
state.isTakePhotoModeShow = false
var imageType = 1;
// state.choiceIndex 1: 身份证中面 2:身份证反面 3:行驶证正面 4:行驶证反面
if (state.choiceIndex == 1) {
imageType = 1
} else if (state.choiceIndex == 2) {
imageType = 100
} else if (state.choiceIndex == 3) {
imageType = 3
} else if (state.choiceIndex == 4) {
imageType = 100
}

uploadFile(val.tempImagePath, imageType).then((data) => {
console.log(data)
if (state.choiceIndex == 1) {
if(state.ownerInfo){
state.form.ownerPosImgUrl = data.imageUrl;
state.form.ownerName = data.name;
state.form.ownerIdNum = data.idno;
}else{
// 谁上传就是谁的信息
state.form.name = data.name;
state.form.customerIdNum = data.idno;
state.form.userPosImagesUrl = data.imageUrl;
}
} else if (state.choiceIndex == 2) {
if(state.ownerInfo){
state.form.ownerNegImgUrl = data.imageUrl;
}else{
state.form.userNegImagesUrl = data.imageUrl;
}

} else if (state.choiceIndex == 3) {
state.form.vehiclePlate = data.plate_a;
state.form.vehicleOwnerName = data.man;
state.form.vehPosImgUrl = data.imageUrl;
} else if (state.choiceIndex == 4) {
state.form.vehNegImgUrl = data.imageUrl;
}
state.isTakePhotoModeShow = false
})
}
const takePhotoMode = (index,ownerInfo) => {
console.log("index", index)
const close = (e) => {
state.isTakePhotoModeShow = e
}
const takePhotoMode = (index: number) => {
state.isTakePhotoModeShow = true
state.choiceIndex = index
state.ownerInfo=ownerInfo
}
const cancle = () => {
state.isTakePhotoModeShow = false
const ocrResult = (data: OCRData) => {
let bizContent = data.bizContent = data.bizContent ? JSON.parse(data.bizContent) : {}
// 1: 身份证正面 2:身份证反面 3: 行车本正页 4:行车本副业 5:营业执照
if (state.choiceIndex === 1) {
state.form.ownerName = bizContent.name
state.form.ownerIdNum = bizContent.idno
state.form.ownerIdAddress = bizContent.address
state.form.ownerPosImgUrl = bizContent.imageUrl
} else if (state.choiceIndex === 5) {
state.form.ownerName = bizContent.unitName
state.form.ownerIdNum = bizContent.screditCode
state.form.ownerIdAddress = bizContent.address
state.form.ownerPosImgUrl = bizContent.imageUrl
} else if (state.choiceIndex === 2) {
state.form.ownerNegImgUrl = bizContent.imageUrl
} else if (state.choiceIndex === 3) {
state.form.vehicleOwnerName = bizContent.man
state.form.vehPosImgUrl = bizContent.imageUrl
if (bizContent.plate_a.length > 8) {
state.form.vehiclePlate = bizContent.plate_a.substring(0, 8);
} else {
state.form.vehiclePlate = bizContent.plate_a;
}
} else if (state.choiceIndex === 4) {
state.form.vehNegImgUrl = bizContent.imageUrl
}
}
const camera = () => {
state.phoneType = 0
interface uploadFileParams{
imageUrl: string
}
//营业执照Orc接口调用
const cardImageOcrYY = () => {
// 授权证书上传
const uploadOtherFile = () => {
uni.chooseImage({
count: 1, //只能选取一张照片
count: 1, // 只能选取一张照片
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有
sourceType: ["camera", "album"], //从相册选择
success: function (res) {
uploadFile(res.tempFilePaths[0], 5).then((data) => {
state.form.orgName =data.unitName;
state.form.unitId =data.screditCode;
state.form.unitImagesUrl =data.imageUrl;
success: (res) => {
uploadFile(res.tempFilePaths[0]).then((data: uploadFileParams) => {
state.form.proxyUrl = data.imageUrl
})
},
});
};
}
// 切换车辆类型
const toggleApplyType = (type:string) => {
state.form.applyType = type;
if (type == '2') {
state.form.ownerPosImgUrl = ''
state.form.ownerNegImgUrl = ''
state.form.ownerName = ''
state.form.ownerIdNum = ''
state.form.proxyUrl = ''
} else if (type == '1') {
state.form.unitImagesUrl = ''
state.form.proxyUrl = ''
state.form.orgName = ''
state.form.unitId = ''
// 获取当前用户信息详情
const getUserInfo = () => {
let option = {
type: 2,
data: {},
method: "POST",
showLoading: true,
}
requestNew(getUserMsg, option).then(res => {
state.form.name = res.userName
state.form.userPosImagesUrl = res.userPosImgUrl
state.form.userNegImagesUrl = res.userNegImgUrl
state.form.userIdNum = res.userIdNum
state.form.mobile = res.mobile
})
}
const toggleApplyType = (item) => {
state.form.ownerIdType = item.value;
state.form.ownerName = "";
state.form.ownerPosImgUrl = "";
state.form.ownerNegImgUrl = "";
state.form.ownerIdNum = "";
state.form.ownerIdAddress = "";
state.form.proxyUrl = "";
state.form.ownerTel = "";
}
// 跳转原原色
const scrollToElement = () => {
uni.createSelectorQuery()
.select('#inputCarOnerInfo') // 选择目标元素
.boundingClientRect((rect) => { // 获取元素的位置信息
console.log(rect)
if (rect) {
// rect 对象包含了元素的位置信息,如 top, left, width, height 等
console.log('Element position:', rect);
// 使用 uni.pageScrollTo 跳转到该元素位置
uni.pageScrollTo({
scrollTop: rect.top, // 滚动到目标元素的顶部位置
duration: 300, // 滚动动画的持续时间(毫秒)
});
}
})
.exec(); // 执行查询
};
</script>

<style lang="scss" scoped>
@@ -760,4 +703,14 @@
background-color: #CCB375;
}
}
.disabled-text{
color: #999999;
}
.uni-list{
width: 88%;
margin: 24rpx auto;
.left-owner-radio{
margin-right: 12rpx;
}
}
</style>

+ 2
- 3
subpackage/orders/opening-account-people.vue 查看文件

@@ -714,7 +714,7 @@
width: 100%;
min-height: calc(100% - 370rpx);
box-sizing: border-box;
padding: 0 30rpx 210rpx;
padding: 0 30rpx 272rpx;


.t-con {
@@ -782,7 +782,6 @@
position: absolute;
bottom: 0rpx;
left: 0;
height: 188rpx;
background-color: #fff;
border-radius: 30rpx 30rpx 0 0;
width: 100vw;
@@ -790,7 +789,7 @@
align-items: center;
justify-content: center;
flex-direction: column;
padding: 24rpx 24rpx calc(24rpx + env(safe-area-inset-bottom));
.btn-tip {
font-family: SourceHanSansSC, SourceHanSansSC;
font-weight: 400;

+ 3
- 3
subpackage/personal-center/setting/personal-information/change-user-info.vue 查看文件

@@ -154,19 +154,19 @@
</FixedFooter>
<!--证件照上传 start-->
<uploadImg
<uploadOcr
:isTakePhotoModeShow="state.isTakePhotoModeShow"
:phoneType="state.choiceIndex"
@close="close"
@ocrResult="ocrResult">
</uploadImg>
</uploadOcr>
<!--证件照上传 end-->
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import { onReady, onLoad } from "@dcloudio/uni-app";
import uploadImg from '@/components/uploadOcr';
import uploadOcr from '@/components/uploadOcr';
import { msg, getFullImageUrl, compareDates, checkStr } from "@/utils/utils";
import { changeUserInfo, sendMessage, getUserMsg, getCustomerDetail, userInfoIndex } from '@/utils/network/api'
import { requestNew } from "@/utils/network/request.js";

+ 0
- 3
utils/network/request.js 查看文件

@@ -317,9 +317,6 @@ export function requestNew(code, options = {}, start = false, clie = () => {}) {
accessToken: getItem(StorageKeys.Token),
customerId: getItem('userInfo') ? (getItem('userInfo')['customerId'] || '' ) : "",
};
console.log("Common", Common, getItem("customerObj"));
// options.url = envs[process.env.NODE_ENV].baseUrl+'/prod' + code
// options.url = envs[process.env.NODE_ENV].baseUrl + "/newProd/prod" + code;
if (process.env.NODE_ENV === 'development') {
options.url = envs[process.env.NODE_ENV].baseUrl + "/newDev/ndev" + code;
// options.url = envs[process.env.NODE_ENV].baseUrl + "/newProd/prod" + code;

+ 2
- 4
utils/utils.ts 查看文件

@@ -552,7 +552,7 @@ function formatNumber(n : any) {
n = n.toString()
return n[1] ? n : `0${n}`
}
export const uploadFile = (tempImagePath, imageType) => {
export const uploadFile = (tempImagePath, imageType: number | string = 100) => {
console.log("tempImagePath", tempImagePath, tempImagePath.size,imageType)
return new Promise((resolve, reject) => {
let url = ''
@@ -571,7 +571,7 @@ export const uploadFile = (tempImagePath, imageType) => {
},
success: (uploadFileRes) => {
console.log("uploadFileRes", uploadFileRes, JSON.parse(uploadFileRes.data).data.ossFilePath)
if (parseInt(imageType) >= 99) {
if (!imageType || parseInt(imageType) >= 99) {
resolve({ imageUrl: JSON.parse(uploadFileRes.data).data.ossFilePath })
return
}
@@ -586,9 +586,7 @@ export const uploadFile = (tempImagePath, imageType) => {
showLoading: true,
};
requestNew(ocrDo, options).then((res) => {
console.log("res===", res)
const data = { ...res, imageUrl: JSON.parse(uploadFileRes.data).data.ossFilePath,imageName: res.imageUrl };
console.log('输出内容=====123', data)
resolve(data)
});


Loading…
取消
儲存