import Quagga from 'quagga' // 条形码 import QRCode from 'qrcodejs2'


<el-upload action="" :show-file-list="false" :http-request="thumbupdateUpload">
  <el-button style="margin-bottom: 10px" icon="el-icon-thumb">点击上传快递单条形码</el-button>（识别单号）
  </el-upload>
  <div v-if="express_img">
  <el-image :src="express_img" fit="contain" class="thumbUrl" :preview-src-list="[express_img]" :z-index="3000" />
  </div>


// 识别物流信息
thumbupdateUpload(params) {
  const file = params.file
  const imgType = ['image/png', 'image/jpg', 'image/jpeg']
  if (imgType.indexOf(file.type) === -1) {
    this.$message.warning('上传图片格式必须为: png或jpg格式')
    return false
  }
  // this.express_img = URL.createObjectURL(file) //赋值图片的url，用于图片回显功能
  let _this = this
  if(file){
    let reader = new FileReader()
    reader.readAsDataURL(file)
    reader.onloadend = function() {
      let img = new Image()
      img.src = reader.result
      _this.init(img.src) // init函数，路径为参数
    }
  }
},

init(src){
  let _this = this
  const config = {
    locator: {
      patchSize: "medium",
      halfSample: true
    },
    numOfWorkers: (navigator.hardwareConcurrency ? navigator.hardwareConcurrency : 4),
    decoder : {
      readers: ["code_128_reader", "ean_reader", "ean_8_reader", "code_39_reader", "code_39_vin_reader", "codabar_reader", "upc_reader", "upc_e_reader", "i2of5_reader"], // List of active readers
    },
    locate: true,
    src:src
  }
  Quagga.decodeSingle(config,function(result) {
    if(!result){
      _this.$message.error('图片中没有条形码!')
      return false;
    }
    //识别结果
    if(result.codeResult){
      _this.addForm.express_number = result.codeResult.code
      _this.express_img = src // 图片回显
    }else{
      _this.$message.error('未识别图片中条形码!')
    }
  })
},