carcheck.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <template>
  2. <view class="check">
  3. <view class="cbox">
  4. <view class="chtop flexc">
  5. <image :src="line"></image>
  6. <view>车辆信息</view>
  7. </view>
  8. <view class="chmain">
  9. <view class="upbox" @click="getaddImage">
  10. <!-- <image :src="baseUrl+datainfo.front" class="img" v-if="datainfo.front"></image> -->
  11. <image :src="car" class="addimg"></image>
  12. <view>拍摄车辆照片自动识别</view>
  13. </view>
  14. <uni-forms ref="form" :model="datainfo">
  15. <uni-forms-item label="车牌号码" name="realName">
  16. <uni-easyinput v-model="datainfo.realName" disabled :inputBorder='false' placeholder="自动识别" />
  17. </uni-forms-item>
  18. <uni-forms-item label="来访门户" name="phonenumber">
  19. <uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="请输入门户号" />
  20. </uni-forms-item>
  21. <uni-forms-item label="手机号码" name="phonenumber">
  22. <uni-easyinput v-model="datainfo.phonenumber" :inputBorder='false' placeholder="请输入手机号码" />
  23. </uni-forms-item>
  24. </uni-forms>
  25. <view class="rhbtn mt63" @click="getNext">确定添加</view>
  26. </view>
  27. </view>
  28. <loading></loading>
  29. </view>
  30. </template>
  31. <script>
  32. import config from '@/config'
  33. import {getlicensePlate} from "@/api/system/card.js"
  34. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  35. import {uploadIdentify} from '@/utils/common.js'
  36. export default{
  37. components:{},
  38. data(){
  39. return{
  40. line:require('@/car/static/car/line.png'),
  41. car:require('@/car/static/car/carico.png'),
  42. baseUrl:config.baseUrl,
  43. datainfo:{
  44. realName:'',
  45. phonenumber:'',
  46. front:'',
  47. },
  48. }
  49. },
  50. onLoad: function() {
  51. },
  52. methods:{
  53. checkPermi, checkRole,
  54. getaddImage(e){
  55. let that = this;
  56. let file =[],count=9
  57. uni.chooseImage({
  58. count: 1,
  59. success:function(res){
  60. let img= res.tempFilePaths;
  61. if(img.length + file.length > count){
  62. uni.showToast({
  63. title: '最多上传'+count+'张图片',
  64. icon: 'none',
  65. duration: 2000
  66. })
  67. }else{
  68. let imglen = res.tempFilePaths.length;
  69. var fuwufile = [];
  70. uploadIdentify('/common/upload',img,0,0,0,imglen,fuwufile,function(rs){
  71. var resurl=rs[0];
  72. if(rs&&rs.length>0){
  73. var obj={
  74. url:resurl.urlOnline
  75. }
  76. that.getOcrIdCard(obj)
  77. }
  78. })
  79. }
  80. }
  81. });
  82. },
  83. getOcrIdCard(obj){
  84. var params={
  85. image:obj.url,
  86. idCardSide:obj.type
  87. }
  88. getlicensePlate(params).then(res=>{
  89. if(res.code==200){
  90. var datainfo=res.data;
  91. var code=res.msg;
  92. if(code){
  93. this.datainfo.plateNumber=code;
  94. }
  95. }
  96. })
  97. }
  98. }
  99. }
  100. </script>
  101. <style>
  102. page{background: #F3F3F0;}
  103. </style>
  104. <style lang="scss" scoped>
  105. .check /deep/ .uni-forms-item{min-height: 106rpx;box-sizing: border-box;display: flex;align-items: center;margin-bottom: 0;border-bottom: 2rpx solid #E6E6E6;padding:10rpx 0;}
  106. .check /deep/ .uni-forms-item__label{font-weight: bold;font-size: 26rpx;color: #222327;flex: 0 0 auto;width: auto !important;}
  107. .check /deep/ .uni-easyinput{flex: 1;text-align: right;font-size: 26rpx;color: #222327;}
  108. .check /deep/ .uni-easyinput__content-textarea{min-height: 40rpx;font-size: 26rpx;}
  109. .check /deep/ .uni-easyinput__placeholder-class{font-size: 26rpx;color: #AAAAAA;}
  110. .check /deep/ .uni-input-input{font-size: 26rpx;}
  111. .check /deep/ .uni-textarea-textarea{font-size: 26rpx;}
  112. .check /deep/ .is-disabled{color: #222327;background-color: #ffffff !important;}
  113. .check{min-height: 100vh;padding: 20rpx 24rpx 24rpx;box-sizing: border-box;display: flex;box-sizing: border-box;}
  114. .cbox{background: #FFFFFF;border-radius: 20rpx;flex: 1;padding-bottom: 32rpx;
  115. .chtop{padding-top: 32rpx;margin-bottom: 32rpx;
  116. image{width: 14rpx;height: 48rpx;margin-right: 20rpx;}
  117. view{font-weight: bold;font-size: 32rpx;color: #272727;}
  118. }
  119. .chmain{
  120. padding: 0 24rpx;
  121. .upbox{height: 224rpx;background: #EFF4FF;border-radius: 20rpx;display: flex;align-items: center;justify-content: center;flex-direction: column;margin-bottom: 8rpx;overflow: auto;
  122. .img{width: 100%;height: 100%;}
  123. .addimg{width: 70rpx;height: 70rpx;margin-bottom: 16rpx;}
  124. view{font-weight: bold;font-size: 26rpx;color: #4C6686;}
  125. }
  126. }
  127. }
  128. </style>