github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-03 08:05:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: apply config

Browse Source
This commit is contained in:
Qiuxia Fan 2022-01-12 15:28:09 +08:00
parent 8e0bf6357e
commit 299980b2d5
1 changed files with 8 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/views/dashboard/configuration/ConfigEdit.vue
View File

@ -25,12 +25,12 @@ limitations under the License. -->
</div> </div>
<div class="render-chart"> <div class="render-chart">
<component <component
:is="states.chartType" :is="states.graph.type"
:intervalTime="appStoreWithOut.intervalTime" :intervalTime="appStoreWithOut.intervalTime"
:data="states.source" :data="states.source"
:config="states.graph" :config="states.graph"
/> />
<div v-show="!states.chartType" class="no-data">{{ t("noData") }}</div> <div v-show="!states.graph.type" class="no-data">{{ t("noData") }}</div>
</div> </div>
</div> </div>
<div class="collapse" :style="{ height: configHeight + 'px' }"> <div class="collapse" :style="{ height: configHeight + 'px' }">
@ -67,7 +67,7 @@ limitations under the License. -->
v-for="(type, index) in ChartTypes" v-for="(type, index) in ChartTypes"
:key="index" :key="index"
@click="changeChartType(type)" @click="changeChartType(type)"
:class="{ active: type.value === states.chartType }" :class="{ active: type.value === states.graph.type }"
> >
{{ type.label }} {{ type.label }}
</span> </span>
@ -75,7 +75,7 @@ limitations under the License. -->
</el-collapse-item> </el-collapse-item>
<el-collapse-item :title="t('graphStyles')" name="3"> <el-collapse-item :title="t('graphStyles')" name="3">
<component <component
:is="`${states.chartType}Config`" :is="`${states.graph.type}Config`"
:config="states.graph" :config="states.graph"
@update="updateGraphOptions" @update="updateGraphOptions"
/> />
@ -142,7 +142,6 @@ export default defineComponent({
valueTypes: Option[]; valueTypes: Option[];
valueType: string; valueType: string;
metricQueryType: string; metricQueryType: string;
chartType: string;
activeNames: string; activeNames: string;
source: any; source: any;
index: string; index: string;
@ -154,11 +153,10 @@ export default defineComponent({
valueTypes: [], valueTypes: [],
valueType: "", valueType: "",
metricQueryType: "", metricQueryType: "",
chartType: selectedGrid.graph.type,
activeNames: "1", activeNames: "1",
source: {}, source: {},
index: selectedGrid.i, index: selectedGrid.i,
graph: {}, graph: selectedGrid.graph,
widget: selectedGrid.widget, widget: selectedGrid.widget,
standard: selectedGrid.standard, standard: selectedGrid.standard,
}); });
@ -199,7 +197,6 @@ export default defineComponent({
} }
function changeChartType(item: Option) { function changeChartType(item: Option) {
states.chartType = String(item.value);
states.graph = { states.graph = {
...DefaultGraphConfig[item.value], ...DefaultGraphConfig[item.value],
}; };
@ -270,18 +267,9 @@ export default defineComponent({
...dashboardStore.selectedGrid, ...dashboardStore.selectedGrid,
metrics: states.metrics, metrics: states.metrics,
queryMetricType: states.valueType, queryMetricType: states.valueType,
chart: states.chartType, widget: states.widget,
widget: { graph: states.graph,
...dashboardStore.selectedGrid.widget, standard: states.standard,
title: states.widget.title,
tips: states.widget.tips,
},
graph: {
...dashboardStore.selectedGrid.graph,
},
standard: {
...dashboardStore.selectedGrid.standard,
},
}; };
dashboardStore.setConfigs(opts); dashboardStore.setConfigs(opts);
dashboardStore.setConfigPanel(false); dashboardStore.setConfigPanel(false);