Better filtering

This commit is contained in:
Douglas Barone 2022-04-07 08:11:48 -04:00
parent cf76272456
commit 61825de579
10 changed files with 397 additions and 367 deletions

View File

@ -1,12 +1,12 @@
{
"name": "ifms-pti-svr",
"version": "2.12.4",
"version": "2.12.5",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "ifms-pti-svr",
"version": "2.12.4",
"version": "2.12.5",
"license": "ISC",
"dependencies": {
"@prisma/client": "^3.11.0",

View File

@ -1,6 +1,6 @@
{
"name": "ifms-pti-svr",
"version": "2.12.4",
"version": "2.12.5",
"description": "Servidor do Portal de TI do IFMS",
"main": "src/index.js",
"scripts": {

View File

@ -1,6 +1,6 @@
import prisma from '../../prisma'
export async function wifiDevices(_, { take = 100, skip = 0, search }) {
export async function wifiDevices(parent, { take = 100, skip = 0, search }) {
const mode = 'insensitive'
if (search === null)

View File

@ -1,15 +1,44 @@
import prisma from '../../prisma'
// TODO: Add filtering
export async function wifiUsers() {
const wifiUsers = await prisma.user.findMany({
where: { wifiDevices: { some: { id: { not: undefined } } } },
include: { wifiDevices: true }
})
export async function wifiUsers(parent, { take = 100, skip = 0, search }) {
const mode = 'insensitive'
return wifiUsers.sort(
(a, b) =>
b.wifiDevices.filter(device => device.status == 'ONLINE').length -
a.wifiDevices.filter(device => device.status == 'ONLINE').length
)
if (search === null)
search = undefined
return prisma.user.findMany({
where: {
AND: [
{ wifiDevices: { some: { id: { not: undefined } } } },
{
OR: [
{ wifiDevices: { some: { hostname: { contains: search, mode } } } },
{
wifiDevices: {
some: {
accessPoint: {
OR: [
{ name: { contains: search, mode } },
{ local: { contains: search, mode } },
]
}
}
}
},
{ wifiDevices: { some: { mac: { contains: search, mode } } } },
{ wifiDevices: { some: { ip: { contains: search, mode } } } },
{ displayName: { contains: search, mode } }, ,
{ sAMAccountName: { contains: search, mode } },
]
}
]
},
include: { wifiDevices: true },
orderBy: [
{ wifiDevices: { _count: 'desc' } },
{ displayName: 'asc' }],
take,
skip
})
}

View File

@ -41,7 +41,10 @@ const typeDefs = gql`
): [WifiDevice]! @auth(roles: ["superAdmin"])
"Users that uses the Wi-Fi"
wifiUsers: [User]! @auth(roles: ["superAdmin"])
wifiUsers(
search: String = ""
take: Int
skip: Int): [User]! @auth(roles: ["superAdmin"])
"Application Logs"
logs(

4
web/package-lock.json generated
View File

@ -1,12 +1,12 @@
{
"name": "ifms-pti",
"version": "2.12.4",
"version": "2.12.5",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "ifms-pti",
"version": "2.12.4",
"version": "2.12.5",
"dependencies": {
"@mdi/font": "^6.6.96",
"apollo-link-ws": "^1.0.20",

View File

@ -1,6 +1,6 @@
{
"name": "ifms-pti",
"version": "2.12.4",
"version": "2.12.5",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",

View File

@ -59,18 +59,18 @@ export default {
route: { name: 'wifi-devices' },
role: 'superAdmin'
},
{
title: 'Access Points',
icon: 'mdi-access-point',
route: { name: 'access-points' },
role: 'superAdmin'
},
{
title: 'Usuários Wi-Fi',
icon: 'mdi-account-voice',
route: { name: 'wifi-users' },
role: 'superAdmin'
},
{
title: 'Access Points',
icon: 'mdi-access-point',
route: { name: 'access-points' },
role: 'superAdmin'
},
{
title: 'Inspecionar Usuário',
icon: 'mdi-account-search',

View File

@ -1,16 +1,12 @@
<template>
<div>
<v-toolbar height="115" class="align-content-center bottom-border" flat>
<v-container fluid>
<v-toolbar class="mb-2" flat outlined>
<v-text-field
v-model="search"
class="mt-6 search"
label="Pesquisar"
hint="MAC/IP/Usuário"
prepend-icon="mdi-magnify"
prepend-inner-icon="mdi-account-search"
clearable
outlined
rounded
style="max-width: 512px"
hide-details
/>
<v-tooltip bottom>
@ -29,171 +25,172 @@
</template>
</v-tooltip>
</v-toolbar>
<v-container fluid>
<div v-if="wifiDevices && stats" class="text-center my-4">
<v-chip color="primary" class="mr-1" dark>
{{ stats.onlineWifiDevices }}
</v-chip>
online de
<v-chip class="mx-1">
{{ stats.totalWifiDevices }}
</v-chip>
no total.
</div>
<v-data-iterator
:items="computedWifiDevices"
:items-per-page.sync="itemsPerPage"
:page="page"
:loading="$apollo.queries.wifiDevices.loading"
>
<template #default="{ items }">
<v-expansion-panels multiple>
<v-expansion-panel v-for="device in items" :key="device.mac">
<v-expansion-panel-header>
<v-row dense align-content="center" no-gutters>
<v-col class="shrink" align-self="center">
<v-badge
:color="device.status == 'ONLINE' ? 'green' : 'grey'"
left
offset-y="16"
dot
>
<ap-icon class="mr-4" :controller="device.controller" />
</v-badge>
</v-col>
<v-col align-self="center" cols="3">
{{ device.hostname }}
</v-col>
<v-col
v-if="$vuetify.breakpoint.mdAndUp"
cols="2"
class="grow"
>{{ device.ip }}</v-col
<div v-if="wifiDevices && stats" class="text-center my-4">
<v-chip color="primary" class="mr-1" dark>
{{ stats.onlineWifiDevices }}
</v-chip>
online de
<v-chip class="mx-1">
{{ stats.totalWifiDevices }}
</v-chip>
no total.
</div>
<v-data-iterator
:items="computedWifiDevices"
:items-per-page.sync="itemsPerPage"
:page="page"
:loading="$apollo.queries.wifiDevices.loading"
>
<template #default="{ items }">
<v-expansion-panels multiple>
<v-expansion-panel v-for="device in items" :key="device.mac">
<v-expansion-panel-header>
<v-row dense align-content="center" no-gutters>
<v-col class="shrink" align-self="center">
<v-badge
:color="device.status == 'ONLINE' ? 'green' : 'grey'"
left
offset-y="16"
dot
>
<v-col v-if="$vuetify.breakpoint.mdAndUp" class="grow">
<div>
<avatar left size="24px" :src="device.thumbnailPhoto" />{{
device.displayName
}}
</div>
</v-col>
</v-row>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-list dense>
<v-list-item v-if="device.status == 'ONLINE'">
<v-list-item-action>
<v-icon color="green darken-1">mdi-wifi</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle> SSID </v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<ap-icon class="mr-4" :controller="device.controller" />
</v-badge>
</v-col>
<v-col align-self="center" cols="3">
{{ device.hostname }}
</v-col>
<v-col
v-if="$vuetify.breakpoint.mdAndUp"
cols="2"
class="grow"
>{{ device.ip }}</v-col
>
<v-col v-if="$vuetify.breakpoint.mdAndUp" class="grow">
<div>
<avatar left size="24px" :src="device.thumbnailPhoto" />{{
device.displayName
}}
</div>
</v-col>
</v-row>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-list dense>
<v-list-item v-if="device.status == 'ONLINE'">
<v-list-item-action>
<v-icon color="green darken-1">mdi-wifi</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle> SSID </v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item v-else>
<v-list-item-action>
<v-icon>mdi-wifi-off</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle>
Dispositivo off-line
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item v-else>
<v-list-item-action>
<v-icon>mdi-wifi-off</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle>
Dispositivo off-line
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-access-point</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.apName }}
</v-list-item-title>
<v-list-item-subtitle>
Access Point ({{ device.controller }})
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-access-point</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.apName }}
</v-list-item-title>
<v-list-item-subtitle>
Access Point ({{ device.controller }})
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-ip-network</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.ip }}
</v-list-item-title>
<v-list-item-subtitle>
Último endereço IP conhecido
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-expansion-card-variant</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.mac }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.oui }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-eye</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.lastSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela última vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-check-decagram</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.firstSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela primeira vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<Avatar :src="device.thumbnailPhoto" size="24px" />
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.displayName }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.sAMAccountName }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</template>
</v-data-iterator>
</v-container>
</div>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-ip-network</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.ip }}
</v-list-item-title>
<v-list-item-subtitle>
Último endereço IP conhecido
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-expansion-card-variant</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.mac }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.oui }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-eye</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.lastSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela última vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-check-decagram</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.firstSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela primeira vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<Avatar :src="device.thumbnailPhoto" size="24px" />
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.displayName }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.sAMAccountName }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</template>
</v-data-iterator>
<v-alert type="info" outlined dismissible>
São exibidos apenas os 100 primeiros resultados da pesquisa
</v-alert>
</v-container>
</template>
<script>

View File

@ -1,16 +1,12 @@
<template>
<div>
<v-toolbar height="115" class="align-content-center bottom-border" flat>
<v-container fluid>
<v-toolbar class="mb-2" flat outlined>
<v-text-field
v-model="search"
class="mt-6 search"
label="Pesquisar"
hint="Nome/conta"
prepend-icon="mdi-account-search"
prepend-inner-icon="mdi-account-search"
clearable
outlined
rounded
style="max-width: 512px"
hide-details
/>
<v-tooltip bottom>
@ -29,178 +25,178 @@
</template>
</v-tooltip>
</v-toolbar>
<v-container fluid>
<div v-if="stats" class="text-center my-4">
<v-chip color="primary" class="mr-2" dark>
{{ stats.onlineUsers }}
</v-chip>
usuários online de
<v-chip class="ml-2">
{{ stats.totalUsers }}
</v-chip>
</div>
<v-data-iterator
:items="sortedWifiUsers"
:loading="$apollo.queries.wifiUsers.loading"
:search="search"
>
<template #default="{ items }">
<v-expansion-panels>
<v-expansion-panel v-for="user in items" :key="user.sAMAccountName">
<v-expansion-panel-header>
<div style="width: 50px">
<avatar size="24" left :src="user.thumbnailPhoto" />
{{ user.displayName }} ({{ user.sAMAccountName }})
</div>
<template #actions>
<div v-if="stats" class="text-center my-4">
<v-chip color="primary" class="mr-2" dark>
{{ stats.onlineUsers }}
</v-chip>
usuários online de
<v-chip class="ml-2">
{{ stats.totalUsers }}
</v-chip>
</div>
<v-data-iterator
:items="sortedWifiUsers"
:loading="$apollo.queries.wifiUsers.loading"
>
<template #default="{ items }">
<v-expansion-panels>
<v-expansion-panel v-for="user in items" :key="user.sAMAccountName">
<v-expansion-panel-header>
<div style="width: 50px">
<avatar size="24" left :src="user.thumbnailPhoto" />
{{ user.displayName }} ({{ user.sAMAccountName }})
</div>
<template #actions>
<v-badge
class="mx-4"
color="grey darken-1"
bottom
offset-y="10"
:content="
user.wifiDevices
.filter(wifiDevice => wifiDevice.status != 'ONLINE')
.length.toString()
"
>
<v-badge
class="mx-4"
color="grey darken-1"
bottom
color="green darken-1"
top
offset-y="10"
:content="
user.wifiDevices
.filter(wifiDevice => wifiDevice.status != 'ONLINE')
.filter(wifiDevice => wifiDevice.status == 'ONLINE')
.length.toString()
"
>
<v-badge
color="green darken-1"
top
offset-y="10"
:content="
user.wifiDevices
.filter(wifiDevice => wifiDevice.status == 'ONLINE')
.length.toString()
"
>
<v-icon>mdi-cellphone-wireless</v-icon>
</v-badge>
<v-icon>mdi-cellphone-wireless</v-icon>
</v-badge>
</template>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panels accordion>
<v-expansion-panel
v-for="device in user.wifiDevices"
:key="device.mac"
</v-badge>
</template>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panels accordion>
<v-expansion-panel
v-for="device in user.wifiDevices"
:key="device.mac"
>
<v-expansion-panel-header>
<div>
<v-icon
left
:color="device.status == 'ONLINE' ? 'green' : ''"
>
mdi-cellphone-wireless
</v-icon>
{{ device.hostname || device.mac }} {{ device.oui }}
</div>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-list dense>
<v-list-item v-if="device.status == 'ONLINE'">
<v-list-item-action>
<v-icon color="green darken-1">mdi-wifi</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle> SSID </v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item v-else>
<v-list-item-action>
<v-icon>mdi-wifi-off</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle>
Dispositivo off-line
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-access-point</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.apName }}
</v-list-item-title>
<v-list-item-subtitle>
Access Point ({{ device.controller }})
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-ip-network</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.ip }}
</v-list-item-title>
<v-list-item-subtitle>
Último endereço IP conhecido
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-expansion-card-variant</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.mac }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.oui }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-eye</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.lastSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela última vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-check-decagram</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.firstSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela primeira vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list></v-expansion-panel-content
>
<v-expansion-panel-header>
<div>
<v-icon
left
:color="device.status == 'ONLINE' ? 'green' : ''"
>
mdi-cellphone-wireless
</v-icon>
{{ device.hostname || device.mac }} {{ device.oui }}
</div>
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-list dense>
<v-list-item v-if="device.status == 'ONLINE'">
<v-list-item-action>
<v-icon color="green darken-1">mdi-wifi</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle> SSID </v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item v-else>
<v-list-item-action>
<v-icon>mdi-wifi-off</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.essid }}
</v-list-item-title>
<v-list-item-subtitle>
Dispositivo off-line
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-access-point</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.apName }}
</v-list-item-title>
<v-list-item-subtitle>
Access Point ({{ device.controller }})
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-ip-network</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.ip }}
</v-list-item-title>
<v-list-item-subtitle>
Último endereço IP conhecido
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-expansion-card-variant</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.mac }}
</v-list-item-title>
<v-list-item-subtitle>
{{ device.oui }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-eye</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.lastSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela última vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-check-decagram</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ device.firstSeen | dateAndTime }}
</v-list-item-title>
<v-list-item-subtitle>
Visto pela primeira vez
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-list></v-expansion-panel-content
>
</v-expansion-panel>
</v-expansion-panels>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</template>
</v-data-iterator>
</v-container>
</div>
</v-expansion-panel>
</v-expansion-panels>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</template>
</v-data-iterator>
<v-alert type="info" outlined dismissible>
São exibidos apenas os 100 primeiros resultados da pesquisa
</v-alert>
</v-container>
</template>
<script>
import gql from 'graphql-tag'
@ -225,8 +221,8 @@ export default {
wifiUsers: {
fetchPolicy: 'cache-and-network',
query: gql`
query {
wifiUsers {
query wifiUsers($search: String) {
wifiUsers(search: $search) {
displayName
sAMAccountName
thumbnailPhoto
@ -244,7 +240,12 @@ export default {
}
}
}
`
`,
variables() {
return {
search: this.search
}
}
},
stats: {
query: gql`