|
36 | 36 |
|
37 | 37 |
|
38 | 38 | function updatedServerStatus(data) { |
39 | | - |
| 39 | + |
40 | 40 | myChart2.data.datasets[0].data[0] = data.totalReceivedBytes; |
41 | 41 | myChart2.data.datasets[0].data[1] = data.totalSentBytes; |
42 | 42 | //myChart.data.datasets[0].data[2] = co; |
43 | 43 | myChart2.update(); |
44 | | - myChart2.lab |
| 44 | + } |
| 45 | + |
| 46 | + function updatedUserStatus(data) { |
| 47 | + |
| 48 | + myChart3.data.datasets[0].data[0] = data.onlineUsersCount; |
| 49 | + myChart3.data.datasets[0].data[1] = data.offlineUsersCount; |
| 50 | + myChart3.data.datasets[0].data[2] = data.banUsersCount; |
| 51 | + //myChart.data.datasets[0].data[2] = co; |
| 52 | + myChart3.update(); |
45 | 53 | } |
46 | 54 |
|
47 | 55 | function getClientsInfo() { |
|
58 | 66 | $.get(apiUrl, |
59 | 67 | function (res) { |
60 | 68 | var data = res.Data; |
61 | | - //var serverStatus = $.parseJSON(data); |
62 | 69 | updatedServerStatus(data); |
63 | 70 | } |
64 | 71 | ); |
65 | 72 | } |
66 | 73 |
|
| 74 | + function getUserStatus() { |
| 75 | + var apiUrl = basepath + "GetUserStatus"; |
| 76 | + $.get(apiUrl, |
| 77 | + function (res) { |
| 78 | + var data = res.Data; |
| 79 | + updatedUserStatus(data); |
| 80 | + } |
| 81 | + ); |
| 82 | + } |
| 83 | + |
67 | 84 | //'use strict' |
68 | 85 | // Graphs |
69 | 86 | var ctx1 = document.getElementById('myChart'); |
|
97 | 114 | getLogFileTable(10); |
98 | 115 | getClientsInfo(); |
99 | 116 | getServerStatus(); |
| 117 | + getUserStatus(); |
100 | 118 |
|
101 | 119 | var myChart2 = new Chart(ctx2, |
102 | 120 | { |
|
124 | 142 | { |
125 | 143 | type: 'doughnut', |
126 | 144 | data: { |
127 | | - labels: ['活跃用户', '离线用户'/*, 'Yellow', 'Green', 'Purple', 'Orange'*/], |
| 145 | + labels: ['活跃用户', '离线用户', '黑名单用户'], |
128 | 146 | datasets: [ |
129 | 147 | { |
130 | 148 | label: '活跃用户', |
131 | | - data: [12, 19], |
| 149 | + data: [0, 0], |
132 | 150 | backgroundColor: [ |
133 | | - "rgb(255, 99, 132)", "rgb(54, 162, 235)", "rgb(255, 205, 86)" |
| 151 | + "rgb(75, 192, 192)", "rgb(255, 99, 132)", "rgb(201, 203, 207)" |
134 | 152 | ] |
135 | 153 | } |
136 | 154 | ] |
|
143 | 161 | } |
144 | 162 |
|
145 | 163 | }); |
146 | | - |
147 | | - //$("#myChart").click( |
148 | | - // function (evt) { |
149 | | - // var url = "连接管理"; |
150 | | - // //alert(url); |
151 | | - // } |
152 | | - //); |
153 | | - |
154 | | - //$("#myChart2").click( |
155 | | - // function (evt) { |
156 | | - // var url = " "; |
157 | | - // //alert(url); |
158 | | - // } |
159 | | - //); |
160 | | - |
161 | | - //$("#myChart3").click( |
162 | | - // function (evt) { |
163 | | - // var url = "用户管理"; |
164 | | - // //alert(url); |
165 | | - // } |
166 | | - //); |
| 164 | + //red: 'rgb(255, 99, 132)', |
| 165 | + // orange: 'rgb(255, 159, 64)', |
| 166 | + // yellow: 'rgb(255, 205, 86)', |
| 167 | + // green: 'rgb(75, 192, 192)', |
| 168 | + // blue: 'rgb(54, 162, 235)', |
| 169 | + // purple: 'rgb(153, 102, 255)', |
| 170 | + // grey: 'rgb(201, 203, 207)' |
167 | 171 | //定时更新数据 |
168 | 172 | if (window.intevalId) { |
169 | 173 | window.clearInterval(window.intevalId); |
|
173 | 177 | getClientsInfo(); |
174 | 178 | getServerStatus(); |
175 | 179 | getLogFileTable(10); |
176 | | - //myChart2.data.datasets.pop(); |
177 | | - //更新数据 |
178 | | - //myChart2.data.datasets[0].data[1] += 3; |
179 | | - //myChart2.data.datasets[1] = 10; |
180 | | - //myChart2.data.datasets.push({ |
181 | | - //label: label, |
182 | | - // backgroundColor: color, |
183 | | - // data: [12, 19] |
184 | | - //}); |
185 | | - //myChart2.update(); |
| 180 | + getUserStatus(); |
186 | 181 | }, 5000 |
187 | 182 | ); |
188 | 183 | }()); |
|
0 commit comments