mirror of
https://github.com/apache/skywalking-booster-ui.git
synced 2025-05-12 15:52:57 +00:00
refactor: update widget types
This commit is contained in:
Fine
parent
569c4f6301
commit
e63ceb0891
@ -188,87 +188,104 @@ export const SortOrder = [
|
||||
{ label: "DES", value: "DES" },
|
||||
{ label: "ASC", value: "ASC" },
|
||||
];
|
||||
export enum WidgetType {
|
||||
Widget = "Widget",
|
||||
Topology = "Topology",
|
||||
Tab = "Tab",
|
||||
Text = "Text",
|
||||
TimeRange = "TimeRange",
|
||||
Trace = "Trace",
|
||||
Log = "Log",
|
||||
Profile = "Profile",
|
||||
Ebpf = "Ebpf",
|
||||
DemandLog = "DemandLog",
|
||||
Event = "Event",
|
||||
NetworkProfiling = "NetworkProfiling",
|
||||
ContinuousProfiling = "ContinuousProfiling",
|
||||
ThirdPartyApp = "ThirdPartyApp",
|
||||
TaskTimeline = "TaskTimeline",
|
||||
}
|
||||
export const AllTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
|
||||
{ name: "merge", content: "Add Trace", id: "addTrace" },
|
||||
{ name: "assignment", content: "Add Log", id: "addLog" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "device_hub", content: "Add Topology", id: WidgetType.Topology },
|
||||
{ name: "merge", content: "Add Trace", id: WidgetType.Trace },
|
||||
{ name: "assignment", content: "Add Log", id: WidgetType.Log },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const ServiceTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
|
||||
{ name: "merge", content: "Add Trace", id: "addTrace" },
|
||||
{ name: "timeline", content: "Add Trace Profiling", id: "addProfile" },
|
||||
{ name: "insert_chart", content: "Add eBPF Profiling", id: "addEbpf" },
|
||||
{ name: "continuous_profiling", content: "Add Continuous Profiling", id: "addContinuousProfiling" },
|
||||
{ name: "assignment", content: "Add Log", id: "addLog" },
|
||||
{ name: "demand", content: "Add On Demand Log", id: "addDemandLog" },
|
||||
{ name: "event", content: "Add Event", id: "addEvent" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "device_hub", content: "Add Topology", id: WidgetType.Topology },
|
||||
{ name: "merge", content: "Add Trace", id: WidgetType.Trace },
|
||||
{ name: "timeline", content: "Add Trace Profiling", id: WidgetType.Profile },
|
||||
{ name: "insert_chart", content: "Add eBPF Profiling", id: WidgetType.Ebpf },
|
||||
{ name: "continuous_profiling", content: "Add Continuous Profiling", id: WidgetType.ContinuousProfiling },
|
||||
{ name: "assignment", content: "Add Log", id: WidgetType.Log },
|
||||
{ name: "demand", content: "Add On Demand Log", id: WidgetType.DemandLog },
|
||||
{ name: "event", content: "Add Event", id: WidgetType.Event },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const InstanceTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "merge", content: "Add Trace", id: "addTrace" },
|
||||
{ name: "assignment", content: "Add Log", id: "addLog" },
|
||||
{ name: "demand", content: "Add On Demand Log", id: "addDemandLog" },
|
||||
{ name: "event", content: "Add Event", id: "addEvent" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "merge", content: "Add Trace", id: WidgetType.Trace },
|
||||
{ name: "assignment", content: "Add Log", id: WidgetType.Log },
|
||||
{ name: "demand", content: "Add On Demand Log", id: WidgetType.DemandLog },
|
||||
{ name: "event", content: "Add Event", id: WidgetType.Event },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
{
|
||||
name: "timeline",
|
||||
content: "Add Network Profiling",
|
||||
id: "addNetworkProfiling",
|
||||
id: WidgetType.NetworkProfiling,
|
||||
},
|
||||
];
|
||||
export const EndpointTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
|
||||
{ name: "merge", content: "Add Trace", id: "addTrace" },
|
||||
{ name: "assignment", content: "Add Log", id: "addLog" },
|
||||
{ name: "event", content: "Add Event", id: "c" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "device_hub", content: "Add Topology", id: WidgetType.Topology },
|
||||
{ name: "merge", content: "Add Trace", id: WidgetType.Trace },
|
||||
{ name: "assignment", content: "Add Log", id: WidgetType.Log },
|
||||
{ name: "event", content: "Add Event", id: WidgetType.Event },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const ProcessTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "task_timeline", content: "Add Task Timeline", id: "addTaskTimeline" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "task_timeline", content: "Add Task Timeline", id: WidgetType.TaskTimeline },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const ProcessRelationTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const ServiceRelationTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "device_hub", content: "Add Topology", id: WidgetType.Topology },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
|
||||
export const EndpointRelationTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
export const InstanceRelationTools = [
|
||||
{ name: "playlist_add", content: "Add Widget", id: "addWidget" },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: "addTab" },
|
||||
{ name: "library_books", content: "Add Text", id: "addText" },
|
||||
{ name: "device_hub", content: "Add Topology", id: "addTopology" },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: "addIframe" },
|
||||
{ name: "playlist_add", content: "Add Widget", id: WidgetType.Widget },
|
||||
{ name: "all_inbox", content: "Add Tabs", id: WidgetType.Tab },
|
||||
{ name: "library_books", content: "Add Text", id: WidgetType.Text },
|
||||
{ name: "device_hub", content: "Add Topology", id: WidgetType.Topology },
|
||||
{ name: "add_iframe", content: "Add Iframe", id: WidgetType.ThirdPartyApp },
|
||||
];
|
||||
|
||||
export const ScopeType = [
|
||||
@ -349,21 +366,3 @@ export enum CallTypes {
|
||||
Server = "SERVER",
|
||||
Client = "CLIENT",
|
||||
}
|
||||
|
||||
export enum WidgetType {
|
||||
Widget = "Widget",
|
||||
Topology = "Topology",
|
||||
Tab = "Tab",
|
||||
Text = "Text",
|
||||
TimeRange = "TimeRange",
|
||||
Trace = "Trace",
|
||||
Log = "Log",
|
||||
Profile = "Profile",
|
||||
Ebpf = "Ebpf",
|
||||
DemandLog = "DemandLog",
|
||||
Event = "Event",
|
||||
NetworkProfiling = "NetworkProfiling",
|
||||
ContinuousProfiling = "ContinuousProfiling",
|
||||
ThirdPartyApp = "ThirdPartyApp",
|
||||
TaskTimeline = "TaskTimeline",
|
||||
}
|
||||
|
||||
@ -155,7 +155,7 @@ limitations under the License. -->
|
||||
const selectorStore = useSelectorStore();
|
||||
const appStore = useAppStoreWithOut();
|
||||
const params = useRoute().params;
|
||||
const toolIcons = ref<{ name: string; content: string; id: string }[]>(AllTools);
|
||||
const toolIcons = ref<{ name: string; content: string; id: WidgetType }[]>(AllTools);
|
||||
const loading = ref<boolean>(false);
|
||||
const states = reactive<{
|
||||
destService: string;
|
||||
@ -398,7 +398,7 @@ limitations under the License. -->
|
||||
loading.value = false;
|
||||
}
|
||||
|
||||
async function clickIcons(t: { id: string; content: string; name: string }) {
|
||||
async function clickIcons(t: { id: WidgetType; content: string; name: string }) {
|
||||
if (dashboardStore.selectedGrid && dashboardStore.selectedGrid.type === "Tab") {
|
||||
setTabControls(t.id);
|
||||
return;
|
||||
@ -410,106 +410,20 @@ limitations under the License. -->
|
||||
setControls(t.id);
|
||||
}
|
||||
|
||||
function setTabControls(id: string) {
|
||||
switch (id) {
|
||||
case "addWidget":
|
||||
dashboardStore.addTabControls(WidgetType.Widget);
|
||||
break;
|
||||
case "addTrace":
|
||||
dashboardStore.addTabControls(WidgetType.Trace);
|
||||
break;
|
||||
case "addLog":
|
||||
dashboardStore.addTabControls(WidgetType.Log);
|
||||
break;
|
||||
case "addProfile":
|
||||
dashboardStore.addTabControls(WidgetType.Profile);
|
||||
break;
|
||||
case "addEbpf":
|
||||
dashboardStore.addTabControls(WidgetType.Ebpf);
|
||||
break;
|
||||
case "addTopology":
|
||||
dashboardStore.addTabControls(WidgetType.Topology);
|
||||
break;
|
||||
case "addText":
|
||||
dashboardStore.addTabControls(WidgetType.Text);
|
||||
break;
|
||||
case "addDemandLog":
|
||||
dashboardStore.addTabControls(WidgetType.DemandLog);
|
||||
break;
|
||||
case "addEvent":
|
||||
dashboardStore.addTabControls(WidgetType.Event);
|
||||
break;
|
||||
case "addNetworkProfiling":
|
||||
dashboardStore.addTabControls(WidgetType.NetworkProfiling);
|
||||
break;
|
||||
case "addContinuousProfiling":
|
||||
dashboardStore.addTabControls(WidgetType.ContinuousProfiling);
|
||||
break;
|
||||
case "addTimeRange":
|
||||
dashboardStore.addTabControls(WidgetType.TimeRange);
|
||||
break;
|
||||
case "addIframe":
|
||||
dashboardStore.addTabControls(WidgetType.ThirdPartyApp);
|
||||
break;
|
||||
case "addTaskTimeline":
|
||||
dashboardStore.addTabControls(WidgetType.TaskTimeline);
|
||||
break;
|
||||
default:
|
||||
function setTabControls(id: WidgetType) {
|
||||
if (!WidgetType[id]) {
|
||||
ElMessage.info("Don't support this control");
|
||||
break;
|
||||
return;
|
||||
}
|
||||
dashboardStore.addTabControls(id);
|
||||
}
|
||||
|
||||
function setControls(id: string) {
|
||||
switch (id) {
|
||||
case "addWidget":
|
||||
dashboardStore.addControl(WidgetType.Widget);
|
||||
break;
|
||||
case "addTab":
|
||||
dashboardStore.addControl(WidgetType.Tab);
|
||||
break;
|
||||
case "addTrace":
|
||||
dashboardStore.addControl(WidgetType.Trace);
|
||||
break;
|
||||
case "addProfile":
|
||||
dashboardStore.addControl(WidgetType.Profile);
|
||||
break;
|
||||
case "addEbpf":
|
||||
dashboardStore.addControl(WidgetType.Ebpf);
|
||||
break;
|
||||
case "addLog":
|
||||
dashboardStore.addControl(WidgetType.Log);
|
||||
break;
|
||||
case "addTopology":
|
||||
dashboardStore.addControl(WidgetType.Topology);
|
||||
break;
|
||||
case "addText":
|
||||
dashboardStore.addControl(WidgetType.Text);
|
||||
break;
|
||||
case "addDemandLog":
|
||||
dashboardStore.addControl(WidgetType.DemandLog);
|
||||
break;
|
||||
case "addEvent":
|
||||
dashboardStore.addControl(WidgetType.Event);
|
||||
break;
|
||||
case "addNetworkProfiling":
|
||||
dashboardStore.addControl(WidgetType.NetworkProfiling);
|
||||
break;
|
||||
case "addContinuousProfiling":
|
||||
dashboardStore.addControl(WidgetType.ContinuousProfiling);
|
||||
break;
|
||||
case "addTimeRange":
|
||||
dashboardStore.addControl(WidgetType.TimeRange);
|
||||
break;
|
||||
case "addIframe":
|
||||
dashboardStore.addControl(WidgetType.ThirdPartyApp);
|
||||
break;
|
||||
case "addTaskTimeline":
|
||||
dashboardStore.addControl(WidgetType.TaskTimeline);
|
||||
break;
|
||||
default:
|
||||
dashboardStore.addControl(WidgetType.Widget);
|
||||
function setControls(id: WidgetType) {
|
||||
if (!WidgetType[id]) {
|
||||
ElMessage.info("Don't support this control");
|
||||
return;
|
||||
}
|
||||
dashboardStore.addControl(id);
|
||||
}
|
||||
|
||||
async function fetchPods(type: string, serviceId: string, setPod: boolean, param?: { keyword?: string }) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user