Commit 5ef2e07e2c4349d57bed5d76a43fb4a96224728a
1 parent
560b2cd5
perf: 优化边缘实例,由点击路由跳转边缘设备修改为Tab页签方式展示
Showing
4 changed files
with
19 additions
and
9 deletions
| @@ -45,6 +45,7 @@ | @@ -45,6 +45,7 @@ | ||
| 45 | const [registerTable, { reload }] = useTable({ | 45 | const [registerTable, { reload }] = useTable({ |
| 46 | title: '边缘设备', | 46 | title: '边缘设备', |
| 47 | columns, | 47 | columns, |
| 48 | + tableLayout: 'auto', | ||
| 48 | api: async ({ page, pageSize, textSearch }) => { | 49 | api: async ({ page, pageSize, textSearch }) => { |
| 49 | const res = await edgeDevicePage( | 50 | const res = await edgeDevicePage( |
| 50 | { | 51 | { |
| @@ -8,7 +8,7 @@ | @@ -8,7 +8,7 @@ | ||
| 8 | import { Image } from 'ant-design-vue'; | 8 | import { Image } from 'ant-design-vue'; |
| 9 | import { useMessage } from '/@/hooks/web/useMessage'; | 9 | import { useMessage } from '/@/hooks/web/useMessage'; |
| 10 | import { syncEdge } from '/@/api/edgeManage/edgeInstance'; | 10 | import { syncEdge } from '/@/api/edgeManage/edgeInstance'; |
| 11 | - import { useGo } from '/@/hooks/web/usePage'; | 11 | + // import { useGo } from '/@/hooks/web/usePage'; |
| 12 | 12 | ||
| 13 | const props = defineProps({ | 13 | const props = defineProps({ |
| 14 | recordData: { | 14 | recordData: { |
| @@ -30,7 +30,7 @@ | @@ -30,7 +30,7 @@ | ||
| 30 | 30 | ||
| 31 | const { createMessage } = useMessage(); | 31 | const { createMessage } = useMessage(); |
| 32 | 32 | ||
| 33 | - const go = useGo(); | 33 | + // const go = useGo(); |
| 34 | 34 | ||
| 35 | const loadStatus = ref(false); | 35 | const loadStatus = ref(false); |
| 36 | 36 | ||
| @@ -51,9 +51,9 @@ | @@ -51,9 +51,9 @@ | ||
| 51 | } | 51 | } |
| 52 | }; | 52 | }; |
| 53 | 53 | ||
| 54 | - const handleEventIsOpenEdgeDevice = () => { | ||
| 55 | - go('/edge/edge_device/' + props.recordData?.id?.id); | ||
| 56 | - }; | 54 | + // const handleEventIsOpenEdgeDevice = () => { |
| 55 | + // go('/edge/edge_device/' + props.recordData?.id?.id); | ||
| 56 | + // }; | ||
| 57 | </script> | 57 | </script> |
| 58 | 58 | ||
| 59 | <template> | 59 | <template> |
| @@ -74,9 +74,9 @@ | @@ -74,9 +74,9 @@ | ||
| 74 | <a-button :loading="loadStatus" type="primary" @click="handleEventIsSyncEdge" | 74 | <a-button :loading="loadStatus" type="primary" @click="handleEventIsSyncEdge" |
| 75 | >同步边缘</a-button | 75 | >同步边缘</a-button |
| 76 | > | 76 | > |
| 77 | - <a-button class="ml-4" type="primary" @click="handleEventIsOpenEdgeDevice" | 77 | + <!-- <a-button class="ml-4" type="primary" @click="handleEventIsOpenEdgeDevice" |
| 78 | >边缘设备</a-button | 78 | >边缘设备</a-button |
| 79 | - > | 79 | + > --> |
| 80 | </div> | 80 | </div> |
| 81 | </div> | 81 | </div> |
| 82 | </a-col> | 82 | </a-col> |
| @@ -3,6 +3,7 @@ | @@ -3,6 +3,7 @@ | ||
| 3 | import { ref } from 'vue'; | 3 | import { ref } from 'vue'; |
| 4 | import { EdgeMonitoring } from '../EdgeMonitoring'; | 4 | import { EdgeMonitoring } from '../EdgeMonitoring'; |
| 5 | import { EdgeEvents } from '../EdgeEvents'; | 5 | import { EdgeEvents } from '../EdgeEvents'; |
| 6 | + import { EdgeDevice } from '../EdgeDevice'; | ||
| 6 | import { EdgeInstanceItemType } from '/@/api/edgeManage/model/edgeInstance'; | 7 | import { EdgeInstanceItemType } from '/@/api/edgeManage/model/edgeInstance'; |
| 7 | import type { PropType } from 'vue'; | 8 | import type { PropType } from 'vue'; |
| 8 | 9 | ||
| @@ -14,11 +15,12 @@ | @@ -14,11 +15,12 @@ | ||
| 14 | }); | 15 | }); |
| 15 | 16 | ||
| 16 | enum ActiveKey { | 17 | enum ActiveKey { |
| 18 | + EDGE_DEVICE = 'EdgeDevice', | ||
| 17 | EDGEMONITORING = 'EdgeMonitoring', | 19 | EDGEMONITORING = 'EdgeMonitoring', |
| 18 | EDGEEVENTS = 'EdgeEvents', | 20 | EDGEEVENTS = 'EdgeEvents', |
| 19 | } | 21 | } |
| 20 | 22 | ||
| 21 | - const activeKey = ref(ActiveKey.EDGEMONITORING); | 23 | + const activeKey = ref(ActiveKey.EDGE_DEVICE); |
| 22 | </script> | 24 | </script> |
| 23 | 25 | ||
| 24 | <template> | 26 | <template> |
| @@ -29,6 +31,13 @@ | @@ -29,6 +31,13 @@ | ||
| 29 | type="card" | 31 | type="card" |
| 30 | class="w-full h-full bg-light-50 !p-4 dark:bg-dark-900" | 32 | class="w-full h-full bg-light-50 !p-4 dark:bg-dark-900" |
| 31 | > | 33 | > |
| 34 | + <Tabs.TabPane tab="边缘设备" :key="ActiveKey.EDGE_DEVICE"> | ||
| 35 | + <EdgeDevice | ||
| 36 | + v-if="recordData" | ||
| 37 | + :recordData="recordData" | ||
| 38 | + class="p-4 bg-neutral-100 dark:bg-dark-700" | ||
| 39 | + /> | ||
| 40 | + </Tabs.TabPane> | ||
| 32 | <Tabs.TabPane tab="边缘监控" :key="ActiveKey.EDGEMONITORING"> | 41 | <Tabs.TabPane tab="边缘监控" :key="ActiveKey.EDGEMONITORING"> |
| 33 | <EdgeMonitoring | 42 | <EdgeMonitoring |
| 34 | v-if="recordData" | 43 | v-if="recordData" |