2155 lines
69 KiB
Vue
2155 lines
69 KiB
Vue
<template>
|
||
<div class="main">
|
||
<div class="topMessage">
|
||
<div class="messageTitle">请输入您的车牌号</div>
|
||
<div class="messageList">
|
||
<div class="messageText">
|
||
1、您授权的车牌信息安全将被严格保证，并限于您授权的用途；
|
||
</div>
|
||
<div class="messageText">2、1个车牌号仅允许被1个账号绑定。</div>
|
||
</div>
|
||
<image class="carLogo" src="https://eshangtech.com/wanmeiyizhanImg/home/carLogoBg.png" />
|
||
</div>
|
||
|
||
<!-- 输入车牌号的框 -->
|
||
<div class="codeBox">
|
||
<!-- 切换一下 是燃油车 还是 新能源 -->
|
||
<div class="carTypeChange" @click="handleChangeCar">
|
||
<view class="carTypeLeft">
|
||
<span class="typeName">{{ carType === 1 ? '燃油车牌' : carType === 2 ? '新能源牌' : '' }}</span>
|
||
</view>
|
||
|
||
<view class="carTypeRight">
|
||
<image class="changeIcon"
|
||
:src="carType === 1 ? '/static/home/newChangeCarType.svg' : '/static/home/normalChargeIcon.svg'" />
|
||
<span class="carType" :style="{ color: carType === 1 ? '#50D000' : '#0077FF' }">{{ carType === 1 ? '新能源' :
|
||
carType === 2 ? '燃油车' :
|
||
'' }}</span>
|
||
</view>
|
||
</div>
|
||
|
||
<div class="input-box">
|
||
<div :class="haveCode ? 'input-f cccBg' : nowIndex === i ? 'input-f orangeRedBorder' : 'input-f'"
|
||
v-for="(item, i) in normalLen" :key="i" @tap="focusInput(i)">
|
||
<div :class="i === 7 && carType === 1 ? 'show-input disabledBox' : 'show-input'">
|
||
<image style="width: 38rpx;height: 38rpx;" class="disabledIcon" v-if="i === 7 && carType === 1"
|
||
src="/static/home/disabledCode.svg" />
|
||
<span v-else>{{ saveCarText[i] }}</span>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="input-f lastBox" @tap="handleChangeCarType">
|
||
<div calss="show-input">
|
||
<span class="text-sm">{{ newEnergy ? "新能源" : "" }}</span>
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div class="bindTypeBox" v-if="!haveCode">
|
||
<span class="bindTrain" @click="handleChangeBindType">{{
|
||
bindCarType === 1 ? "绑定货车" : "绑定轿车"
|
||
}}</span>
|
||
</div> -->
|
||
|
||
<view>
|
||
<div class="bindPopup">
|
||
<div class="popupTitle">绑定车辆</div>
|
||
|
||
|
||
<div class="fileItem">
|
||
<div class="itemTitle">身份证<span style="color: red;margin-left: 8rpx;">*</span></div>
|
||
<div class="newUploadImgBox">
|
||
<div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(1)>
|
||
<view class="leftText">{{ codeImgObj.frontIDCard ? '身份证人像面' : '请上传身份证人像面' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.frontIDCard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
|
||
<div class="imgItem" @click=handleShowUplodaPopup(2)>
|
||
<view class="leftText">{{ codeImgObj.reverseIDcard ? '身份证国徽面' : '请上传身份证国徽面' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.reverseIDcard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div class="uploadImgBox">
|
||
<div class="submitImgBox" v-if="!codeImgObj.frontIDCard" @click="submitImg('1', '1')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText">请上传身份证人像面</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.frontIDCard" @click="submitImg('1', '1')" mode="aspectFill" />
|
||
</div>
|
||
|
||
<div class="submitImgBox" v-if="!codeImgObj.reverseIDcard" @click="submitImg('1', '2')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText">请上传身份证国徽面</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.reverseIDcard" @click="submitImg('1', '2')" mode="aspectFill" />
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
|
||
<div class="fileItem">
|
||
<div class="itemTitle">驾驶证<span style="color: red;margin-left: 8rpx;">*</span></div>
|
||
<div class="newUploadImgBox">
|
||
<div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(3)>
|
||
<view class="leftText">{{ codeImgObj.frontDriverCard ? '驾驶证主页' : '请上传驾驶证主页' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.frontDriverCard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
|
||
<div class="imgItem" @click=handleShowUplodaPopup(4)>
|
||
<view class="leftText">{{ codeImgObj.reverseDriverCard ? '驾驶证副页' : '请上传驾驶证副页' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.reverseDriverCard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div class="uploadImgBox">
|
||
<div class="submitImgBox" v-if="!codeImgObj.frontDriverCard" @click="submitImg('2', '1')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText"><span style="color: red">*</span>请上传驾驶证主页</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.frontDriverCard" @click="submitImg('2', '1')" mode="aspectFill" />
|
||
</div>
|
||
|
||
<div class="submitImgBox" v-if="!codeImgObj.reverseDriverCard" @click="submitImg('2', '2')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText">请上传驾驶证副页</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.reverseDriverCard" @click="submitImg('2', '2')" mode="aspectFill" />
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
|
||
<div class="fileItem">
|
||
<div class="itemTitle">行驶证<span style="color: red;margin-left: 8rpx;">*</span></div>
|
||
|
||
<div class="newUploadImgBox">
|
||
<div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(5)>
|
||
<view class="leftText">{{ codeImgObj.frontLicenseCard ? '行驶证主页' : '请上传行驶证主页' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.frontLicenseCard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
|
||
<div class="imgItem" @click=handleShowUplodaPopup(6)>
|
||
<view class="leftText">{{ codeImgObj.reverseLicenseCard ? '行驶证副页' : '请上传行驶证副页' }}</view>
|
||
<view class="rightBox">
|
||
<span class="rightText">{{ codeImgObj.reverseLicenseCard ? '上传成功' : '点击上传' }}</span>
|
||
<image class="rightIcon" src="/static/home/rightRow.svg" />
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<!-- <div class="uploadImgBox">
|
||
<div class="submitImgBox" v-if="!codeImgObj.frontLicenseCard" @click="submitImg('3', '1')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText"><span style="color: red">*</span>请上传行驶证主页</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.frontLicenseCard" @click="submitImg('3', '1')" mode="aspectFill" />
|
||
</div>
|
||
|
||
<div class="submitImgBox" v-if="!codeImgObj.reverseLicenseCard" @click="submitImg('3', '2')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
<span class="submitText">请上传行驶证副页</span>
|
||
</div>
|
||
<div class="imgItem" v-else>
|
||
<image :src="codeImgObj.reverseLicenseCard" @click="submitImg('3', '2')" mode="aspectFill" />
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
<!-- 确认绑定按钮 -->
|
||
<div class="confirmBox" @click="handleConfirmCode" v-if="!haveCode">
|
||
确认绑定
|
||
</div>
|
||
<!-- 取消绑定 -->
|
||
<div class="cancelBox" @click="handleCancelCode" v-if="haveCode">
|
||
解绑车辆
|
||
</div>
|
||
|
||
<uni-popup ref="uploadPopup" :show="showPopup" :safe-area="false" :mask-click="false" :is-mask-click="false">
|
||
<view class="uploadBox">
|
||
<image class="closeIcon" src="/static/home/newCloseIcon.svg" @click="handleHideUplodaPopup" />
|
||
<div class="uploadTitle">{{
|
||
popupType === 1 ? '身份证人像面' :
|
||
popupType === 2 ? '身份证国徽面' :
|
||
popupType === 3 ? '驾驶证主页' :
|
||
popupType === 4 ? '驾驶证副页' :
|
||
popupType === 5 ? '行驶证主页' :
|
||
popupType === 6 ? '行驶证副页' : ''
|
||
}}</div>
|
||
|
||
<div class="imgBox" :style="{
|
||
backgroundImage: `url(${popupType === 1 ? codeImgObj.frontIDCard :
|
||
popupType === 2 ? codeImgObj.reverseIDcard :
|
||
popupType === 3 ? codeImgObj.frontDriverCard :
|
||
popupType === 4 ? codeImgObj.reverseDriverCard :
|
||
popupType === 5 ? codeImgObj.frontLicenseCard :
|
||
popupType === 6 ? codeImgObj.reverseLicenseCard : '#E8E8E8'
|
||
})`
|
||
}" @click="handlePriview"></div>
|
||
|
||
<div class="uploadAgain" @click="handleUploadAgain">重新上传</div>
|
||
|
||
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<!-- 货车司机 -->
|
||
<!-- <div class="confirmBox" style="margin-top: 26rpx" @click="handleBindTruck">
|
||
绑定货车
|
||
</div> -->
|
||
|
||
<!-- <uni-popup
|
||
ref="popup"
|
||
:show="showPopup"
|
||
:safe-area="false"
|
||
@close="handleClosePopup"
|
||
@maskClick="handleClosePopup"
|
||
>
|
||
<div class="bindPopup">
|
||
<div class="fileItem">
|
||
<div class="itemTitle">身份证<span style="color: red">*</span></div>
|
||
<div class="uploadImgBox">
|
||
<div class="submitImgBox" @click="submitImg('1')">
|
||
<image class="addIcon" src="/static/home/addImageIcon.svg" />
|
||
</div>
|
||
|
||
<div
|
||
class="imgItem"
|
||
v-for="(item, index) in IDCardImgList"
|
||
:key="index"
|
||
>
|
||
<image
|
||
:src="item"
|
||
@click="showImg2(index, IDCardImgList)"
|
||
mode="aspectFill"
|
||
/>
|
||
<div class="closeBox" @click.stop="deleteImgFunc(item, index)">
|
||
<image class="closeIcon" src="/static/home/closeIcon.svg" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</uni-popup> -->
|
||
|
||
<div>
|
||
<keyboard :isShow="isShow" :keyBoardType="defaultKeyWordType" @inputchange="inputChange" @delete="delValue"
|
||
@ok="confirmboard" />
|
||
</div>
|
||
|
||
<div class="page-body" v-if="false">
|
||
<div v-show="!isLoading && cards.length > 0">
|
||
<div class="title">已绑车辆</div>
|
||
<swiper scroll-x="true" class="banner">
|
||
<swiper-item v-for="(item, o) in cards" :key="o" class="car-card">
|
||
<div class="car-card">
|
||
<image src="https://eshangtech.com/wanmeiyizhanImg/car-card.png" mode="acspetFit" />
|
||
<text class="card-title">{{ item.License_Plate }}</text>
|
||
</div>
|
||
</swiper-item>
|
||
<swiper-item class="car-card">
|
||
<div class="car-card-add"></div>
|
||
</swiper-item>
|
||
</swiper>
|
||
</div>
|
||
<div v-show="!isLoading && cards.length == 0">
|
||
<image src="https://eshangtech.com/wanmeiyizhanImg/car.png" mode="acspetFit" class="pic-image"></image>
|
||
<div class="tip-text">暂无绑定车辆</div>
|
||
<div class="add-car" @tap="toAdd">
|
||
<van-icon name="plus" size="32" color="#B0B0B0" />
|
||
<span class="">添加车辆</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<CustomLoading :visible="isLoading" v-if="isLoading" @update:visible="(val) => (isLoading = val)" />
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters } from "vuex";
|
||
import keyboard from "../../../components/keyboard.vue";
|
||
import CustomLoading from "../../../components/customLoading.vue";
|
||
export default {
|
||
data() {
|
||
return {
|
||
cards: [],
|
||
// isLoading: true,
|
||
normalLen: 8,
|
||
nowIndex: -1,
|
||
isShow: false,
|
||
saveCarText: ["皖", "A", "", "", "", "", "", ""],
|
||
newEnergy: true, // 是否是新能源
|
||
haveCode: false, // 判断是否已经有了code
|
||
defaultKeyWordType: 1, // 默认的键盘类型 1是 省份 2是 车牌号
|
||
showPopup: false,
|
||
IDCardImgList: [], // 身份证 上传的图片
|
||
driverLicenseList: [], // 驾驶证 上传的图片
|
||
drivingLicenseList: [], // 行驶证 上传的图片
|
||
bindCarType: 1, // 绑定车的类型 1 轿车 2 货车
|
||
isLoading: false,
|
||
carType: 1,// 1 燃油车 2 新能源汽车
|
||
codeInfo: {
|
||
cardInfoCode: {
|
||
STAFF_ID: "",
|
||
}, // 身份证的数据
|
||
drivingInfo: {
|
||
STAFF_ID: "",
|
||
}, // 驾驶证的数据
|
||
vehicleInfo: {
|
||
STAFF_ID: "",
|
||
}, // 行驶证的数据
|
||
},
|
||
codeImgObj: {
|
||
frontIDCard: "", // 身份证正面
|
||
reverseIDcard: "", // 身份证反面
|
||
frontDriverCard: "", // 驾驶证正面
|
||
reverseDriverCard: "", // 驾驶证反面
|
||
frontLicenseCard: "", // 行驶证正面
|
||
reverseLicenseCard: "", // 行驶证反面
|
||
}, // 三证的图片数据
|
||
popupType: 0,// 上传证件类型
|
||
};
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "user",
|
||
}),
|
||
},
|
||
components: {
|
||
keyboard,
|
||
CustomLoading,
|
||
},
|
||
methods: {
|
||
// 重新上传
|
||
handleUploadAgain() {
|
||
// 身份证正面
|
||
if (this.popupType === 1) {
|
||
this.submitImg('1', '1')
|
||
} else if (this.popupType === 2) {
|
||
// 身份证反面
|
||
this.submitImg('1', '2')
|
||
} else if (this.popupType === 3) {
|
||
// 驾驶证主页
|
||
this.submitImg('2', '1')
|
||
} else if (this.popupType === 4) {
|
||
// 驾驶证副页
|
||
this.submitImg('2', '2')
|
||
} else if (this.popupType === 5) {
|
||
// 行驶证主页
|
||
this.submitImg('3', '1')
|
||
} else if (this.popupType === 6) {
|
||
// 行驶证副页
|
||
this.submitImg('3', '2')
|
||
}
|
||
},
|
||
// 预览图片
|
||
handlePriview() {
|
||
uni.previewImage({
|
||
current: 0, // 当前显示图片的http链接
|
||
urls: [this.popupType === 1 ? this.codeImgObj.frontIDCard :
|
||
this.popupType === 2 ? this.codeImgObj.reverseIDcard :
|
||
this.popupType === 3 ? this.codeImgObj.frontDriverCard :
|
||
this.popupType === 4 ? this.codeImgObj.reverseDriverCard :
|
||
this.popupType === 5 ? this.codeImgObj.frontLicenseCard :
|
||
this.popupType === 6 ? this.codeImgObj.reverseLicenseCard : ""], // 需要预览的图片http链接列表
|
||
});
|
||
},
|
||
// 点击立即上传 唤起悬浮框
|
||
handleShowUplodaPopup(value) {
|
||
console.log('valuevaluevaluevalue', value);
|
||
// this.popupType = value
|
||
// this.$refs.uploadPopup.open('center')
|
||
|
||
// 判断是否显示编辑的抽屉
|
||
let isShowDetail = false
|
||
if (value === 1 && this.codeImgObj.frontIDCard) {
|
||
isShowDetail = true
|
||
} else if (value === 2 && this.codeImgObj.reverseIDcard) {
|
||
isShowDetail = true
|
||
} else if (value === 3 && this.codeImgObj.frontDriverCard) {
|
||
isShowDetail = true
|
||
} else if (value === 4 && this.codeImgObj.reverseDriverCard) {
|
||
isShowDetail = true
|
||
} else if (value === 5 && this.codeImgObj.frontLicenseCard) {
|
||
isShowDetail = true
|
||
} else if (value === 6 && this.codeImgObj.reverseLicenseCard) {
|
||
isShowDetail = true
|
||
}
|
||
if (isShowDetail) {
|
||
this.popupType = value
|
||
this.$refs.uploadPopup.open('center')
|
||
} else {
|
||
// 身份证正面
|
||
if (value === 1) {
|
||
this.submitImg('1', '1')
|
||
} else if (value === 2) {
|
||
// 身份证反面
|
||
this.submitImg('1', '2')
|
||
} else if (value === 3) {
|
||
// 驾驶证主页
|
||
this.submitImg('2', '1')
|
||
} else if (value === 4) {
|
||
// 驾驶证副页
|
||
this.submitImg('2', '2')
|
||
} else if (value === 5) {
|
||
// 行驶证主页
|
||
this.submitImg('3', '1')
|
||
} else if (value === 6) {
|
||
// 行驶证副页
|
||
this.submitImg('3', '2')
|
||
}
|
||
}
|
||
|
||
|
||
console.log('this.codeInfo', this.codeInfo);
|
||
console.log('this.codeImgObj', this.codeImgObj);
|
||
|
||
},
|
||
//
|
||
handleHideUplodaPopup() {
|
||
this.popupType = 0
|
||
this.$refs.uploadPopup.close()
|
||
},
|
||
// 切换汽车类型 会增加会减少车牌号
|
||
handleChangeCar() {
|
||
if (this.carType === 1) {
|
||
this.carType = 2
|
||
// this.normalLen = 8
|
||
} else {
|
||
this.carType = 1
|
||
// this.normalLen = 7
|
||
}
|
||
this.$forceUpdate();
|
||
},
|
||
// 修改绑定类型
|
||
handleChangeBindType() {
|
||
if (this.bindCarType === 1) {
|
||
this.bindCarType = 2;
|
||
} else {
|
||
this.bindCarType = 1;
|
||
}
|
||
},
|
||
// 绑定货车
|
||
handleBindTruck() {
|
||
this.handleOpenDetail();
|
||
},
|
||
// 关闭悬浮框 货车的
|
||
handleClosePopup() {
|
||
this.$refs.popup.close();
|
||
},
|
||
// 打开悬浮框 货车的
|
||
handleOpenDetail() {
|
||
this.$refs.popup.open("bottom");
|
||
},
|
||
showImg2(index, imgList) {
|
||
uni.previewImage({
|
||
urls: imgList,
|
||
current: index,
|
||
loop: true,
|
||
indicator: "number",
|
||
});
|
||
},
|
||
// 删除答案里面的图片
|
||
deleteImgFuncResponse(item, index) {
|
||
item = item.splice(index, 1);
|
||
this.$forceUpdate();
|
||
},
|
||
submitImg(type, frontOrBack) {
|
||
// type 1 为身份证 2 为驾驶证 3 为行驶证
|
||
// frontOrBack 1 为正面 2 为反面
|
||
if (this.haveCode) {
|
||
let imgList = [];
|
||
if (type === "1") {
|
||
if (frontOrBack === "1") {
|
||
imgList = [this.codeImgObj.frontIDCard];
|
||
} else {
|
||
imgList = [this.codeImgObj.reverseIDcard];
|
||
}
|
||
} else if (type === "2") {
|
||
if (frontOrBack === "1") {
|
||
imgList = [this.codeImgObj.frontDriverCard];
|
||
} else {
|
||
imgList = [this.codeImgObj.reverseDriverCard];
|
||
}
|
||
} else if (type === "3") {
|
||
if (frontOrBack === "1") {
|
||
imgList = [this.codeImgObj.frontLicenseCard];
|
||
} else {
|
||
imgList = [this.codeImgObj.reverseLicenseCard];
|
||
}
|
||
}
|
||
|
||
uni.previewImage({
|
||
urls: imgList,
|
||
current: 0,
|
||
loop: true,
|
||
indicator: "number",
|
||
});
|
||
} else {
|
||
let _this = this;
|
||
uni.chooseImage({
|
||
count: 9, //默认9
|
||
sizeType: ["original", "compressed"],
|
||
sourceType: ["camera"],
|
||
// "album",
|
||
success: function (rs) {
|
||
let quality = 100;
|
||
if (rs.tempFiles[0].size > 1024 * 200) {
|
||
quality = ((1024 * 200) / rs.tempFiles[0].size) * 100;
|
||
}
|
||
if (quality < 100 && rs.tempFiles[0].path.indexOf(".jpg") > -1) {
|
||
uni.compressImage({
|
||
src: rs.tempFilePaths[0], // 图片路径
|
||
quality: quality, // 压缩质量
|
||
success(res) {
|
||
let data = {};
|
||
if (res.data) {
|
||
data = JSON.parse(res.data);
|
||
}
|
||
// uni.showLoading({
|
||
// title: "图片上传中...",
|
||
// });
|
||
_this.isLoading = true;
|
||
uni.uploadFile({
|
||
// url: "https://user.eshangtech.com/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
|
||
// url: "https://es.robot-z.cn/oss/upload",
|
||
url: "https://es.eshangtech.com/oss/upload",
|
||
filePath: res.tempFilePath,
|
||
header: {
|
||
"Content-Type": "multipart/form-data",
|
||
},
|
||
formData: {},
|
||
fileType: "image",
|
||
name: "file",
|
||
async success(res) {
|
||
let data = {};
|
||
if (res.data) {
|
||
data = JSON.parse(res.data);
|
||
}
|
||
// uni.hideLoading();
|
||
|
||
_this.isLoading = false;
|
||
|
||
if (type === "1") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
1,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontIDCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseIDcard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
// // 身份证的数组
|
||
// _this.IDCardImgList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
} else if (type === "2") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
2,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontDriverCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseDriverCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
// 驾驶证的图片
|
||
// _this.driverLicenseList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
} else if (type === "3") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
3,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
|
||
// 行驶证图片
|
||
// _this.drivingLicenseList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
}
|
||
|
||
|
||
console.log('_this.codeImgObj', _this.codeImgObj);
|
||
|
||
// _this.$forceUpdate();
|
||
},
|
||
fail(error) {
|
||
_this.noPost = true;
|
||
},
|
||
});
|
||
},
|
||
fail(error) {
|
||
_this.noPost = true;
|
||
},
|
||
});
|
||
} else {
|
||
_this.isLoading = true;
|
||
// uni.showLoading({
|
||
// title: "图片上传中...",
|
||
// });
|
||
uni.uploadFile({
|
||
// url: "https://user.eshangtech.com/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
|
||
// url: "https://es.robot-z.cn/oss/upload",
|
||
url: "https://es.eshangtech.com/oss/upload",
|
||
filePath: rs.tempFilePaths[0],
|
||
fileType: "image",
|
||
header: {
|
||
"Content-Type": "multipart/form-data",
|
||
},
|
||
name: "file",
|
||
async success(res) {
|
||
let data = {};
|
||
if (res.data) {
|
||
data = JSON.parse(res.data);
|
||
}
|
||
// uni.hideLoading();
|
||
|
||
_this.isLoading = false;
|
||
if (type === "1") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
1,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontIDCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseIDcard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
// // 身份证的数组
|
||
// _this.IDCardImgList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
} else if (type === "2") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
2,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontDriverCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseDriverCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
// // 驾驶证的图片
|
||
// _this.driverLicenseList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
} else if (type === "3") {
|
||
const res = await _this.handleIdentification(
|
||
`https://es.eshangtech.com/${data.data.path}`,
|
||
3,
|
||
frontOrBack
|
||
);
|
||
if (res) {
|
||
if (frontOrBack === "1") {
|
||
_this.codeImgObj.frontLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
} else {
|
||
_this.codeImgObj.reverseLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
|
||
}
|
||
// // 行驶证图片
|
||
// _this.drivingLicenseList.push(
|
||
// `https://es.eshangtech.com/${data.data.path}`
|
||
// );
|
||
}
|
||
}
|
||
|
||
console.log('_this.codeImgObj', _this.codeImgObj);
|
||
// _this.$forceUpdate();
|
||
},
|
||
fail(error) {
|
||
_this.noPost = true;
|
||
},
|
||
});
|
||
}
|
||
},
|
||
fail: function (err) { },
|
||
});
|
||
}
|
||
|
||
},
|
||
|
||
// 根据车辆类型返回需要的准驾车型
|
||
getRequiredLicenseTypes(vehicleType) {
|
||
if (!vehicleType) return [];
|
||
if (
|
||
vehicleType.includes("小型") &&
|
||
(vehicleType.includes("轿车") || vehicleType.includes("客车"))
|
||
) {
|
||
return ["C1", "C2"];
|
||
} else if (
|
||
vehicleType.includes("微型货车") ||
|
||
vehicleType.includes("微型封闭式货车") ||
|
||
vehicleType.includes("轻型货车") ||
|
||
vehicleType.includes("轻型封闭式货车")
|
||
) {
|
||
return ["C1"]; // 轻微型货车 C1可以开
|
||
} else if (
|
||
vehicleType.includes("中型货车") ||
|
||
vehicleType.includes("中型封闭式货车")
|
||
) {
|
||
return ["B2"];
|
||
} else if (
|
||
vehicleType.includes("重型货车") ||
|
||
vehicleType.includes("重型封闭式货车")
|
||
) {
|
||
return ["B2"];
|
||
} else if (vehicleType.includes("牵引车")) {
|
||
return ["A2"];
|
||
} else if (vehicleType.includes("中型客车")) {
|
||
return ["B1"];
|
||
} else if (
|
||
vehicleType.includes("大型客车") ||
|
||
vehicleType.includes("重型客车")
|
||
) {
|
||
return ["A1"];
|
||
} else if (vehicleType.includes("半挂")) {
|
||
return ["A2"];
|
||
} else {
|
||
return []; // 无法判断的车辆类型，默认放过
|
||
}
|
||
},
|
||
// 证件识别
|
||
async handleIdentification(url, type, frontOrBack) {
|
||
this.isLoading = true;
|
||
// type 1 身份证 2 驾驶证 3 行驶证
|
||
// frontOrBack 1 为正面 2 为反面
|
||
console.log("frontOrBack", frontOrBack);
|
||
|
||
const req = {
|
||
imageUrl: url,
|
||
};
|
||
let data = {};
|
||
if (type === 1) {
|
||
data = await this.$api.$get("/MemberIdentify/RecognizeIdCard", req);
|
||
} else if (type === 2) {
|
||
data = await this.$api.$get("/MemberIdentify/RecognizeDriving", req);
|
||
} else if (type === 3) {
|
||
data = await this.$api.$get("/MemberIdentify/RecognizeVehicle", req);
|
||
}
|
||
if (data.Result_Code !== 100) {
|
||
uni.showToast({
|
||
title: `${type === 1
|
||
? "身份证"
|
||
: type === 2
|
||
? "驾驶证"
|
||
: type === 3
|
||
? "行驶证"
|
||
: ""
|
||
}识别失败！请重新上传`,
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
|
||
let obj = JSON.parse(data.Result_Data);
|
||
|
||
let infoObj = {};
|
||
if (type === 1) {
|
||
console.log("this.codeInfo.cardInfoCode", this.codeInfo.cardInfoCode);
|
||
if (frontOrBack === "1") {
|
||
if (obj.data.face) {
|
||
infoObj = obj.data.face.data;
|
||
this.codeInfo.cardInfoCode = {
|
||
...this.codeInfo.cardInfoCode,
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码 ,
|
||
IDCARDINFO_NAME: infoObj.name || "", // 身份证人名
|
||
IDCARDINFO_CODE: infoObj.idNumber || "", // 证件号码
|
||
GENDER:
|
||
infoObj.sex === "男" ? 1 : infoObj.sex === "女" ? "2" : "0", //性别 男1 女2
|
||
NATIONALITY: infoObj.ethnicity || "", //名族
|
||
BIRTH_DATE: infoObj.birthDate || "", //证件生日
|
||
IDCARDINFO_ADDRESS: infoObj.address || "", //证件地址
|
||
STAFF_ID: "",
|
||
STAFF_NAME: this.user.MEMBERSHIP_NAME, //
|
||
IDCARDINFO_STATE: 1,
|
||
OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "身份证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
} else {
|
||
if (obj.data.back) {
|
||
infoObj = obj.data.back.data;
|
||
let [start, end] = ["", ""];
|
||
if (infoObj.validPeriod) {
|
||
[start, end] = infoObj.validPeriod.split("-");
|
||
}
|
||
start = start.replace(/\./g, "-");
|
||
end = end.replace(/\./g, "-");
|
||
this.codeInfo.cardInfoCode = {
|
||
...this.codeInfo.cardInfoCode,
|
||
ISSUE_DATE: start || "",
|
||
EXPIRE_DATE: end || "",
|
||
ISSUE_AUTHORITY: infoObj.issueAuthority || "",
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "身份证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
}
|
||
} else if (type === 2) {
|
||
if (frontOrBack === "1") {
|
||
if (obj.data.face) {
|
||
infoObj = obj.data.face.data;
|
||
let [start, end] = ["", ""];
|
||
if (infoObj.validPeriod) {
|
||
[start, end] = infoObj.validPeriod.split("至");
|
||
}
|
||
this.codeInfo.drivingInfo = {
|
||
...this.codeInfo.drivingInfo,
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码
|
||
// LICENSE_NUMBER: infoObj.licenseNumber, // 驾驶证号
|
||
IDCARDINFO_NAME: infoObj.name, // 证件姓名
|
||
IDCARDINFO_CODE: infoObj.licenseNumber, // 关联身份证号
|
||
LICENSE_TYPE: infoObj.approvedType, // 准驾车型
|
||
VALID_FROM: start, // 有效期起始日
|
||
VALID_TO: end, // 有效期截止日
|
||
ISSUE_DATE: infoObj.initialIssueDate, // 发证日期
|
||
DRIVERLICENSE_STATE: 1, // 状态（正常/吊销/过期）
|
||
STAFF_ID: "", //
|
||
STAFF_NAME: this.user.MEMBERSHIP_NAME, //
|
||
OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "驾驶证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
} else {
|
||
if (obj.data.back) {
|
||
infoObj = obj.data.back.data;
|
||
this.codeInfo.drivingInfo = {
|
||
...this.codeInfo.drivingInfo,
|
||
LICENSE_NUMBER: infoObj.licenseNumber,
|
||
RECORD: infoObj.record,
|
||
RECORD_NUMBER: infoObj.recordNumber,
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "驾驶证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
_this.isLoading = false;
|
||
return false;
|
||
}
|
||
}
|
||
} else if (type === 3) {
|
||
if (frontOrBack === "1") {
|
||
if (obj.data.face) {
|
||
infoObj = obj.data.face.data;
|
||
this.codeInfo.vehicleInfo = {
|
||
...this.codeInfo.vehicleInfo,
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, //
|
||
PLATE_NUMBER: infoObj.licensePlateNumber, // 车牌号
|
||
VEHICLE_TYPE: infoObj.vehicleType, // 车辆类型（如轿车/货车）
|
||
// IDCARDINFO_CODE: "string",// 所有人身份证号
|
||
IDCARDINFO_ADDRESS: infoObj.address, // 所有人住址
|
||
VEHICLELICENSE_VIN: infoObj.vinCode, // 车辆识别代号（车架号）
|
||
ENGINE_NUMBER: infoObj.engineNumber, // 发动机号
|
||
REGISTER_DATE: infoObj.registrationDate, // 注册日期
|
||
INSPECT_DATE: infoObj.inspectionRecord, // 检验有效期
|
||
STAFF_ID: 0, //
|
||
STAFF_NAME: "", //
|
||
VEHICLELICENSE_STATE: 1,
|
||
OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
|
||
VEHICLELICENSE_DESC: "", //
|
||
|
||
ISSUEAUTHORITY: infoObj.issueAuthority, // 签发机关
|
||
MODAL: infoObj.model, // 品牌类型
|
||
OWNER: infoObj.owner, // 所有人名称
|
||
ISSUEDATE: infoObj.issueDate, // 发证日期
|
||
USE_NATURE: infoObj.useNature, // 使用性质
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "行驶证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
} else {
|
||
if (obj.data.back) {
|
||
infoObj = obj.data.back.data;
|
||
this.codeInfo.vehicleInfo = {
|
||
...this.codeInfo.vehicleInfo,
|
||
...infoObj,
|
||
};
|
||
} else {
|
||
uni.showToast({
|
||
title: "行驶证识别失败，请重新上传！",
|
||
icon: "error",
|
||
});
|
||
this.isLoading = false;
|
||
return false;
|
||
}
|
||
}
|
||
}
|
||
this.isLoading = false;
|
||
|
||
|
||
|
||
|
||
return true;
|
||
// 到这里说明已经拿到了 识别到的数据了 然后去调用一下 存储的接口
|
||
// 三证分别是三个不同的接口
|
||
// let codeInfo = {}
|
||
// if (type === 1) {
|
||
// // 存储身份证的识别信息
|
||
// const req = {
|
||
// MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码 ,
|
||
// IDCARDINFO_NAME: infoObj.name, // 身份证人名
|
||
// IDCARDINFO_CODE: infoObj.idNumber, // 证件号码
|
||
// GENDER: infoObj.sex === '男' ? 1 : infoObj.sex === '女' ? '2' : '0',//性别 男1 女2
|
||
// NATIONALITY: infoObj.ethnicity,//名族
|
||
// BIRTH_DATE: infoObj.birthDate,//证件生日
|
||
// IDCARDINFO_ADDRESS: infoObj.address,//证件地址
|
||
// ISSUE_DATE: ,//签发日期
|
||
// EXPIRE_DATE: "",//失效日期
|
||
// STAFF_ID: "",
|
||
// ISSUE_AUTHORITY: "",//签发机关
|
||
// STAFF_NAME: this.user.MEMBERSHIP_NAME,//
|
||
// OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
|
||
// }
|
||
// codeInfo = await this.$api.$post(
|
||
// "/EShangApiMain/Member/SynchroIDCARDINFO",
|
||
// req
|
||
// );
|
||
// } else if (type === 2) {
|
||
// // 存储驾驶证的识别信息
|
||
// const req = {
|
||
// DRIVERLICENSE_ID: 0,
|
||
// MEMBERSHIP_ID: 0,// 会员内码
|
||
// LICENSE_NUMBER: "string", // 驾驶证号
|
||
// IDCARDINFO_NAME: "string",// 关联身份证号
|
||
// IDCARDINFO_CODE: "string",// 证件姓名
|
||
// LICENSE_TYPE: "string",// 准驾车型
|
||
// VALID_FROM: "string",// 有效期起始日
|
||
// VALID_TO: "string",// 有效期截止日
|
||
// ISSUE_DATE: "string",// 发证日期
|
||
// DRIVERLICENSE_STATUS: "string",// 状态（正常/吊销/过期）
|
||
// STAFF_ID: 0,//
|
||
// STAFF_NAME: "",//
|
||
// OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
|
||
// DRIVERLICENSE_DESC: ""//
|
||
// }
|
||
// } else if (type === 3) {
|
||
// // 存储行驶证的识别信息
|
||
// const req = {
|
||
// VEHICLELICENSE_ID: 0, //
|
||
// MEMBERSHIP_ID: 0,//
|
||
// PLATE_NUMBER: "string",// 车牌号
|
||
// VEHICLE_TYPE: "string",// 车辆类型（如轿车/货车）
|
||
// IDCARDINFO_CODE: "string",// 所有人身份证号
|
||
// IDCARDINFO_ADDRESS: "string",// 所有人住址
|
||
// VEHICLELICENSE_VIN: "string",// 车辆识别代号（车架号）
|
||
// ENGINE_NUMBER: "string",// 发动机号
|
||
// REGISTER_DATE: "string",// 注册日期
|
||
// INSPECT_DATE: "string",// 检验有效期
|
||
// STAFF_ID: 0,//
|
||
// STAFF_NAME: "",//
|
||
// OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
|
||
// VEHICLELICENSE_DESC: ""//
|
||
// }
|
||
// }
|
||
|
||
// 前面前端调用的 有签名的方法问题
|
||
// const config = {
|
||
// accessKeyId: 'LTAI5tCyuvisosdGk8sCbuhZ', // 替换为你的AK
|
||
// accessKeySecret: 'NhnqXZGE8pN1jFNnQL6BJDJQGPBaJY', // 替换为你的SK
|
||
// endpoint: 'ocr-api.cn-hangzhou.aliyuncs.com', // 服务端点
|
||
// apiVersion: '2019-12-30', // API版本
|
||
// action: 'RecognizeVehicleLicense' // 行驶证识别接口
|
||
// };
|
||
|
||
// const businessRes = await new Promise((resolve, reject) => {
|
||
// uni.request({
|
||
// url: `https://api.aliyun.com/api/auth/product/openAPIRequest`,
|
||
// method: "POST",
|
||
// data: {
|
||
// action: "RecognizeDrivingLicense",
|
||
// params: {
|
||
// Url: url
|
||
// }
|
||
// },
|
||
// success(res) {
|
||
// resolve(res);
|
||
// },
|
||
// });
|
||
// });
|
||
// console.log('businessResbusinessResbusinessResbusinessResbusinessResbusinessResbusinessResbusinessRes', businessRes);
|
||
},
|
||
// 确认绑定
|
||
async handleConfirmCode() {
|
||
console.log("this.saveCarText", this.saveCarText);
|
||
let _this = this;
|
||
let carText = _this.saveCarText.join("");
|
||
console.log("carText", carText);
|
||
console.log("carType", this.carType);
|
||
|
||
if ((this.carType === 1 && carText.length < 7) || (this.carType === 2 && carText.length < 8)) {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您完善车牌号再提交",
|
||
cancelColor: "#000000",
|
||
confirmText: "确定",
|
||
confirmColor: "#3CC51F",
|
||
success: (result) => {
|
||
if (result.confirm) {
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
} else {
|
||
let reg
|
||
if (this.carType === 1) {
|
||
reg =
|
||
/^(([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳使领]))$/;
|
||
} else {
|
||
reg = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][DF][A-HJ-NP-Z0-9]{5}$/
|
||
}
|
||
|
||
const careg = reg.test(carText);
|
||
if (!careg) {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请输入正确车牌号",
|
||
showCancel: false,
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
console.log('carTextcarTextcarTextcarTextcarText', carText);
|
||
|
||
let isOk = true;
|
||
// if (this.bindCarType === 2) {
|
||
// // 暂时把非身份证的副页 都设置为不必填
|
||
// if (!this.codeImgObj.frontIDCard || !this.codeImgObj.reverseIDcard) {
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: "请上传身份证！",
|
||
// showCancel: false,
|
||
// });
|
||
// return;
|
||
// }
|
||
// if (!this.codeImgObj.frontDriverCard) {
|
||
// // || !this.codeImgObj.reverseDriverCard
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: "请上传身份证！",
|
||
// showCancel: false,
|
||
// });
|
||
// return;
|
||
// }
|
||
// if (!this.codeImgObj.frontLicenseCard) {
|
||
// // || !this.codeImgObj.reverseLicenseCard
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: "请上传身份证！",
|
||
// showCancel: false,
|
||
// });
|
||
// return;
|
||
// }
|
||
|
||
// // // 判断身份证和驾驶证 身份证号、名字 是否一致
|
||
// // if (this.codeInfo.cardInfoCode.IDCARDINFO_CODE && this.codeInfo.drivingInfo.LICENSE_NUMBER && this.codeInfo.drivingInfo.LICENSE_NUMBER === this.codeInfo.cardInfoCode.IDCARDINFO_CODE ||
|
||
// // this.codeInfo.cardInfoCode.IDCARDINFO_NAME && this.codeInfo.drivingInfo.IDCARDINFO_CODE && this.codeInfo.drivingInfo.IDCARDINFO_CODE === this.codeInfo.cardInfoCode.IDCARDINFO_NAME) {
|
||
// // } else {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: "驾驶证和身份证信息不一致，请重新上传",
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return false;
|
||
// // }
|
||
|
||
// // // 比较 驾驶证的准驾车型 和 行驶证的车辆类型 是否一致
|
||
// // const vehicleType = this.codeInfo.vehicleInfo.VEHICLE_TYPE || '';
|
||
// // const approvedType = this.codeInfo.drivingInfo.LICENSE_TYPE || '';
|
||
|
||
// // const requiredLicenseTypes = this.getRequiredLicenseTypes(vehicleType);
|
||
|
||
// // if (requiredLicenseTypes && requiredLicenseTypes.length > 0) {
|
||
// // if (!requiredLicenseTypes.includes(approvedType)) {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: `驾驶证准驾车型（${approvedType}）不符合驾驶车辆（${vehicleType}）的要求`,
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return false;
|
||
// // }
|
||
// // } else {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: `未知车型！`,
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return false;
|
||
// // }
|
||
|
||
// if (
|
||
// this.codeInfo.vehicleInfo.PLATE_NUMBER !==
|
||
// this.saveCarText.toString().replace(/,/g, "")
|
||
// ) {
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: `行驶证车牌号与绑定车牌号不一致！`,
|
||
// showCancel: false,
|
||
// });
|
||
// return false;
|
||
// }
|
||
|
||
// // if (!(this.IDCardImgList && this.IDCardImgList.length > 0)) {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: "请上传身份证！",
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return;
|
||
// // }
|
||
|
||
// // if (!(this.driverLicenseList && this.driverLicenseList.length > 0)) {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: "请上传驾驶证！",
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return;
|
||
// // }
|
||
// // if (!(this.drivingLicenseList && this.drivingLicenseList.length > 0)) {
|
||
// // uni.showModal({
|
||
// // title: "温馨提示",
|
||
// // content: "请上传行驶证！",
|
||
// // showCancel: false,
|
||
// // });
|
||
// // return;
|
||
// // }
|
||
// this.isLoading = true;
|
||
|
||
// console.log("this.codeInfothis.codeInfothis.codeInfo", this.codeInfo);
|
||
// isOk = await this.handleSaveAllCarInfo();
|
||
// } else {
|
||
// let code = this.saveCarText.toString().replace(/,/g, "");
|
||
// const vehicleInfo = await this.$api.$post(
|
||
// "/EShangApiMain/Member/SynchroVEHICLELICENSE",
|
||
// {
|
||
// PLATE_NUMBER: code,
|
||
// STAFF_NAME: "", //
|
||
// VEHICLELICENSE_STATE: 1,
|
||
// OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
|
||
// }
|
||
// );
|
||
// if (vehicleInfo.Result_Code !== 100) {
|
||
// uni.showToast({
|
||
// title: "存储失败！",
|
||
// icon: "none",
|
||
// });
|
||
// isOk = false;
|
||
// return false;
|
||
// }
|
||
// }
|
||
|
||
// 图片的上传对象格式
|
||
// let imgObj = {
|
||
// IDCardImgList: _this.IDCardImgList,
|
||
// driverLicenseList: _this.driverLicenseList,
|
||
// drivingLicenseList: _this.drivingLicenseList,
|
||
// };
|
||
let imgObj = this.codeImgObj;
|
||
|
||
this.isLoading = true;
|
||
|
||
|
||
if (isOk) {
|
||
_this.$api
|
||
.getCoop({
|
||
action_type: "BindVehicle",
|
||
LicensePlate: carText,
|
||
VehicleType: _this.newEnergy ? "新能源" : "",
|
||
ImageInfo: _this.bindCarType === 2 ? JSON.stringify(imgObj) : "",
|
||
})
|
||
.then((res) => {
|
||
console.log("res", res);
|
||
if (res.Result_Code === 100) {
|
||
uni.showModal({
|
||
content: res.Result_Desc,
|
||
cancelColor: "#000000",
|
||
showCancel: false,
|
||
confirmText: "确定",
|
||
confirmColor: "#3CC51F",
|
||
success: (result) => {
|
||
_this.isShow = false;
|
||
_this.getList();
|
||
_this.handleSearchCurrentList();
|
||
},
|
||
});
|
||
} else {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: res.Result_Desc,
|
||
cancelColor: "#000000",
|
||
confirmText: "确定",
|
||
confirmColor: "#3CC51F",
|
||
success: (result) => {
|
||
if (result.confirm) {
|
||
}
|
||
},
|
||
});
|
||
}
|
||
});
|
||
}
|
||
this.isLoading = false;
|
||
},
|
||
|
||
// 一次性存储三份数据
|
||
async handleSaveAllCarInfo() {
|
||
const data = await this.$api.$post(
|
||
"/EShangApiMain/Member/SyncMemberLicense",
|
||
{
|
||
idcardinfoModel: this.codeInfo.cardInfoCode,
|
||
driverlicenseModel: this.codeInfo.drivingInfo,
|
||
vehiclelicenseModel: this.codeInfo.vehicleInfo,
|
||
}
|
||
);
|
||
if (data.Result_Code !== 100) {
|
||
uni.showToast({
|
||
title: `${data.Result_Desc}`,
|
||
icon: "none",
|
||
});
|
||
return false;
|
||
}
|
||
return true;
|
||
|
||
// const codeCarInfo = await this.$api.$post(
|
||
// "/EShangApiMain/Member/SynchroIDCARDINFO",
|
||
// this.codeInfo.cardInfoCode
|
||
// );
|
||
// console.log('codeCarInfo', codeCarInfo);
|
||
// if (codeCarInfo.Result_Code !== 100) {
|
||
// uni.showToast({
|
||
// title: "身份证信息有误，请重新上传图片！",
|
||
// icon: 'none'
|
||
// })
|
||
// return false
|
||
// }
|
||
|
||
// const drivingInfo = await this.$api.$post(
|
||
// "/EShangApiMain/Member/SynchroDRIVERLICENSE",
|
||
// this.codeInfo.drivingInfo
|
||
// );
|
||
// if (drivingInfo.Result_Code !== 100) {
|
||
// uni.showToast({
|
||
// title: "驾驶证信息有误，请重新上传图片！",
|
||
// icon: 'none'
|
||
// })
|
||
// return false
|
||
// }
|
||
|
||
// const vehicleInfo = await this.$api.$post(
|
||
// "/EShangApiMain/Member/SynchroVEHICLELICENSE",
|
||
// this.codeInfo.vehicleInfo
|
||
// );
|
||
// if (vehicleInfo.Result_Code !== 100) {
|
||
// uni.showToast({
|
||
// title: "行驶证信息有误，请重新上传图片！",
|
||
// icon: 'none'
|
||
// })
|
||
// return false
|
||
// }
|
||
// return true
|
||
},
|
||
// 一次性查当前的用户的三证id
|
||
async handleSearchCurrentList() {
|
||
const codeCarInfo = await this.$api.$post(
|
||
"/EShangApiMain/Member/GetIDCARDINFOList",
|
||
{
|
||
SearchParameter: {
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
|
||
IDCARDINFO_STATE: 1,
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 10,
|
||
}
|
||
);
|
||
console.log("codeCarInfo", codeCarInfo);
|
||
|
||
const drivingInfo = await this.$api.$post(
|
||
"/EShangApiMain/Member/GetDRIVERLICENSEList",
|
||
{
|
||
SearchParameter: {
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
|
||
DRIVERLICENSE_STATE: 1,
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 10,
|
||
}
|
||
);
|
||
console.log("drivingInfo", drivingInfo);
|
||
|
||
const vehicleInfo = await this.$api.$post(
|
||
"/EShangApiMain/Member/GetVEHICLELICENSEList",
|
||
{
|
||
SearchParameter: {
|
||
MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
|
||
VEHICLELICENSE_STATE: 1,
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 10,
|
||
}
|
||
);
|
||
console.log("vehicleInfo", vehicleInfo);
|
||
|
||
this.codeInfo = {
|
||
cardInfoCode:
|
||
codeCarInfo.Result_Data.List &&
|
||
codeCarInfo.Result_Data.List.length > 0
|
||
? codeCarInfo.Result_Data.List[0]
|
||
: { STAFF_ID: "" },
|
||
drivingInfo:
|
||
drivingInfo.Result_Data.List &&
|
||
drivingInfo.Result_Data.List.length > 0
|
||
? drivingInfo.Result_Data.List[0]
|
||
: { STAFF_ID: "" },
|
||
vehicleInfo:
|
||
vehicleInfo.Result_Data.List &&
|
||
vehicleInfo.Result_Data.List.length > 0
|
||
? vehicleInfo.Result_Data.List[0]
|
||
: { STAFF_ID: "" },
|
||
};
|
||
console.log("this.codeInfo", this.codeInfo);
|
||
},
|
||
// 一次性解绑当前三证
|
||
async handleDeleteCurrent() {
|
||
console.log("this.codeInfo", this.codeInfo);
|
||
|
||
console.log(
|
||
"this.codeInfo.cardInfoCode.IDCARDINFO_ID",
|
||
this.codeInfo.cardInfoCode.IDCARDINFO_ID
|
||
);
|
||
const codeCarInfo = await this.$api.$get(
|
||
"/EShangApiMain/Member/DeleteIDCARDINFO",
|
||
{
|
||
IDCARDINFOId: this.codeInfo.cardInfoCode.IDCARDINFO_ID,
|
||
}
|
||
);
|
||
if (codeCarInfo.Result_Code !== 100) {
|
||
uni.showToast({
|
||
title: "删除失败！",
|
||
icon: "none",
|
||
});
|
||
return false;
|
||
}
|
||
|
||
console.log(
|
||
"this.codeInfo.drivingInfo.DRIVERLICENSE_ID",
|
||
this.codeInfo.drivingInfo.DRIVERLICENSE_ID
|
||
);
|
||
const drivingInfo = await this.$api.$get(
|
||
"/EShangApiMain/Member/DeleteDRIVERLICENSE",
|
||
{
|
||
DRIVERLICENSEId: this.codeInfo.drivingInfo.DRIVERLICENSE_ID,
|
||
}
|
||
);
|
||
if (drivingInfo.Result_Code !== 100) {
|
||
uni.showToast({
|
||
title: "删除失败！",
|
||
icon: "none",
|
||
});
|
||
return false;
|
||
}
|
||
console.log(
|
||
"this.codeInfo.vehicleInfo.VEHICLELICENSE_ID",
|
||
this.codeInfo.vehicleInfo.VEHICLELICENSE_ID
|
||
);
|
||
|
||
const vehicleInfo = await this.$api.$get(
|
||
"/EShangApiMain/Member/DeleteVEHICLELICENSE",
|
||
{
|
||
VEHICLELICENSEId: this.codeInfo.vehicleInfo.VEHICLELICENSE_ID,
|
||
}
|
||
);
|
||
if (vehicleInfo.Result_Code !== 100) {
|
||
uni.showToast({
|
||
title: "删除失败！",
|
||
icon: "none",
|
||
});
|
||
return false;
|
||
}
|
||
return true;
|
||
},
|
||
// 改变车的能源类型
|
||
handleChangeCarType() {
|
||
if (this.haveCode) {
|
||
uni.showToast({
|
||
title: "已有关联车辆！如需修改请先解绑",
|
||
icon: "none",
|
||
duration: 2000,
|
||
});
|
||
return;
|
||
} else {
|
||
this.newEnergy = !this.newEnergy;
|
||
}
|
||
},
|
||
inputChange(value) {
|
||
console.log('inputChangeinputChangeinputChangeinputChangeinputChange', value);
|
||
|
||
let index = this.nowIndex;
|
||
this.saveCarText[index] = value;
|
||
let next = index + 1;
|
||
if (this.carType === 1) {
|
||
if (next < 7) {
|
||
this.nowIndex = next;
|
||
}
|
||
} else {
|
||
if (next < 8) {
|
||
this.nowIndex = next;
|
||
}
|
||
}
|
||
|
||
console.log('inputChangeinputChangeinputChangeinputChangeinputChange', this.nowIndex);
|
||
if (this.nowIndex >= 1) {
|
||
this.defaultKeyWordType = 2;
|
||
} else {
|
||
this.defaultKeyWordType = 1;
|
||
}
|
||
|
||
this.$forceUpdate();
|
||
},
|
||
delValue() {
|
||
let index = this.nowIndex;
|
||
|
||
this.saveCarText[index] = "";
|
||
let next = index - 1;
|
||
|
||
if (next > -1) {
|
||
this.nowIndex = next;
|
||
}
|
||
|
||
if (this.nowIndex >= 1) {
|
||
this.defaultKeyWordType = 2;
|
||
} else {
|
||
this.defaultKeyWordType = 1;
|
||
}
|
||
|
||
this.$forceUpdate();
|
||
},
|
||
confirmboard() {
|
||
this.isShow = false;
|
||
},
|
||
focusInput(value) {
|
||
console.log('focusInputfocusInputfocusInputfocusInputfocusInput', value);
|
||
if (value === 7 && this.carType === 1) {
|
||
return
|
||
}
|
||
|
||
// 判断第一个 有没有值 有值了的话 就显示数字键盘 没值的话 就显示中文键盘
|
||
if (value === 0) {
|
||
this.defaultKeyWordType = 1;
|
||
} else {
|
||
this.defaultKeyWordType = 2;
|
||
}
|
||
|
||
if (this.haveCode) {
|
||
uni.showToast({
|
||
title: "已有关联车辆！如需修改请先解绑",
|
||
icon: "none",
|
||
duration: 2000,
|
||
});
|
||
return;
|
||
}
|
||
this.isShow = true;
|
||
this.nowIndex = value;
|
||
},
|
||
// 取消绑定
|
||
async handleCancelCode() {
|
||
let _this = this;
|
||
let data = false;
|
||
if (this.bindCarType === 2) {
|
||
this.isLoading = true;
|
||
// 删除三个
|
||
data = await this.handleDeleteCurrent();
|
||
} else {
|
||
data = true;
|
||
}
|
||
|
||
if (data) {
|
||
if (_this.cards && _this.cards.length > 0) {
|
||
let obj = _this.cards[0];
|
||
uni.showModal({
|
||
title: "确认取消绑定？",
|
||
content: "取消绑定后将无法恢复",
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
this.isLoading = true;
|
||
_this.$api
|
||
.getCoop({
|
||
action_type: "UnbindVehicle",
|
||
MEMBERSHIPVEHICLE_ID: obj.MEMBERSHIPVEHICLE_ID,
|
||
LicensePlate: obj.License_Plate,
|
||
// Membership_Id: _this.user.MEMBERSHIP_ID,
|
||
})
|
||
.then((res) => {
|
||
_this.isLoading = false;
|
||
if (res.Result_Code === 100) {
|
||
// _this.IDCardImgList = [];
|
||
// _this.driverLicenseList = [];
|
||
// _this.drivingLicenseList = [];
|
||
_this.codeImgObj = {
|
||
frontIDCard: "", // 身份证正面
|
||
reverseIDcard: "", // 身份证反面
|
||
frontDriverCard: "", // 驾驶证正面
|
||
reverseDriverCard: "", // 驾驶证反面
|
||
frontLicenseCard: "", // 行驶证正面
|
||
reverseLicenseCard: "", // 行驶证反面
|
||
};
|
||
uni.showModal({
|
||
content: res.Result_Desc,
|
||
cancelColor: "#000000",
|
||
showCancel: false,
|
||
confirmText: "确定",
|
||
confirmColor: "#3CC51F",
|
||
success: (result) => {
|
||
_this.isShow = false;
|
||
_this.getList();
|
||
},
|
||
});
|
||
}
|
||
});
|
||
}
|
||
},
|
||
});
|
||
} else {
|
||
uni.showToast({
|
||
title: "暂无关联车辆！",
|
||
icon: "none",
|
||
duration: 2000,
|
||
});
|
||
_this.isLoading = false;
|
||
}
|
||
}
|
||
},
|
||
getList() {
|
||
let _this = this;
|
||
|
||
// uni.showLoading({ title: "加载中" });
|
||
|
||
_this.isLoading = true;
|
||
this.$api
|
||
.getCoop({
|
||
action_type: "GetVehicleList",
|
||
})
|
||
.then((res) => {
|
||
_this.isLoading = false;
|
||
_this.cards = res.Result_Data.List;
|
||
if (_this.cards && _this.cards.length > 0) {
|
||
let obj = _this.cards[0];
|
||
let code = obj.License_Plate;
|
||
if (obj.ImageInfo) {
|
||
let imgObj = JSON.parse(obj.ImageInfo);
|
||
_this.codeImgObj = imgObj;
|
||
_this.bindCarType = 2;
|
||
console.log("codeImgObj", _this.codeImgObj);
|
||
// _this.IDCardImgList = imgObj.IDCardImgList;
|
||
// _this.driverLicenseList = imgObj.driverLicenseList;
|
||
// _this.drivingLicenseList = imgObj.drivingLicenseList;
|
||
}
|
||
_this.saveCarText = code.split("");
|
||
_this.haveCode = true;
|
||
} else {
|
||
_this.saveCarText = ["皖", "A", "", "", "", "", "", ""];
|
||
_this.haveCode = false;
|
||
}
|
||
// uni.hideLoading();
|
||
|
||
_this.isLoading = false;
|
||
});
|
||
},
|
||
toAdd() {
|
||
uni.navigateTo({ url: "/pages/homeFn/bindingCar/index" });
|
||
},
|
||
},
|
||
onShow() { },
|
||
async onLoad() {
|
||
this.isLoading = true;
|
||
this.getList();
|
||
await this.handleSearchCurrentList();
|
||
this.$utils.addUserBehaviorNew();
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.main {
|
||
width: 100%;
|
||
min-height: 100vh;
|
||
background: #f5f5f5;
|
||
padding-bottom: constant(safe-area-inset-bottom);
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
|
||
.topMessage {
|
||
width: 100%;
|
||
height: 292rpx;
|
||
background: linear-gradient(270deg, #727377 0%, #424448 100%);
|
||
box-sizing: border-box;
|
||
padding: 48rpx 32rpx;
|
||
position: relative;
|
||
|
||
.messageTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #ffffff;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.messageList {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
|
||
.messageText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #b8b7b4;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
}
|
||
|
||
.carLogo {
|
||
position: absolute;
|
||
right: 12rpx;
|
||
bottom: 0;
|
||
width: 240rpx;
|
||
height: 240rpx;
|
||
opacity: 0.8;
|
||
}
|
||
}
|
||
|
||
.codeBox {
|
||
width: calc(100% - 64rpx);
|
||
height: 206rpx;
|
||
background: #ffffff;
|
||
border-radius: 10rpx;
|
||
margin-left: 32rpx;
|
||
transform: translateY(-60rpx);
|
||
box-sizing: border-box;
|
||
padding: 28rpx 32rpx;
|
||
|
||
.carTypeChange {
|
||
width: 100%;
|
||
height: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.carTypeLeft {
|
||
.typeName {
|
||
font-weight: 400;
|
||
font-size: 30rpx;
|
||
color: #000000;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.carTypeRight {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.changeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.carType {
|
||
color: #ba922f;
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #0077FF;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
|
||
.input-box {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 24rpx;
|
||
|
||
.input-f {
|
||
text-align: center;
|
||
width: 72rpx;
|
||
height: 72rpx;
|
||
box-sizing: border-box;
|
||
border-radius: 5rpx;
|
||
line-height: 72rpx;
|
||
position: relative;
|
||
border: 1rpx solid #e7e7e6;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 8rpx;
|
||
|
||
.show-input {
|
||
font-size: 34rpx;
|
||
}
|
||
|
||
.disabledBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.disabled {
|
||
background-color: #F6F6F6;
|
||
}
|
||
|
||
.text-sm {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #716f69;
|
||
line-height: 28rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.text-tip-btn {
|
||
text-align: center;
|
||
width: 74rpx;
|
||
height: 74rpx;
|
||
border: 1rpx dashed #ededed;
|
||
border-radius: 5rpx;
|
||
background: #f8f8f8;
|
||
line-height: 70rpx;
|
||
}
|
||
}
|
||
|
||
.cccBg {
|
||
background: #f5f6f7;
|
||
}
|
||
|
||
.orangeRedBorder {
|
||
border: 1px solid #07C160;
|
||
}
|
||
|
||
.lastBox {
|
||
background: #f5f6f7;
|
||
border-radius: 2rpx;
|
||
border: 1rpx dashed #e7e7e6 !important;
|
||
}
|
||
|
||
.input-f:nth-last-child(1) {
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.confirmBox {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
// height: 88rpx;
|
||
padding: 14rpx 0;
|
||
color: #ffffff;
|
||
line-height: 44rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
width: calc(100% - 64rpx);
|
||
margin-left: 32rpx;
|
||
background: #07C160;
|
||
border-radius: 10rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.cancelBox {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
height: 88rpx;
|
||
color: #b8b7b4;
|
||
line-height: 44rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
width: calc(100% - 64rpx);
|
||
margin-left: 32rpx;
|
||
background: #ffffff;
|
||
border-radius: 6rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border: 1px solid #b8b7b4;
|
||
margin-top: 24rpx;
|
||
}
|
||
|
||
.bindPopup {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx;
|
||
border-top-left-radius: 32rpx;
|
||
border-top-right-radius: 32rpx;
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
|
||
.popupTitle {
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #000000;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
|
||
.fileItem {
|
||
margin-bottom: 24rpx;
|
||
background-color: #fff;
|
||
box-sizing: border-box;
|
||
padding: 26rpx 32rpx;
|
||
border-radius: 10rpx;
|
||
|
||
.itemTitle {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.newUploadImgBox {
|
||
|
||
.imgItem {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 22rpx;
|
||
background: #F6F6F6;
|
||
border-radius: 6rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.leftText {
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: rgba(0, 0, 0, 0.3);
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
}
|
||
|
||
.rightBox {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.rightText {
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #07C160;
|
||
text-align: right;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
}
|
||
|
||
.rightIcon {
|
||
width: 20rpx;
|
||
height: 20rpx;
|
||
margin-left: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
|
||
.uploadImgBox {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
|
||
.submitImgBox {
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
background: #fff;
|
||
border-radius: 8rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-right: 32rpx;
|
||
|
||
.addIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
color: #b4b5ba;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.submitText {
|
||
font-size: 22rpx;
|
||
color: #b4b5ba;
|
||
}
|
||
}
|
||
|
||
.imgItem {
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
margin-right: 32rpx;
|
||
position: relative;
|
||
border-radius: 8rpx;
|
||
overflow: hidden;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.closeBox {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
background: rgba(6, 10, 25, 0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
|
||
.closeIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.bindTypeBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
margin-bottom: 8px;
|
||
|
||
.bindTrain {
|
||
font-family: "PingFangSC";
|
||
font-weight: 400;
|
||
font-size: 30rpx;
|
||
line-height: 36rpx;
|
||
color: #ba922f;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
page {
|
||
background: #fff;
|
||
}
|
||
|
||
.title {
|
||
color: #333333;
|
||
padding-bottom: 36rpx;
|
||
padding-left: 28rpx;
|
||
padding-top: 43rpx;
|
||
}
|
||
|
||
.banner {
|
||
height: 500rpx;
|
||
}
|
||
|
||
.car-card-add {
|
||
width: 502rpx;
|
||
height: 246rpx;
|
||
background: #ffffff;
|
||
border-radius: 8rpx;
|
||
box-shadow: 0rpx 2rpx 8rpx 0rpx rgba(221, 221, 221, 0.48);
|
||
}
|
||
|
||
.car-card {
|
||
position: relative;
|
||
padding-left: 35rpx;
|
||
padding-top: 33rpx;
|
||
width: 534rpx !important;
|
||
height: 285rpx;
|
||
|
||
// margin-left 26rpx
|
||
image {
|
||
width: 534rpx;
|
||
height: 285rpx;
|
||
position: absolute;
|
||
z-index: -1;
|
||
left: 0;
|
||
top: 0;
|
||
}
|
||
|
||
.card-title {
|
||
background: linear-gradient(#f3e6dd, #e5ba9f);
|
||
-webkit-background-clip: text;
|
||
color: transparent;
|
||
-webkit-text-fill-color: transparent;
|
||
text-fill-color: transparent;
|
||
font-size: 36rpx;
|
||
font-weight: bolder;
|
||
}
|
||
}
|
||
|
||
.pic-image {
|
||
width: 482rpx;
|
||
height: 281rpx;
|
||
margin-left: 128rpx;
|
||
margin-right: 140rpx;
|
||
margin-top: 138rpx;
|
||
margin-bottom: 54rpx;
|
||
}
|
||
|
||
.tip-text {
|
||
text-align: center;
|
||
}
|
||
|
||
.add-car {
|
||
color: #b0b0b0;
|
||
width: 504rpx;
|
||
height: 145rpx;
|
||
background: #f8f8f8;
|
||
border: 1rpx dashed #c3c3c3;
|
||
border-radius: 5rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-direction: column;
|
||
margin: 83rpx auto;
|
||
font-size: 24rpx;
|
||
justify-content: center;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.uploadBox {
|
||
width: calc(100vw - 64rpx);
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
background-color: #fff;
|
||
border-radius: 10rpx;
|
||
position: relative;
|
||
|
||
.closeIcon {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
position: absolute;
|
||
top: 20rpx;
|
||
right: 20rpx;
|
||
}
|
||
|
||
.uploadTitle {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #000000;
|
||
text-align: center;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
}
|
||
|
||
.imgBox {
|
||
width: 100%;
|
||
height: calc(100vw - 64rpx);
|
||
border-radius: 10rpx;
|
||
margin-top: 42rpx;
|
||
// background: #E8E8E8;
|
||
background-repeat: no-repeat;
|
||
background-size: contain;
|
||
|
||
}
|
||
|
||
.uploadAgain {
|
||
width: 100%;
|
||
border-radius: 10rpx;
|
||
background-color: #07C160;
|
||
box-sizing: border-box;
|
||
padding: 14rpx;
|
||
font-weight: 400;
|
||
font-size: 30rpx;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
margin-top: 36rpx;
|
||
}
|
||
|
||
}
|
||
</style> |