mirror of
https://github.com/apache/skywalking-booster-ui.git
synced 2025-07-10 03:55:25 +00:00
update style
This commit is contained in:
parent
96b7662e23
commit
f031944f71
@ -22,14 +22,14 @@ import graphql from "@/graphql";
|
|||||||
import { AxiosResponse } from "axios";
|
import { AxiosResponse } from "axios";
|
||||||
import { useAppStoreWithOut } from "@/store/modules/app";
|
import { useAppStoreWithOut } from "@/store/modules/app";
|
||||||
import { useSelectorStore } from "@/store/modules/selectors";
|
import { useSelectorStore } from "@/store/modules/selectors";
|
||||||
import { Conditions, DemandLog } from "@/types/demand-log";
|
import { Conditions, Log } from "@/types/demand-log";
|
||||||
|
|
||||||
interface DemandLogState {
|
interface DemandLogState {
|
||||||
containers: Instance[];
|
containers: Instance[];
|
||||||
instances: Instance[];
|
instances: Instance[];
|
||||||
conditions: Conditions;
|
conditions: Conditions;
|
||||||
selectorStore: any;
|
selectorStore: any;
|
||||||
logs: DemandLog[];
|
logs: Log[];
|
||||||
loadLogs: boolean;
|
loadLogs: boolean;
|
||||||
namespaces: Option[];
|
namespaces: Option[];
|
||||||
}
|
}
|
||||||
|
@ -27,7 +27,7 @@ export interface Conditions {
|
|||||||
excludingKeywordsOfContent?: string;
|
excludingKeywordsOfContent?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DemandLog {
|
export interface Log {
|
||||||
content: string;
|
content: string;
|
||||||
timestamp: number;
|
timestamp: number;
|
||||||
contentType: string;
|
contentType: string;
|
||||||
|
@ -32,9 +32,7 @@ limitations under the License. -->
|
|||||||
<div class="header">
|
<div class="header">
|
||||||
<Header />
|
<Header />
|
||||||
</div>
|
</div>
|
||||||
<div class="log">
|
<Content />
|
||||||
<Content />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
@ -92,8 +90,4 @@ function removeWidget() {
|
|||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.log {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -13,11 +13,16 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|||||||
See the License for the specific language governing permissions and
|
See the License for the specific language governing permissions and
|
||||||
limitations under the License. -->
|
limitations under the License. -->
|
||||||
<template>
|
<template>
|
||||||
<div class="log-content" ref="logContent"></div>
|
<div
|
||||||
|
class="log-content"
|
||||||
|
ref="logContent"
|
||||||
|
style="width: 100%; height: calc(100% - 140px)"
|
||||||
|
></div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { onMounted, ref, onUnmounted } from "vue";
|
import { onMounted, ref, onUnmounted } from "vue";
|
||||||
import { useDemandLogStore } from "@/store/modules/demand-log";
|
import { useDemandLogStore } from "@/store/modules/demand-log";
|
||||||
|
import { Log } from "@/types/demand-log";
|
||||||
|
|
||||||
/*global Nullable */
|
/*global Nullable */
|
||||||
const demandLogStore = useDemandLogStore();
|
const demandLogStore = useDemandLogStore();
|
||||||
@ -30,9 +35,10 @@ onMounted(() => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
function monacoInstanceGen(monaco: any) {
|
function monacoInstanceGen(monaco: any) {
|
||||||
|
const value = demandLogStore.logs.map((d: Log) => d.content).join("\n");
|
||||||
monaco.languages.register({ id: "custom" });
|
monaco.languages.register({ id: "custom" });
|
||||||
monacoInstance.value = monaco.editor.create(logContent.value, {
|
monacoInstance.value = monaco.editor.create(logContent.value, {
|
||||||
value: demandLogStore.logs,
|
value: "console.log(123)", // value
|
||||||
language: "javascript",
|
language: "javascript",
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -42,9 +48,7 @@ onUnmounted(() => {
|
|||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.log-content {
|
.log-content {
|
||||||
min-height: 300px;
|
|
||||||
width: 100%;
|
|
||||||
min-width: 600px;
|
min-width: 600px;
|
||||||
height: calc(100% - 140px);
|
min-height: 400px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user