mirror of
https://gitee.com/ulthon/ulthon_admin.git
synced 2026-08-30 12:45:32 +08:00
75 lines
4.0 KiB
PHP
75 lines
4.0 KiB
PHP
<div class="layuimini-container">
|
||
<div class="layuimini-main" style="padding: 10px 15px;">
|
||
<!-- 顶部摘要卡片（服务端渲染） -->
|
||
<div class="layui-row layui-col-space15">
|
||
<div class="layui-col-md3 layui-col-sm6">
|
||
<div class="layui-card xhprof-summary-card">
|
||
<div class="layui-card-header">总耗时</div>
|
||
<div class="layui-card-body">
|
||
<span class="xhprof-num">{$summary.wall_time_ms}</span><span class="xhprof-unit">ms</span>
|
||
<div class="xhprof-sub">CPU {$summary.cpu_time_ms}ms</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-col-md3 layui-col-sm6">
|
||
<div class="layui-card xhprof-summary-card">
|
||
<div class="layui-card-header">SQL 占比</div>
|
||
<div class="layui-card-body">
|
||
<span class="xhprof-num" id="summary-sql-pct">--</span><span class="xhprof-unit">%</span>
|
||
<div class="xhprof-sub">think\db* 独占耗时 / 总耗时</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-col-md3 layui-col-sm6">
|
||
<div class="layui-card xhprof-summary-card">
|
||
<div class="layui-card-header">内存峰值</div>
|
||
<div class="layui-card-body">
|
||
<span class="xhprof-num">{$summary.memory_peak_mb}</span><span class="xhprof-unit">MB</span>
|
||
<div class="xhprof-sub">函数总数 <span id="summary-fn-total">-</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-col-md3 layui-col-sm6">
|
||
<div class="layui-card xhprof-summary-card">
|
||
<div class="layui-card-header">请求信息</div>
|
||
<div class="layui-card-body xhprof-request-card">
|
||
<div>
|
||
<span class="layui-badge layui-bg-blue">{$run.method|default='-'}</span>
|
||
<span class="xhprof-url" title="{$summary.url_display}">{$summary.url_display}</span>
|
||
</div>
|
||
<div class="xhprof-sub">{$summary.request_time_text} · 节点 {$summary.node_display}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SQL 摘要条（JS 以接口模式取数填充） -->
|
||
<div class="layui-card">
|
||
<div class="layui-card-header">SQL 耗时摘要（think\db 前缀函数独占耗时合计）</div>
|
||
<div class="layui-card-body">
|
||
<div class="xhprof-bar-track"><div class="xhprof-bar-fill" id="sql-bar" style="width: 0;"></div></div>
|
||
<div class="xhprof-bar-text" id="sql-bar-text">数据加载中...</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 函数级分析表（JS 以接口模式取数后本地渲染） -->
|
||
<div class="layui-card">
|
||
<div class="layui-card-header">函数级分析（按独占耗时降序 Top 100）</div>
|
||
<div class="layui-card-body" style="padding: 5px 10px;">
|
||
<table id="funcTable" class="layui-table" data-id="{$run.id}" lay-filter="funcTable"></table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<style>
|
||
.xhprof-summary-card .layui-card-body { padding: 12px 15px; }
|
||
.xhprof-num { font-size: 26px; font-weight: 600; color: #16baaa; }
|
||
.xhprof-num.is-warn { color: #ff5722; }
|
||
.xhprof-unit { margin-left: 4px; color: #999; }
|
||
.xhprof-sub { margin-top: 4px; color: #999; font-size: 12px; }
|
||
.xhprof-request-card .xhprof-url { margin-left: 6px; font-weight: 600; word-break: break-all; }
|
||
.xhprof-bar-track { height: 18px; background: #f2f2f2; border-radius: 9px; overflow: hidden; }
|
||
.xhprof-bar-fill { height: 100%; background: linear-gradient(90deg, #16b777, #16baaa); border-radius: 9px; transition: width .4s ease; min-width: 0; }
|
||
.xhprof-bar-text { margin-top: 6px; color: #666; font-size: 12px; }
|
||
</style>
|