4a5de24a by lihua

关系网修改节点大小,并添加定位到标准管理

1 parent 8990ced8
...@@ -210,7 +210,7 @@ const initGraph = () => { ...@@ -210,7 +210,7 @@ const initGraph = () => {
210 const { item, target } = evt; 210 const { item, target } = evt;
211 let model = item._cfg.model; 211 let model = item._cfg.model;
212 if (props.noContextMenu) { 212 if (props.noContextMenu) {
213 return false; 213 // return false;
214 if (model && !model.isField) { 214 if (model && !model.isField) {
215 return true; 215 return true;
216 } 216 }
...@@ -320,15 +320,17 @@ const initGraph = () => { ...@@ -320,15 +320,17 @@ const initGraph = () => {
320 graphRef.value = graph; 320 graphRef.value = graph;
321 graph.node((node) => { 321 graph.node((node) => {
322 return { 322 return {
323 size: node.isField ? 11 : 16,
323 id: node.guid as string, 324 id: node.guid as string,
324 label: handleLabelLength((node.isField ? node.metaStandardId : node.standardName) as string), 325 label: handleLabelLength((node.isField ? node.metaStandardId : node.standardName) as string),
325 collapsed: node.children?.length ? false : true, 326 collapsed: node.children?.length ? false : true,
326 labelCfg: { 327 labelCfg: {
327 offset: 7, 328 offset: node.isField ? 4 : 7,
328 style: { 329 style: {
329 fontSize: 13, 330 fontSize: 13,
330 fill: '#212121', 331 fill: '#212121',
331 fontWeight: 500 332 fontWeight: 500,
333 cursor: 'pointer'
332 }, 334 },
333 position: !node.isField ? 'left' : 'right', //只有字段是最后一层级,不需要展开 335 position: !node.isField ? 'left' : 'right', //只有字段是最后一层级,不需要展开
334 }, 336 },
......
...@@ -277,7 +277,7 @@ const routes: RouteRecordRaw[] = [ ...@@ -277,7 +277,7 @@ const routes: RouteRecordRaw[] = [
277 } 277 }
278 } 278 }
279 }, 279 },
280 { 280 {
281 path: 'table-create-manual', 281 path: 'table-create-manual',
282 name: 'tableCreateManual', 282 name: 'tableCreateManual',
283 component: () => import('@/views/data_meta/tableCreateManual.vue'), 283 component: () => import('@/views/data_meta/tableCreateManual.vue'),
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
8 <graphTopbar ref="topBarRef" @displaySwitchChange="displaySwitchChange" :isGraphDisplay="isGraphDisplay" /> 8 <graphTopbar ref="topBarRef" @displaySwitchChange="displaySwitchChange" :isGraphDisplay="isGraphDisplay" />
9 </div> 9 </div>
10 <RelationNetwork v-show="graphTreeData?.guid && isGraphDisplay" ref="relationNetworkRef" :tree-data="graphTreeData" 10 <RelationNetwork v-show="graphTreeData?.guid && isGraphDisplay" ref="relationNetworkRef" :tree-data="graphTreeData"
11 :noContextMenu="true" @nodeItemClick="handleNodeItemClick"> 11 :noContextMenu="true" @nodeItemClick="handleNodeItemClick" @contextMenu="handleContextMenu">
12 </RelationNetwork> 12 </RelationNetwork>
13 <Sankey v-show="!isGraphDisplay && (sankeyNames?.length || sankeyDataLoading)" v-loading="sankeyDataLoading" 13 <Sankey v-show="!isGraphDisplay && (sankeyNames?.length || sankeyDataLoading)" v-loading="sankeyDataLoading"
14 :tree-data="sankeyData" :names="sankeyNames"> 14 :tree-data="sankeyData" :names="sankeyNames">
...@@ -128,9 +128,9 @@ const handleNodeItemClick = (graph, nodeItem) => { ...@@ -128,9 +128,9 @@ const handleNodeItemClick = (graph, nodeItem) => {
128 graph.layout(); 128 graph.layout();
129 graph.setMinZoom(0.5); 129 graph.setMinZoom(0.5);
130 graph.setMaxZoom(5); 130 graph.setMaxZoom(5);
131 graph.focusItem(nodeItem, true, { 131 graph.focusItem(nodeItem, true, {
132 duration: 400 // 动画时长为500ms 132 duration: 400 // 动画时长为500ms
133 }); 133 });
134 }, 500); 134 }, 500);
135 } else { 135 } else {
136 parentData.isLoading = false; 136 parentData.isLoading = false;
...@@ -139,6 +139,15 @@ const handleNodeItemClick = (graph, nodeItem) => { ...@@ -139,6 +139,15 @@ const handleNodeItemClick = (graph, nodeItem) => {
139 }) 139 })
140 } 140 }
141 141
142 const handleContextMenu = (model) => {
143 router.push({
144 name: 'metadataStandard',
145 query: {
146 standardGuid: model.guid
147 }
148 });
149 }
150
142 onBeforeMount(() => { 151 onBeforeMount(() => {
143 graphDataLoading.value = true 152 graphDataLoading.value = true
144 getMetaStandardTreeList(metaGuid.value).then((res: any) => { 153 getMetaStandardTreeList(metaGuid.value).then((res: any) => {
......
...@@ -24,6 +24,8 @@ import StandardFieldsDialog from './components/standardFieldsDialog.vue' ...@@ -24,6 +24,8 @@ import StandardFieldsDialog from './components/standardFieldsDialog.vue'
24 24
25 const { proxy } = getCurrentInstance() as any; 25 const { proxy } = getCurrentInstance() as any;
26 26
27 const route = useRoute();
28
27 const cacheStore = useCatchStore() 29 const cacheStore = useCatchStore()
28 const showFiledsPage = ref(false) 30 const showFiledsPage = ref(false)
29 31
...@@ -76,8 +78,10 @@ function treeCustomClick (node, type) { ...@@ -76,8 +78,10 @@ function treeCustomClick (node, type) {
76 }).then(() => deleteTreeNode(node.data.guid)) 78 }).then(() => deleteTreeNode(node.data.guid))
77 } 79 }
78 } 80 }
79 function getTree (refresh = false) { 81 function getTree (refresh = false, initLocate = false) {
82 treeInfo.value.loading = true;
80 getMetaStandardTree().then((res:any) => { 83 getMetaStandardTree().then((res:any) => {
84 treeInfo.value.loading = false;
81 if (res.code === proxy.$passCode) { 85 if (res.code === proxy.$passCode) {
82 let data = res.data || [] 86 let data = res.data || []
83 data.forEach(item => { 87 data.forEach(item => {
...@@ -85,8 +89,10 @@ function getTree (refresh = false) { ...@@ -85,8 +89,10 @@ function getTree (refresh = false) {
85 item.level = 1 89 item.level = 1
86 }) 90 })
87 treeInfo.value.data = data 91 treeInfo.value.data = data
88 treeInfo.value.expandedKey = [data[0].guid] 92 if (!initLocate) {
89 treeInfo.value.currentNodeKey = data[0].guid 93 treeInfo.value.expandedKey = [data[0].guid]
94 treeInfo.value.currentNodeKey = data[0].guid
95 }
90 nodeClick(data[0]) 96 nodeClick(data[0])
91 } 97 }
92 }) 98 })
...@@ -443,8 +449,16 @@ function batchDelete () { ...@@ -443,8 +449,16 @@ function batchDelete () {
443 }) 449 })
444 } 450 }
445 451
452 /** 从关系网定位打开此页面,需定位到对应的树节点。 route.query.standardGuid */
453
454 onActivated(() => {
455 if (route.query.standardGuid) {
456 treeInfo.value.currentNodeKey = route.query.standardGuid as string;
457 }
458 })
459
446 onBeforeMount(() => { 460 onBeforeMount(() => {
447 getTree() 461 getTree(false, route.query.standardGuid != null)
448 }) 462 })
449 463
450 const viewGraph = () => { 464 const viewGraph = () => {
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!