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",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "ifms-pti-svr",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@prisma/client": "^4.7.1",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "ifms-pti-svr",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"description": "Servidor do Portal de TI do IFMS",
|
||||
"main": "src/index.js",
|
||||
"prisma": {
|
||||
|
|
4
web/package-lock.json
generated
4
web/package-lock.json
generated
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "ifms-pti",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "ifms-pti",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"dependencies": {
|
||||
"@mdi/font": "^6.9.96",
|
||||
"apollo-link-ws": "^1.0.20",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "ifms-pti",
|
||||
"version": "3.4.9",
|
||||
"version": "3.5.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
|
|
|
@ -33,19 +33,55 @@
|
|||
prepend-inner-icon="mdi-timer-outline"
|
||||
/>
|
||||
</v-toolbar>
|
||||
|
||||
{{ accessPoints }}
|
||||
<v-expand-transition>
|
||||
<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>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import gql from 'graphql-tag'
|
||||
import ClientsChart from '../../components/charts/ClientsChart.vue'
|
||||
|
||||
export default {
|
||||
name: 'AccessPointsStats',
|
||||
components: {
|
||||
ClientsChart
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
subnet: null,
|
||||
minutesIn: 1440,
|
||||
minutesIn: 720,
|
||||
minutesInItems: [
|
||||
{
|
||||
text: 'Última hora',
|
||||
|
@ -80,7 +116,6 @@ export default {
|
|||
'Alfabética',
|
||||
'Clientes atualmente',
|
||||
'Pico de clientes',
|
||||
'Menor quantidade de clientes',
|
||||
'Média de clientes'
|
||||
],
|
||||
orderBy: 'Pico de clientes'
|
||||
|
@ -94,6 +129,60 @@ export default {
|
|||
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: {
|
||||
pollInterval: 10000,
|
||||
debounce: 500,
|
||||
cachePolicy: 'cache-and-network',
|
||||
skip() {
|
||||
return !this.subnet
|
||||
},
|
||||
|
@ -130,10 +222,14 @@ export default {
|
|||
accessPoints(networkShortName: $networkShortName) {
|
||||
id
|
||||
mac
|
||||
name
|
||||
hostname
|
||||
clients
|
||||
local
|
||||
subnetInfo {
|
||||
shortName
|
||||
}
|
||||
stats(minutesIn: $minutesIn) {
|
||||
stats(minutesIn: $minutesIn, take: 64) {
|
||||
timestamp
|
||||
id
|
||||
clients
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
<v-progress-linear
|
||||
v-if="$apollo.queries.subnets.loading"
|
||||
class="pa-0 ma-0"
|
||||
:indeterminate="$apollo.queries.subnets.loading"
|
||||
indeterminate
|
||||
/>
|
||||
</v-expand-transition>
|
||||
<v-container fluid>
|
||||
|
|
Loading…
Reference in New Issue
Block a user