getcarno.vue 3.3 KB

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