ÿØÿà JFIF ` ` ÿþ
|
Server : Apache System : Linux cloud.heroica.com.br 4.18.0-553.36.1.el8_10.x86_64 #1 SMP Wed Jan 22 03:07:54 EST 2025 x86_64 User : farolpborg ( 1053) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /lib/python3.6/site-packages/glances/outputs/static/js/components/ |
Upload File : |
<template>
<section id="quicklook" class="plugin">
<div class="cpu-name">
{{ cpu_name }}
</div>
<div class="table">
<div class="table-row" v-if="!args.percpu">
<div class="table-cell text-left">CPU</div>
<div class="table-cell">
<div class="progress">
<div
:class="`progress-bar progress-bar-${getDecoration('cpu')}`"
role="progressbar"
:aria-valuenow="cpu"
aria-valuemin="0"
aria-valuemax="100"
:style="`width: ${cpu}%;`"
>
</div>
</div>
</div>
<div class="table-cell">{{ cpu }}%</div>
</div>
<template v-if="args.percpu">
<div class="table-row" v-for="(percpu, percpuId) in percpus" :key="percpuId">
<div class="table-cell text-left">CPU{{ percpu.number }}</div>
<div class="table-cell">
<div class="progress">
<div
:class="`progress-bar progress-bar-${getDecoration('cpu')}`"
role="progressbar"
:aria-valuenow="percpu.total"
aria-valuemin="0"
aria-valuemax="100"
:style="`width: ${percpu.total}%;`"
>
</div>
</div>
</div>
<div class="table-cell">{{ percpu.total }}%</div>
</div>
</template>
<div class="table-row">
<div class="table-cell text-left">MEM</div>
<div class="table-cell">
<div class="progress">
<div
:class="`progress-bar progress-bar-${getDecoration('mem')}`"
role="progressbar"
:aria-valuenow="mem"
aria-valuemin="0"
aria-valuemax="100"
:style="`width: ${mem}%;`"
>
</div>
</div>
</div>
<div class="table-cell">{{ mem }}%</div>
</div>
<div class="table-row">
<div class="table-cell text-left">SWAP</div>
<div class="table-cell">
<div class="progress">
<div
:class="`progress-bar progress-bar-${getDecoration('swap')}`"
role="progressbar"
:aria-valuenow="swap"
aria-valuemin="0"
aria-valuemax="100"
:style="`width: ${swap}%;`"
>
</div>
</div>
</div>
<div class="table-cell">{{ swap }}%</div>
</div>
</div>
</section>
</template>
<script>
import { store } from '../store.js';
export default {
props: {
data: {
type: Object
}
},
data() {
return {
store
};
},
computed: {
args() {
return this.store.args || {};
},
stats() {
return this.data.stats['quicklook'];
},
view() {
return this.data.views['quicklook'];
},
mem() {
return this.stats.mem;
},
cpu() {
return this.stats.cpu;
},
cpu_name() {
return this.stats.cpu_name;
},
cpu_hz_current() {
return this.stats.cpu_hz_current;
},
cpu_hz() {
return this.stats.cpu_hz;
},
swap() {
return this.stats.swap;
},
percpus() {
return this.stats.percpu.map(({ cpu_number: number, total }) => ({
number,
total
}));
}
},
methods: {
getDecoration(value) {
if (this.view[value] === undefined) {
return;
}
return this.view[value].decoration.toLowerCase();
}
}
};
</script>