feat(概览)

src/views/business-analysis/topology/components/allBusinessCon.vue

@@ -296,7 +296,7 @@ import { getToken } from '@/utils/auth'
 import resize from '../../mixins/resize'
 import BigNumber from 'bignumber.js'
 export default {
-  name: 'KeyBusiness',
+  name: 'allBusinessCon',
   components: {
     ServiceSpaceDrawer
   },

src/views/business-analysis/topology/components/keyBusinessCon.vue

@@ -194,7 +194,7 @@ import { getToken } from '@/utils/auth'
 import resize from '../../mixins/resize'
 import BigNumber from 'bignumber.js'
 export default {
-  name: 'KeyBusiness',
+  name: 'keyBusinessCon',
   components: {
     ServiceSpaceDrawer
   },
@@ -355,6 +355,7 @@ export default {
     }
   },
   created() {
+    console.log(34567890,'created')
     this.$store.commit('time/setTimeFlag', false)
 
     this.appItem = storage.get('appsItem')

src/views/business-analysis/topology/components/topoCon.vue

@@ -45,6 +45,7 @@
 <script>
 import storage from '@/utils/storage'
 export default {
+  name: 'topoCon',
   data() {
     return {
       loading: false,

src/views/business-analysis/topology/systemTab.vue

@@ -1,52 +1,45 @@
 <template>
   <div class="system-tab-content">
-    <el-tabs v-model="activeName" class="customTab" @tab-click="handleClick">
-      <el-tab-pane v-for="item in btnArr" :key="item.name" :name="item.name">
+    <el-tabs v-model="activeName" class="customTab">
+      <el-tab-pane v-for="tab in tabs" :key="tab.name" :name="tab.name">
         <span slot="label">
-          <el-button size="small" round class="ob-header-btn">{{ item.name }}</el-button>
+          <el-button size="small" round class="ob-header-btn">{{ tab.label }}</el-button>
         </span>
-        <component :is="currentComponent" style="width: 100%;height: 100%;" />
+        <component :is="tab.component" />
       </el-tab-pane>
     </el-tabs>
   </div>
 </template>
 <script>
-import topoCon from './components/topoCon.vue'
+import TopoCon from './components/topoCon.vue'
 import KeyBusinessCon from './components/keyBusinessCon.vue'
 import AllBusinessCon from './components/allBusinessCon.vue'
 export default {
   components: {
-    topoCon,
+    TopoCon,
     KeyBusinessCon,
     AllBusinessCon
   },
   data() {
     return {
-      btnArr: [{
-        name: '动态拓扑',
-        id: '1'
-      }, {
-        name: '重点业务',
-        id: '2'
-      }, {
-        name: '业务总览',
-        id: '3'
-      }],
-      isShow: false,
-      currentComponent: 'topoCon',
-      activeName: '动态拓扑'
-    }
-  },
-  methods: {
-    handleClick() {
-      const obj = {
-        '动态拓扑': 'topoCon',
-        '重点业务': 'KeyBusinessCon',
-        '业务总览': 'AllBusinessCon'
-      }
-      this.$nextTick(() => {
-        this.currentComponent = obj[this.activeName]
-      })
+      activeName: 'topoCon',
+      tabs: [
+        {
+          name: 'topoCon',
+          label: '动态拓扑',
+          component: 'TopoCon' // 组件名称
+        },
+        {
+          name: 'keyBusinessCon',
+          label: '重点业务',
+          component: 'KeyBusinessCon' // 组件名称
+        },
+        {
+          name: 'allBusinessCon',
+          label: '业务总览',
+          component: 'AllBusinessCon' // 组件名称
+        }
+      ]
     }
   }
 }
@@ -92,5 +85,4 @@ export default {
     font-size: 14px;
   }
 }
-
 </style>