Toner levels
This commit is contained in:
parent
410555a40f
commit
73799af53f
|
@ -1,9 +1,8 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<link rel="icon" href="/favicon.png" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Vuetify 3</title>
|
<title>Vuetify 3</title>
|
||||||
</head>
|
</head>
|
||||||
|
@ -12,5 +11,4 @@
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<script type="module" src="/src/main.ts"></script>
|
<script type="module" src="/src/main.ts"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 15 KiB |
BIN
web/public/favicon.png
Normal file
BIN
web/public/favicon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 3.7 KiB |
|
@ -7,18 +7,10 @@
|
||||||
<div>
|
<div>
|
||||||
<v-list density="compact">
|
<v-list density="compact">
|
||||||
<v-list-item>
|
<v-list-item>
|
||||||
<template v-slot:prepend>
|
|
||||||
<v-icon icon="mdi-printer"></v-icon>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<v-list-item-title>{{ printer.serialNumber }}</v-list-item-title>
|
<v-list-item-title>{{ printer.serialNumber }}</v-list-item-title>
|
||||||
<v-list-item-subtitle>{{ printer.model }}</v-list-item-subtitle>
|
<v-list-item-subtitle>{{ printer.model }}</v-list-item-subtitle>
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
<v-list-item>
|
<v-list-item>
|
||||||
<template v-slot:prepend>
|
|
||||||
<v-icon icon="mdi-map"></v-icon>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<v-list-item-title>
|
<v-list-item-title>
|
||||||
{{ printer.location || '-' }}
|
{{ printer.location || '-' }}
|
||||||
</v-list-item-title>
|
</v-list-item-title>
|
||||||
|
@ -27,9 +19,14 @@
|
||||||
</v-list-item-subtitle>
|
</v-list-item-subtitle>
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
<v-list-item>
|
<v-list-item>
|
||||||
<template v-slot:prepend>
|
<v-list-item-title>
|
||||||
<v-icon icon="mdi-clock"></v-icon>
|
{{
|
||||||
</template>
|
new Intl.NumberFormat('pt-BR').format(printer.status[0].counter)
|
||||||
|
}}
|
||||||
|
</v-list-item-title>
|
||||||
|
<v-list-item-subtitle>Contador</v-list-item-subtitle>
|
||||||
|
</v-list-item>
|
||||||
|
<v-list-item>
|
||||||
<v-list-item-title>
|
<v-list-item-title>
|
||||||
{{ new Date(printer.updatedAt).toLocaleString() }}
|
{{ new Date(printer.updatedAt).toLocaleString() }}
|
||||||
</v-list-item-title>
|
</v-list-item-title>
|
||||||
|
@ -39,18 +36,19 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-grow-1">
|
<div class="flex-grow-1">
|
||||||
<v-list density="compact">
|
<v-list density="compact">
|
||||||
<v-list-subheader>Toner</v-list-subheader>
|
|
||||||
<v-list-item>
|
<v-list-item>
|
||||||
<v-list-item-title>
|
<v-list-item-title>
|
||||||
<v-progress-linear
|
<v-progress-linear
|
||||||
:title="`${printer.status[0].tonerBlackLevel}%`"
|
:title="`${printer.status[0].tonerBlackLevel}%`"
|
||||||
class="mb-1"
|
class="mb-1"
|
||||||
height="5"
|
height="6"
|
||||||
|
color="black"
|
||||||
:model-value="printer.status[0].tonerBlackLevel"
|
:model-value="printer.status[0].tonerBlackLevel"
|
||||||
/>
|
></v-progress-linear>
|
||||||
</v-list-item-title>
|
</v-list-item-title>
|
||||||
<v-list-item-subtitle>
|
<v-list-item-subtitle>
|
||||||
{{ printer.blackTonerModel }}
|
{{ printer.blackTonerModel }}
|
||||||
|
|
||||||
<v-chip
|
<v-chip
|
||||||
size="x-small"
|
size="x-small"
|
||||||
title="Nível do toner"
|
title="Nível do toner"
|
||||||
|
@ -67,12 +65,88 @@
|
||||||
</v-chip>
|
</v-chip>
|
||||||
</v-list-item-subtitle>
|
</v-list-item-subtitle>
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
<v-list-item>
|
<v-list-item v-if="printer.status[0].tonerCyanLevel">
|
||||||
<v-list-item-title>
|
<v-list-item-title>
|
||||||
{{ printer.location || '-' }}
|
<v-progress-linear
|
||||||
|
:title="`${printer.status[0].tonerCyanLevel}%`"
|
||||||
|
class="mb-1"
|
||||||
|
height="6"
|
||||||
|
:model-value="printer.status[0].tonerCyanLevel"
|
||||||
|
color="cyan"
|
||||||
|
/>
|
||||||
</v-list-item-title>
|
</v-list-item-title>
|
||||||
<v-list-item-subtitle>
|
<v-list-item-subtitle>
|
||||||
{{ printer.ip }} ({{ printer.network.name }})
|
{{ printer.cyanTonerModel }}
|
||||||
|
<v-chip
|
||||||
|
size="x-small"
|
||||||
|
title="Nível do toner"
|
||||||
|
variant="tonal"
|
||||||
|
:color="
|
||||||
|
printer.status[0].tonerCyanLevel < 10
|
||||||
|
? 'error'
|
||||||
|
: printer.status[0].tonerCyanLevel < 20
|
||||||
|
? 'warning'
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ printer.status[0].tonerCyanLevel }}%
|
||||||
|
</v-chip>
|
||||||
|
</v-list-item-subtitle>
|
||||||
|
</v-list-item>
|
||||||
|
<v-list-item v-if="printer.status[0].tonerMagentaLevel">
|
||||||
|
<v-list-item-title>
|
||||||
|
<v-progress-linear
|
||||||
|
:title="`${printer.status[0].tonerMagentaLevel}%`"
|
||||||
|
class="mb-1"
|
||||||
|
height="6"
|
||||||
|
:model-value="printer.status[0].tonerMagentaLevel"
|
||||||
|
color="pink"
|
||||||
|
/>
|
||||||
|
</v-list-item-title>
|
||||||
|
<v-list-item-subtitle>
|
||||||
|
{{ printer.magentaTonerModel }}
|
||||||
|
<v-chip
|
||||||
|
size="x-small"
|
||||||
|
title="Nível do toner"
|
||||||
|
variant="tonal"
|
||||||
|
:color="
|
||||||
|
printer.status[0].tonerMagentaLevel < 10
|
||||||
|
? 'error'
|
||||||
|
: printer.status[0].tonerMagentaLevel < 20
|
||||||
|
? 'warning'
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ printer.status[0].tonerMagentaLevel }}%
|
||||||
|
</v-chip>
|
||||||
|
</v-list-item-subtitle>
|
||||||
|
</v-list-item>
|
||||||
|
<v-list-item v-if="printer.status[0].tonerYellowLevel">
|
||||||
|
<v-list-item-title>
|
||||||
|
<v-progress-linear
|
||||||
|
:title="`${printer.status[0].tonerYellowLevel}%`"
|
||||||
|
class="mb-1"
|
||||||
|
height="6"
|
||||||
|
:model-value="printer.status[0].tonerYellowLevel"
|
||||||
|
color="yellow darken-3"
|
||||||
|
/>
|
||||||
|
</v-list-item-title>
|
||||||
|
<v-list-item-subtitle>
|
||||||
|
{{ printer.yellowTonerModel }}
|
||||||
|
<v-chip
|
||||||
|
size="x-small"
|
||||||
|
title="Nível do toner"
|
||||||
|
variant="tonal"
|
||||||
|
:color="
|
||||||
|
printer.status[0].tonerYellowLevel < 10
|
||||||
|
? 'error'
|
||||||
|
: printer.status[0].tonerYellowLevel < 20
|
||||||
|
? 'warning'
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ printer.status[0].tonerYellowLevel }}%
|
||||||
|
</v-chip>
|
||||||
</v-list-item-subtitle>
|
</v-list-item-subtitle>
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
</v-list>
|
</v-list>
|
||||||
|
|
|
@ -1,5 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<v-app>
|
<v-app>
|
||||||
|
<v-progress-linear
|
||||||
|
v-if="appStore.loadingPrinters"
|
||||||
|
style="position: fixed; z-index: 9999"
|
||||||
|
color="primary"
|
||||||
|
indeterminate
|
||||||
|
/>
|
||||||
<v-app-bar :elevation="0">
|
<v-app-bar :elevation="0">
|
||||||
<v-text-field
|
<v-text-field
|
||||||
class="ml-2"
|
class="ml-2"
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<v-container fluid>
|
<v-container fluid>
|
||||||
<v-row>
|
<v-row>
|
||||||
<v-col cols="12" v-for="printer in appStore.printers" :key="printer.id">
|
<v-col cols="6" v-for="printer in appStore.printers" :key="printer.id">
|
||||||
<printer-card :printer="printer" />
|
<printer-card :printer="printer" />
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user