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 {ColorUtils} from "../../base/ColorUtils.js"; 19import {Utils} from "../../base/Utils.js"; 20 21@element('tabpane-freq') 22export class TabPaneFreq extends BaseElement { 23 private tbl: LitTable | null | undefined; 24 25 set data(freq:any) { 26 if(freq){ 27 this.tbl!.dataSource = [{ 28 startNS:Utils.getTimeString(freq.startNS), 29 dur:Utils.getProbablyTime(freq.dur), 30 freq:`${ColorUtils.formatNumberComma(freq.value!)} kHz`, 31 cpu:`Cpu ${freq.cpu}` 32 }] 33 } 34 } 35 36 initElements(): void { 37 this.tbl = this.shadowRoot?.querySelector<LitTable>('#tb-freq'); 38 } 39 40 connectedCallback() { 41 super.connectedCallback(); 42 new ResizeObserver((entries) => { 43 if (this.parentElement?.clientHeight != 0) { 44 // @ts-ignore 45 this.tbl?.shadowRoot.querySelector(".table").style.height = (this.parentElement.clientHeight - 45) + "px" 46 this.tbl?.reMeauseHeight() 47 } 48 }).observe(this.parentElement!) 49 } 50 51 initHtml(): string { 52 return ` 53 <style> 54 :host{ 55 display: flex; 56 flex-direction: column; 57 padding: 10px 10px; 58 } 59 </style> 60 <lit-table id="tb-freq" style="height: auto"> 61 <lit-table-column width="1fr" title="StartTime" data-index="startNS" key="startNS" align="flex-start"> 62 </lit-table-column> 63 <lit-table-column width="1fr" title="Duration" data-index="dur" key="dur" align="flex-start" > 64 </lit-table-column> 65 <lit-table-column width="1fr" title="Cpu" data-index="cpu" key="cpu" align="flex-start" > 66 </lit-table-column> 67 <lit-table-column width="1fr" title="Freq" data-index="freq" key="freq" align="flex-start" > 68 </lit-table-column> 69 </lit-table> 70 `; 71 } 72 73}