From d11ceab59df60978b7ff269e01da96fd94b62cbb Mon Sep 17 00:00:00 2001 From: Fine0830 Date: Wed, 28 Dec 2022 19:02:44 +0800 Subject: [PATCH 01/39] fix: add ElPopconfirm (#213) --- src/types/components.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/types/components.d.ts b/src/types/components.d.ts index fa07aadd..05ec63bd 100644 --- a/src/types/components.d.ts +++ b/src/types/components.d.ts @@ -22,6 +22,7 @@ declare module '@vue/runtime-core' { ElMenuItemGroup: typeof import('element-plus/es')['ElMenuItemGroup'] ElOption: typeof import('element-plus/es')['ElOption'] ElPagination: typeof import('element-plus/es')['ElPagination'] + ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm'] ElPopover: typeof import('element-plus/es')['ElPopover'] ElProgress: typeof import('element-plus/es')['ElProgress'] ElRadio: typeof import('element-plus/es')['ElRadio'] From db793e6c050d7683bbb41dd7970d954aef23c880 Mon Sep 17 00:00:00 2001 From: Fine0830 Date: Thu, 29 Dec 2022 17:55:44 +0800 Subject: [PATCH 02/39] docs: update (#214) --- README.md | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 39ae54c3..bd5d26d6 100644 --- a/README.md +++ b/README.md @@ -1,20 +1,20 @@ -Apache SkyWalking Booster UI -=============== +# Apache SkyWalking Booster UI Sky Walking logo -[Apache SkyWalking](https://github.com/apache/skywalking) Booster UI. +[Apache SkyWalking](https://github.com/apache/skywalking) Booster UI. ![NPM BUILD](https://github.com/apache/skywalking-booster-ui/workflows/Node%20CI/badge.svg) This UI starts from SkyWalking OAP v9 core. ## Release + This repo wouldn't release separately. All source codes have been included in the main repo release. The tags match the [main repo](https://github.com/apache/skywalking) tags. ## Development - The app was built with [Vue3.x + Typescript](https://github.com/vuejs/vue). +The app was built with [Vue3.x + Typescript](https://github.com/vuejs/vue). ### Prepare @@ -28,19 +28,21 @@ npm install ### Build **All following builds are for dev.** + ``` npm install -npm run serve +npm run dev ``` The default UI address is `http://localhost:8080`. - # Contact Us -* Submit an [issue](https://github.com/apache/skywalking/issues) if you face some issues. Submit a [discussion](https://github.com/apache/skywalking/discussions) if you want to propose new feature or have any question. -* Mailing list: **dev@skywalking.apache.org**. Mail to `dev-subscribe@skywalking.apache.org`, follow the reply to subscribe the mailing list. -* Join Slack. Send `Request to join SkyWalking slack` mail to the mail list(`dev@skywalking.apache.org`), we will invite you in. -* QQ Group: 392443393, 901167865 + +- Submit an [issue](https://github.com/apache/skywalking/issues) if you face some issues. Submit a [discussion](https://github.com/apache/skywalking/discussions) if you want to propose new feature or have any question. +- Mailing list: **dev@skywalking.apache.org**. Mail to `dev-subscribe@skywalking.apache.org`, follow the reply to subscribe the mailing list. +- Join Slack. Send `Request to join SkyWalking slack` mail to the mail list(`dev@skywalking.apache.org`), we will invite you in. +- QQ Group: 392443393, 901167865 # License + [Apache 2.0 License.](/LICENSE) From 8785817efed1ea255f6e6101c3ab042c0caa7762 Mon Sep 17 00:00:00 2001 From: Fine0830 Date: Tue, 3 Jan 2023 16:12:45 +0800 Subject: [PATCH 03/39] feat: add a iframe widget for zipkin ui (#215) --- src/assets/icons/add_iframe.svg | 15 +++ src/locales/lang/en.ts | 2 + src/locales/lang/es.ts | 2 + src/locales/lang/zh.ts | 2 + src/store/data.ts | 2 + src/store/modules/dashboard.ts | 6 +- .../dashboard/configuration/ThirdPartyApp.vue | 89 ++++++++++++++ src/views/dashboard/configuration/index.ts | 2 + src/views/dashboard/controls/Text.vue | 4 +- .../dashboard/controls/ThirdPartyApp.vue | 116 ++++++++++++++++++ src/views/dashboard/controls/index.ts | 2 + src/views/dashboard/controls/tab.ts | 2 + src/views/dashboard/data.ts | 10 +- src/views/dashboard/panel/Tool.vue | 6 + vite.config.ts | 12 +- 15 files changed, 262 insertions(+), 10 deletions(-) create mode 100644 src/assets/icons/add_iframe.svg create mode 100644 src/views/dashboard/configuration/ThirdPartyApp.vue create mode 100644 src/views/dashboard/controls/ThirdPartyApp.vue diff --git a/src/assets/icons/add_iframe.svg b/src/assets/icons/add_iframe.svg new file mode 100644 index 00000000..5fa776c0 --- /dev/null +++ b/src/assets/icons/add_iframe.svg @@ -0,0 +1,15 @@ + + \ No newline at end of file diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts index cdcceaeb..60c6c9a0 100644 --- a/src/locales/lang/en.ts +++ b/src/locales/lang/en.ts @@ -179,6 +179,8 @@ const msg = { when4xx: "Sample HTTP requests and responses with tracing when response code between 400 and 499", when5xx: "Sample HTTP requests and responses with tracing when response code between 500 and 599", taskTitle: "HTTP request and response collecting rules", + iframeWidgetTip: "Add a link to a widget", + iframeSrc: "Iframe Link", seconds: "Seconds", hourTip: "Select Hour", minuteTip: "Select Minute", diff --git a/src/locales/lang/es.ts b/src/locales/lang/es.ts index b4485f02..3cbcd4ce 100644 --- a/src/locales/lang/es.ts +++ b/src/locales/lang/es.ts @@ -162,6 +162,8 @@ const msg = { latency: "Retraso", metricValues: "Valor métrico", legendValues: "Valor de la leyenda", + iframeWidgetTip: "Añadir enlaces a los gadgets", + iframeSrc: "Enlace Iframe", seconds: "Segundos", hourTip: "Seleccione Hora", minuteTip: "Seleccione Minuto", diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts index 54f4f723..59f7cdfd 100644 --- a/src/locales/lang/zh.ts +++ b/src/locales/lang/zh.ts @@ -176,6 +176,8 @@ const msg = { when4xx: "当响应代码介于400和499之间时，带有跟踪的HTTP请求和响应示例", when5xx: "当响应代码介于500和599之间时，带有跟踪的HTTP请求和响应示例", taskTitle: "HTTP请求和响应收集规则", + iframeWidgetTip: "添加widget的链接", + iframeSrc: "Iframe链接", seconds: "秒", hourTip: "选择小时", minuteTip: "选择分钟", diff --git a/src/store/data.ts b/src/store/data.ts index ce31dd2c..04a51f52 100644 --- a/src/store/data.ts +++ b/src/store/data.ts @@ -37,3 +37,5 @@ export const TimeRangeConfig = { textAlign: "center", text: "text", }; + +export const ControlsTypes = ["Trace", "Profile", "Log", "DemandLog", "Ebpf", "NetworkProfiling", "ThirdPartyApp"]; diff --git a/src/store/modules/dashboard.ts b/src/store/modules/dashboard.ts index 3258bfbf..7a20c78f 100644 --- a/src/store/modules/dashboard.ts +++ b/src/store/modules/dashboard.ts @@ -21,7 +21,7 @@ import graphql from "@/graphql"; import query from "@/graphql/fetch"; import type { DashboardItem } from "@/types/dashboard"; import { useSelectorStore } from "@/store/modules/selectors"; -import { NewControl, TextConfig, TimeRangeConfig } from "../data"; +import { NewControl, TextConfig, TimeRangeConfig, ControlsTypes } from "../data"; import type { AxiosResponse } from "axios"; import { ElMessage } from "element-plus"; import { useI18n } from "vue-i18n"; @@ -108,7 +108,7 @@ export const dashboardStore = defineStore({ depth: this.entity === EntityType[1].value ? 1 : this.entity === EntityType[0].value ? 2 : 3, }; } - if (["Trace", "Profile", "Log", "DemandLog", "Ebpf", "NetworkProfiling"].includes(type)) { + if (ControlsTypes.includes(type)) { newItem.h = 36; } if (type === "Text") { @@ -168,7 +168,7 @@ export const dashboardStore = defineStore({ showDepth: true, }; } - if (["Trace", "Profile", "Log", "DemandLog", "Ebpf", "NetworkProfiling"].includes(type)) { + if (ControlsTypes.includes(type)) { newItem.h = 32; } if (type === "Text") { diff --git a/src/views/dashboard/configuration/ThirdPartyApp.vue b/src/views/dashboard/configuration/ThirdPartyApp.vue new file mode 100644 index 00000000..da700dc2 --- /dev/null +++ b/src/views/dashboard/configuration/ThirdPartyApp.vue @@ -0,0 +1,89 @@ + + + + diff --git a/src/views/dashboard/configuration/index.ts b/src/views/dashboard/configuration/index.ts index 0055f828..1fb47e4f 100644 --- a/src/views/dashboard/configuration/index.ts +++ b/src/views/dashboard/configuration/index.ts @@ -20,6 +20,7 @@ import Widget from "./Widget.vue"; import Topology from "./Topology.vue"; import Event from "./Event.vue"; import TimeRange from "./TimeRange.vue"; +import ThirdPartyApp from "./ThirdPartyApp.vue"; export default { Text, @@ -27,4 +28,5 @@ export default { Topology, Event, TimeRange, + ThirdPartyApp, }; diff --git a/src/views/dashboard/controls/Text.vue b/src/views/dashboard/controls/Text.vue index 209694da..3c637c76 100644 --- a/src/views/dashboard/controls/Text.vue +++ b/src/views/dashboard/controls/Text.vue @@ -13,7 +13,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. -->