107 lines
2.6 KiB
Vue
107 lines
2.6 KiB
Vue
|
<template>
|
||
|
|
<view class="container">
|
||
|
|
<VNavigationBar title="车辆详情" background-color="#fff" title-color="#333"></VNavigationBar>
|
||
|
|
<view class="body">
|
||
|
|
<camera device-position="back" flash="auto" @error="error" style="width: 100%; height: 500upx;">
|
||
|
|
<cover-image src="@/static/images/scan-img.png" class="scan-img"></cover-image>
|
||
|
|
</camera>
|
||
|
|
<view class="scan-text">请将行驶证放置白色框内</view>
|
||
|
|
<button type="primary" @click="takePhoto">识别</button>
|
||
|
|
<view class="scan-img-box"><image mode="widthFix" class="photos-box" :src="src"></image></view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import VNavigationBar from '@/components/VNavigationBar.vue';
|
||
|
|
import request from "@/utils/request";
|
||
|
|
import config from '@/config'
|
||
|
|
import upload from '@/utils/upload'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
VNavigationBar
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
src: "",
|
||
|
|
imgUrl:"",
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
takePhoto() {
|
||
|
|
const ctx = uni.createCameraContext();
|
||
|
|
ctx.takePhoto({
|
||
|
|
quality: 'high',
|
||
|
|
success: (res) => {
|
||
|
|
this.src = res.tempImagePath
|
||
|
|
uni.showLoading({
|
||
|
|
title: 'OCR自动识别中...'
|
||
|
|
});
|
||
|
|
//上传服务器
|
||
|
|
upload({
|
||
|
|
url:'/app-api/infra/file/upload',
|
||
|
|
filePath: res.tempImagePath
|
||
|
|
}).then((res)=>{
|
||
|
|
this.imgUrl = config.baseImageUrl+res.data
|
||
|
|
//识别内容
|
||
|
|
request({
|
||
|
|
url: '/app-api/base/user-car/vehicleLicenseOCR',
|
||
|
|
method: 'POST',
|
||
|
|
data: this.imgUrl,
|
||
|
|
tenantIdFlag: false
|
||
|
|
}).then((res)=>{
|
||
|
|
res.data['imgUrl'] = this.imgUrl
|
||
|
|
uni.hideLoading();
|
||
|
|
let pages = getCurrentPages();
|
||
|
|
let prevPage = pages[pages.length - 2];
|
||
|
|
prevPage.setData({
|
||
|
|
"driveLicense": res.data,
|
||
|
|
})
|
||
|
|
uni.navigateBack();
|
||
|
|
console.log(res)
|
||
|
|
})
|
||
|
|
})
|
||
|
|
}
|
||
|
|
});
|
||
|
|
},
|
||
|
|
error(e) {
|
||
|
|
console.log(e.detail);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped>
|
||
|
|
|
||
|
|
|
||
|
|
.container {
|
||
|
|
box-sizing: border-box;
|
||
|
|
height: 100%;
|
||
|
|
background-color: #f3f5f7;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.body {
|
||
|
|
flex: 1;
|
||
|
|
height: 0;
|
||
|
|
overflow: auto;
|
||
|
|
|
||
|
|
.scan-img {
|
||
|
|
opacity: 0.4;
|
||
|
|
width: 100%;
|
||
|
|
height: 500 upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.scan-text {
|
||
|
|
font-size: 20px;
|
||
|
|
text-align: center;
|
||
|
|
line-height: 60 upx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.scan-img-box{
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|