feat: add config

This commit is contained in:
Fine 2023-01-03 12:11:27 +08:00
parent c902d93160
commit 1d4fce9632
2 changed files with 15 additions and 9 deletions

View File

@ -13,7 +13,7 @@ limitations under the License. -->
<template>
<div class="item">
<span class="label">{{ t("textUrl") }}</span>
<el-input class="input" v-model="url" size="small" @change="changeConfig({ url })" />
<el-input class="input" v-model="url" size="small" @change="changeConfig({ url: encodeURIComponent(url) })" />
</div>
<div class="footer">
<el-button size="small" @click="cancelConfig">
@ -31,15 +31,19 @@ limitations under the License. -->
const { t } = useI18n();
const dashboardStore = useDashboardStore();
const originConfig = dashboardStore.selectedGrid;
const graph = originConfig.graph || {};
const url = ref(graph.url || "");
function changeConfig(param: { [key: string]: unknown }) {
const widget = originConfig.widget || {};
const url = ref(widget.url || "");
function changeConfig(param: { [key: string]: string }) {
const key = Object.keys(param)[0];
if (!key) {
return;
}
const { selectedGrid } = dashboardStore;
const graph = {
...selectedGrid.graph,
...param,
const widget = {
...dashboardStore.selectedGrid.widget,
[key]: decodeURIComponent(param[key]),
};
dashboardStore.selectWidget({ ...selectedGrid, graph });
dashboardStore.selectWidget({ ...selectedGrid, widget });
}
function applyConfig() {
dashboardStore.setConfigPanel(false);

View File

@ -30,11 +30,12 @@ limitations under the License. -->
</el-popover>
</div>
<div class="body">
<iframe src="/general" width="100%" height="100%" scrolling="no"></iframe>
<iframe :src="widget.url" width="100%" height="100%" scrolling="no" style="border: none"></iframe>
</div>
</div>
</template>
<script lang="ts" setup>
import { computed } from "vue";
import type { PropType } from "vue";
import { useI18n } from "vue-i18n";
import { useDashboardStore } from "@/store/modules/dashboard";
@ -49,6 +50,7 @@ limitations under the License. -->
});
const { t } = useI18n();
const dashboardStore = useDashboardStore();
const widget = computed(() => props.data.widget || {});
function removeTopo() {
dashboardStore.removeControls(props.data);