github/skywalking-booster-ui
3
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2026-05-28 10:18:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: enhance the Dark Theme (#336)

Browse Source
This commit is contained in:
Fine0830
2023-11-15 19:53:23 +08:00
committed by GitHub
parent 832dc1676b
commit a4271bb479
11 changed files with 151 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/hooks/useLegendProcessor.ts
View File

@@ -16,6 +16,9 @@
*/
import type { LegendOptions } from "@/types/dashboard";
import { isDef } from "@/utils/is";
import { DarkChartColors, LightChartColors } from "./data";
import { useAppStoreWithOut } from "@/store/modules/app";
import { Themes } from "@/constants/data";
export default function useLegendProcess(legend?: LegendOptions) {
let isRight = false;
@@ -96,37 +99,11 @@ export default function useLegendProcess(legend?: LegendOptions) {
return { source, headers };
}
function chartColors(keys: string[]) {
let color: string[] = [];
switch (keys.length) {
case 2:
color = ["#FF6A84", "#a0b1e6"];
break;
case 1:
color = ["#3f96e3"];
break;
default:
color = [
"#30A4EB",
"#45BFC0",
"#FFCC55",
"#FF6A84",
"#a0a7e6",
"#c23531",
"#2f4554",
"#61a0a8",
"#d48265",
"#91c7ae",
"#749f83",
"#ca8622",
"#bda29a",
"#6e7074",
"#546570",
"#c4ccd3",
];
break;
}
return color;
function chartColors() {
const appStore = useAppStoreWithOut();
const list = appStore.theme === Themes.Dark ? DarkChartColors : LightChartColors;
return list;
}
return { showEchartsLegend, isRight, aggregations, chartColors };
}