Parcourir la source

fix(router): 设备模拟 与cvs 树

wangxiao il y a 2 ans
Parent
commit
e67ce0d326
2 fichiers modifiés avec 89 ajouts et 2 suppressions
  1. 1 1
      config/proxy.ts
  2. 88 1
      src/pages/Iot/device/simulator.vue

+ 1 - 1
config/proxy.ts

@@ -11,7 +11,7 @@ module.exports = {
       pathRewrite: { '^/user': '' }
     },
     '/cvs': {
-      target: 'http://127.0.0.1:8888',
+      target: 'http://124.222.113.37:8080',
       changeOrigin: true,
       pathRewrite: { '^/cvs': '' }
     },

+ 88 - 1
src/pages/Iot/device/simulator.vue

@@ -1,3 +1,90 @@
 <template>
-  <a-card></a-card>
+  <a-card
+    style="margin-top: 20px;"
+    title="设备模拟器"
+  >
+    <a-row :gutter="[8, 8]" style="margin: 0 20px;" >
+      <a-col :span="24" >
+        <a-space>
+          <a-spin
+            :spinning="state.spinning"
+          >
+            <a-select
+              v-model:value="state.searchDeviceLabel"
+              show-search
+              placeholder="输入设备名检索设备"
+              :default-active-first-option="false"
+              style="width: 170px"
+              :show-arrow="false"
+              :filter-option="false"
+              :not-found-content="null"
+              :options="state.dataSource"
+              @search="getDeviceLabel"
+              @change="selectDevice"
+            >
+              <template v-if="state.fetching" #notFoundContent>
+                <a-spin size="small" />
+              </template>
+            </a-select>
+          </a-spin>
+          <a-button v-if="state.deviceId!" @click="deviceSimulator" >发送模拟数据</a-button>
+        </a-space>
+      </a-col>
+      <a-col :span="24">
+        <a-textarea
+          v-model:value="state.input"
+          :placeholder="placeholder"
+          :auto-size="{ minRows: 8 }"
+        />
+      </a-col>
+
+    </a-row>
+  </a-card>
 </template>
+
+<script lang='ts' setup >
+import { DeviceContriller } from '@/controller'
+import { reactive, computed } from 'vue'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
+const placeholder = computed(() => {
+  return '如果是二进制请输入HEX字符,如二进制[0x00, 0x50, 0x00, 0x5a]对应的模拟输入数据为0050005a。如果是json格式请输入json 字符串,比如 {"id":1}'
+})
+
+const state = reactive<{
+  [key: string]: any
+}>({
+  input: '',
+  deviceId: '',
+  searchDeviceLabel: null,
+  dataSource: [],
+  loading: false,
+  spinning: false
+})
+
+state.deviceId = route.query.id as string
+
+const selectDevice = async (value: string) => {
+  const device = await DeviceContriller.byId(value)
+  state.deviceId = device.id
+}
+
+const getDeviceLabel = async (val: string) => {
+  if (!val) return
+  state.spinning = true
+  const { data } = await DeviceContriller.labelsByLabel(val)
+  state.spinning = false
+  state.dataSource = data.map(item => ({ value: item.id, label: item.deviceLabel }))
+  console.log(data)
+}
+
+const deviceSimulator = async () => {
+  await DeviceContriller.deviceSimulator({
+    deviceId: state.deviceId,
+    payload: state.input
+  })
+}
+</script>
+<style lang='less' scoped >
+</style>