getcarno.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  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. import getUrlParams from "../../utils/getUrlParams.js";
  19. export default{
  20. data(){
  21. return{
  22. keyboardshow:false,
  23. newPlateNumber:'',
  24. spaceId:'',
  25. vehicleClor:''
  26. }
  27. },
  28. onLoad(){
  29. let locationLocaturl = window.location.hash;
  30. // console.log('locationLocaturl',locationLocaturl)
  31. this.spaceId = getUrlParams(locationLocaturl,"spaceId");
  32. },
  33. methods:{
  34. getPic(){
  35. let that = this;
  36. uni.chooseImage({
  37. count: 1, //默认9
  38. sizeType: ['compressed'], //可以指定是原图还是压缩图,默认二者都有
  39. sourceType: ['camera'], //
  40. success: function (res) {
  41. // console.log('img',res)
  42. uni.showLoading({});
  43. const tempFilePaths = res.tempFilePaths;
  44. // 若多选,需循环调用uni.uploadFile ,因微信小程序只支持单文件上传
  45. uni.uploadFile({
  46. url: `${that.config.fileUrl}/baidu/ocr`,
  47. filePath: tempFilePaths[0],
  48. name: 'file',
  49. formData: {
  50. 'test': 'test' // 上传附带参数
  51. },
  52. success: (res) => {
  53. // 根据接口具体返回格式 赋值具体对应url
  54. // alert(uploadFileRes.data);
  55. let resobj=eval("("+res.data+")");
  56. uni.hideLoading();
  57. if(resobj.code==200){
  58. console.log(resobj);
  59. that.newPlateNumber = resobj.data.vehicleNo;
  60. that.vehicleClor = resobj.data.vehicleClor;
  61. }else{
  62. that.$refs.uToast.show({
  63. title: resobj.msg,
  64. type: 'error'
  65. });
  66. }
  67. console.log(res);
  68. },
  69. fail: (err) => {
  70. that.$refs.uToast.show({
  71. title:err.msg,
  72. type: 'error'
  73. });
  74. uni.hideLoading();
  75. }
  76. });
  77. }
  78. });
  79. },
  80. messageInputClick(){
  81. this.keyboardshow = true;
  82. },
  83. // 按键被点击(点击退格键不会触发此事件)
  84. keyboardChange(val) {
  85. // 将每次按键的值拼接到value变量中,注意+=写法
  86. this.newPlateNumber += val;
  87. console.log(this.newPlateNumber);
  88. },
  89. // 退格键被点击
  90. backspace() {
  91. // 删除value的最后一个字符
  92. if(this.newPlateNumber.length) this.newPlateNumber = this.newPlateNumber.substr(0, this.newPlateNumber.length - 1);
  93. console.log(this.newPlateNumber);
  94. },
  95. submit(){
  96. let param ={
  97. spaceId:this.spaceId,
  98. vehicleNo:this.newPlateNumber,
  99. };
  100. this.$u.api.entrance(param)
  101. .then(res=>{
  102. this.$refs.uToast.show({
  103. title: res.msg,
  104. type: 'success',
  105. url:'pages/getout/getout'
  106. });
  107. console.log('entrance',res)
  108. }).catch(err=>{
  109. this.$refs.uToast.show({
  110. title: err.msg,
  111. type: 'error',
  112. url:'pages/parking/parking'
  113. });
  114. console.log('entrance ',err)
  115. });
  116. }
  117. }
  118. }
  119. </script>
  120. <style lang="scss" scoped>
  121. @import "./getcarno.scss";
  122. </style>