调整关系网字段间距
Showing
1 changed file
with
18 additions
and
11 deletions
| ... | @@ -4,7 +4,7 @@ | ... | @@ -4,7 +4,7 @@ |
| 4 | <div class="title">{{ detailInfoLabel }}</div> | 4 | <div class="title">{{ detailInfoLabel }}</div> |
| 5 | <div class="row" v-for="item in Object.keys(detailInfo)"> | 5 | <div class="row" v-for="item in Object.keys(detailInfo)"> |
| 6 | <span>{{ item + ':' }}</span> | 6 | <span>{{ item + ':' }}</span> |
| 7 | <span>{{ detailInfo[item] == null ? '-' : detailInfo[item] }}</span> | 7 | <span>{{ detailInfo[item] == null || detailInfo[item] == '' ? '-' : detailInfo[item] }}</span> |
| 8 | </div> | 8 | </div> |
| 9 | </div> | 9 | </div> |
| 10 | </div> | 10 | </div> |
| ... | @@ -37,7 +37,7 @@ const emits = defineEmits([ | ... | @@ -37,7 +37,7 @@ const emits = defineEmits([ |
| 37 | 37 | ||
| 38 | const { proxy } = getCurrentInstance() as any; | 38 | const { proxy } = getCurrentInstance() as any; |
| 39 | 39 | ||
| 40 | const maxChineseCount = ref(14); | 40 | const maxChineseCount = ref(16); |
| 41 | 41 | ||
| 42 | const maxEnglishCount = ref(26); | 42 | const maxEnglishCount = ref(26); |
| 43 | 43 | ||
| ... | @@ -122,7 +122,9 @@ const handleLabelLength = (label: string) => { | ... | @@ -122,7 +122,9 @@ const handleLabelLength = (label: string) => { |
| 122 | if (detectLanguage(label) == 'English') { | 122 | if (detectLanguage(label) == 'English') { |
| 123 | return label?.length > maxEnglishCount.value ? label.slice(0, maxEnglishCount.value) + '...' : label; | 123 | return label?.length > maxEnglishCount.value ? label.slice(0, maxEnglishCount.value) + '...' : label; |
| 124 | } | 124 | } |
| 125 | return label?.length > maxChineseCount.value ? label.slice(0, maxChineseCount.value) + '...' : label; | 125 | let arr = label.split('\n'); |
| 126 | let maxLen = Math.max(...arr.map(s => s.length)); | ||
| 127 | return maxLen > maxChineseCount.value ? label.slice(0, maxChineseCount.value) + '...' : label; | ||
| 126 | }; | 128 | }; |
| 127 | 129 | ||
| 128 | insertCss(` | 130 | insertCss(` |
| ... | @@ -167,7 +169,9 @@ const initGraph = () => { | ... | @@ -167,7 +169,9 @@ const initGraph = () => { |
| 167 | if (detectLanguage(name) == 'English') { | 169 | if (detectLanguage(name) == 'English') { |
| 168 | return name?.length > maxEnglishCount.value; | 170 | return name?.length > maxEnglishCount.value; |
| 169 | } | 171 | } |
| 170 | return name?.length > maxChineseCount.value; | 172 | let arr = name.split('\n'); |
| 173 | let maxLen = Math.max(...arr.map(s => s.length)); | ||
| 174 | return maxLen > maxChineseCount.value; | ||
| 171 | } | 175 | } |
| 172 | return false; | 176 | return false; |
| 173 | }, | 177 | }, |
| ... | @@ -178,7 +182,7 @@ const initGraph = () => { | ... | @@ -178,7 +182,7 @@ const initGraph = () => { |
| 178 | const outDiv = document.createElement('div'); | 182 | const outDiv = document.createElement('div'); |
| 179 | outDiv.className = 'node'; | 183 | outDiv.className = 'node'; |
| 180 | outDiv.style.width = 'fit-content'; | 184 | outDiv.style.width = 'fit-content'; |
| 181 | const name = item._cfg.model.label; | 185 | const name = item._cfg.model.isField ? item._cfg.model.metaStandardId : item._cfg.model.standardName; |
| 182 | if (currentAnchor == 'text-shape') { | 186 | if (currentAnchor == 'text-shape') { |
| 183 | outDiv.innerHTML = `<h4>${name}</h4>` | 187 | outDiv.innerHTML = `<h4>${name}</h4>` |
| 184 | } | 188 | } |
| ... | @@ -265,7 +269,7 @@ const initGraph = () => { | ... | @@ -265,7 +269,7 @@ const initGraph = () => { |
| 265 | ], | 269 | ], |
| 266 | }, | 270 | }, |
| 267 | defaultNode: { | 271 | defaultNode: { |
| 268 | size: 20, | 272 | size: 16, |
| 269 | anchorPoints: [ | 273 | anchorPoints: [ |
| 270 | [0, 0.5], | 274 | [0, 0.5], |
| 271 | [1, 0.5], | 275 | [1, 0.5], |
| ... | @@ -291,8 +295,11 @@ const initGraph = () => { | ... | @@ -291,8 +295,11 @@ const initGraph = () => { |
| 291 | getWidth: function getWidth() { | 295 | getWidth: function getWidth() { |
| 292 | return 16; | 296 | return 16; |
| 293 | }, | 297 | }, |
| 294 | getVGap: function getVGap() { | 298 | getVGap: function getVGap(node) { |
| 295 | return 15; | 299 | if (node.isField) { |
| 300 | return 6; | ||
| 301 | } | ||
| 302 | return 20; | ||
| 296 | }, | 303 | }, |
| 297 | getHGap: function getHGap() { | 304 | getHGap: function getHGap() { |
| 298 | return 120; | 305 | return 120; |
| ... | @@ -479,14 +486,14 @@ const bindEvents = () => { | ... | @@ -479,14 +486,14 @@ const bindEvents = () => { |
| 479 | lastSelectNode.value = item; | 486 | lastSelectNode.value = item; |
| 480 | detailInfo.value = {}; | 487 | detailInfo.value = {}; |
| 481 | // detailInfo.value.guid = model.guid; | 488 | // detailInfo.value.guid = model.guid; |
| 482 | detailInfoLabel.value = model.label || {}; | 489 | detailInfoLabel.value = model.metaStandardId || {}; |
| 483 | updateTooltipPosition(evt); | 490 | updateTooltipPosition(evt); |
| 484 | 491 | ||
| 485 | detailLoading.value = true; | 492 | detailLoading.value = true; |
| 486 | getMetaStandardFieldDetail(model.guid).then((res: any) => { | 493 | getMetaStandardFieldDetail(model.guid).then((res: any) => { |
| 487 | if (res?.code == proxy.$passCode) { | 494 | if (res?.code == proxy.$passCode) { |
| 488 | detailInfo.value = res.data?.metaStandardValue || {}; | 495 | detailInfo.value = res.data?.metaStandardValue || {}; |
| 489 | detailInfoLabel.value = model.label; | 496 | detailInfoLabel.value = model.metaStandardId; |
| 490 | detailLoading.value = false; | 497 | detailLoading.value = false; |
| 491 | } else { | 498 | } else { |
| 492 | ElMessage.error(res.msg); | 499 | ElMessage.error(res.msg); |
| ... | @@ -618,7 +625,7 @@ defineExpose({ | ... | @@ -618,7 +625,7 @@ defineExpose({ |
| 618 | font-size: 12px; | 625 | font-size: 12px; |
| 619 | color: #666666; | 626 | color: #666666; |
| 620 | word-break: break-all; | 627 | word-break: break-all; |
| 621 | line-height: 21px; | 628 | line-height: 18px; |
| 622 | } | 629 | } |
| 623 | } | 630 | } |
| 624 | </style> | 631 | </style> |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or sign in to post a comment