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.js'; 17import { LitTable } from '../../../../../base-ui/table/lit-table.js'; 18import { SelectionData, SelectionParam } from '../../../../bean/BoxSelection.js'; 19import { Utils } from '../../base/Utils.js'; 20import { resizeObserver } from '../SheetUtils.js'; 21 22@element('tabpane-irq-counter') 23export class TabPaneIrqCounter extends BaseElement { 24 private irqCounterTbl: LitTable | null | undefined; 25 private irqRange: HTMLLabelElement | null | undefined; 26 private irqCounterSource: Array<SelectionData> = []; 27 28 set data(irqParam: SelectionParam | any) { 29 //@ts-ignore 30 this.irqCounterTbl?.shadowRoot?.querySelector('.table')?.style?.height = 31 this.parentElement!.clientHeight - 45 + 'px'; 32 this.irqRange!.textContent = 33 'Selected range: ' + parseFloat(((irqParam.rightNs - irqParam.leftNs) / 1000000.0).toFixed(5)) + ' ms'; 34 let dataSource: Array<SelectionData> = []; 35 let collect = irqParam.irqMapData; 36 let sumCount = 0; 37 for (let key of collect.keys()) { 38 let counters = collect.get(key); 39 let selectCounterData = this.createSelectCounterData(key, counters); 40 sumCount += Number.parseInt(selectCounterData.count || '0'); 41 selectCounterData.avgDuration = Utils.getProbablyTime( 42 selectCounterData.wallDuration / parseInt(selectCounterData.count) 43 ); 44 dataSource.push(selectCounterData); 45 } 46 this.irqCounterSource = dataSource; 47 this.irqCounterTbl!.recycleDataSource = dataSource; 48 } 49 50 initElements(): void { 51 this.irqCounterTbl = this.shadowRoot?.querySelector<LitTable>('#tb-irq-counter'); 52 this.irqRange = this.shadowRoot?.querySelector('#time-range'); 53 this.irqCounterTbl!.addEventListener('column-click', (event) => { 54 // @ts-ignore 55 this.sortByColumn(event.detail); 56 }); 57 } 58 59 connectedCallback() { 60 super.connectedCallback(); 61 resizeObserver(this.parentElement!, this.irqCounterTbl!); 62 } 63 64 initHtml(): string { 65 return ` 66 <style> 67 .irq-counter-label{ 68 font-size: 10pt; 69 } 70 :host{ 71 display: flex; 72 flex-direction: column; 73 padding: 10px 10px; 74 } 75 </style> 76 <label id="time-range" class="irq-counter-label" style="width: 100%;height: 20px;text-align: end;margin-bottom: 5px;">Selected range:0.0 ms</label> 77 <lit-table id="tb-irq-counter" style="height: auto"> 78 <lit-table-column width="30%" title="Name" data-index="name" key="name" align="flex-start" order> 79 </lit-table-column> 80 <lit-table-column width="1fr" title="Duration" data-index="wallDurationFormat" key="wallDurationFormat" align="flex-start" order > 81 </lit-table-column> 82 <lit-table-column width="1fr" title="Average Duration" data-index="avgDuration" key="avgDuration" align="flex-start" order > 83 </lit-table-column> 84 <lit-table-column width="1fr" title="Occurrences" data-index="count" key="count" align="flex-start" order > 85 </lit-table-column> 86 </lit-table> 87 `; 88 } 89 90 createSelectCounterData(name: string, list: Array<any>): SelectionData { 91 let selectData = new SelectionData(); 92 if (list.length > 0) { 93 selectData.name = name; 94 selectData.count = list.length + ''; 95 for (let index = 0; index < list.length; index++) { 96 selectData.wallDuration += list[index].dur; 97 } 98 selectData.wallDurationFormat = Utils.getProbablyTime(selectData.wallDuration); 99 } 100 return selectData; 101 } 102 103 sortByColumn(detail: any) { 104 let type = detail.sort; 105 let key = detail.key; 106 if (type == 0) { 107 this.irqCounterTbl!.recycleDataSource = this.irqCounterSource; 108 } else { 109 let arr = Array.from(this.irqCounterSource); 110 arr.sort((irqCounterLeftData, irqCounterRightData): number => { 111 if (key == 'wallDurationFormat') { 112 if (type == 1) { 113 return irqCounterLeftData.wallDuration - irqCounterRightData.wallDuration; 114 } else { 115 return irqCounterRightData.wallDuration - irqCounterLeftData.wallDuration; 116 } 117 } else if (key == 'count') { 118 if (type == 1) { 119 return parseInt(irqCounterLeftData.count) >= parseInt(irqCounterRightData.count) ? 1 : -1; 120 } else { 121 return parseInt(irqCounterRightData.count) >= parseInt(irqCounterLeftData.count) ? 1 : -1; 122 } 123 } else if (key == 'avgDuration') { 124 if (type == 1) { 125 return ( 126 irqCounterLeftData.wallDuration / parseInt(irqCounterLeftData.count) - 127 irqCounterRightData.wallDuration / parseInt(irqCounterRightData.count) 128 ); 129 } else { 130 return ( 131 irqCounterRightData.wallDuration / parseInt(irqCounterRightData.count) - 132 irqCounterLeftData.wallDuration / parseInt(irqCounterLeftData.count) 133 ); 134 } 135 } else if (key == 'name') { 136 if (irqCounterLeftData.name > irqCounterRightData.name) { 137 return type === 2 ? 1 : -1; 138 } else if (irqCounterLeftData.name == irqCounterRightData.name) { 139 return 0; 140 } else { 141 return type === 2 ? -1 : 1; 142 } 143 } else { 144 return 0; 145 } 146 }); 147 this.irqCounterTbl!.recycleDataSource = arr; 148 } 149 } 150} 151