数据地图-数据流程：添加关系图谱页面

src/views/dataBook/dataProcess/details.vue

@@ -1,15 +1,56 @@
 <template>
-  <div>
-
+  <div class="content">
+    <div>
+      <v-tabs v-model="tab">
+        <v-tab v-for="item in items" :key="item.path" @click="handleClick(item)">{{ item.title }}</v-tab>
+      </v-tabs>
+    </div>
+    <div style="flex: 1">
+      <v-tabs-items v-model="tab">
+        <v-tab-item
+          v-for="item in items"
+          :key="item.path"
+        >
+          <component :is="item.path" />
+        </v-tab-item>
+      </v-tabs-items>
+    </div>
   </div>
 </template>
 
 <script>
+import { loadDynamicComponents } from '@/utils'
+const vueComponent = require.context('./dynamic', true, /\.vue$/)
+const autoComponent = loadDynamicComponents(vueComponent)
 export default {
-  name: 'dataProcessDetails'
+  name: 'data-process-details',
+  components: {
+    ...autoComponent
+  },
+  data () {
+    return {
+      tab: 0,
+      items: [{ title: '关系图谱', path: 'graph' }]
+    }
+  },
+  created () {
+    const savedTab = new URLSearchParams(window.location.search).get('tab')
+    if (!savedTab) {
+      this.activeIndex = 0
+      return
+    }
+    this.activeIndex = this.list.findIndex(e => e.path === savedTab)
+  },
+  methods: {
+    handleClick (item) {
+      this.$router.push(`${this.$route.path}?tab=${item.path}`)
+    }
+  }
 }
 </script>
 
 <style lang="scss" scoped>
-
+::v-deep .v-window,.v-window-item {
+  height: 100%;
+}
 </style>

src/views/dataBook/dataProcess/dynamic/graph.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class="pa-3" style="height: 100%;">
+    <MCard title="关系图谱" bodyStyle="flex: 1" style="height: 100%;" class="d-flex flex-column">
+      <graph :to-api="api.getGraphAll"></graph>
+    </MCard>
+  </div>
+</template>
+
+<script>
+import MCard from '@/components/MCard'
+import Graph from '../../components/mGraph'
+import { api } from '@/api/dataGovernance'
+export default {
+  name: 'data-process-graph',
+  components: {
+    Graph,
+    MCard
+  },
+  data () {
+    return {
+      api
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/dataBook/dataProcess/index.vue

@@ -11,10 +11,9 @@
       :show-select="false"
       :is-tools="false"
       @pageHandleChange="pageHandleChange"
-      @sort="handleSort"
     >
       <template #name_zh="{ item }">
-        <span>{{ item.name_zh }}</span>
+        <span class="defaultLink" @click="handleDetail(item)">{{ item.name_zh }}</span>
       </template>
       <template #status="{ item }">
         <v-chip small :color="item.status === 'active' ? 'success' : 'error'">
@@ -93,9 +92,8 @@ export default {
       this.pageInfo.current = page
       this.init()
     },
-    handleSort (val) {
-      this.orders = val
-      this.init()
+    handleDetail (item) {
+      this.$router.push(`${this.$route.path}/details/${item.id}/${item.name_zh}`)
     }
   }
 }