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 16export const TabPaneNMCallTreeHtml = ` 17 <style> 18 :host{ 19 padding: 10px 10px 0 10px; 20 display: flex; 21 flex-direction: column; 22 } 23 .show{ 24 display: flex; 25 flex: 1; 26 } 27 #nm-call-tree-filter { 28 border: solid rgb(216,216,216) 1px; 29 float: left; 30 position: fixed; 31 bottom: 0; 32 width: 100%; 33 } 34 selector{ 35 display: none; 36 } 37 .nm-call-tree-progress{ 38 bottom: 33px; 39 position: absolute; 40 height: 1px; 41 left: 0; 42 right: 0; 43 } 44 .nm-call-tree-loading{ 45 bottom: 0; 46 position: absolute; 47 left: 0; 48 right: 0; 49 width:100%; 50 background:transparent; 51 z-index: 999999; 52 } 53 </style> 54 <lit-headline class="titleBox"></lit-headline> 55 <div class="nm-call-tree-content" style="display: flex;flex-direction: row"> 56 <selector id='show_table' class="show"> 57 <lit-slicer style="width:100%"> 58 <div id="left_table" style="width: 65%"> 59 <tab-native-data-modal id="modal"></tab-native-data-modal> 60 <lit-table id="tb-filesystem-calltree" style="height: auto" tree> 61 <lit-table-column class="nm-call-tree-column" width="60%" title="Symbol Name" 62 data-index="symbol" key="symbol" align="flex-start" retract> 63 </lit-table-column> 64 <lit-table-column class="nm-call-tree-column" width="1fr" title="Size" 65 data-index="heapSizeStr" key="heapSizeStr" align="flex-start" order> 66 </lit-table-column> 67 <lit-table-column class="nm-call-tree-column" width="1fr" title="%" 68 data-index="heapPercent" key="heapPercent" align="flex-start" order> 69 </lit-table-column> 70 <lit-table-column class="nm-call-tree-column" width="1fr" title="Count" 71 data-index="countValue" key="countValue" align="flex-start" order> 72 </lit-table-column> 73 <lit-table-column class="nm-call-tree-column" width="1fr" title="%" 74 data-index="countPercent" key="countPercent" align="flex-start" order> 75 </lit-table-column> 76 <lit-table-column class="nm-call-tree-column" width="1fr" title=" " 77 data-index="type" key="type" align="flex-start" > 78 <template> 79 <img src="img/library.png" size="20" v-if=" type == 1 "> 80 <img src="img/function.png" size="20" v-if=" type == 0 "> 81 <div v-if=" type == - 1 "></div> 82 </template> 83 </lit-table-column> 84 </lit-table> 85 86 </div> 87 <lit-slicer-track class="nm-call-tree-slicer-track" ></lit-slicer-track> 88 <lit-table id="tb-filesystem-list" no-head 89 style="height: auto;border-left: 1px solid var(--dark-border1,#e2e2e2)" hideDownload> 90 <span slot="head">Heaviest Stack Trace</span> 91 <lit-table-column class="nm-call-tree-column" width="30px" title="" 92 data-index="type" key="type" align="flex-start" > 93 <template> 94 <img src="img/library.png" size="20" v-if=" type == 1 "> 95 <img src="img/function.png" size="20" v-if=" type == 0 "> 96 </template> 97 </lit-table-column> 98 <lit-table-column class="nm-call-tree-column" width="1fr" title="" 99 data-index="symbol" key="symbol" align="flex-start"></lit-table-column> 100 </lit-table> 101 </div> 102 </lit-slicer> 103 </selector> 104 <tab-pane-filter id="nm-call-tree-filter" first second icon nativeMemory></tab-pane-filter> 105 <lit-progress-bar class="progress nm-call-tree-progress"></lit-progress-bar> 106 <selector class="nm-call-tree-selector" id='show_chart'> 107 <tab-framechart id='framechart' style='width: 100%;height: auto'> </tab-framechart> 108 </selector> 109 <div class="loading nm-call-tree-loading"></div> 110 </div>`; 111
