This commit is contained in:
2022-09-21 22:43:13 +00:00
parent a0f242186c
commit 156acaf17a

View File

@@ -25,14 +25,14 @@
<v-col cols="12"> <v-col cols="12">
<gz-chart-line <gz-chart-line
:chart-data="memAllChartData" :chart-data="memAllChartData"
:options="timeLineChartOptions" :options="timeLineMMChartOptions"
class="my-12" class="my-12"
/> />
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<gz-chart-line <gz-chart-line
:chart-data="cpuChartData" :chart-data="cpuChartData"
:options="timeLineChartOptions" :options="timeLineMMChartOptions"
class="my-12" class="my-12"
/> />
</v-col> </v-col>
@@ -41,7 +41,7 @@
<v-col cols="12"> <v-col cols="12">
<gz-chart-line <gz-chart-line
:chart-data="dbChartData" :chart-data="dbChartData"
:options="timeLineChartOptions" :options="timeLineDDChartOptions"
class="my-12" class="my-12"
/> />
</v-col> </v-col>
@@ -63,14 +63,14 @@
<v-col cols="12"> <v-col cols="12">
<gz-chart-line <gz-chart-line
:chart-data="fileSizeChartData" :chart-data="fileSizeChartData"
:options="timeLineChartOptions" :options="timeLineDDChartOptions"
class="my-12" class="my-12"
/> />
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<gz-chart-line <gz-chart-line
:chart-data="attachmentCountChartData" :chart-data="attachmentCountChartData"
:options="timeLineChartOptions" :options="timeLineDDChartOptions"
class="my-12" class="my-12"
/> />
</v-col> </v-col>
@@ -85,19 +85,55 @@
import relativeDatefilterCalculator from "../api/relative-date-filter-calculator.js"; import relativeDatefilterCalculator from "../api/relative-date-filter-calculator.js";
import Palette from "../api/palette"; import Palette from "../api/palette";
const FORM_KEY = "ops-metrics"; const FORM_KEY = "ops-metrics";
const DEFAULT_POINT = {
Radius: 5,
HoverRadius: 12,
HitRadius: 4
};
export default { export default {
data() { data() {
return { return {
storage: { isnew: true }, storage: { isnew: true },
memcpu: { isnew: true }, memcpu: { isnew: true },
db: { isnew: true }, db: { isnew: true },
timeLineChartOptions: { timeLineDDChartOptions: {
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
scales: { scales: {
xAxes: [ xAxes: [
{ {
type: "time", type: "time",
time: {
unit: "day"
},
gridLines: {
drawOnChartArea: false
}
}
],
yAxes: [
{
gridLines: {
drawOnChartArea: false
},
ticks: {
beginAtZero: true
}
}
]
}
},
timeLineMMChartOptions: {
responsive: true,
maintainAspectRatio: false,
scales: {
xAxes: [
{
type: "time",
// time: {
// unit: "minute"
// },
gridLines: { gridLines: {
drawOnChartArea: false drawOnChartArea: false
} }
@@ -138,9 +174,9 @@ export default {
label: "CPU %", label: "CPU %",
borderColor: Palette.color.soft_sand, borderColor: Palette.color.soft_sand,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.memcpu.cpu data: this.memcpu.cpu
} }
] ]
@@ -153,9 +189,9 @@ export default {
label: this.$ay.t("MetricDBSize"), label: this.$ay.t("MetricDBSize"),
borderColor: Palette.color.blue, borderColor: Palette.color.blue,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.db.totalSize data: this.db.totalSize
} }
] ]
@@ -187,17 +223,17 @@ export default {
label: this.$ay.t("MetricAllocatedMemory"), label: this.$ay.t("MetricAllocatedMemory"),
borderColor: Palette.color.soft_brown_darker, borderColor: Palette.color.soft_brown_darker,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.memcpu.allocated data: this.memcpu.allocated
}, },
{ {
label: this.$ay.t("MetricWorkingSet"), label: this.$ay.t("MetricWorkingSet"),
borderColor: Palette.color.soft_green, borderColor: Palette.color.soft_green,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
fill: false, fill: false,
data: this.memcpu.workingSet data: this.memcpu.workingSet
}, },
@@ -205,9 +241,9 @@ export default {
label: this.$ay.t("MetricPrivateBytes"), label: this.$ay.t("MetricPrivateBytes"),
borderColor: Palette.color.soft_deep_blue, borderColor: Palette.color.soft_deep_blue,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.memcpu.privateBytes data: this.memcpu.privateBytes
} }
] ]
@@ -220,27 +256,27 @@ export default {
label: this.$ay.t("MetricAttachmentsMB"), label: this.$ay.t("MetricAttachmentsMB"),
borderColor: Palette.color.purple, borderColor: Palette.color.purple,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.storage.attachmentFileSize data: this.storage.attachmentFileSize
}, },
{ {
label: this.$ay.t("MetricBackupMB"), label: this.$ay.t("MetricBackupMB"),
borderColor: Palette.color.orange, borderColor: Palette.color.orange,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.storage.utilityFileSize data: this.storage.utilityFileSize
}, },
{ {
label: this.$ay.t("MetricAvailableDiskSpace"), label: this.$ay.t("MetricAvailableDiskSpace"),
borderColor: Palette.color.green, borderColor: Palette.color.green,
fill: false, fill: false,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.storage.attachmentFilesAvailableSpace data: this.storage.attachmentFilesAvailableSpace
} }
] ]
@@ -252,10 +288,10 @@ export default {
{ {
label: this.$ay.t("MetricAttachmentsCount"), label: this.$ay.t("MetricAttachmentsCount"),
borderColor: Palette.color.blue, borderColor: Palette.color.blue,
fill: false, fill: true,
radius: 0, pointRadius: DEFAULT_POINT.Radius,
hoverRadius: 10, pointHoverRadius: DEFAULT_POINT.HoverRadius,
hitRadius: 4, pointHitRadius: DEFAULT_POINT.HitRadius,
data: this.storage.attachmentFileCount data: this.storage.attachmentFileCount
} }
] ]