github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-02 14:34:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix: refresh nodes/calls metrics as global duration changes for Topology widget, change date picker theme (#374)

Browse Source
This commit is contained in:
Fine0830 2024-03-04 11:48:55 +08:00 committed by GitHub
parent e25bf9ee8b
commit 2faeecebcc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 8 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/DateCalendar.vue
View File

@ -451,7 +451,7 @@ limitations under the License. -->
} }
.calendar + .calendar { .calendar + .calendar {
border-left: solid 1px #eaeaea; border-left: solid 1px var(--sw-border-color-light);
margin-left: 5px; margin-left: 5px;
padding-left: 5px; padding-left: 5px;
} }
@ -464,7 +464,7 @@ limitations under the License. -->
} }
.calendar-head a { .calendar-head a {
color: #666; color: var(--sw-topology-color);
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
text-align: center; text-align: center;
@ -568,7 +568,7 @@ limitations under the License. -->
.calendar-hour { .calendar-hour {
display: inline-block; display: inline-block;
border: 1px solid #e6e5e5; border: 1px solid var(--sw-border-color-light);
color: #9e9e9e; color: #9e9e9e;
} }

6
src/components/TimePicker.vue
View File

@ -447,7 +447,7 @@ limitations under the License. -->
width: 100px; width: 100px;
height: 100%; height: 100%;
padding: 5px; padding: 5px;
border-right: solid 1px #eaeaea; border-right: solid 1px var(--sw-border-color-light);
} }
&__shortcut { &__shortcut {
@ -457,7 +457,7 @@ limitations under the License. -->
background-color: transparent; background-color: transparent;
line-height: 34px; line-height: 34px;
font-size: $font-size-smaller; font-size: $font-size-smaller;
color: #666; color: var(--sw-topology-color);
text-align: left; text-align: left;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
@ -532,6 +532,6 @@ limitations under the License. -->
} }
.datepicker__buttons .datepicker__button-cancel { .datepicker__buttons .datepicker__button-cancel {
background: #666; background: var(--sw-topology-color);
} }
</style> </style>

15
src/views/dashboard/related/topology/service/ServiceMap.vue
View File

@ -13,13 +13,7 @@ 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 <div ref="chart" class="micro-topo-chart" v-loading="loading" :style="`height: ${height}px`">
ref="chart"
class="micro-topo-chart"
v-loading="loading"
element-loading-background="rgba(0, 0, 0, 0)"
:style="`height: ${height}px`"
>
<svg class="svg-topology" :width="width - 100" :height="height" @click="svgEvent"> <svg class="svg-topology" :width="width - 100" :height="height" @click="svgEvent">
<g class="svg-graph" :transform="`translate(${diff[0]}, ${diff[1]})`"> <g class="svg-graph" :transform="`translate(${diff[0]}, ${diff[1]})`">
<g <g
@ -224,6 +218,7 @@ limitations under the License. -->
svg.value.call(zoom(d3, graph.value, diff.value)); svg.value.call(zoom(d3, graph.value, diff.value));
} }
async function freshNodes() { async function freshNodes() {
loading.value = true;
topologyStore.setNode(null); topologyStore.setNode(null);
topologyStore.setLink(null); topologyStore.setLink(null);
const resp = await getTopology(); const resp = await getTopology();
@ -637,12 +632,6 @@ limitations under the License. -->
if (!(oldVal[0] && newVal[0])) { if (!(oldVal[0] && newVal[0])) {
return; return;
} }
if (oldVal[0].id === newVal[0].id && !oldVal[1]) {
return;
}
if (oldVal[0].id === newVal[0].id && oldVal[1].id === newVal[1].id) {
return;
}
freshNodes(); freshNodes();
hierarchyRelated.value = false; hierarchyRelated.value = false;
}, },