mirror of
https://github.com/apache/skywalking-booster-ui.git
synced 2025-06-17 11:06:18 +00:00
update TTL Tab
This commit is contained in:
Fine
parent
e4a43d91e2
commit
88553431b8
@ -397,8 +397,8 @@ const msg = {
|
||||
instances: "Instances",
|
||||
snapshot: "Snapshot",
|
||||
expression: "Expression",
|
||||
metricsTTL: "Metrics TTL",
|
||||
recordsTTL: "Records TTL",
|
||||
metricsTTL: "Metrics TTL (day)",
|
||||
recordsTTL: "Records TTL (day)",
|
||||
clusterNodes: "Cluster Nodes",
|
||||
debuggingConfigDump: "Dump Effective Configurations",
|
||||
customDuration: "Custom Duration",
|
||||
|
||||
@ -397,8 +397,8 @@ const msg = {
|
||||
snapshot: "Snapshot",
|
||||
expression: "Expression",
|
||||
asSelector: "As Selector",
|
||||
metricsTTL: "Metrics TTL",
|
||||
recordsTTL: "Records TTL",
|
||||
metricsTTL: "Metrics TTL (day)",
|
||||
recordsTTL: "Records TTL (day)",
|
||||
clusterNodes: "Cluster Nodes",
|
||||
debuggingConfigDump: "Dump Effective Configurations",
|
||||
customDuration: "Duración Personalizada",
|
||||
|
||||
@ -395,8 +395,8 @@ const msg = {
|
||||
instances: "实例",
|
||||
snapshot: "快照",
|
||||
expression: "表达式",
|
||||
metricsTTL: "Metrics TTL",
|
||||
recordsTTL: "Records TTL",
|
||||
metricsTTL: "Metrics TTL (day)",
|
||||
recordsTTL: "Records TTL (day)",
|
||||
clusterNodes: "集群节点",
|
||||
debuggingConfigDump: "转储有效配置",
|
||||
customDuration: "自定义时长",
|
||||
|
||||
34
src/views/settings/components/DoubleHeaderTable.vue
Normal file
34
src/views/settings/components/DoubleHeaderTable.vue
Normal file
@ -0,0 +1,34 @@
|
||||
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
|
||||
contributor license agreements. See the NOTICE file distributed with
|
||||
this work for additional information regarding copyright ownership.
|
||||
The ASF licenses this file to You under the Apache License, Version 2.0
|
||||
(the "License"); you may not use this file except in compliance with
|
||||
the License. You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License. -->
|
||||
<template>
|
||||
<el-table :data="[data]" class="mb-5" :row-style="{ backgroundColor: 'var(--layout-background)' }">
|
||||
<el-table-column v-for="column in metricsRows" :prop="column.value" :label="column.label" :key="column.value">
|
||||
<el-table-column v-for="item in column.children" :prop="item.value" :label="item.label" :key="item.value">
|
||||
{{ data ? (data[item.value] < 0 ? "N/A" : data[item.value]) : "N/A" }}
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import type { Option } from "@/types/app";
|
||||
/*global PropType, Indexable */
|
||||
defineProps({
|
||||
metricsRows: {
|
||||
type: Array as PropType<{ label: string; value: string; children: Option[] }[]>,
|
||||
default: () => [],
|
||||
},
|
||||
data: { type: Object as PropType<Indexable>, default: () => {} },
|
||||
});
|
||||
</script>
|
||||
@ -15,43 +15,16 @@ limitations under the License. -->
|
||||
<template>
|
||||
<div class="ttl">
|
||||
<div class="label">{{ t("metricsTTL") }}</div>
|
||||
<el-table
|
||||
:data="[settingsStore.configTTL.metrics]"
|
||||
class="mb-5"
|
||||
:row-style="{ backgroundColor: 'var(--layout-background)' }"
|
||||
>
|
||||
<el-table-column v-for="item in MetricsTTLRow" :prop="item.value" :label="item.label" :key="item.value">
|
||||
{{
|
||||
settingsStore.configTTL?.metrics
|
||||
? settingsStore.configTTL.metrics[item.value] < 0
|
||||
? "N/A"
|
||||
: (settingsStore.configTTL?.metrics ?? {})[item.value]
|
||||
: "N/A"
|
||||
}}
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<DoubleHeaderTable :data="settingsStore.configTTL.metrics" :metricsRows="MetricsTTLRow" />
|
||||
<div class="label">{{ t("recordsTTL") }}</div>
|
||||
<el-table
|
||||
:data="[settingsStore.configTTL.records]"
|
||||
class="mb-5"
|
||||
:row-style="{ backgroundColor: 'var(--layout-background)' }"
|
||||
>
|
||||
<el-table-column v-for="item in RecordsTTLRow" :prop="item.value" :label="item.label" :key="item.value">
|
||||
{{
|
||||
settingsStore.configTTL?.records
|
||||
? settingsStore.configTTL?.records[item.value] < 0
|
||||
? "N/A"
|
||||
: (settingsStore.configTTL?.records || {})[item.value]
|
||||
: "N/A"
|
||||
}}
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<DoubleHeaderTable :data="settingsStore.configTTL.records" :metricsRows="RecordsTTLRow" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useSettingsStore } from "@/store/modules/settings";
|
||||
import DoubleHeaderTable from "./DoubleHeaderTable.vue";
|
||||
import { MetricsTTLRow, RecordsTTLRow } from "../data";
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
@ -51,70 +51,94 @@ export const SettingsTabs = [
|
||||
];
|
||||
export const MetricsTTLRow = [
|
||||
{
|
||||
label: "Day",
|
||||
value: "day",
|
||||
label: "Hot / Warm",
|
||||
value: "hotAndWarm",
|
||||
children: [
|
||||
{
|
||||
label: "Day",
|
||||
value: "day",
|
||||
},
|
||||
{
|
||||
label: "Hour",
|
||||
value: "hour",
|
||||
},
|
||||
{
|
||||
label: "Minute",
|
||||
value: "minute",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Hour",
|
||||
value: "hour",
|
||||
},
|
||||
{
|
||||
label: "Minute",
|
||||
value: "minute",
|
||||
},
|
||||
{
|
||||
label: "Cold Day",
|
||||
value: "coldDay",
|
||||
},
|
||||
{
|
||||
label: "Cold Hour",
|
||||
value: "coldHour",
|
||||
},
|
||||
{
|
||||
label: "Cold Minute",
|
||||
value: "coldMinute",
|
||||
label: "Cold",
|
||||
value: "cold",
|
||||
children: [
|
||||
{
|
||||
label: "Day",
|
||||
value: "coldDay",
|
||||
},
|
||||
{
|
||||
label: "Hour",
|
||||
value: "coldHour",
|
||||
},
|
||||
{
|
||||
label: "Minute",
|
||||
value: "coldMinute",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export const RecordsTTLRow = [
|
||||
{
|
||||
label: "Normal",
|
||||
value: "normal",
|
||||
label: "Hot / Warm",
|
||||
value: "hotAndWarm",
|
||||
children: [
|
||||
{
|
||||
label: "Normal",
|
||||
value: "normal",
|
||||
},
|
||||
{
|
||||
label: "Trace",
|
||||
value: "trace",
|
||||
},
|
||||
{
|
||||
label: "Zipkin Trace",
|
||||
value: "zipkinTrace",
|
||||
},
|
||||
{
|
||||
label: "Log",
|
||||
value: "log",
|
||||
},
|
||||
{
|
||||
label: "Browser Error Log",
|
||||
value: "browserErrorLog",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Trace",
|
||||
value: "trace",
|
||||
},
|
||||
{
|
||||
label: "Log",
|
||||
value: "log",
|
||||
},
|
||||
{
|
||||
label: "Zipkin Trace",
|
||||
value: "zipkinTrace",
|
||||
},
|
||||
{
|
||||
label: "Browser Error Log",
|
||||
value: "browserErrorLog",
|
||||
},
|
||||
{
|
||||
label: "Cold Normal",
|
||||
value: "coldNormal",
|
||||
},
|
||||
{
|
||||
label: "Cold Trace",
|
||||
value: "coldTrace",
|
||||
},
|
||||
{
|
||||
label: "Cold Zipkin Trace",
|
||||
value: "coldZipkinTrace",
|
||||
},
|
||||
{
|
||||
label: "Cold Log",
|
||||
value: "coldLog",
|
||||
},
|
||||
{
|
||||
label: "Cold Browser Error Log",
|
||||
value: "coldBrowserErrorLog",
|
||||
label: "Cold",
|
||||
value: "cold",
|
||||
children: [
|
||||
{
|
||||
label: "Normal",
|
||||
value: "coldNormal",
|
||||
},
|
||||
{
|
||||
label: "Trace",
|
||||
value: "coldTrace",
|
||||
},
|
||||
{
|
||||
label: "Zipkin Trace",
|
||||
value: "coldZipkinTrace",
|
||||
},
|
||||
{
|
||||
label: "Log",
|
||||
value: "coldLog",
|
||||
},
|
||||
{
|
||||
label: "Browser Error Log",
|
||||
value: "coldBrowserErrorLog",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
Loading…
Reference in New Issue
Block a user