You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
96 lines
2.3 KiB
Vue
96 lines
2.3 KiB
Vue
<template>
|
|
<v-card outlined>
|
|
<v-list-item>
|
|
<v-list-item-icon class="mr-3">
|
|
<v-icon>{{ stats.wifi.rssi | wifiIcon(stats.wifi.secure) }}</v-icon>
|
|
</v-list-item-icon>
|
|
<v-list-item-content>
|
|
<v-list-item-title>{{ stats.wifi.ssid }}</v-list-item-title>
|
|
</v-list-item-content>
|
|
<v-list-item-avatar>
|
|
<v-avatar
|
|
color="secondary lighten-3"
|
|
size="24"
|
|
>
|
|
<span class="white--text text-h5 text-caption">{{ stats.wifi.channel }}</span>
|
|
</v-avatar>
|
|
</v-list-item-avatar>
|
|
</v-list-item>
|
|
|
|
<v-divider class="mx-4" />
|
|
|
|
<v-list dense>
|
|
<v-list-item
|
|
v-for="key in wifiStats"
|
|
:key="key"
|
|
>
|
|
<v-list-item-title>{{ key }}</v-list-item-title>
|
|
|
|
<v-list-item-subtitle class="text-right">
|
|
{{ stats.wifi[key] }}
|
|
</v-list-item-subtitle>
|
|
</v-list-item>
|
|
</v-list>
|
|
|
|
<v-list-item>
|
|
<v-list-item-icon class="mr-3">
|
|
<v-icon>$storage</v-icon>
|
|
</v-list-item-icon>
|
|
<v-list-item-content>
|
|
<v-list-item-title>i8n:Storage</v-list-item-title>
|
|
</v-list-item-content>
|
|
<v-list-item-avatar>
|
|
<v-progress-circular
|
|
:rotate="-90"
|
|
:value="fsUsage"
|
|
class="text-caption"
|
|
>
|
|
{{ fsUsage }}
|
|
</v-progress-circular>
|
|
</v-list-item-avatar>
|
|
</v-list-item>
|
|
|
|
<v-divider class="mx-4" />
|
|
|
|
<v-list
|
|
dense
|
|
class="pb-0"
|
|
>
|
|
<v-list-item>
|
|
<v-list-item-title>Total</v-list-item-title>
|
|
<v-list-item-subtitle class="text-right">
|
|
{{ fs.total | prettyBytes }}
|
|
</v-list-item-subtitle>
|
|
</v-list-item>
|
|
|
|
<v-list-item>
|
|
<v-list-item-title>Free</v-list-item-title>
|
|
<v-list-item-subtitle class="text-right">
|
|
{{ fs.free | prettyBytes }}
|
|
</v-list-item-subtitle>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-card>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data: () => ({
|
|
wifiStats: ['ip', 'gateway', 'dns', 'mac'],
|
|
}),
|
|
computed: {
|
|
stats () {
|
|
return this.$root._data.stats
|
|
},
|
|
fsUsage () {
|
|
return Math.round(
|
|
(100 / this.stats.device.fs.total) * this.stats.device.fs.used,
|
|
)
|
|
},
|
|
fs () {
|
|
return this.stats.device.fs
|
|
},
|
|
},
|
|
}
|
|
</script>
|