fix: 拓扑图基础

src/views/monitor/topology/index.vue

@@ -0,0 +1,68 @@
+<script setup lang="ts">
+import { reactive, onMounted } from 'vue';
+import { PageContainer } from 'antdv-pro-layout';
+import ChartGraphG6 from '@/components/ChartGraphG6/index.vue';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
+
+/**查询全部网元数据列表 */
+function fnGetList() {}
+
+onMounted(() => {});
+</script>
+
+<template>
+  <PageContainer>
+    <a-card
+      :bordered="false"
+      :body-style="{ marginBottom: '24px', paddingBottom: 0 }"
+    >
+      <!-- 表格搜索栏 -->
+      <a-form name="queryParams" layout="horizontal">
+        <a-row :gutter="16">
+          <a-col :lg="10" :md="10" :xs="24">
+            <a-form-item
+              :label="t('views.monitor.monitor.filter')"
+              name="neTypeSelect"
+            >
+              ssdf
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item>
+              <a-space :size="8">
+                <a-button type="primary" @click.prevent="fnGetList()">
+                  <template #icon><SearchOutlined /></template>
+                  {{ t('common.search') }}
+                </a-button>
+              </a-space>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </a-card>
+
+    <a-row :gutter="16">
+      <a-col :lg="24" :md="24" :xs="24">
+        <a-card :bordered="false" :body-style="{ marginBottom: '24px' }">
+          <!-- 插槽-卡片左侧侧 -->
+          <template #title>asdf</template>
+          <!-- 插槽-卡片右侧 -->
+          <template #extra> adf </template>
+
+          <div class="chart">
+            <ChartGraphG6 :option="{}"></ChartGraphG6>
+          </div>
+        </a-card>
+      </a-col>
+    </a-row>
+  </PageContainer>
+</template>
+
+<style lang="less" scoped>
+.chart {
+  width: 100%;
+  height: 500px;
+  background-color: rgb(238, 237, 237);
+}
+</style>