getcarno.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  1. <template>
  2. <view>
  3. <view class="taking-pictures" @click="getPic">点击拍照</view>
  4. <view class="wrap">
  5. <view class="title">手输车牌号</view>
  6. <view class="new-plate-number">
  7. <view class="message-input-wrap" @click="messageInputClick">
  8. <u-message-input :maxlength="8" width="70" font-size="50" :disabled-keyboard="true" v-model="newPlateNumber"></u-message-input>
  9. </view>
  10. <u-keyboard ref="uKeyboard" mode="car" @change="keyboardChange" @backspace="backspace" v-model="keyboardshow"></u-keyboard>
  11. </view>
  12. <view class="bottom-btn" @click="submit">确认</view>
  13. </view>
  14. <u-toast ref="uToast" />
  15. </view>
  16. </template>
  17. <script>
  18. //#ifdef APP-PLUS
  19. let ocr = uni.requireNativePlugin("OcrPlug");
  20. //#endif
  21. export default{
  22. data(){
  23. return{
  24. keyboardshow:false,
  25. newPlateNumber:'',
  26. spaceId:'',
  27. vehicleClor:''
  28. }
  29. },
  30. onLoad(page){
  31. this.spaceId = page.spaceId;
  32. },
  33. methods:{
  34. getPic(){
  35. // let that = this;
  36. // ocr.ocrVehicleNo((ret) => {
  37. // if (ret.success){
  38. // that.confirmData.vehicleNo = ret.vehicleNo;
  39. // //that.vehicleImage = 'data:image/png;base64,' + ret.imageBase64;
  40. // // speak('成功识别车牌' + ret.vehicleNo);
  41. // }else {
  42. // plus.nativeUI.toast('识别失败');
  43. // }
  44. // });
  45. let that = this;
  46. uni.chooseImage({
  47. count: 1, //默认9
  48. sizeType: ['compressed'], //可以指定是原图还是压缩图,默认二者都有
  49. sourceType: ['camera'], //
  50. success: function (res) {
  51. // console.log('img',res)
  52. uni.showLoading({});
  53. const tempFilePaths = res.tempFilePaths;
  54. // 若多选,需循环调用uni.uploadFile ,因微信小程序只支持单文件上传
  55. uni.uploadFile({
  56. url: `${that.config.fileUrl}/tencent/ocr`,
  57. filePath: tempFilePaths[0],
  58. name: 'file',
  59. formData: {
  60. 'isUpload': 1 // 上传附带参数
  61. },
  62. success: (res) => {
  63. // 根据接口具体返回格式 赋值具体对应url
  64. // alert(uploadFileRes.data);
  65. let resobj=eval("("+res.data+")");
  66. uni.hideLoading();
  67. if(resobj.code==200){
  68. console.log(resobj);
  69. that.newPlateNumber = resobj.data.vehicleNo;
  70. that.vehicleClor = resobj.data.vehicleClor;
  71. }else{
  72. that.$refs.uToast.show({
  73. title: resobj.msg,
  74. type: 'error'
  75. });
  76. }
  77. console.log(res);
  78. },
  79. fail: (err) => {
  80. that.$refs.uToast.show({
  81. title:err.msg,
  82. type: 'error'
  83. });
  84. uni.hideLoading();
  85. }
  86. });
  87. }
  88. });
  89. },
  90. messageInputClick(){
  91. this.keyboardshow = true;
  92. },
  93. // 按键被点击(点击退格键不会触发此事件)
  94. keyboardChange(val) {
  95. // 将每次按键的值拼接到value变量中,注意+=写法
  96. this.newPlateNumber += val;
  97. console.log(this.newPlateNumber);
  98. },
  99. // 退格键被点击
  100. backspace() {
  101. // 删除value的最后一个字符
  102. if(this.newPlateNumber.length) this.newPlateNumber = this.newPlateNumber.substr(0, this.newPlateNumber.length - 1);
  103. console.log(this.newPlateNumber);
  104. },
  105. submit(){
  106. let param ={
  107. spaceId:this.spaceId,
  108. vehicleNo:this.newPlateNumber,
  109. };
  110. this.$u.api.entrance(param)
  111. .then(res=>{
  112. this.$refs.uToast.show({
  113. title: res.msg,
  114. type: 'success',
  115. url:'pages/getout/getout'
  116. });
  117. console.log('entrance',res)
  118. }).catch(err=>{
  119. this.$refs.uToast.show({
  120. title: err.msg,
  121. type: 'error',
  122. url:'pages/parking/parking'
  123. });
  124. console.log('entrance ',err)
  125. });
  126. }
  127. }
  128. }
  129. </script>
  130. <style lang="scss">
  131. @import "./getcarno.scss";
  132. </style>