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 */ 15export const Top20FrequencyThreadHtml = ` 16 <style> 17 :host { 18 width: 100%; 19 height: 100%; 20 background-color: var(--dark-background5,#F6F6F6); 21 } 22 .tb_thread_count{ 23 width: calc(100% - 100px); 24 border-radius: 5px; 25 border: solid 1px var(--dark-border1,#e0e0e0); 26 margin: 15px; 27 padding: 5px 15px 28 } 29 .pie-chart{ 30 display: flex; 31 box-sizing: border-box; 32 width: 80%; 33 height: 500px; 34 } 35 #nodata { 36 opacity: 0; 37 } 38 .root{ 39 width: 100%; 40 height: 100%; 41 display: flex; 42 flex-direction: row; 43 overflow-x: hidden; 44 overflow-y: auto; 45 box-sizing: border-box; 46 } 47 </style> 48 <lit-progress-bar id="loading" style="height: 1px;width: 100%" loading></lit-progress-bar> 49 <div style="padding: 15px"> 50 Thread Search 51 <lit-select-v value default-value="" id="thread_select" rounded placement="bottom" placeholder="please select thread"></lit-select-v> 52 </div> 53 <table-no-data id="nodata" contentHeight="500px"> 54 <div class="root"> 55 <div style="width: 40%;padding: 15px;display: flex;flex-direction: column;align-items: center"> 56 <div>Statistics By Duration</div> 57 <lit-chart-pie id="pie" class="pie-chart"></lit-chart-pie> 58 </div> 59 <div style="flex: 1;display: flex;flex-direction: column;align-items: center;padding-top: 15px;height: 60vh"> 60 <div id="current_thread" style="font-weight: bold;height: 40px"></div> 61 <div id="tb_vessel" class="tb_thread_count"> 62 <lit-table id="tb-process-thread-count" hideDownload style="height: calc(60vh - 60px)"> 63 <lit-table-column width="1fr" title="NO" data-index="no" key="no" align="flex-start" order></lit-table-column> 64 <lit-table-column width="1fr" title="cpu" data-index="cpu" key="cpu" align="flex-start" order></lit-table-column> 65 <lit-table-column width="1fr" title="frequency" data-index="freq" key="freq" align="flex-start" order></lit-table-column> 66 <lit-table-column width="1fr" title="duration" data-index="timeStr" key="timeStr" align="flex-start" order></lit-table-column> 67 <lit-table-column width="1fr" title="%" data-index="ratio" key="ratio" align="flex-start" order></lit-table-column> 68 </lit-table> 69 </div> 70 </div> 71 </div> 72 </table-no-data> 73 `; 74