You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta name="description" content="dbmon vue" />
|
|
|
|
|
<link href="./lib/styles.css" rel="stylesheet" type="text/css" />
|
|
|
|
|
<title>dbmon (Vue)</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<h2>
|
|
|
|
|
Reference: <a href="http://mathieuancelin.github.io/js-repaint-perfs/">js-repaint-perfs</a>
|
|
|
|
|
</h2>
|
|
|
|
|
<div id="app">
|
|
|
|
|
<table class="table table-striped lastest-data">
|
|
|
|
|
<tbody>
|
|
|
|
|
<tr v-for="db in databases">
|
|
|
|
|
<td class="dbname">{{db.dbname}}</td>
|
|
|
|
|
<td class="query-count">
|
|
|
|
|
<span :class="db.lastSample.countClassName">{{db.lastSample.nbQueries}}</span>
|
|
|
|
|
</td>
|
|
|
|
|
<td v-for="q in db.lastSample.topFiveQueries" :class="'Query ' + q.elapsedClassName">
|
|
|
|
|
{{q.formatElapsed}}
|
|
|
|
|
<div class="popover left">
|
|
|
|
|
<div class="popover-content">{{q.query}}</div>
|
|
|
|
|
<div class="arrow"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script src="./ENV.js"></script>
|
|
|
|
|
<script src="./lib/memory-stats.js"></script>
|
|
|
|
|
<script src="./lib/monitor.js"></script>
|
|
|
|
|
<script src="../../dist/vue.min.js"></script>
|
|
|
|
|
<script src="./app.js"></script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
