|
@@ -1,22 +1,67 @@
|
|
|
<template>
|
|
|
<HcNewCard>
|
|
|
<template #header>
|
|
|
- <el-button size="large" type="primary" @click="testClick">测试</el-button>
|
|
|
+ <el-button size="large" type="success" @click="connectReader">连接读卡器</el-button>
|
|
|
</template>
|
|
|
<template #extra>
|
|
|
- extra
|
|
|
- </template>
|
|
|
- 111111
|
|
|
- <template #action>
|
|
|
- action
|
|
|
+ <el-button size="large" type="warning" @click="clearTable">清除表格</el-button>
|
|
|
+ <el-button size="large" type="danger" @click="closeLink">关闭链接</el-button>
|
|
|
</template>
|
|
|
+ <hc-table :column="tableColumn" :datas="tableData" :is-index="false" />
|
|
|
</HcNewCard>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-const testClick = () => {
|
|
|
+import { onUnmounted, ref } from 'vue'
|
|
|
+
|
|
|
+const tableColumn = [{ key: 'epc', name: 'EPC' }]
|
|
|
+const tableData = ref([])
|
|
|
+
|
|
|
+//连接设备
|
|
|
+let device
|
|
|
+const connectReader = async () => {
|
|
|
+ tableData.value = []
|
|
|
+ const devices = await navigator.hid.requestDevice({
|
|
|
+ filters: [{ vendorId: 1240, productId: 831 }],
|
|
|
+ })
|
|
|
+ if (devices.length <= 0) return
|
|
|
+ device = devices[0]
|
|
|
+ // 检查设备是否打开
|
|
|
+ if (!device.opened) {
|
|
|
+ await device.open() // 打开设备
|
|
|
+ }
|
|
|
+ // 电脑接收到来自设备的消息回调
|
|
|
+ device.oninputreport = (event) => {
|
|
|
+ const array = new Uint8Array(event.data.buffer)
|
|
|
+ const data = array.slice(10, array[0] - 1)
|
|
|
+ let hexstr = ''
|
|
|
+ const res = new Uint8Array(data)
|
|
|
+ for (const data of res) {
|
|
|
+ hexstr += (Array(2).join(0) + data.toString(16).toUpperCase()).slice(-2) + '' // 将字节数据转换成(XX )形式字符串
|
|
|
+ }
|
|
|
+ tableData.value.push({ epc: hexstr })
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
+//清除表格
|
|
|
+const clearTable = () => {
|
|
|
+ tableData.value = []
|
|
|
}
|
|
|
+
|
|
|
+//关闭设备连接
|
|
|
+const closeLink = async () => {
|
|
|
+ if ((device != null) && (device?.opened)) {
|
|
|
+ await device.close() // 关闭设备
|
|
|
+ await device.forget() // 遗忘设备
|
|
|
+ clearTable()
|
|
|
+ device = null
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//页面卸载
|
|
|
+onUnmounted(() => {
|
|
|
+ closeLink()
|
|
|
+})
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|