双奇点-增加扫码

周宾

3 天以前 6027ffa6428b8ca5e2cfd8d76e6516ec3d595143

双奇点-增加扫码

 src/views/inventoryManagement/stockManagement/index.vue

@@ -146,6 +146,51 @@
        </div>
      </template>
    </el-dialog>
    <el-dialog v-model="barcodeDia" title="产品信息" width="70%" @close="closeBarcodeDia">
      <div>
        <el-row :gutter="30">
          <el-col :span="12">
            <div class="barcode-item">
              <div class="barcode-label">名称</div>
              <div class="barcode-value">{{barcodeDetail.barcode}}</div>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="barcode-item">
              <div class="barcode-label">单价</div>
              <div class="barcode-value">xxx元</div>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <div class="barcode-item">
              <div class="barcode-label">产品高度</div>
              <div class="barcode-value">222cm</div>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="barcode-item">
              <div class="barcode-label">数量/件</div>
              <div class="barcode-value">120</div>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <div class="barcode-item">
              <div class="barcode-label">规格</div>
              <div class="barcode-value">12*20*30</div>
            </div>
          </el-col>
        </el-row>
      </div>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="closeBarcodeDia">关闭</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

@@ -186,6 +231,7 @@
// 用户信息表单弹框数据
const operationType = ref('')
const dialogFormVisible = ref(false)
const barcodeDia = ref(false)
const data = reactive({
  searchForm: {
    supplierName: '',
@@ -281,6 +327,7 @@

// 打开弹框
const openForm = async (type, row) => {
  console.log('openForm',type,row)
  operationType.value = type
  form.value = {}
  productData.value = []
@@ -401,7 +448,39 @@
  const day = String(today.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
}

let scanBarcodeInput = ref('')
const scanBarcode = (e) => {
  if(!e||!e.target||!e.target.tagName){
    return;
  }
  if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') {
    return
  }
  if (e.key === 'Enter') {
    let _value = scanBarcodeInput.value
    getDetail(_value)
    scanBarcodeInput.value = ""
  } else {
    scanBarcodeInput.value += e.key
  }
}

const barcodeDetail = ref({})
const getDetail = (barcode)=>{
  barcodeDetail.value = {
    barcode:barcode
  }
  barcodeDia.value = true
}

const closeBarcodeDia = () => {
  barcodeDia.value = false
}

onMounted(() => {
  // 添加扫码枪监听事件
  document.addEventListener('keypress', scanBarcode)
  getList()
  // checkStockAndCreatePurchase();
    // 每小时检查一次库存
@@ -411,6 +490,11 @@
//   // 组件卸载时清除定时器
//   clearInterval(intervalId);
// });
})
onUnmounted(() => {
  // 移除键盘监听事件
  document.removeEventListener('keypress', scanBarcode)
  console.log('组件卸载')
})
</script>

@@ -423,4 +507,9 @@
:deep(.row-low-stock:hover > td) {
  background-color: #fcd4d4;
}
.barcode-item{
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
}
</style>