Support to configure the maximum number of displayed items (#481)
* Support to configure the maximum number of displayed items
* set defaultVal '10' to maxItemNum
* Adjust the implementation of the 'setDefaultValue' method
Co-authored-by: Qiuxia Fan <fine0830@outlook.com>
diff --git a/src/assets/lang/en.ts b/src/assets/lang/en.ts
index a218839..442ff73 100644
--- a/src/assets/lang/en.ts
+++ b/src/assets/lang/en.ts
@@ -150,6 +150,7 @@
timeTips: 'Time interval cannot exceed 60 days',
standardAPM: 'Standard',
entityType: 'Entity type',
+ maxItemNum: 'Max number of Item',
independentSelector: 'Selectors',
unknownMetrics: 'Unknown Metrics',
labels: 'Labels',
diff --git a/src/assets/lang/zh.ts b/src/assets/lang/zh.ts
index 9901404..d206aa0 100644
--- a/src/assets/lang/zh.ts
+++ b/src/assets/lang/zh.ts
@@ -150,6 +150,7 @@
timeTips: '时间区间不能超过60天',
standardAPM: '标准APM',
entityType: '实体类型',
+ maxItemNum: '最多条目数',
independentSelector: '独立选择器',
unknownMetrics: '未知指标',
labels: '标签',
diff --git a/src/store/modules/dashboard/dashboard-data-query.ts b/src/store/modules/dashboard/dashboard-data-query.ts
index 0cbac5e..5394335 100644
--- a/src/store/modules/dashboard/dashboard-data-query.ts
+++ b/src/store/modules/dashboard/dashboard-data-query.ts
@@ -80,7 +80,7 @@
parentService: null,
normal: true,
scope: config.entityType,
- topN: 10,
+ topN: Number(config.maxItemNum) || 10,
order: config.sortOrder || 'DES',
},
}
@@ -109,7 +109,7 @@
parentService: config.parentService ? parentService : null,
normal,
scope: normal ? config.entityType : config.parentService ? 'Service' : config.entityType,
- topN: 10,
+ topN: Number(config.maxItemNum) || 10,
order: config.sortOrder || 'DES',
},
};
diff --git a/src/views/components/dashboard/charts/chart-edit.vue b/src/views/components/dashboard/charts/chart-edit.vue
index b4ce9a4..2254416 100755
--- a/src/views/components/dashboard/charts/chart-edit.vue
+++ b/src/views/components/dashboard/charts/chart-edit.vue
@@ -226,6 +226,16 @@
@change="setItemConfig({ type: 'height', value: $event.target.value })"
/>
</div>
+ <div class="flex-h mb-5" v-show="!isChartType">
+ <div class="title grey sm">{{ $t('maxItemNum') }}:</div>
+ <input
+ type="number"
+ min="1"
+ class="rk-chart-edit-input long"
+ :value="itemConfig.maxItemNum"
+ @change="setItemConfig({ type: 'maxItemNum', value: $event.target.value })"
+ />
+ </div>
<div class="flex-h mb-5">
<div class="title grey sm">{{ $t('aggregation') }}:</div>
<select
@@ -318,6 +328,9 @@
@Prop() private intervalTime!: any;
@Prop() private type!: string;
private itemConfig: any = {};
+ private itemConfigDefault: any = {
+ maxItemNum: '10',
+ };
private EntityType = EntityType;
private IndependentType = IndependentType;
private CalculationType = CalculationType;
@@ -336,7 +349,7 @@
private ChartTable = 'ChartTable';
private created() {
- this.itemConfig = this.item;
+ this.setDefaultValue((this.itemConfig = this.item));
this.initConfig();
if (!this.itemConfig.independentSelector || this.pageTypes.includes(this.type)) {
return;
@@ -344,6 +357,21 @@
this.setItemServices();
}
+ private setDefaultValue(itemConfig: any) {
+ const currentKeys: string[] = Object.keys(itemConfig);
+ const defaultKeys: string[] = Object.keys(this.itemConfigDefault);
+
+ if (!currentKeys.length || !defaultKeys.length) {
+ return;
+ }
+
+ defaultKeys.forEach((key: string) => {
+ if (!currentKeys.includes(key)) {
+ itemConfig[key] = this.itemConfigDefault[key];
+ }
+ });
+ }
+
private initConfig() {
this.isDatabase = this.pageTypes.includes(this.type)
? false
diff --git a/src/views/components/trace/trace-search.vue b/src/views/components/trace/trace-search.vue
index 75d8de4..79ea57b 100644
--- a/src/views/components/trace/trace-search.vue
+++ b/src/views/components/trace/trace-search.vue
@@ -221,8 +221,10 @@
temp.traceId = this.traceId;
}
localStorage.setItem('traceId', this.traceId);
+
temp.tags = this.tagsMap;
localStorage.setItem('traceTags', JSON.stringify(this.tagsList));
+
this.SET_TRACE_FORM(temp);
this.$eventBus.$emit('SET_LOADING_TRUE', () => {
this.GET_TRACELIST().then(() => {
