Plot OK
This commit is contained in:
parent
a5ba94ad25
commit
f19d5d72d5
4
server/package-lock.json
generated
4
server/package-lock.json
generated
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "ifms-pti-svr",
|
"name": "ifms-pti-svr",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"lockfileVersion": 2,
|
"lockfileVersion": 2,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "ifms-pti-svr",
|
"name": "ifms-pti-svr",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@prisma/client": "^4.7.1",
|
"@prisma/client": "^4.7.1",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "ifms-pti-svr",
|
"name": "ifms-pti-svr",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"description": "Servidor do Portal de TI do IFMS",
|
"description": "Servidor do Portal de TI do IFMS",
|
||||||
"main": "src/index.js",
|
"main": "src/index.js",
|
||||||
"prisma": {
|
"prisma": {
|
||||||
|
|
4
web/package-lock.json
generated
4
web/package-lock.json
generated
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "ifms-pti",
|
"name": "ifms-pti",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"lockfileVersion": 2,
|
"lockfileVersion": 2,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "ifms-pti",
|
"name": "ifms-pti",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@mdi/font": "^6.9.96",
|
"@mdi/font": "^6.9.96",
|
||||||
"apollo-link-ws": "^1.0.20",
|
"apollo-link-ws": "^1.0.20",
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "ifms-pti",
|
"name": "ifms-pti",
|
||||||
"version": "3.4.9",
|
"version": "3.5.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vue-cli-service serve",
|
||||||
|
|
|
@ -33,19 +33,55 @@
|
||||||
prepend-inner-icon="mdi-timer-outline"
|
prepend-inner-icon="mdi-timer-outline"
|
||||||
/>
|
/>
|
||||||
</v-toolbar>
|
</v-toolbar>
|
||||||
|
<v-expand-transition>
|
||||||
{{ accessPoints }}
|
<v-progress-linear
|
||||||
|
v-if="$apollo.queries.accessPoints.loading"
|
||||||
|
class="pa-0 ma-0"
|
||||||
|
indeterminate
|
||||||
|
/>
|
||||||
|
</v-expand-transition>
|
||||||
|
<v-container fluid>
|
||||||
|
<v-row dense>
|
||||||
|
<v-col
|
||||||
|
v-for="ap in orderedAccessPoints"
|
||||||
|
:key="ap.id"
|
||||||
|
sm="12"
|
||||||
|
md="6"
|
||||||
|
lg="4"
|
||||||
|
>
|
||||||
|
<div class="font-weight-light">
|
||||||
|
{{ ap.name || ap.hostname }}
|
||||||
|
<span v-if="ap.local"> ({{ ap.local }}) </span>
|
||||||
|
</div>
|
||||||
|
<v-card class="mb-1" flat outlined>
|
||||||
|
<v-card-text class="pa-0">
|
||||||
|
<ClientsChart
|
||||||
|
:stats="ap.stats"
|
||||||
|
:subnet="ap.subnet"
|
||||||
|
:height="90"
|
||||||
|
hide-labels
|
||||||
|
/>
|
||||||
|
</v-card-text>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import gql from 'graphql-tag'
|
import gql from 'graphql-tag'
|
||||||
|
import ClientsChart from '../../components/charts/ClientsChart.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'AccessPointsStats',
|
name: 'AccessPointsStats',
|
||||||
|
components: {
|
||||||
|
ClientsChart
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
subnet: null,
|
subnet: null,
|
||||||
minutesIn: 1440,
|
minutesIn: 720,
|
||||||
minutesInItems: [
|
minutesInItems: [
|
||||||
{
|
{
|
||||||
text: 'Última hora',
|
text: 'Última hora',
|
||||||
|
@ -80,7 +116,6 @@ export default {
|
||||||
'Alfabética',
|
'Alfabética',
|
||||||
'Clientes atualmente',
|
'Clientes atualmente',
|
||||||
'Pico de clientes',
|
'Pico de clientes',
|
||||||
'Menor quantidade de clientes',
|
|
||||||
'Média de clientes'
|
'Média de clientes'
|
||||||
],
|
],
|
||||||
orderBy: 'Pico de clientes'
|
orderBy: 'Pico de clientes'
|
||||||
|
@ -94,6 +129,60 @@ export default {
|
||||||
value: network.shortName
|
value: network.shortName
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
orderedAccessPoints() {
|
||||||
|
const accessPoints = this.accessPoints
|
||||||
|
if (!accessPoints) return []
|
||||||
|
|
||||||
|
const orderBy = this.orderBy
|
||||||
|
|
||||||
|
if (orderBy === 'Alfabética') {
|
||||||
|
return accessPoints.sort((a, b) => {
|
||||||
|
const aName = a.name || a.hostname
|
||||||
|
const bName = b.name || b.hostname
|
||||||
|
return aName.localeCompare(bName)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (orderBy === 'Clientes atualmente') {
|
||||||
|
return accessPoints.sort((a, b) => {
|
||||||
|
const aClients = a.clients || 0
|
||||||
|
const bClients = b.clients || 0
|
||||||
|
return bClients - aClients
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (orderBy === 'Pico de clientes') {
|
||||||
|
return accessPoints.sort((a, b) => {
|
||||||
|
const aStats = a.stats || []
|
||||||
|
const bStats = b.stats || []
|
||||||
|
const aMaxClients = aStats.reduce((max, stat) => {
|
||||||
|
return Math.max(max, stat.clients)
|
||||||
|
}, 0)
|
||||||
|
const bMaxClients = bStats.reduce((max, stat) => {
|
||||||
|
return Math.max(max, stat.clients)
|
||||||
|
}, 0)
|
||||||
|
return bMaxClients - aMaxClients
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (orderBy === 'Média de clientes') {
|
||||||
|
return accessPoints.sort((a, b) => {
|
||||||
|
const aStats = a.stats || []
|
||||||
|
const bStats = b.stats || []
|
||||||
|
const aAvgClients =
|
||||||
|
aStats.reduce((sum, stat) => {
|
||||||
|
return sum + stat.clients
|
||||||
|
}, 0) / aStats.length
|
||||||
|
const bAvgClients =
|
||||||
|
bStats.reduce((sum, stat) => {
|
||||||
|
return sum + stat.clients
|
||||||
|
}, 0) / bStats.length
|
||||||
|
return bAvgClients - aAvgClients
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return accessPoints
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -122,6 +211,9 @@ export default {
|
||||||
`
|
`
|
||||||
},
|
},
|
||||||
accessPoints: {
|
accessPoints: {
|
||||||
|
pollInterval: 10000,
|
||||||
|
debounce: 500,
|
||||||
|
cachePolicy: 'cache-and-network',
|
||||||
skip() {
|
skip() {
|
||||||
return !this.subnet
|
return !this.subnet
|
||||||
},
|
},
|
||||||
|
@ -130,10 +222,14 @@ export default {
|
||||||
accessPoints(networkShortName: $networkShortName) {
|
accessPoints(networkShortName: $networkShortName) {
|
||||||
id
|
id
|
||||||
mac
|
mac
|
||||||
|
name
|
||||||
|
hostname
|
||||||
|
clients
|
||||||
|
local
|
||||||
subnetInfo {
|
subnetInfo {
|
||||||
shortName
|
shortName
|
||||||
}
|
}
|
||||||
stats(minutesIn: $minutesIn) {
|
stats(minutesIn: $minutesIn, take: 64) {
|
||||||
timestamp
|
timestamp
|
||||||
id
|
id
|
||||||
clients
|
clients
|
||||||
|
|
|
@ -26,7 +26,7 @@
|
||||||
<v-progress-linear
|
<v-progress-linear
|
||||||
v-if="$apollo.queries.subnets.loading"
|
v-if="$apollo.queries.subnets.loading"
|
||||||
class="pa-0 ma-0"
|
class="pa-0 ma-0"
|
||||||
:indeterminate="$apollo.queries.subnets.loading"
|
indeterminate
|
||||||
/>
|
/>
|
||||||
</v-expand-transition>
|
</v-expand-transition>
|
||||||
<v-container fluid>
|
<v-container fluid>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user