Layout updates
This commit is contained in:
Douglas Barone
parent
dcbac7f2c7
commit
ad3c6f05a3
|
|
@ -47,11 +47,11 @@
|
|||
<v-list-item-title> {{ item.title }} </v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
|
||||
<v-divider />
|
||||
<v-card-actions>
|
||||
<ThemeToggleBtn />
|
||||
<v-spacer />
|
||||
<v-btn color="error darken-2" depressed @click="doLogout">
|
||||
<v-btn text depressed @click="doLogout">
|
||||
<v-icon left>mdi-logout</v-icon> Sair
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@
|
|||
<transition-group
|
||||
name="scale-transition"
|
||||
tag="div"
|
||||
class="d-flex flex-wrap"
|
||||
class="d-flex flex-wrap mx-n2"
|
||||
mode="out-in"
|
||||
>
|
||||
<v-col
|
||||
v-for="userPresence in userPresences"
|
||||
|
|
@ -108,7 +109,7 @@ export default {
|
|||
<style scoped lang="scss">
|
||||
.border-highlight {
|
||||
box-shadow: 1.5px 1.5px 12px rgba(0, 0, 0, 0.05);
|
||||
border-left: 3px solid grey;
|
||||
border-left: 4px solid grey;
|
||||
}
|
||||
.online {
|
||||
border-left-color: #4caf50;
|
||||
|
|
|
|||
|
|
@ -28,11 +28,9 @@
|
|||
</v-app-bar>
|
||||
|
||||
<v-main>
|
||||
<v-container>
|
||||
<v-slide-x-transition hide-on-leave>
|
||||
<router-view />
|
||||
</v-slide-x-transition>
|
||||
</v-container>
|
||||
</v-main>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
//.theme--light .gradient-bg,
|
||||
//.theme--light .primary {
|
||||
// .theme--light .gradient-bg,
|
||||
// .theme--light .primary {
|
||||
// background-color: #3fa14c;
|
||||
// background-image: linear-gradient(
|
||||
// 45deg,
|
||||
|
|
@ -7,10 +7,10 @@
|
|||
// #3ecf51 60%,
|
||||
// #39e650 100%
|
||||
// );
|
||||
//}
|
||||
//
|
||||
//.theme--dark .gradient-bg,
|
||||
//.theme--dark .primary {
|
||||
// }
|
||||
|
||||
// .theme--dark .gradient-bg,
|
||||
// .theme--dark .primary {
|
||||
// background-color: #174a63;
|
||||
// background-image: linear-gradient(
|
||||
// 45deg,
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
// #457099 60%,
|
||||
// #4762b3 100%
|
||||
// );
|
||||
//}
|
||||
// }
|
||||
|
||||
// .theme--light.v-application {
|
||||
// background: #f5f5f5;
|
||||
|
|
@ -27,3 +27,7 @@
|
|||
// .theme--dark.v-application {
|
||||
// background: #313233;
|
||||
// }
|
||||
|
||||
.bottom-border {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<v-container fluid class="mb-12">
|
||||
<div>
|
||||
<v-toolbar height="100" class="align-content-center bottom-border" flat>
|
||||
<v-text-field
|
||||
v-model="search"
|
||||
:loading="$apollo.queries.userPresence.loading"
|
||||
|
|
@ -9,16 +10,26 @@
|
|||
prepend-icon="mdi-account-search"
|
||||
clearable
|
||||
filled
|
||||
style="max-width: 400px"
|
||||
style="max-width: 512px"
|
||||
>
|
||||
<v-progress-circular
|
||||
v-if="$apollo.queries.userPresence.loading"
|
||||
slot="prepend"
|
||||
color="grey"
|
||||
class="pa-0 ma-0"
|
||||
:width="2"
|
||||
:size="24"
|
||||
indeterminate
|
||||
/>
|
||||
|
||||
<div v-if="stats" class="text-center mb-6 mt-0">
|
||||
</v-text-field>
|
||||
</v-toolbar>
|
||||
<v-container fluid class="mb-12">
|
||||
<div v-if="stats" class="text-center my-4">
|
||||
<v-chip color="green" class="mr-2" dark>
|
||||
{{ stats.onlineUsers }}
|
||||
</v-chip>
|
||||
usuários online.
|
||||
</div>
|
||||
|
||||
<UserPresenceStatusList
|
||||
:user-presences="pagedUserPresences"
|
||||
:loading="$apollo.queries.userPresence.loading && !userPresence"
|
||||
|
|
@ -50,9 +61,9 @@
|
|||
dark
|
||||
>
|
||||
A lista de pessoas mostrada aqui é obtida através do uso da rede
|
||||
<strong>Wi-Fi</strong> Este método não é preciso, podendo não indicar
|
||||
alguém presente ou indicar alguém que deixou um dispositivo no campus.
|
||||
Use esta lista com a <strong>devida cautela</strong>.
|
||||
<strong>Wi-Fi</strong> Este método não é preciso, podendo não
|
||||
indicar alguém presente ou indicar alguém que deixou um dispositivo
|
||||
no campus. Use esta lista com a <strong>devida cautela</strong>.
|
||||
</v-alert>
|
||||
</v-col>
|
||||
|
||||
|
|
@ -70,6 +81,7 @@
|
|||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -1,22 +1,24 @@
|
|||
<template>
|
||||
<v-container fluid>
|
||||
<v-toolbar flat class="mb-2 pt-3">
|
||||
<div>
|
||||
<v-toolbar height="100" class="align-content-center bottom-border" flat>
|
||||
<v-text-field
|
||||
v-model="search"
|
||||
prepend-inner-icon="mdi-cellphone"
|
||||
rounded
|
||||
outlined
|
||||
dense
|
||||
label="Buscar"
|
||||
hint="MAC, IP, Usuário"
|
||||
:loading="$apollo.queries.wifiDevices.loading"
|
||||
class="mt-6 search"
|
||||
label="Pesquisar"
|
||||
hint="MAC/IP/Usuário"
|
||||
prepend-icon="mdi-cellphone"
|
||||
clearable
|
||||
filled
|
||||
style="max-width: 512px"
|
||||
/>
|
||||
|
||||
<v-tooltip bottom>
|
||||
<span>Atualizar</span>
|
||||
<template #activator="{ on }">
|
||||
<v-btn
|
||||
class="ml-2 mb-6"
|
||||
class="ml-2"
|
||||
:loading="$apollo.queries.wifiDevices.loading"
|
||||
color="primary"
|
||||
icon
|
||||
large
|
||||
v-on="on"
|
||||
|
|
@ -27,7 +29,8 @@
|
|||
</template>
|
||||
</v-tooltip>
|
||||
</v-toolbar>
|
||||
<div v-if="stats" class="text-center mb-6 mt-0">
|
||||
<v-container fluid>
|
||||
<div v-if="stats" class="text-center my-4">
|
||||
<v-chip color="green" class="mr-1" dark>
|
||||
{{
|
||||
wifiDevices && wifiDevices.filter(device => device.isOnline).length
|
||||
|
|
@ -193,6 +196,7 @@
|
|||
</template>
|
||||
</v-data-iterator>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -1,22 +1,24 @@
|
|||
<template>
|
||||
<v-container fluid>
|
||||
<v-toolbar flat class="mb-2 pt-3">
|
||||
<div>
|
||||
<v-toolbar height="100" class="align-content-center bottom-border" flat>
|
||||
<v-text-field
|
||||
v-model="search"
|
||||
prepend-inner-icon="mdi-account"
|
||||
rounded
|
||||
outlined
|
||||
label="Buscar"
|
||||
hint="Nome, conta"
|
||||
dense
|
||||
:loading="$apollo.queries.wifiUsers.loading"
|
||||
class="mt-6 search"
|
||||
label="Pesquisar"
|
||||
hint="Nome/conta"
|
||||
prepend-icon="mdi-account-search"
|
||||
clearable
|
||||
filled
|
||||
style="max-width: 512px"
|
||||
/>
|
||||
|
||||
<v-tooltip bottom>
|
||||
<span>Atualizar</span>
|
||||
<template #activator="{ on }">
|
||||
<v-btn
|
||||
class="ml-2 mb-6"
|
||||
class="ml-2"
|
||||
:loading="$apollo.queries.wifiUsers.loading"
|
||||
color="primary"
|
||||
icon
|
||||
large
|
||||
v-on="on"
|
||||
|
|
@ -27,7 +29,8 @@
|
|||
</template>
|
||||
</v-tooltip>
|
||||
</v-toolbar>
|
||||
<div v-if="stats" class="text-center mb-6 mt-0">
|
||||
<v-container fluid>
|
||||
<div v-if="stats" class="text-center my-4">
|
||||
<v-chip color="green" class="mr-2" dark>
|
||||
{{ stats.onlineUsers }}
|
||||
</v-chip>
|
||||
|
|
@ -194,6 +197,7 @@
|
|||
</template>
|
||||
</v-data-iterator>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import gql from 'graphql-tag'
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user