github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-12 15:52:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: update

Browse Source
This commit is contained in:
Fine 2023-11-10 23:37:39 +08:00
parent f95015ad02
commit 96830ca3ef
4 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/layout/components/NavBar.vue
View File

@ -48,12 +48,12 @@ limitations under the License. -->
@input="changeTimeRange" @input="changeTimeRange"
/> />
<span> UTC{{ appStore.utcHour >= 0 ? "+" : "" }}{{ `${appStore.utcHour}:${appStore.utcMin}` }} </span> <span> UTC{{ appStore.utcHour >= 0 ? "+" : "" }}{{ `${appStore.utcHour}:${appStore.utcMin}` }} </span>
<span title="refresh" class="ghost ml-5 cp" @click="handleReload">
<Icon iconName="retry" :loading="appStore.autoRefresh" class="middle" />
</span>
<span class="ml-5"> <span class="ml-5">
<el-switch v-model="theme" :active-icon="Moon" :inactive-icon="Sunny" inline-prompt @change="changeTheme" /> <el-switch v-model="theme" :active-icon="Moon" :inactive-icon="Sunny" inline-prompt @change="changeTheme" />
</span> </span>
<span title="refresh" class="ghost ml-5 cp" @click="handleReload">
<Icon iconName="retry" :loading="appStore.autoRefresh" class="middle" />
</span>
<span class="version ml-5 cp"> <span class="version ml-5 cp">
<el-popover trigger="hover" width="250" placement="bottom" :content="appStore.version"> <el-popover trigger="hover" width="250" placement="bottom" :content="appStore.version">
<template #reference> <template #reference>

6
src/styles/theme.scss
View File

@ -36,12 +36,11 @@ html {
--sw-table-col: #fff; --sw-table-col: #fff;
--sw-config-header: aliceblue; --sw-config-header: aliceblue;
--sw-topology-color: #666; --sw-topology-color: #666;
--sw-topology-operations-bg: #f7f9fa;
--vis-tooltip-bg: #fff; --vis-tooltip-bg: #fff;
--sw-topology-switch-icon: rgba(0, 0, 0, 0.3); --sw-topology-switch-icon: rgba(0, 0, 0, 0.3);
--sw-topology-box-shadow: #eee 1px 2px 10px; --sw-topology-box-shadow: #eee 1px 2px 10px;
--sw-topology-setting-bg: #fff; --sw-topology-setting-bg: #fff;
--sw-topology-border: 1px solid #000000; --sw-topology-border: 1px solid #999;
} }
html.dark { html.dark {
@ -64,12 +63,11 @@ html.dark {
--sw-table-col: none; --sw-table-col: none;
--sw-config-header: #333; --sw-config-header: #333;
--sw-topology-color: #ccc; --sw-topology-color: #ccc;
--sw-topology-operations-bg: #4b4b52;
--vis-tooltip-bg: #414243; --vis-tooltip-bg: #414243;
--sw-topology-switch-icon: #aaa; --sw-topology-switch-icon: #aaa;
--sw-topology-box-shadow: 0 0 2px 0 #444; --sw-topology-box-shadow: 0 0 2px 0 #444;
--sw-topology-setting-bg: #333; --sw-topology-setting-bg: #333;
--sw-topology-border: 1px solid #999; --sw-topology-border: 1px solid #666;
} }
.el-table tr { .el-table tr {

15
src/views/dashboard/panel/Tool.vue
View File

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License. --> limitations under the License. -->
<template> <template>
<div class="dashboard-tool flex-h"> <div class="dashboard-tool flex-h">
<div :class="isRelation ? 'flex-v' : 'flex-h'"> <div :class="isRelation ? 'flex-v' : 'flex-h'" class="tool-selectors">
<div class="flex-h"> <div class="flex-h">
<div class="selectors-item" v-if="key !== 10"> <div class="selectors-item" v-if="key !== 10">
<span class="label">$Service</span> <span class="label">$Service</span>
@ -103,7 +103,7 @@ limitations under the License. -->
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item @click="clickIcons(t)" v-for="(t, index) in toolIcons" :key="index" :title="t.content"> <el-dropdown-item @click="clickIcons(t)" v-for="(t, index) in toolIcons" :key="index" :title="t.content">
<Icon class="mr-5" size="middle" :iconName="t.name" /> <Icon class="mr-5" size="sm" :iconName="t.name" />
<span>{{ t.content }}</span> <span>{{ t.content }}</span>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@ -115,7 +115,7 @@ limitations under the License. -->
</i> </i>
</el-tooltip> </el-tooltip>
</div> </div>
<div class="switch"> <div class="ml-5">
<el-switch <el-switch
v-model="dashboardStore.editMode" v-model="dashboardStore.editMode"
active-text="E" active-text="E"
@ -735,15 +735,15 @@ limitations under the License. -->
<style lang="scss" scoped> <style lang="scss" scoped>
.dashboard-tool { .dashboard-tool {
text-align: right; text-align: right;
padding: 3px 5px 5px; padding: 5px;
background: $dashboard-tool-bg-color; background: $dashboard-tool-bg-color;
border-bottom: 1px solid $border-color; border-bottom: 1px solid $border-color;
justify-content: space-between; justify-content: space-between;
} }
.switch { .tool-selectors {
padding-top: 2px; align-items: center;
margin: 0 10px; height: auto;
} }
.label { .label {
@ -758,6 +758,7 @@ limitations under the License. -->
.tools { .tools {
justify-content: space-between; justify-content: space-between;
align-items: center;
height: auto; height: auto;
} }

7
src/views/dashboard/related/topology/components/Graph.vue
View File

@ -739,11 +739,10 @@ limitations under the License. -->
position: absolute; position: absolute;
color: $font-color; color: $font-color;
cursor: pointer; cursor: pointer;
background-color: var(--sw-topology-operations-bg); border: var(--sw-topology-border);
border-radius: 5px; border-radius: 3px;
background-color: $theme-background;
padding: 10px 0; padding: 10px 0;
border: 1px solid $border-color-primary;
box-shadow: --sw-topology-box-shadow;
span { span {
display: block; display: block;