yiliangyiyun-pc/src/components/balanceAlert.vue

<template>
  <div class="content">
    <div class="title" v-if="information.indexOf('毛重') > -1">毛重</div>
    <div class="title" v-else>皮重</div>
    <div class="contentInfo">
      <div class="uncertain">浮动重量</div>
      <div class="number" v-if="information.indexOf('毛重') > -1">
        {{ grossWeightVal }} kg
      </div>
      <div class="number" v-else>{{ tareVal }} kg</div>
    </div>

    <div class="btn" @click="sendVal">确定</div>
  </div>
</template>

<script>
export default {
  name: 'balanceAlert',
  props: ['deptBudgetList', 'information'],
  data() {
    return {
      param: 9600,
      grossWeightVal: '',
      tareVal: '',
    }
  },
  activated() {},
  mounted() {
    console.log('11111111111111111111111111111111111')
    console.log(this.deptBudgetList)
    this.openPort()
  },
  computed: {},
  created() {},
  methods: {
    sendVal() {
      console.log(this.grossWeightVal)
      console.log(this.tareVal)
      console.log(this.deptBudgetList)
      if (this.information.indexOf('毛重') > -1) {
        this.$emit('balanceListen', this.grossWeightVal)
      } else {
        this.$emit('balanceListen', this.tareVal)
      }
    },
    async closePort() {
      console.log('closePort')
      this.reader.cancel()
    },
    async openPort() {
      console.log('openPort', navigator)
      if ('serial' in navigator) {
        if (!this.$store.state.app.reader) {
          // The Web Serial API is supported.
          console.log('the Web Serial API is supported.')
          const port = await navigator.serial.requestPort()
          if (this.deptBudgetList.warehouseName == '白城内陆港') {
            this.param = 1200
          } else {
            this.param = 9600
          }
          console.log(this.param)
          await port.open({
            baudRate: this.param,
          }) // set baud rate
          this.reader = port.readable.getReader()
          console.log('port  ', port)
          this.$store.dispatch('app/setReader', this.reader)
          console.log('reader  ', this.reader)
        } else {
          console.log('afterport', this.$store.state.app.reader)
          this.reader = this.$store.state.app.reader
        }
        // 监听来自串行设备的数据
        while (true) {
          const { value, done } = await this.reader.read()
          // console.log("value",value);
          if (done) {
            // 允许稍后关闭串口。
            this.reader.releaseLock()
            break
          }
          var result = ''
          //2。获取16进制字符串
          // var receData = HexConvert.ByteToString(value);
          // console.log("receData",receData);
          var flag = false
          var flag1 = false
          // for (var i = 0; i < value.length; i++) {
          //   var tmp = String.fromCharCode(value[i])
          //   if (tmp == '+') {
          //     flag = true
          //   }
          //   if (flag && result.length < 6 && tmp != '+') {
          //     result += tmp
          //   }
          // }
          // if (this.information != '毛重检斤') {
          //   if(parseInt(result)){
          //     this.deptBudgetList.grossWeight = parseInt(result)
          //   }
          // } else {
          //   if(parseInt(result)){
          //     this.deptBudgetList.tare = parseInt(result)
          //   }
          // }
          if (value.length > 3) {
            console.log('value:', value)
          } else if (this.deptBudgetList.warehouseName == '白城内陆港') {
            continue
          }
          if (
            this.deptBudgetList.warehouseName &&
            (this.deptBudgetList.warehouseName == '山东诸城迈饶库' ||
              this.deptBudgetList.warehouseName == '克东千红库' ||
              this.deptBudgetList.warehouseName == '鲅鱼圈祥腾库' ||
              this.deptBudgetList.warehouseName == '哈尔滨依兰库' ||
              this.deptBudgetList.warehouseName == '龙江金信库' ||
              this.deptBudgetList.warehouseName == '白城内陆港')
          ) {
            for (var i = 0; i < value.length; i++) {
              var tmp = String.fromCharCode(value[i])
              if (tmp == '+') {
                flag = true
              }
              if (flag && result.length < 6 && tmp != '+') {
                result += tmp
              }
            }
            if (this.information.indexOf('毛重') > -1) {
              if (parseInt(result) || parseInt(result) == 0) {
                this.grossWeightVal = parseInt(result)
              }
            } else {
              if (parseInt(result) || parseInt(result) == 0) {
                this.tareVal = parseInt(result)
              }
            }
          } else if (
            this.deptBudgetList.warehouseName &&
            (this.deptBudgetList.warehouseName == '顺诚粮库' ||
              this.deptBudgetList.warehouseName == '鲅鱼圈金信库')
          ) {
            for (var i = value.length - 1; i >= 0; i--) {
              var tmp = String.fromCharCode(value[i])
              console.log(tmp)
              if (String.fromCharCode(value[0]) == '.') {
                flag = true
              }
              if (flag && result.length < 9 && tmp != '=' && tmp != '.') {
                result += tmp
              }
            }
            if (this.information.indexOf('毛重') > -1) {
              if (parseInt(result) || parseInt(result) == 0) {
                this.grossWeightVal = parseInt(result)
              }
            } else {
              if (parseInt(result) || parseInt(result) == 0) {
                this.tareVal = parseInt(result)
              }
            }
          } else {
            if (value.length > 10) {
              for (var i = 0; i < value.length; i++) {
                var tmp = String.fromCharCode(value[i])

                // if (value[0] != 49 && value[0] != 2) {
                //   // if (
                //   //   value[value.length - 1] == 48 &&
                //   //   value[value.length - 2] == 48
                //   // ) {
                //   //   flag1 = true
                //   // } else {
                //   //   break
                //   // }
                //   // flag1 = true
                //   if (i == 0) {
                //     this.result1 = tmp + '0'
                //   }
                // }
                // else{
                //   if (tmp == String.fromCharCode(32)) {
                //     flag = true
                //   }
                // }
                if (tmp == String.fromCharCode(32)) {
                  flag = true
                }
                if (
                  flag &&
                  result.length < 7 &&
                  tmp != String.fromCharCode(32)
                  // &&
                  // !(
                  //   value[value.length - 1] == 48 && value[value.length - 2] == 48
                  // )
                ) {
                  if (i > 0 && value[i] == 48 && value[i - 1] == 32 && result) {
                    break
                  } else {
                    result += tmp
                  }
                }
                // if (flag1 && tmp != String.fromCharCode(32)) {
                //   // if (
                //   //   value[value.length - 1] == 48 &&
                //   //   value[value.length - 2] == 48
                //   // ) {
                //   //   if (i == 0) {
                //   //     this.result1 = tmp + '0'
                //   //   }
                //   // }
                //   if (i == 0) {
                //     this.result1 = tmp + '0'
                //   }
                // }
              }
            }

            if (this.information.indexOf('毛重') > -1) {
              if (parseInt(result) || parseInt(result) == 0) {
                this.grossWeightVal = parseInt(result + this.result1)
              }
            } else {
              if (parseInt(result) || parseInt(result) == 0) {
                this.tareVal = parseInt(result + this.result1)
              }
            }
          }
          // setTimeout(1000)
          // value 是一个 Uint8Array
        }
        await port.close()
      } else {
        console.log('the Web Serial API is not supported.', navigator)
      }
    },
  },
}
</script>

<style lang="scss" scoped>
.content {
  height: 350px;
  position: relative;
  background: black;
  color: #2aff7c;
  font-size: 32px;
  text-align: right;
  padding: 20px;
  border-radius: 10px;
  margin: 0 20px 20px 20px;
  .btn {
    position: absolute;
    bottom: 20px;
    right: 20px;
    border: 1px solid #2aff7c;
    width: 200px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .contentInfo {
    display: flex;
    .uncertain {
      width: 35%;
      text-align: left;
    }
    .number {
      width: 65%;
      text-align: right;
    }
  }
}
.title {
  text-align: right;
  margin-bottom: 20px;
}
</style>