index.html 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta name="description" content="dbmon vue" />
  5. <link href="./lib/bootstrap.min.css" rel="stylesheet" type="text/css" />
  6. <link href="./lib/styles.css" rel="stylesheet" type="text/css" />
  7. <title>dbmon (Vue)</title>
  8. </head>
  9. <body>
  10. <h2>
  11. Reference: <a href="http://mathieuancelin.github.io/js-repaint-perfs/">js-repaint-perfs</a>
  12. </h2>
  13. <div id="app">
  14. <table class="table table-striped lastest-data">
  15. <tbody>
  16. <tr v-for="db in databases">
  17. <td class="dbname">{{db.dbname}}</td>
  18. <td class="query-count">
  19. <span :class="db.lastSample.countClassName">{{db.lastSample.nbQueries}}</span>
  20. </td>
  21. <td v-for="q in db.lastSample.topFiveQueries" :class="'Query ' + q.elapsedClassName">
  22. {{q.formatElapsed}}
  23. <div class="popover left">
  24. <div class="popover-content">{{q.query}}</div>
  25. <div class="arrow"></div>
  26. </div>
  27. </td>
  28. </tr>
  29. </tbody>
  30. </table>
  31. </div>
  32. <script src="./ENV.js"></script>
  33. <script src="./lib/memory-stats.js"></script>
  34. <script src="./lib/monitor.js"></script>
  35. <script src="../../dist/vue.min.js"></script>
  36. <script src="./app.js"></script>
  37. </body>
  38. </html>