ownersquery.vue 3.6 KB

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