绘制技术监督 ui

src/views/pqs/supervise/terminal/index.vue

@@ -1,20 +1,37 @@
 <template>
     <div class="default-main">
         <el-tabs v-model="activeName" type="border-card">
-            <el-tab-pane label="终端入网检测" name="1"></el-tab-pane>
-            <el-tab-pane label="终端周期检测" name="2"></el-tab-pane>
+            <el-tab-pane label="终端入网检测" name="1">
+                <!-- <network v-if="activeName == '1'" /> -->
+                <el-tabs v-model="network" type="border-card" style="height: 100%" tab-position="left">
+                    <el-tab-pane label="列表" name="1">
+                        <networkTab v-if="activeName == '1' && network == '1'" />
+                    </el-tab-pane>
+                    <el-tab-pane label="图表" name="2">Config</el-tab-pane>
+                </el-tabs>
+            </el-tab-pane>
+            <el-tab-pane label="终端周期检测" name="2">
+                <!-- <cycle v-if="activeName == '2'" /> -->
+                <el-tabs v-model="cycle" type="border-card" style="height: 100%" tab-position="left">
+                    <el-tab-pane label="列表" name="1"><cycleTab v-if="activeName == '2' && cycle == '1'"/></el-tab-pane>
+                    <el-tab-pane label="图表" name="2">Config</el-tab-pane>
+                </el-tabs>
+            </el-tab-pane>
         </el-tabs>
     </div>
 </template>
 
 <script setup lang="ts">
 import { onMounted, reactive, ref, provide } from 'vue'
-
+import networkTab from './components/networkTab.vue'
+import cycleTab from './components/cycleTab.vue'
 import { mainHeight } from '@/utils/layout'
 defineOptions({
     name: 'Processsupervision/Terminaldetection'
 })
 const activeName = ref('1')
+const network = ref('1')
+const cycle = ref('1')
 const Statistics = ref()
 const compatibility = ref()