You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@skywalking.apache.org by wu...@apache.org on 2021/04/25 09:31:08 UTC
[skywalking-rocketbot-ui] branch master updated: feat: enhance the
custom content of tooltips on dashboard (#482)
This is an automated email from the ASF dual-hosted git repository.
wusheng pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/skywalking-rocketbot-ui.git
The following commit(s) were added to refs/heads/master by this push:
new 2d92272 feat: enhance the custom content of tooltips on dashboard (#482)
2d92272 is described below
commit 2d92272e1863bd7fad27e6777c6036d8d7936988
Author: Qiuxia Fan <fi...@outlook.com>
AuthorDate: Sun Apr 25 17:30:57 2021 +0800
feat: enhance the custom content of tooltips on dashboard (#482)
---
src/assets/lang/en.ts | 1 +
src/assets/lang/zh.ts | 1 +
src/views/components/dashboard/charts/chart-edit.vue | 16 ++++++++++++----
src/views/components/dashboard/dashboard-item.vue | 3 +++
src/views/components/trace/trace-search.vue | 1 -
src/views/containers/dashboard.vue | 11 +++++++++++
6 files changed, 28 insertions(+), 5 deletions(-)
diff --git a/src/assets/lang/en.ts b/src/assets/lang/en.ts
index 4848d1a..574a51d 100644
--- a/src/assets/lang/en.ts
+++ b/src/assets/lang/en.ts
@@ -221,6 +221,7 @@ const m = {
show: 'Show',
hide: 'Hide',
message: 'Message',
+ tooltipsContent: 'Tooltip Content',
};
export default m;
diff --git a/src/assets/lang/zh.ts b/src/assets/lang/zh.ts
index 570ef7d..e6d6594 100644
--- a/src/assets/lang/zh.ts
+++ b/src/assets/lang/zh.ts
@@ -219,6 +219,7 @@ const m = {
show: '展示',
hide: '隐藏',
message: '信息',
+ tooltipsContent: '提示内容',
};
export default m;
diff --git a/src/views/components/dashboard/charts/chart-edit.vue b/src/views/components/dashboard/charts/chart-edit.vue
index d7bf985..59c9177 100755
--- a/src/views/components/dashboard/charts/chart-edit.vue
+++ b/src/views/components/dashboard/charts/chart-edit.vue
@@ -281,6 +281,15 @@ limitations under the License. -->
<option :value="false">{{ $t('hide') }}</option>
</select>
</div>
+ <div class="flex-h mb-5">
+ <div class="title grey sm">{{ $t('tooltipsContent') }}:</div>
+ <input
+ type="text"
+ class="rk-chart-edit-input long"
+ :value="itemConfig.tips"
+ @change="setItemConfig({ type: 'tips', value: $event.target.value })"
+ />
+ </div>
</div>
</div>
</template>
@@ -367,7 +376,7 @@ limitations under the License. -->
private setItemConfig(params: { type: string; value: string }) {
this.itemConfig[params.type] = params.value;
const types = ['endpointsKey', 'instancesKey', 'currentService'];
- const typesUpdate = ['title', 'width', 'height', 'unit'];
+ const typesUpdate = ['title', 'width', 'height', 'unit', 'tips'];
if (params.type === 'servicesKey') {
this.setItemServices(true);
}
@@ -588,7 +597,7 @@ limitations under the License. -->
.rk-chart-edit {
margin: 0 -10px;
height: 100%;
- overflow: auto;
+ border: 1px dashed rgba(196, 200, 225, 0.5);
select {
margin: 0;
@@ -601,10 +610,9 @@ limitations under the License. -->
.rk-chart-edit-container {
padding: 7px 5px;
- border: 1px dashed rgba(196, 200, 225, 0.5);
border-radius: 4px;
height: 100%;
-
+ overflow: auto;
.title {
width: 120px;
flex-shrink: 0;
diff --git a/src/views/components/dashboard/dashboard-item.vue b/src/views/components/dashboard/dashboard-item.vue
index 7cc7104..137ad4b 100644
--- a/src/views/components/dashboard/dashboard-item.vue
+++ b/src/views/components/dashboard/dashboard-item.vue
@@ -320,6 +320,9 @@ limitations under the License. -->
if (type === 'unit') {
this.unit = value;
}
+ if (type === 'tips') {
+ this.tips = value;
+ }
}
private copyTable() {
diff --git a/src/views/components/trace/trace-search.vue b/src/views/components/trace/trace-search.vue
index 9b3dde7..67aa4d7 100644
--- a/src/views/components/trace/trace-search.vue
+++ b/src/views/components/trace/trace-search.vue
@@ -235,7 +235,6 @@ limitations under the License. -->
temp.traceId = this.traceId;
}
localStorage.setItem('traceId', this.traceId);
-
if (this.tagsList.length) {
const tagsMap = this.tagsList.map((item: string) => {
const key = item.substring(0, item.indexOf('='));
diff --git a/src/views/containers/dashboard.vue b/src/views/containers/dashboard.vue
index ee65932..dd0545e 100644
--- a/src/views/containers/dashboard.vue
+++ b/src/views/containers/dashboard.vue
@@ -140,3 +140,14 @@ limitations under the License. -->
}
}
</script>
+<style lang="scss" scoped>
+ .rk-add-dashboard-item {
+ height: 342px;
+ text-align: center;
+ line-height: 250px;
+ border: 1px dashed rgba(196, 200, 225, 0.5);
+ cursor: pointer;
+ display: inline-block;
+ font-size: 16px;
+ }
+</style>