|
|
@@ -118,15 +118,12 @@
|
|
|
<a-button type="primary" @click="state.drawerVisible = true" >选择设备</a-button>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
- <!-- :tab-list="tabListNoTitle"
|
|
|
- :active-tab-key="state.activeKey"
|
|
|
- @tabChange="onTabChange" -->
|
|
|
- <a-card
|
|
|
- title="应用模拟器"
|
|
|
- style="width: 100%;height: 632px;margin-top: 10px;position: relative;"
|
|
|
- >
|
|
|
+ <a-row>
|
|
|
+ <a-card
|
|
|
+ title="应用模拟器"
|
|
|
+ style="width: 100%;height: 316px;margin-top: 10px;position: relative;"
|
|
|
+ >
|
|
|
<a-row :gutter="[8, 8]">
|
|
|
- <a-col span="24" ><a-tag color="blue" style="scale: 1.2;" >命令下发</a-tag></a-col>
|
|
|
<a-col class="subtitle" span="24" >
|
|
|
应用模拟器可根据产品定义向设备下发命令。<br/>
|
|
|
若您使用了图形化开发的编解码插件，为获得正确的编码结果，下发命令时，请携带所有在插件中定义的字段，且每个命令的长度需小于512个字节
|
|
|
@@ -170,8 +167,46 @@
|
|
|
<template #extra >
|
|
|
<a-button type="primary" @click="openCmdModal">命令下发</a-button>
|
|
|
</template>
|
|
|
-
|
|
|
</a-card>
|
|
|
+ </a-row>
|
|
|
+ <a-row>
|
|
|
+ <a-card
|
|
|
+ title="设备模拟器"
|
|
|
+ style="width: 100%;height: 316px;margin-top: 10px;position: relative;"
|
|
|
+ >
|
|
|
+
|
|
|
+ <a-textarea
|
|
|
+ v-model:input="simulatorState.input"
|
|
|
+ :placeholder="placeholder"
|
|
|
+ :auto-size="{ minRows: 8 }"
|
|
|
+ />
|
|
|
+ <template #extra >
|
|
|
+ <a-space>
|
|
|
+ <a-spin
|
|
|
+ :spinning="simulatorState.spinning"
|
|
|
+ >
|
|
|
+ <a-select
|
|
|
+ v-model:value="simulatorState.searchDeviceLabel"
|
|
|
+ show-search
|
|
|
+ placeholder="输入设备名检索设备"
|
|
|
+ :default-active-first-option="false"
|
|
|
+ style="width: 170px"
|
|
|
+ :filter-option="false"
|
|
|
+ :not-found-content="null"
|
|
|
+ :options="simulatorState.dataSource"
|
|
|
+ @search="getDeviceLabel"
|
|
|
+ @change="selectDevice"
|
|
|
+ >
|
|
|
+ <template #notFoundContent>
|
|
|
+ <a-spin size="small" />
|
|
|
+ </template>
|
|
|
+ </a-select>
|
|
|
+ </a-spin>
|
|
|
+ <a-button v-if="simulatorState.deviceId!" type="primary" @click="deviceSimulator" >发送模拟数据</a-button>
|
|
|
+ </a-space>
|
|
|
+ </template>
|
|
|
+ </a-card>
|
|
|
+ </a-row>
|
|
|
</a-col>
|
|
|
</a-row>
|
|
|
|
|
|
@@ -179,7 +214,7 @@
|
|
|
v-model:open="state.drawerVisible"
|
|
|
size="large"
|
|
|
class="custom-class"
|
|
|
- title="选择设备2233"
|
|
|
+ title="选择设备"
|
|
|
placement="right"
|
|
|
>
|
|
|
<SelectDevice ref="selectDeviceRef" />
|
|
|
@@ -218,10 +253,22 @@ const route = useRoute()
|
|
|
|
|
|
const selectDeviceRef = ref()
|
|
|
|
|
|
+const placeholder = computed(() => {
|
|
|
+ return '如果是二进制请输入HEX字符，如二进制[0x00, 0x50, 0x00, 0x5a]对应的模拟输入数据为0050005a。如果是json格式请输入json 字符串,比如 {"id":1}'
|
|
|
+})
|
|
|
+
|
|
|
const cmdState = reactive({
|
|
|
visible: false
|
|
|
})
|
|
|
|
|
|
+const simulatorState = reactive({
|
|
|
+ spinning: false,
|
|
|
+ searchDeviceLabel: null,
|
|
|
+ dataSource: [],
|
|
|
+ deviceId: '',
|
|
|
+ input: ''
|
|
|
+})
|
|
|
+
|
|
|
const state = reactive<{
|
|
|
activeKey: 'app',
|
|
|
drawerVisible: boolean,
|
|
|
@@ -329,6 +376,27 @@ const getDeviceById = async () => {
|
|
|
state.device = data
|
|
|
}
|
|
|
|
|
|
+const selectDevice = async (value: string) => {
|
|
|
+ const device = await DeviceContriller.byId(value)
|
|
|
+ simulatorState.deviceId = device.id
|
|
|
+}
|
|
|
+
|
|
|
+const getDeviceLabel = async (val: string) => {
|
|
|
+ if (!val) return
|
|
|
+ simulatorState.spinning = true
|
|
|
+ const { data } = await DeviceContriller.labelsByLabel(val)
|
|
|
+ simulatorState.spinning = false
|
|
|
+ simulatorState.dataSource = data.map(item => ({ value: item.id, label: item.deviceLabel }))
|
|
|
+ console.log(data)
|
|
|
+}
|
|
|
+
|
|
|
+const deviceSimulator = async () => {
|
|
|
+ await DeviceContriller.deviceSimulator({
|
|
|
+ deviceId: simulatorState.deviceId,
|
|
|
+ payload: simulatorState.input
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
const deviceId = route.query.id as string
|
|
|
|
