1/* 2 * Copyright (C) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import { BaseElement, element } from '../../../../../base-ui/BaseElement'; 17import { LitTable } from '../../../../../base-ui/table/lit-table'; 18import { SelectionParam } from '../../../../bean/BoxSelection'; 19import { LitChartPie } from '../../../../../base-ui/chart/pie/LitChartPie'; 20import '../../../../../base-ui/chart/pie/LitChartPie'; 21import { LitProgressBar } from '../../../../../base-ui/progress-bar/LitProgressBar'; 22import { Utils } from '../../base/Utils'; 23import { procedurePool } from '../../../../database/Procedure'; 24import { LitCheckBox } from '../../../../../base-ui/checkbox/LitCheckBox'; 25import { TabPaneFilter } from '../TabPaneFilter'; 26import { initSort } from '../SheetUtils'; 27import { TabPaneVMCallTree } from './TabPaneIOCallTree'; 28import { TabPaneVirtualMemoryStatisticsAnalysisHtml } from './TabPaneVirtualMemoryStatisticsAnalysis.html'; 29 30@element('tabpane-virtual-memory-statistics-analysis') 31export class TabPaneVirtualMemoryStatisticsAnalysis extends BaseElement { 32 private vmPieChart: LitChartPie | null | undefined; 33 private vmCurrentSelection: SelectionParam | null | undefined; 34 private vmStatisticsAnalysisProcessData: unknown; 35 private vmStatisticsAnalysisPidData!: unknown[]; 36 private vmStatisticsAnalysisThreadData!: unknown[]; 37 private vmStatisticsAnalysisSoData!: unknown[]; 38 private vmStatisticsAnalysisFunctionData!: unknown[]; 39 private vmStatisticsAnalysisTypeData!: unknown[]; 40 private vmStatisticsAnalysisTableProcess: LitTable | null | undefined; 41 private vmStatisticsAnalysisTableType: LitTable | null | undefined; 42 private vmStatisticsAnalysisTableThread: LitTable | null | undefined; 43 private vmStatisticsAnalysisTableSo: LitTable | null | undefined; 44 private vmStatisticsAnalysisTableFunction: LitTable | null | undefined; 45 private sumDur: number = 0; 46 private vmStatisticsAnalysisRange: HTMLLabelElement | null | undefined; 47 private vmBack: HTMLDivElement | null | undefined; 48 private tabName: HTMLDivElement | null | undefined; 49 private vmStatisticsAnalysisProgressEL: LitProgressBar | null | undefined; 50 private vmProcessName: string = ''; 51 private vmtypeName: string = ''; 52 private vmThreadName: string = ''; 53 private vmSortColumn: string = ''; 54 private vmSortType: number = 0; 55 private currentLevel = -1; 56 private currentLevelData!: Array<unknown>; 57 private processStatisticsData!: {}; 58 private typeStatisticsData!: {}; 59 private threadStatisticsData!: {}; 60 private libStatisticsData!: {}; 61 private functionStatisticsData!: {}; 62 private virtualMemoryTitleEl: HTMLDivElement | undefined | null; 63 private virtualMemoryFilterEl: TabPaneFilter | undefined | null; 64 private hideProcessCheckBox: LitCheckBox | undefined | null; 65 private hideThreadCheckBox: LitCheckBox | undefined | null; 66 private checkBoxs: NodeListOf<LitCheckBox> | undefined | null; 67 private vmTableArray: NodeListOf<LitTable> | undefined | null; 68 69 set data(vmStatisticsAnalysisSelection: SelectionParam) { 70 if (vmStatisticsAnalysisSelection === this.vmCurrentSelection) { 71 this.vmStatisticsAnalysisPidData.unshift(this.processStatisticsData); 72 this.vmStatisticsAnalysisTableProcess!.recycleDataSource = this.vmStatisticsAnalysisPidData; 73 // @ts-ignore 74 this.vmStatisticsAnalysisPidData.shift(this.processStatisticsData); 75 return; 76 } 77 if (this.vmTableArray && this.vmTableArray.length > 0) { 78 for (let vmTable of this.vmTableArray) { 79 initSort(vmTable!, this.vmSortColumn, this.vmSortType); 80 } 81 } 82 this.reset(this.vmStatisticsAnalysisTableProcess!, false); 83 this.hideProcessCheckBox!.checked = false; 84 this.hideThreadCheckBox!.checked = false; 85 this.vmCurrentSelection = vmStatisticsAnalysisSelection; 86 this.virtualMemoryTitleEl!.textContent = ''; 87 this.tabName!.textContent = ''; 88 this.vmStatisticsAnalysisRange!.textContent = `Selected range: ${parseFloat( 89 ((vmStatisticsAnalysisSelection.rightNs - vmStatisticsAnalysisSelection.leftNs) / 1000000.0).toFixed(5) 90 )} ms`; 91 this.vmStatisticsAnalysisProgressEL!.loading = true; 92 this.getVmDataByWorker( 93 [ 94 { 95 funcName: 'setSearchValue', 96 funcArgs: [''], 97 }, 98 { 99 funcName: 'getCurrentDataFromDb', 100 funcArgs: [{ queryFuncName: 'virtualMemory', ...vmStatisticsAnalysisSelection }], 101 }, 102 ], 103 (results: unknown[]): void => { 104 this.disableCheckBox(results); 105 this.getVirtualMemoryProcess(results); 106 } 107 ); 108 } 109 110 initElements(): void { 111 this.vmStatisticsAnalysisRange = this.shadowRoot?.querySelector('#time-range'); 112 this.vmPieChart = this.shadowRoot!.querySelector<LitChartPie>('#vm-chart-pie'); 113 this.vmStatisticsAnalysisTableProcess = this.shadowRoot!.querySelector<LitTable>('#tb-process-usage'); 114 this.vmStatisticsAnalysisTableType = this.shadowRoot!.querySelector<LitTable>('#tb-type-usage'); 115 this.vmStatisticsAnalysisTableThread = this.shadowRoot!.querySelector<LitTable>('#tb-thread-usage'); 116 this.vmStatisticsAnalysisTableSo = this.shadowRoot!.querySelector<LitTable>('#tb-so-usage'); 117 this.vmStatisticsAnalysisTableFunction = this.shadowRoot!.querySelector<LitTable>('#tb-function-usage'); 118 this.vmBack = this.shadowRoot!.querySelector<HTMLDivElement>('.vm-go-back'); 119 this.tabName = this.shadowRoot!.querySelector<HTMLDivElement>('.vm-subheading'); 120 this.vmStatisticsAnalysisProgressEL = this.shadowRoot?.querySelector('.vm-progress') as LitProgressBar; 121 this.goBack(); 122 this.virtualMemoryTitleEl = this.shadowRoot!.querySelector<HTMLDivElement>('.title'); 123 this.virtualMemoryFilterEl = this.shadowRoot?.querySelector('#filter'); 124 this.virtualMemoryFilterEl!.setOptionsList(['Hide Process', 'Hide Thread']); 125 let popover = this.virtualMemoryFilterEl!.shadowRoot!.querySelector('#check-popover'); 126 this.hideProcessCheckBox = popover!!.querySelector<LitCheckBox>('div > #hideProcess'); 127 this.hideThreadCheckBox = popover!!.querySelector<LitCheckBox>('div > #hideThread'); 128 this.checkBoxs = popover!.querySelectorAll<LitCheckBox>('.check-wrap > lit-check-box'); 129 this.vmTableArray = this.shadowRoot!.querySelectorAll('lit-table') as NodeListOf<LitTable>; 130 for (let vmTable of this.vmTableArray) { 131 this.columnClickEvent(vmTable); 132 vmTable!.addEventListener('contextmenu', function (event: MouseEvent): void { 133 event.preventDefault(); // 阻止默认的上下文菜单弹框 134 }); 135 this.rowHoverEvent(vmTable); 136 this.rowClickEvent(vmTable); 137 } 138 for (let box of this.checkBoxs) { 139 this.checkBoxEvent(box); 140 } 141 const addRowClickEventListener = (vmTable: LitTable, clickEvent: Function): void => { 142 vmTable.addEventListener('row-click', (evt: Event): void => { 143 // @ts-ignore 144 const detail = evt.detail; 145 if (detail.button === 0 && detail.data.tableName !== '' && detail.data.duration !== 0) { 146 clickEvent(detail.data, this.vmCurrentSelection); 147 } 148 }); 149 }; 150 151 addRowClickEventListener(this.vmStatisticsAnalysisTableProcess!, this.vmProcessLevelClickEvent.bind(this)); 152 addRowClickEventListener(this.vmStatisticsAnalysisTableType!, this.vmTypeLevelClickEvent.bind(this)); 153 addRowClickEventListener(this.vmStatisticsAnalysisTableThread!, this.vmThreadLevelClickEvent.bind(this)); 154 addRowClickEventListener(this.vmStatisticsAnalysisTableSo!, this.vmSoLevelClickEvent.bind(this)); 155 } 156 private disableCheckBox(results: Array<unknown>): void { 157 if (results.length === 0) { 158 this.hideProcessCheckBox?.setAttribute('disabled', 'disabled'); 159 this.hideThreadCheckBox?.setAttribute('disabled', 'disabled'); 160 } else { 161 this.hideProcessCheckBox?.removeAttribute('disabled'); 162 this.hideThreadCheckBox?.removeAttribute('disabled'); 163 } 164 } 165 166 private columnClickEvent(vmTable: LitTable): void { 167 vmTable!.addEventListener('column-click', (evt: Event): void => { 168 // @ts-ignore 169 this.vmSortColumn = evt.detail.key; 170 // @ts-ignore 171 this.vmSortType = evt.detail.sort; 172 this.sortByColumn(); 173 }); 174 } 175 176 private checkBoxEvent(box: LitCheckBox): void { 177 box!.addEventListener('change', (): void => { 178 if (this.hideProcessCheckBox!.checked && this.hideThreadCheckBox!.checked) { 179 this.hideThread(); 180 this.vmBack!.style.visibility = 'hidden'; 181 } else if (this.hideProcessCheckBox!.checked && !this.hideThreadCheckBox!.checked) { 182 this.hideProcess(); 183 } else { 184 this.reset(this.vmStatisticsAnalysisTableProcess!, false); // @ts-ignore 185 this.getVirtualMemoryProcess(this.vmStatisticsAnalysisProcessData); 186 } 187 }); 188 } 189 190 private rowClickEvent(vmTable: LitTable): void { 191 vmTable!.addEventListener('row-click', (evt: Event): void => { 192 // @ts-ignore 193 let detail = evt.detail; 194 if (detail.button === 2) { 195 let vmTab = this.parentElement?.parentElement?.querySelector<TabPaneVMCallTree>( 196 '#box-vm-calltree > tabpane-vm-calltree' 197 ); 198 vmTab!.cWidth = this.clientWidth; 199 vmTab!.currentCallTreeLevel = this.currentLevel; 200 if (this.hideProcessCheckBox?.checked) { 201 detail.data.pid = undefined; 202 } 203 if (this.hideThreadCheckBox?.checked) { 204 detail.data.tid = undefined; 205 } 206 vmTab!.rowClickData = detail.data; 207 let title = ''; 208 if (this.virtualMemoryTitleEl?.textContent === '') { 209 title = detail.data.tableName; 210 } else { 211 title = `${this.virtualMemoryTitleEl?.textContent} / ${detail.data.tableName}`; 212 } 213 vmTab!.pieTitle = title; 214 // 是否是在表格上右键点击跳转到火焰图的 215 this.vmCurrentSelection!.isRowClick = true; 216 vmTab!.data = this.vmCurrentSelection; 217 } 218 }); 219 } 220 221 private rowHoverEvent(vmTable: LitTable): void { 222 vmTable!.addEventListener('row-hover', (evt: Event): void => { 223 // @ts-ignore 224 let detail = evt.detail; 225 if (detail.data) { 226 let tableData = detail.data; 227 tableData.isHover = true; 228 if (detail.callBack) { 229 detail.callBack(true); 230 } 231 } 232 this.vmPieChart?.showHover(); 233 this.vmPieChart?.hideTip(); 234 }); 235 } 236 237 private reset(showTable: LitTable, isShowBack: boolean): void { 238 this.clearData(); 239 if (isShowBack) { 240 this.vmBack!.style.visibility = 'visible'; 241 } else { 242 this.vmBack!.style.visibility = 'hidden'; 243 this.virtualMemoryTitleEl!.textContent = ''; 244 } 245 if (this.vmTableArray) { 246 for (let virtualMemoryTable of this.vmTableArray) { 247 if (virtualMemoryTable === showTable) { 248 initSort(virtualMemoryTable!, this.vmSortColumn, this.vmSortType); 249 virtualMemoryTable.style.display = 'grid'; 250 virtualMemoryTable!.removeAttribute('hideDownload'); 251 } else { 252 virtualMemoryTable!.style.display = 'none'; 253 virtualMemoryTable.setAttribute('hideDownload', ''); 254 } 255 } 256 } 257 } 258 259 private clearData(): void { 260 this.vmPieChart!.dataSource = []; 261 this.vmStatisticsAnalysisTableProcess!.recycleDataSource = []; 262 this.vmStatisticsAnalysisTableType!.recycleDataSource = []; 263 this.vmStatisticsAnalysisTableThread!.recycleDataSource = []; 264 this.vmStatisticsAnalysisTableSo!.recycleDataSource = []; 265 this.vmStatisticsAnalysisTableFunction!.recycleDataSource = []; 266 } 267 268 private showAssignLevel(showVmTable: LitTable, hideVmTable: LitTable, currentLevel: number): void { 269 showVmTable!.style.display = 'grid'; 270 hideVmTable!.style.display = 'none'; 271 hideVmTable.setAttribute('hideDownload', ''); 272 showVmTable?.removeAttribute('hideDownload'); 273 this.currentLevel = currentLevel; 274 } 275 276 private goBack(): void { 277 this.vmBack!.addEventListener('click', () => { 278 if (this.tabName!.textContent === 'Statistic By type AllDuration') { 279 this.vmBack!.style.visibility = 'hidden'; 280 this.showAssignLevel(this.vmStatisticsAnalysisTableProcess!, this.vmStatisticsAnalysisTableType!, 0); 281 this.processPieChart(); 282 } else if (this.tabName!.textContent === 'Statistic By Thread AllDuration') { 283 if (this.hideProcessCheckBox?.checked) { 284 this.vmBack!.style.visibility = 'hidden'; 285 } else { 286 this.vmBack!.style.visibility = 'visible'; 287 } 288 this.showAssignLevel(this.vmStatisticsAnalysisTableType!, this.vmStatisticsAnalysisTableThread!, 1); 289 this.typePieChart(); 290 } else if (this.tabName!.textContent === 'Statistic By Library AllDuration') { 291 if (this.hideThreadCheckBox?.checked) { 292 if (this.hideProcessCheckBox?.checked) { 293 this.vmBack!.style.visibility = 'hidden'; 294 } 295 this.showAssignLevel(this.vmStatisticsAnalysisTableType!, this.vmStatisticsAnalysisTableSo!, 1); 296 this.typePieChart(); 297 } else { 298 this.showAssignLevel(this.vmStatisticsAnalysisTableThread!, this.vmStatisticsAnalysisTableSo!, 2); 299 this.threadPieChart(); 300 } 301 } else if (this.tabName!.textContent === 'Statistic By Function AllDuration') { 302 this.showAssignLevel(this.vmStatisticsAnalysisTableSo!, this.vmStatisticsAnalysisTableFunction!, 3); 303 this.libraryPieChart(); 304 } 305 }); 306 } 307 308 private hideProcess(): void { 309 this.reset(this.vmStatisticsAnalysisTableType!, false); 310 this.vmProcessName = ''; 311 this.getVirtualMemoryType(null); 312 } 313 314 private hideThread(it?: unknown): void { 315 this.reset(this.vmStatisticsAnalysisTableType!, true); 316 this.vmProcessName = ''; 317 this.vmThreadName = ''; 318 if (it) { 319 this.getVirtualMemoryType(it); 320 } else { 321 this.getVirtualMemoryType(null); 322 } 323 } 324 325 private processPieChart(): void { 326 // @ts-ignore 327 this.sumDur = this.processStatisticsData.allDuration; 328 this.vmPieChart!.config = { 329 appendPadding: 0, 330 data: this.getVmPieChartData(this.vmStatisticsAnalysisPidData), 331 angleField: 'duration', 332 colorField: 'tableName', 333 radius: 1, 334 label: { 335 type: 'outer', 336 }, // @ts-ignore 337 tip: this.getVmTip(), 338 angleClick: (it: Object): void => { 339 // @ts-ignore 340 if (it.tableName !== 'other') { 341 this.vmProcessLevelClickEvent(it); 342 } 343 }, 344 hoverHandler: (data): void => { 345 if (data) { 346 this.vmStatisticsAnalysisTableProcess!.setCurrentHover(data); 347 } else { 348 this.vmStatisticsAnalysisTableProcess!.mouseOut(); 349 } 350 }, 351 interactions: [ 352 { 353 type: 'element-active', 354 }, 355 ], 356 }; 357 this.virtualMemoryTitleEl!.textContent = ''; 358 this.tabName!.textContent = 'Statistic By Process AllDuration'; 359 this.vmStatisticsAnalysisPidData.unshift(this.processStatisticsData); 360 this.vmStatisticsAnalysisTableProcess!.recycleDataSource = this.vmStatisticsAnalysisPidData; 361 // @ts-ignore 362 this.vmStatisticsAnalysisPidData.shift(this.processStatisticsData); 363 this.currentLevelData = this.vmStatisticsAnalysisPidData; 364 this.vmStatisticsAnalysisTableProcess?.reMeauseHeight(); 365 } 366 367 private getVmTip() { 368 return (obj: { obj: { tableName: unknown; durFormat: unknown; percent: unknown } }): string => { 369 return `<div> 370 <div>ProcessName:${obj.obj.tableName}</div> 371 <div>Duration:${obj.obj.durFormat}</div> 372 <div>Percent:${obj.obj.percent}%</div> 373 </div> 374 `; 375 }; 376 } 377 378 private vmProcessLevelClickEvent(it: unknown): void { 379 this.reset(this.vmStatisticsAnalysisTableType!, true); 380 this.getVirtualMemoryType(it); // @ts-ignore 381 this.vmProcessName = it.tableName; 382 this.virtualMemoryTitleEl!.textContent = this.vmProcessName; 383 this.vmPieChart?.hideTip(); 384 } 385 386 private typePieChart(): void { 387 this.vmPieChart!.config = { 388 appendPadding: 0, 389 data: this.vmStatisticsAnalysisTypeData, 390 angleField: 'duration', 391 colorField: 'tableName', 392 radius: 1, 393 label: { 394 type: 'outer', 395 }, // @ts-ignore 396 tip: this.getVmTip(), 397 angleClick: (it): void => { 398 this.vmTypeLevelClickEvent(it); 399 }, 400 hoverHandler: (data): void => { 401 if (data) { 402 this.vmStatisticsAnalysisTableType!.setCurrentHover(data); 403 } else { 404 this.vmStatisticsAnalysisTableType!.mouseOut(); 405 } 406 }, 407 interactions: [ 408 { 409 type: 'element-active', 410 }, 411 ], 412 }; 413 this.virtualMemoryTitleEl!.textContent = this.vmProcessName; 414 this.tabName!.textContent = 'Statistic By type AllDuration'; 415 this.vmStatisticsAnalysisTypeData.unshift(this.typeStatisticsData); 416 this.vmStatisticsAnalysisTableType!.recycleDataSource = this.vmStatisticsAnalysisTypeData; 417 // @ts-ignore 418 this.vmStatisticsAnalysisTypeData.shift(this.typeStatisticsData); 419 this.currentLevelData = this.vmStatisticsAnalysisTypeData; 420 this.vmStatisticsAnalysisTableType?.reMeauseHeight(); 421 } 422 423 private vmTypeLevelClickEvent(it: unknown): void { 424 if (this.hideThreadCheckBox!.checked) { 425 this.reset(this.vmStatisticsAnalysisTableSo!, true); 426 this.getVirtualMemorySo(it); 427 } else { 428 this.reset(this.vmStatisticsAnalysisTableThread!, true); 429 this.getVirtualMemoryThread(it); 430 } // @ts-ignore 431 this.vmtypeName = it.tableName; 432 this.vmPieChart?.hideTip(); 433 let title = ''; 434 if (this.vmProcessName.length > 0) { 435 title += `${this.vmProcessName} / `; 436 } 437 if (this.vmtypeName.length > 0) { 438 title += this.vmtypeName; 439 } 440 this.virtualMemoryTitleEl!.textContent = title; 441 } 442 443 private threadPieChart(): void { 444 // @ts-ignore 445 this.sumDur = this.threadStatisticsData.allDuration; 446 this.vmPieChart!.config = { 447 appendPadding: 0, 448 data: this.getVmPieChartData(this.vmStatisticsAnalysisThreadData), 449 angleField: 'duration', 450 colorField: 'tableName', 451 radius: 1, 452 label: { 453 type: 'outer', 454 }, // @ts-ignore 455 tip: this.getVmTip(), 456 angleClick: (it: Object): void => { 457 // @ts-ignore 458 if (it.tableName !== 'other') { 459 this.vmThreadLevelClickEvent(it); 460 } 461 }, 462 hoverHandler: (data): void => { 463 if (data) { 464 this.vmStatisticsAnalysisTableThread!.setCurrentHover(data); 465 } else { 466 this.vmStatisticsAnalysisTableThread!.mouseOut(); 467 } 468 }, 469 interactions: [ 470 { 471 type: 'element-active', 472 }, 473 ], 474 }; 475 let title = ''; 476 if (this.vmProcessName.length > 0) { 477 title += `${this.vmProcessName} / `; 478 } 479 if (this.vmtypeName.length > 0) { 480 title += this.vmtypeName; 481 } 482 this.virtualMemoryTitleEl!.textContent = title; 483 this.tabName!.textContent = 'Statistic By Thread AllDuration'; 484 this.vmStatisticsAnalysisThreadData.unshift(this.threadStatisticsData); 485 this.vmStatisticsAnalysisTableThread!.recycleDataSource = this.vmStatisticsAnalysisThreadData; 486 // @ts-ignore 487 this.vmStatisticsAnalysisThreadData.shift(this.threadStatisticsData); 488 this.currentLevelData = this.vmStatisticsAnalysisThreadData; 489 this.vmStatisticsAnalysisTableThread?.reMeauseHeight(); 490 } 491 492 private vmThreadLevelClickEvent(it: unknown): void { 493 this.reset(this.vmStatisticsAnalysisTableSo!, true); 494 this.getVirtualMemorySo(it); // @ts-ignore 495 this.vmThreadName = it.tableName; 496 this.vmPieChart?.hideTip(); 497 let virtualMemoryTitleTitle = ''; 498 if (this.vmProcessName.length > 0) { 499 virtualMemoryTitleTitle += `${this.vmProcessName} / `; 500 } 501 if (this.vmtypeName.length > 0) { 502 virtualMemoryTitleTitle += `${this.vmtypeName} / `; 503 } 504 if (this.vmThreadName.length > 0) { 505 virtualMemoryTitleTitle += this.vmThreadName; 506 } 507 this.virtualMemoryTitleEl!.textContent = virtualMemoryTitleTitle; 508 } 509 510 private libraryPieChart(): void { 511 // @ts-ignore 512 this.sumDur = this.libStatisticsData.allDuration; 513 this.setVmPieConfig(); 514 let title = ''; 515 if (this.vmProcessName.length > 0) { 516 title += `${this.vmProcessName} / `; 517 } 518 if (this.vmtypeName.length > 0) { 519 if (this.hideThreadCheckBox?.checked) { 520 title += this.vmtypeName; 521 } else { 522 title += `${this.vmtypeName} / `; 523 } 524 } 525 if (this.vmThreadName.length > 0) { 526 title += this.vmThreadName; 527 } 528 this.virtualMemoryTitleEl!.textContent = title; 529 this.tabName!.textContent = 'Statistic By Library AllDuration'; 530 this.vmStatisticsAnalysisSoData.unshift(this.libStatisticsData); 531 this.vmStatisticsAnalysisTableSo!.recycleDataSource = this.vmStatisticsAnalysisSoData; 532 // @ts-ignore 533 this.vmStatisticsAnalysisSoData.shift(this.libStatisticsData); 534 this.currentLevelData = this.vmStatisticsAnalysisSoData; 535 this.vmStatisticsAnalysisTableSo?.reMeauseHeight(); 536 } 537 538 private setVmPieChartConfig(): void { 539 this.vmPieChart!.config = { 540 appendPadding: 0, 541 data: this.getVmPieChartData(this.vmStatisticsAnalysisFunctionData), 542 angleField: 'duration', 543 colorField: 'tableName', 544 radius: 1, 545 label: { 546 type: 'outer', 547 }, 548 tip: (vmLibraryObj): string => { 549 return `<div> 550 <div>Library:${ 551 // @ts-ignore 552 vmLibraryObj.obj.tableName 553 }</div> 554 <div>Duration:${ 555 // @ts-ignore 556 vmLibraryObj.obj.durFormat 557 }</div> 558 <div>percent:${ 559 // @ts-ignore 560 vmLibraryObj.obj.percent 561 }%</div> 562 </div> 563 `; 564 }, 565 hoverHandler: (data): void => { 566 if (data) { 567 this.vmStatisticsAnalysisTableSo!.setCurrentHover(data); 568 } else { 569 this.vmStatisticsAnalysisTableSo!.mouseOut(); 570 } 571 }, 572 interactions: [ 573 { 574 type: 'element-active', 575 }, 576 ], 577 }; 578 } 579 580 private vmSoLevelClickEvent(it: unknown): void { 581 this.reset(this.vmStatisticsAnalysisTableFunction!, true); 582 this.getVirtualMemoryFunction(it); 583 this.vmPieChart?.hideTip(); 584 let title = ''; 585 if (this.vmProcessName.length > 0) { 586 title += `${this.vmProcessName} / `; 587 } 588 if (this.vmtypeName.length > 0) { 589 title += `${this.vmtypeName} / `; 590 } 591 if (this.vmThreadName.length > 0 && !this.hideThreadCheckBox!.checked) { 592 title += `${this.vmThreadName} / `; 593 } // @ts-ignore 594 if (it.tableName.length > 0) { 595 // @ts-ignore 596 title += it.tableName; 597 } 598 this.virtualMemoryTitleEl!.textContent = title; 599 } 600 601 private sortByColumn(): void { 602 let vmsCurrentTable: LitTable | null | undefined; 603 switch (this.currentLevel) { 604 case 0: 605 vmsCurrentTable = this.vmStatisticsAnalysisTableProcess; 606 break; 607 case 1: 608 vmsCurrentTable = this.vmStatisticsAnalysisTableType; 609 break; 610 case 2: 611 vmsCurrentTable = this.vmStatisticsAnalysisTableThread; 612 break; 613 case 3: 614 vmsCurrentTable = this.vmStatisticsAnalysisTableSo; 615 break; 616 case 4: 617 vmsCurrentTable = this.vmStatisticsAnalysisTableFunction; 618 break; 619 } 620 if (!vmsCurrentTable) { 621 return; 622 } 623 this.sortByType(vmsCurrentTable); 624 } 625 626 private sortByType(vmsCurrentTable: LitTable): void { 627 if (this.vmSortType === 0) { 628 let vmsArr = [...this.currentLevelData]; 629 switch (this.currentLevel) { 630 case 0: 631 vmsArr.unshift(this.processStatisticsData); 632 break; 633 case 1: 634 vmsArr.unshift(this.typeStatisticsData); 635 break; 636 case 2: 637 vmsArr.unshift(this.threadStatisticsData); 638 break; 639 case 3: 640 vmsArr.unshift(this.libStatisticsData); 641 break; 642 case 4: 643 vmsArr.unshift(this.functionStatisticsData); 644 break; 645 } 646 vmsCurrentTable!.recycleDataSource = vmsArr; 647 } else { 648 let vmsArray = [...this.currentLevelData]; 649 if (this.vmSortColumn === 'tableName') { 650 this.sortTableNameCase(vmsCurrentTable, vmsArray); 651 } else if (this.vmSortColumn === 'durFormat' || this.vmSortColumn === 'percent') { 652 vmsCurrentTable!.recycleDataSource = vmsArray.sort((a, b) => { 653 // @ts-ignore 654 return this.vmSortType === 1 ? a.duration - b.duration : b.duration - a.duration; 655 }); 656 } 657 switch (this.currentLevel) { 658 case 0: 659 vmsArray.unshift(this.processStatisticsData); 660 break; 661 case 1: 662 vmsArray.unshift(this.typeStatisticsData); 663 break; 664 case 2: 665 vmsArray.unshift(this.threadStatisticsData); 666 break; 667 case 3: 668 vmsArray.unshift(this.libStatisticsData); 669 break; 670 case 4: 671 vmsArray.unshift(this.functionStatisticsData); 672 break; 673 } 674 vmsCurrentTable!.recycleDataSource = vmsArray; 675 } 676 } 677 678 private sortTableNameCase(vmsCurrentTable: LitTable, vmsArray: unknown[]): void { 679 vmsCurrentTable!.recycleDataSource = vmsArray.sort((firstVMElement, secondVMElement): number => { 680 if (this.vmSortType === 1) { 681 // @ts-ignore 682 if (firstVMElement.tableName > secondVMElement.tableName) { 683 return 1; // @ts-ignore 684 } else if (firstVMElement.tableName === secondVMElement.tableName) { 685 return 0; 686 } else { 687 return -1; 688 } 689 } else { 690 // @ts-ignore 691 if (secondVMElement.tableName > firstVMElement.tableName) { 692 return 1; // @ts-ignore 693 } else if (firstVMElement.tableName === secondVMElement.tableName) { 694 return 0; 695 } else { 696 return -1; 697 } 698 } 699 }); 700 } 701 702 private getVirtualMemoryProcess(result: Array<unknown>): void { 703 this.vmStatisticsAnalysisProgressEL!.loading = true; 704 this.vmStatisticsAnalysisProcessData = JSON.parse(JSON.stringify(result)); // @ts-ignore 705 if (!this.vmStatisticsAnalysisProcessData || this.vmStatisticsAnalysisProcessData.length === 0) { 706 this.vmStatisticsAnalysisPidData = []; 707 this.processStatisticsData = []; 708 this.processPieChart(); 709 return; 710 } 711 let allDur = 0; 712 let vmMap = new Map<string, Array<number | string>>(); 713 for (let itemData of result) { 714 // @ts-ignore 715 allDur += itemData.dur; // @ts-ignore 716 if (vmMap.has(itemData.pid)) { 717 // @ts-ignore 718 vmMap.get(itemData.pid)?.push(itemData); 719 } else { 720 let itemArray = []; 721 itemArray.push(itemData); // @ts-ignore 722 vmMap.set(itemData.pid, itemArray); 723 } 724 } 725 this.vmStatisticsAnalysisPidData = []; 726 vmMap.forEach((value: Array<unknown>, key: string): void => { 727 let vmPidDataDur = 0; 728 let pName = ''; 729 for (let item of value) { 730 // @ts-ignore 731 if (item.processName && item.processName.length > 0) { 732 // @ts-ignore 733 if (!item.processName.endsWith(`(${item.pid})`)) { 734 // @ts-ignore 735 item.processName = `${item.processName}(${item.pid})`; 736 } 737 } else { 738 // @ts-ignore 739 item.processName = `Process(${item.pid})`; 740 } // @ts-ignore 741 pName = item.processName; // @ts-ignore 742 vmPidDataDur += item.dur; 743 } 744 this.vmStatisticsAnalysisPidData.push({ 745 tableName: pName, 746 pid: key, 747 percent: ((vmPidDataDur / allDur) * 100).toFixed(2), 748 durFormat: Utils.getProbablyTime(vmPidDataDur), 749 duration: vmPidDataDur, 750 }); 751 }); // @ts-ignore 752 this.vmStatisticsAnalysisPidData.sort((a, b) => b.duration - a.duration); 753 this.processStatisticsData = this.totalDurationData(allDur); 754 this.currentLevel = 0; 755 this.vmStatisticsAnalysisProgressEL!.loading = false; 756 this.processPieChart(); 757 } 758 759 private getVirtualMemoryType(item: unknown): void { 760 this.vmStatisticsAnalysisProgressEL!.loading = true; 761 let vmTypeMap = new Map<number, Array<number | string>>(); 762 let allDur = 0; // @ts-ignore 763 if (!this.vmStatisticsAnalysisProcessData || this.vmStatisticsAnalysisProcessData.length === 0) { 764 return; 765 } // @ts-ignore 766 for (let vmsItem of this.vmStatisticsAnalysisProcessData) { 767 // @ts-ignore 768 if (item && vmsItem.pid !== item.pid && !this.hideProcessCheckBox?.checked) { 769 continue; 770 } 771 allDur += vmsItem.dur; 772 if (vmTypeMap.has(vmsItem.type)) { 773 vmTypeMap.get(vmsItem.type)?.push(vmsItem); 774 } else { 775 let itemArray = []; 776 itemArray.push(vmsItem); 777 vmTypeMap.set(vmsItem.type, itemArray); 778 } 779 } 780 this.vmStatisticsAnalysisTypeData = []; 781 vmTypeMap.forEach((value: Array<unknown>, key: number): void => { 782 let dur = 0; 783 for (let vmItem of value) { 784 // @ts-ignore 785 dur += vmItem.dur; 786 } 787 const vmTypeData = { 788 tableName: this.typeIdToString(key), // @ts-ignore 789 pid: item === null ? value[0].pid : item.pid, 790 type: key, 791 percent: ((dur / allDur) * 100).toFixed(2), 792 durFormat: Utils.getProbablyTime(dur), 793 duration: dur, 794 }; 795 this.vmStatisticsAnalysisTypeData.push(vmTypeData); 796 }); // @ts-ignore 797 this.vmStatisticsAnalysisTypeData.sort((a, b) => b.duration - a.duration); 798 this.typeStatisticsData = this.totalDurationData(allDur); 799 this.currentLevel = 1; 800 this.typePieChart(); 801 this.vmStatisticsAnalysisProgressEL!.loading = false; 802 } 803 804 private getVirtualMemoryThread(item: unknown): void { 805 this.vmStatisticsAnalysisProgressEL!.loading = true; 806 let threadMap = new Map<string, Array<number | string>>(); // @ts-ignore 807 let pid = item.pid; // @ts-ignore 808 let type = item.type; 809 let allDur = 0; // @ts-ignore 810 if (!this.vmStatisticsAnalysisProcessData || this.vmStatisticsAnalysisProcessData.length === 0) { 811 return; 812 } // @ts-ignore 813 for (let vmapItem of this.vmStatisticsAnalysisProcessData) { 814 if ( 815 (!this.hideProcessCheckBox?.checked && vmapItem.pid !== pid) || 816 vmapItem.type !== type || 817 (vmapItem.type !== type && this.hideProcessCheckBox?.checked) 818 ) { 819 continue; 820 } 821 allDur += vmapItem.dur; 822 if (threadMap.has(vmapItem.tid)) { 823 threadMap.get(vmapItem.tid)?.push(vmapItem); 824 } else { 825 let itemArray = []; 826 itemArray.push(vmapItem); 827 threadMap.set(vmapItem.tid, itemArray); 828 } 829 } 830 this.updateVmThreadData(threadMap, item, allDur); 831 this.threadStatisticsData = this.totalDurationData(allDur); 832 this.currentLevel = 2; 833 this.vmStatisticsAnalysisProgressEL!.loading = false; 834 this.threadPieChart(); 835 } 836 837 private updateVmThreadData(threadMap: Map<string, Array<number | string>>, item: unknown, allDur: number): void { 838 this.vmStatisticsAnalysisThreadData = []; 839 threadMap.forEach((value: Array<unknown>, key: string): void => { 840 let vmThreadDur = 0; 841 let tName = ''; 842 for (let item of value) { 843 // @ts-ignore 844 vmThreadDur += item.dur; // @ts-ignore 845 tName = item.threadName = // @ts-ignore 846 item.threadName === null || item.threadName === undefined // @ts-ignore 847 ? `Thread(${item.tid})` // @ts-ignore 848 : `${item.threadName}(${item.tid})`; 849 } 850 const threadData = { 851 tableName: tName, // @ts-ignore 852 pid: item.pid, // @ts-ignore 853 type: item.type, 854 tid: key, 855 percent: ((vmThreadDur / allDur) * 100).toFixed(2), 856 durFormat: Utils.getProbablyTime(vmThreadDur), 857 duration: vmThreadDur, 858 }; 859 this.vmStatisticsAnalysisThreadData.push(threadData); 860 }); // @ts-ignore 861 this.vmStatisticsAnalysisThreadData.sort((a, b) => b.duration - a.duration); 862 } 863 864 private getVirtualMemorySo(item: unknown): void { 865 this.vmStatisticsAnalysisProgressEL!.loading = true; 866 let allDur = 0; 867 let libMap = new Map<number, Array<number | string>>(); // @ts-ignore 868 if (!this.vmStatisticsAnalysisProcessData || this.vmStatisticsAnalysisProcessData.length === 0) { 869 return; 870 } // @ts-ignore 871 for (let vmItemData of this.vmStatisticsAnalysisProcessData) { 872 if (this.soIsAccumulationData(item, vmItemData)) { 873 continue; 874 } 875 allDur += vmItemData.dur; 876 if (libMap.has(vmItemData.libId)) { 877 libMap.get(vmItemData.libId)?.push(vmItemData); 878 } else { 879 let dataArray = []; 880 dataArray.push(vmItemData); 881 libMap.set(vmItemData.libId, dataArray); 882 } 883 } 884 this.updateVmSoData(libMap, item, allDur); 885 this.libStatisticsData = this.totalDurationData(allDur); 886 this.currentLevel = 3; 887 this.vmStatisticsAnalysisProgressEL!.loading = false; 888 this.libraryPieChart(); 889 } 890 891 private soIsAccumulationData(item: unknown, vmItemData: unknown): boolean { 892 if (!this.hideProcessCheckBox?.checked && !this.hideThreadCheckBox?.checked) { 893 // @ts-ignore 894 return item && (vmItemData.pid !== item.pid || vmItemData.tid !== item.tid || vmItemData.type !== item.type); 895 } else if (!this.hideProcessCheckBox?.checked && this.hideThreadCheckBox?.checked) { 896 // @ts-ignore 897 return item && (vmItemData.pid !== item.pid || vmItemData.type !== item.type); 898 } else if (this.hideProcessCheckBox?.checked && !this.hideThreadCheckBox?.checked) { 899 // @ts-ignore 900 return (item && vmItemData.tid !== item.tid) || vmItemData.type !== item.type; 901 } else if (this.hideProcessCheckBox?.checked && this.hideThreadCheckBox?.checked) { 902 // @ts-ignore 903 return item && vmItemData.type !== item.type; 904 } 905 return false; 906 } 907 908 private updateVmSoData(libMap: Map<number, Array<number | string>>, item: unknown, allDur: number): void { 909 this.vmStatisticsAnalysisSoData = []; 910 libMap.forEach((value: unknown[], key: number): void => { 911 let dur = 0; 912 let vmLibName = ''; 913 for (let item of value) { 914 // @ts-ignore 915 dur += item.dur; 916 if (key === null) { 917 // @ts-ignore 918 item.libName = 'unknown'; 919 } // @ts-ignore 920 vmLibName = item.libName; 921 } 922 let libPath = vmLibName?.split('/'); 923 if (libPath) { 924 vmLibName = libPath[libPath.length - 1]; 925 } 926 const soData = { 927 tableName: vmLibName, // @ts-ignore 928 pid: item === null ? value[0].pid : item.pid, // @ts-ignore 929 type: item === null ? value[0].type : item.type, // @ts-ignore 930 tid: item === null ? value[0].tid : item.tid, 931 libId: key, 932 percent: ((dur / allDur) * 100).toFixed(2), 933 durFormat: Utils.getProbablyTime(dur), 934 duration: dur, 935 }; 936 this.vmStatisticsAnalysisSoData.push(soData); 937 }); // @ts-ignore 938 this.vmStatisticsAnalysisSoData.sort((a, b) => b.duration - a.duration); 939 } 940 941 private getVirtualMemoryFunction(item: unknown): void { 942 this.vmStatisticsAnalysisProgressEL!.loading = true; 943 this.shadowRoot!.querySelector<HTMLDivElement>('.vm-subheading')!.textContent = 'Statistic By Function AllDuration'; // @ts-ignore 944 let tid = item.tid; // @ts-ignore 945 let pid = item.pid; // @ts-ignore 946 let type = item.type; // @ts-ignore 947 let libId = item.libId; 948 let allDur = 0; 949 let symbolMap = new Map<number, Array<unknown>>(); // @ts-ignore 950 if (!this.vmStatisticsAnalysisProcessData || this.vmStatisticsAnalysisProcessData.length === 0) { 951 return; 952 } // @ts-ignore 953 for (let vmProcessData of this.vmStatisticsAnalysisProcessData) { 954 if (this.vmFunctionIsAccumulationData(vmProcessData, tid, pid, type, libId)) { 955 continue; 956 } 957 allDur += vmProcessData.dur; 958 if (symbolMap.has(vmProcessData.symbolId)) { 959 symbolMap.get(vmProcessData.symbolId)?.push(vmProcessData); 960 } else { 961 let dataArray = []; 962 dataArray.push(vmProcessData); 963 symbolMap.set(vmProcessData.symbolId, dataArray); 964 } 965 } 966 this.updateVmFunctionData(symbolMap, item, allDur); 967 this.functionStatisticsData = this.totalDurationData(allDur); 968 this.currentLevel = 4; 969 // @ts-ignore 970 this.sumDur = this.libStatisticsData.allDuration; 971 this.vmStatisticsAnalysisProgressEL!.loading = false; 972 this.setVmPieChartConfig(); 973 this.vmStatisticsAnalysisFunctionData.unshift(this.functionStatisticsData); 974 this.vmStatisticsAnalysisTableFunction!.recycleDataSource = this.vmStatisticsAnalysisFunctionData; 975 this.vmStatisticsAnalysisTableFunction?.reMeauseHeight(); 976 // @ts-ignore 977 this.vmStatisticsAnalysisFunctionData.shift(this.functionStatisticsData); 978 this.currentLevelData = this.vmStatisticsAnalysisFunctionData; 979 } 980 981 private setVmPieConfig(): void { 982 this.vmPieChart!.config = { 983 appendPadding: 0, 984 data: this.getVmPieChartData(this.vmStatisticsAnalysisSoData), 985 angleField: 'duration', 986 colorField: 'tableName', 987 radius: 1, 988 label: { 989 type: 'outer', 990 }, 991 tip: (vmObj): string => { 992 return `<div> 993 <div>Function:${ 994 // @ts-ignore 995 vmObj.obj.tableName 996 }</div> 997 <div>Duration:${ 998 // @ts-ignore 999 vmObj.obj.durFormat 1000 }</div> 1001 <div>percent:${ 1002 // @ts-ignore 1003 vmObj.obj.percent 1004 }</div> 1005 </div> 1006 `; 1007 }, 1008 angleClick: (it): void => { 1009 this.vmSoLevelClickEvent(it); 1010 }, 1011 hoverHandler: (vmPieData): void => { 1012 if (vmPieData) { 1013 this.vmStatisticsAnalysisTableFunction!.setCurrentHover(vmPieData); 1014 } else { 1015 this.vmStatisticsAnalysisTableFunction!.mouseOut(); 1016 } 1017 }, 1018 interactions: [ 1019 { 1020 type: 'element-active', 1021 }, 1022 ], 1023 }; 1024 } 1025 1026 private vmFunctionIsAccumulationData( 1027 vmProcessData: unknown, 1028 tid: number, 1029 pid: number, 1030 type: string, 1031 libId: number 1032 ): boolean { 1033 if (!this.hideProcessCheckBox?.checked && !this.hideThreadCheckBox?.checked) { 1034 return ( 1035 // @ts-ignore 1036 vmProcessData.pid !== pid || // @ts-ignore 1037 vmProcessData.tid !== tid || // @ts-ignore 1038 vmProcessData.type !== type || // @ts-ignore 1039 vmProcessData.libId !== libId 1040 ); // @ts-ignore 1041 } else if (!this.hideProcessCheckBox?.checked && this.hideThreadCheckBox?.checked) { 1042 // @ts-ignore 1043 return vmProcessData.pid !== pid || vmProcessData.type !== type || vmProcessData.libId !== libId; 1044 } else if (this.hideProcessCheckBox?.checked && !this.hideThreadCheckBox?.checked) { 1045 // @ts-ignore 1046 return vmProcessData.tid !== tid || vmProcessData.type !== type || vmProcessData.libId !== libId; 1047 } else if (this.hideProcessCheckBox?.checked && this.hideThreadCheckBox?.checked) { 1048 // @ts-ignore 1049 return vmProcessData.type !== type || vmProcessData.libId !== libId; 1050 } 1051 return false; 1052 } 1053 1054 private updateVmFunctionData(symbolMap: Map<number, Array<unknown>>, item: unknown, allDur: number): void { 1055 this.vmStatisticsAnalysisFunctionData = []; 1056 symbolMap.forEach((symbolItems, key): void => { 1057 let dur = 0; 1058 let symbolName = ''; 1059 for (let symbolItem of symbolItems) { 1060 // @ts-ignore 1061 symbolName = symbolItem.symbolName; // @ts-ignore 1062 dur += symbolItem.dur; 1063 } 1064 let symbolPath = symbolName?.split('/'); 1065 if (symbolPath) { 1066 symbolName = symbolPath[symbolPath.length - 1]; 1067 } 1068 const symbolData = { 1069 // @ts-ignore 1070 pid: item.pid, // @ts-ignore 1071 type: item.type, // @ts-ignore 1072 tid: item.tid, // @ts-ignore 1073 libId: item.libId, 1074 symbol: key, 1075 percent: ((dur / allDur) * 100).toFixed(2), 1076 tableName: symbolName, 1077 durFormat: Utils.getProbablyTime(dur), 1078 duration: dur, 1079 }; 1080 this.vmStatisticsAnalysisFunctionData.push(symbolData); 1081 }); // @ts-ignore 1082 this.vmStatisticsAnalysisFunctionData.sort((a, b) => b.duration - a.duration); 1083 } 1084 1085 private typeIdToString(type: number): string { 1086 let vmReleaseType: string; 1087 if (type === 1) { 1088 vmReleaseType = 'File Backed In'; 1089 } else if (type === 7) { 1090 vmReleaseType = 'Copy On Writer'; 1091 } else { 1092 vmReleaseType = 'Other'; 1093 } 1094 // @ts-ignore 1095 return vmReleaseType; 1096 } 1097 1098 private totalDurationData(duration: number): { 1099 durFormat: string; 1100 percent: string; 1101 tableName: string; 1102 duration: number; 1103 } { 1104 return { 1105 durFormat: Utils.getProbablyTime(duration), 1106 percent: ((duration / duration) * 100).toFixed(2), 1107 tableName: '', 1108 duration: 0, 1109 }; 1110 } 1111 1112 private getVmPieChartData(vmRes: unknown[]): unknown[] { 1113 if (vmRes.length > 20) { 1114 let vmPieChartArr: string[] = []; 1115 let other: unknown = { 1116 tableName: 'other', 1117 duration: 0, 1118 percent: 0, 1119 durFormat: 0, 1120 }; 1121 for (let i = 0; i < vmRes.length; i++) { 1122 if (i < 19) { 1123 // @ts-ignore 1124 vmPieChartArr.push(vmRes[i]); 1125 } else { 1126 // @ts-ignore 1127 other.duration += vmRes[i].duration; // @ts-ignore 1128 other.durFormat = Utils.getProbablyTime(other.duration); // @ts-ignore 1129 other.percent = ((other.duration / this.sumDur) * 100).toFixed(2); 1130 } 1131 } // @ts-ignore 1132 vmPieChartArr.push(other); 1133 return vmPieChartArr; 1134 } 1135 return vmRes; 1136 } 1137 1138 private getVmDataByWorker(args: unknown[], handler: Function): void { 1139 procedurePool.submitWithName( 1140 'logic0', 1141 'fileSystem-action', 1142 { args, callType: 'virtualMemory', isAnalysis: true }, 1143 undefined, 1144 (results: unknown) => { 1145 handler(results); 1146 this.vmStatisticsAnalysisProgressEL!.loading = false; 1147 } 1148 ); 1149 } 1150 1151 public connectedCallback(): void { 1152 new ResizeObserver((): void => { 1153 if (this.parentElement?.clientHeight !== 0) { 1154 this.vmStatisticsAnalysisTableProcess!.style.height = `${this.parentElement!.clientHeight - 50}px`; 1155 this.vmStatisticsAnalysisTableProcess?.reMeauseHeight(); 1156 this.vmStatisticsAnalysisTableType!.style.height = `${this.parentElement!.clientHeight - 50}px`; 1157 this.vmStatisticsAnalysisTableType?.reMeauseHeight(); 1158 this.vmStatisticsAnalysisTableThread!.style.height = `${this.parentElement!.clientHeight - 50}px`; 1159 this.vmStatisticsAnalysisTableThread?.reMeauseHeight(); 1160 this.vmStatisticsAnalysisTableSo!.style.height = `${this.parentElement!.clientHeight - 50}px`; 1161 this.vmStatisticsAnalysisTableSo?.reMeauseHeight(); 1162 this.vmStatisticsAnalysisTableFunction!.style.height = `${this.parentElement!.clientHeight - 50}px`; 1163 this.vmStatisticsAnalysisTableFunction?.reMeauseHeight(); 1164 if (this.parentElement!.clientHeight >= 0 && this.parentElement!.clientHeight <= 31) { 1165 this.virtualMemoryFilterEl!.style.display = 'none'; 1166 } else { 1167 this.virtualMemoryFilterEl!.style.display = 'flex'; 1168 } 1169 } 1170 }).observe(this.parentElement!); 1171 } 1172 1173 initHtml(): string { 1174 return TabPaneVirtualMemoryStatisticsAnalysisHtml; 1175 } 1176} 1177