From aad9b305ef051ea56b58d19ee485f6501e42ba49 Mon Sep 17 00:00:00 2001
From: virusdefender <1670873886@qq.com>
Date: Sat, 8 Aug 2015 09:44:15 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=9C=8D=E5=8A=A1=E5=99=A8?=
 =?UTF-8?q?=E7=9B=91=E6=8E=A7=E7=9A=84=E5=AF=B9=E5=BA=94=20js=20=E4=B9=9F?=
 =?UTF-8?q?=20demo=20=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/src/js/app/admin/monitor/monitor.js | 56 ++++++++++++++++++++++
 static/src/js/config.js                    |  1 +
 template/admin/monitor/monitor.html        | 21 ++++++++
 3 files changed, 78 insertions(+)
 create mode 100644 static/src/js/app/admin/monitor/monitor.js
 create mode 100644 template/admin/monitor/monitor.html

diff --git a/static/src/js/app/admin/monitor/monitor.js b/static/src/js/app/admin/monitor/monitor.js
new file mode 100644
index 0000000..66a4574
--- /dev/null
+++ b/static/src/js/app/admin/monitor/monitor.js
@@ -0,0 +1,56 @@
+require(["jquery", "chart"], function ($, Chart) {
+    var data = {
+        labels: ["January", "February", "March", "April", "May", "June", "July",
+            "January", "February", "March", "April", "January", "February", "March", "April"],
+        datasets: [
+            {
+                label: "11111111",
+                fillColor: "rgba(220,220,220,0.2)",
+                strokeColor: "rgba(220,220,220,1)",
+                pointColor: "rgba(220,220,220,1)",
+                pointStrokeColor: "#fff",
+                pointHighlightFill: "#fff",
+                pointHighlightStroke: "rgba(220,220,220,1)",
+                data: [10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10]
+            },
+            {
+                label: "2222222",
+                fillColor: "rgba(151,187,205,0.2)",
+                strokeColor: "rgba(151,187,205,1)",
+                pointColor: "rgba(151,187,205,1)",
+                pointStrokeColor: "#fff",
+                pointHighlightFill: "#fff",
+                pointHighlightStroke: "rgba(151,187,205,1)",
+                data: [3, 7, 8, 9, 1, 4, 10, 10, 9, 8, 7, 10, 10, 10, 10]
+            }
+        ]
+    };
+    Chart.defaults.global.responsive = true;
+    var myLineChart = new Chart($("#myChart").get(0).getContext("2d")).Line(data);
+
+    var data1 = [
+    {
+        value: 300,
+        color:"#F7464A",
+        highlight: "#FF5A5E",
+        label: "Red"
+    },
+    {
+        value: 50,
+        color: "#46BFBD",
+        highlight: "#5AD3D1",
+        label: "Green"
+    },
+    {
+        value: 100,
+        color: "#FDB45C",
+        highlight: "#FFC870",
+        label: "Yellow"
+    }
+];
+
+
+    new Chart($("#c1").get(0).getContext("2d")).Pie(data1);
+    new Chart($("#c2").get(0).getContext("2d")).Pie(data1);
+
+});
\ No newline at end of file
diff --git a/static/src/js/config.js b/static/src/js/config.js
index 67bb9b6..2f730b4 100644
--- a/static/src/js/config.js
+++ b/static/src/js/config.js
@@ -16,6 +16,7 @@ var require = {
         contest: "app/admin/contest/contest",
         csrf: "utils/csrf",
         admin: "app/admin/admin",
+        chart: "lib/chart/Chart",
 
         //formValidation 不要在代码中单独使用，而是使用和修改utils/validation
         base: "lib/formValidation/base",
diff --git a/template/admin/monitor/monitor.html b/template/admin/monitor/monitor.html
new file mode 100644
index 0000000..07a4ba1
--- /dev/null
+++ b/template/admin/monitor/monitor.html
@@ -0,0 +1,21 @@
+<div ms-controller="monitor" class="col-lg-9">
+    <h1>服务器监控</h1>
+
+    <div>
+        <h3>判题实例数量</h3>
+        <div>
+        <canvas id="myChart" style="min-width:100%;max-height: 300px;"></canvas>
+            <div style="text-align: center;">判题实例数量变化</div>
+            </div>
+        <div style="width: 50%;float: left;">
+            <canvas id="c1" width="250" height="125"></canvas>
+            <div style="text-align: center;">内存</div>
+        </div>
+        <div style="width: 50%;float: left;">
+            <canvas id="c2" width="250" height="125"></canvas>
+            <div style="text-align: center"> cpu</div>
+        </div>
+    </div>
+
+    <script src="/static/js/app/admin/monitor/monitor.js"></script>
+</div>
\ No newline at end of file