From f798d569aebdf79fcf8e759b9a6f14987feae462 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=96=B9=E4=BD=B3=20=E5=8D=9A?= <12742597+fang-jiabo@user.noreply.gitee.com> Date: Wed, 15 Nov 2023 16:29:11 +0800 Subject: [PATCH 1/2] =?UTF-8?q?'=E4=BA=A4''?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/visual/components/merkle.vue | 155 +++++++++++++++---------- 1 file changed, 91 insertions(+), 64 deletions(-) diff --git a/src/views/visual/components/merkle.vue b/src/views/visual/components/merkle.vue index 99d23d5..e3e34f4 100644 --- a/src/views/visual/components/merkle.vue +++ b/src/views/visual/components/merkle.vue @@ -11,7 +11,6 @@
- @@ -38,21 +37,64 @@ const getData=async()=>{ // 在这里操作每个数组 // console.log(`Array for key ${key}:`, array); if(key==='one'){ - cell.value[0].attributes[0]=array - console.log(cell.value[0].attributes[0]); - console.log(array); - } - // 例如,你可以对每个数组进行进一步的操作 - // array.forEach(item => { - // // 对每个数组元素进行操作 - // console.log(item); - // }); - - // 或者你可以修改原始数组 - // data[key] = array.map(item => { - // // 修改每个数组元素 - // return item + '_modified'; - // }); + // cell.value[0].attributes[0]=array.slice(0,13)+'...' + const truncatedString = computed(() => { + return array[0].length > 15 + ? array[0].substring(0, 15) + '...' + : array[0]; + }); + cell.value[0].attributes[0]=truncatedString.value + } + if(key==='two'){ + array.forEach((item,index)=>{ + const truncatedString = computed(() => { + return item.length > 15 + ? item.substring(0, 15) + '...' + : item; + }); + cell.value[index+1].attributes[0]=truncatedString.value + }) + } + if(key==='three'){ + array.forEach((item,index)=>{ + const truncatedString = computed(() => { + return item.length > 15 + ? item.substring(0, 15) + '...' + : item; + }); + cell.value[index+3].attributes[0]=truncatedString.value + }) + } + if(key==='four'){ + array.forEach((item,index)=>{ + const truncatedString = computed(() => { + return item.length > 15 + ? item.substring(0, 15) + '...' + : item; + }); + cell.value[index+7].attributes[0]=truncatedString.value + }) + } + if(key==='five'){ + array.forEach((item,index)=>{ + const truncatedString = computed(() => { + return item.length > 15 + ? item.substring(0, 15) + '...' + : item; + }); + cell.value[index+15].attributes[0]=truncatedString.value + }) + } + if(key==='six'){ + array.forEach((item,index)=>{ + const truncatedString = computed(() => { + return item.length > 15 + ? item.substring(0, 15) + '...' + : item; + }); + cell.value[index+31].attributes[0]=truncatedString.value + }) + } } graph.value.fromJSON(cell.value) graph.value.zoomToFit({ padding: 10, maxScale: 1 }) @@ -61,32 +103,21 @@ const getData=async()=>{ } // 全屏函数 -const height=ref(1084) +const height=ref(790) const toggleFullscreen = () => { toggleFullscreenContainer('.merkleTree') document.addEventListener('fullscreenchange', exitFullscreenHandler); document.addEventListener('webkitfullscreenchange', exitFullscreenHandler); document.addEventListener('mozfullscreenchange', exitFullscreenHandler); document.addEventListener('MSFullscreenChange', exitFullscreenHandler); - const element = document.querySelector('.umlMain'); - element.style.position='relative' - element.style.transform='scale(1)' - element.style.top='0' - element.style.right='0' - // height.value =950 + height.value =1084 } // 处理退出全屏的函数 function exitFullscreenHandler() { if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) { // 退出全屏后执行的代码 - // console.log('已退出全屏'); - const element = document.querySelector('.umlMain'); - element.style.position='absolute' - element.style.transform='scale(0.44)' - element.style.top='' - element.style.right='' - // 在这里可以添加你想要执行的操作 + height.value=790 } } const cell=ref([]) @@ -342,7 +373,7 @@ Graph.registerEdge( "Top hash", ], "attributes": [ - "adasfasd12fa1sd3f13a" + "" ], "methods": [ ], @@ -356,7 +387,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -373,7 +404,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -390,7 +421,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -407,7 +438,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -424,7 +455,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "2" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -441,7 +472,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "3" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -458,7 +489,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -475,7 +506,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -492,7 +523,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "2" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -509,7 +540,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "3" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -526,7 +557,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "4" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -543,7 +574,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "5" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -560,7 +591,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "6" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -577,7 +608,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "7" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -611,7 +642,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "0-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -628,7 +659,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "1-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -645,7 +676,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "1-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -662,7 +693,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "2-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -679,7 +710,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "2-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -696,7 +727,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "3-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -713,7 +744,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "3-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -730,7 +761,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "4-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -747,7 +778,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "4-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -764,7 +795,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "5-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -781,7 +812,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "5-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -798,7 +829,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "6-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -815,7 +846,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "6-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -832,7 +863,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "7-0" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -849,7 +880,7 @@ Graph.registerEdge( "shape": "class", "name": [ "Hash", - "0-0" + "7-1" ], "attributes": [ "hash(adasfasd12fa1sd3f13a)" @@ -1757,10 +1788,6 @@ graph.value.zoomToFit({ padding: 10, maxScale: 1 }) .umlMain{ width: 3840px; height: 1084px; - transform: scale(0.44) translateX(0); - position: absolute; - right: -1085px; - top: -135px; } } #umlContainer { From d53eaa51766a6164e23d08d4469af26af485aa9a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=96=B9=E4=BD=B3=20=E5=8D=9A?= <12742597+fang-jiabo@user.noreply.gitee.com> Date: Wed, 15 Nov 2023 16:50:54 +0800 Subject: [PATCH 2/2] 'tj' --- src/views/visual/components/merkle.vue | 126 ++++++++++++------------- 1 file changed, 63 insertions(+), 63 deletions(-) diff --git a/src/views/visual/components/merkle.vue b/src/views/visual/components/merkle.vue index e3e34f4..2ae432a 100644 --- a/src/views/visual/components/merkle.vue +++ b/src/views/visual/components/merkle.vue @@ -103,7 +103,7 @@ const getData=async()=>{ } // 全屏函数 -const height=ref(790) +const height=ref(770) const toggleFullscreen = () => { toggleFullscreenContainer('.merkleTree') document.addEventListener('fullscreenchange', exitFullscreenHandler); @@ -390,7 +390,7 @@ Graph.registerEdge( "0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -407,7 +407,7 @@ Graph.registerEdge( "1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -424,7 +424,7 @@ Graph.registerEdge( "0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -441,7 +441,7 @@ Graph.registerEdge( "1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -458,7 +458,7 @@ Graph.registerEdge( "2" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -475,7 +475,7 @@ Graph.registerEdge( "3" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -492,7 +492,7 @@ Graph.registerEdge( "0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -509,7 +509,7 @@ Graph.registerEdge( "1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -526,7 +526,7 @@ Graph.registerEdge( "2" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -543,7 +543,7 @@ Graph.registerEdge( "3" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -560,7 +560,7 @@ Graph.registerEdge( "4" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -577,7 +577,7 @@ Graph.registerEdge( "5" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -594,7 +594,7 @@ Graph.registerEdge( "6" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -611,7 +611,7 @@ Graph.registerEdge( "7" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -628,7 +628,7 @@ Graph.registerEdge( "0-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -645,7 +645,7 @@ Graph.registerEdge( "0-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -662,7 +662,7 @@ Graph.registerEdge( "1-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -679,7 +679,7 @@ Graph.registerEdge( "1-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -696,7 +696,7 @@ Graph.registerEdge( "2-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -713,7 +713,7 @@ Graph.registerEdge( "2-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -730,7 +730,7 @@ Graph.registerEdge( "3-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -747,7 +747,7 @@ Graph.registerEdge( "3-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -764,7 +764,7 @@ Graph.registerEdge( "4-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -781,7 +781,7 @@ Graph.registerEdge( "4-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -798,7 +798,7 @@ Graph.registerEdge( "5-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -815,7 +815,7 @@ Graph.registerEdge( "5-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -832,7 +832,7 @@ Graph.registerEdge( "6-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -849,7 +849,7 @@ Graph.registerEdge( "6-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -866,7 +866,7 @@ Graph.registerEdge( "7-0" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -883,7 +883,7 @@ Graph.registerEdge( "7-1" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -899,7 +899,7 @@ Graph.registerEdge( "Hash1", ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -915,7 +915,7 @@ Graph.registerEdge( "Hash2", ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -931,7 +931,7 @@ Graph.registerEdge( "Hash3" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -947,7 +947,7 @@ Graph.registerEdge( "Hash4" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -963,7 +963,7 @@ Graph.registerEdge( "Hash5" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -979,7 +979,7 @@ Graph.registerEdge( "Hash6" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -995,7 +995,7 @@ Graph.registerEdge( "Hash7" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1011,7 +1011,7 @@ Graph.registerEdge( "Hash8" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1027,7 +1027,7 @@ Graph.registerEdge( "Hash9" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1043,7 +1043,7 @@ Graph.registerEdge( "Hash10", ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1059,7 +1059,7 @@ Graph.registerEdge( "Hash11" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1075,7 +1075,7 @@ Graph.registerEdge( "Hash12" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1091,7 +1091,7 @@ Graph.registerEdge( "Hash13", ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1107,7 +1107,7 @@ Graph.registerEdge( "Hash14" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1123,7 +1123,7 @@ Graph.registerEdge( "Hash15" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1139,7 +1139,7 @@ Graph.registerEdge( "Hash16" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1155,7 +1155,7 @@ Graph.registerEdge( "Hash17" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1171,7 +1171,7 @@ Graph.registerEdge( "Hash18" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1187,7 +1187,7 @@ Graph.registerEdge( "Hash19" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1203,7 +1203,7 @@ Graph.registerEdge( "Hash20" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1219,7 +1219,7 @@ Graph.registerEdge( "Hash21" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1235,7 +1235,7 @@ Graph.registerEdge( "Hash22" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1251,7 +1251,7 @@ Graph.registerEdge( "Hash23" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1267,7 +1267,7 @@ Graph.registerEdge( "Hash24" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1283,7 +1283,7 @@ Graph.registerEdge( "Hash25" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1299,7 +1299,7 @@ Graph.registerEdge( "Hash26" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1315,7 +1315,7 @@ Graph.registerEdge( "Hash27", ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1331,7 +1331,7 @@ Graph.registerEdge( "Hash28" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1347,7 +1347,7 @@ Graph.registerEdge( "Hash29" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1363,7 +1363,7 @@ Graph.registerEdge( "Hash30" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1379,7 +1379,7 @@ Graph.registerEdge( "Hash31" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ], @@ -1395,7 +1395,7 @@ Graph.registerEdge( "Hash32" ], "attributes": [ - "hash(adasfasd12fa1sd3f13a)" + "" ], "methods": [ ],