feat: 修改tabs组件样式， 完成参数样式

src/components/mui/Tabs.tsx

@@ -11,27 +11,62 @@ import { isEqual } from "lodash";
 import { useState } from "react";
 import { Box } from "@mui/system";
 import Tab from "@mui/material/Tab";
+import { ThemeProvider, createTheme } from "@mui/material/styles";
 import { TabContext, TabList, TabPanel } from "@mui/lab";
 import { Typography } from "@mui/material";
 
 interface ITabList {
 	label: string;
 	value: string;
-	component: JSX.Element;
+	component: JSX.Element | React.ReactNode;
 	icon?: string;
 	iconed?: string;
 	hide?: boolean;
+	disabled?: boolean;
 }
 
 interface IProps {
 	tabList: ITabList[];
 	defaultValue?: string;
+	allowNullValue?: boolean; // 是否允许空值
 }
 
+const theme = createTheme({
+	components: {
+		MuiTab: {
+			styleOverrides: {
+				root: {
+                    paddingLeft: 0,
+                    paddingRight: 0,
+                    paddingTop: '8px',
+                    paddingBottom: '8px',
+					minWidth: '20px',
+					marginRight: '32px',
+					color: '#8A9099',
+					selected: {
+						color: '#1976d2'
+					},
+					"&.Mui-disabled": {
+						color: '#C2C6CC',
+					},
+				},
+			},
+		},
+		// #C2C6CC
+		MuiTabs:{
+			styleOverrides: {
+				indicator: {
+					backgroundColor: '#1370FF',
+				}
+			}
+		},
+	},
+});
+
 const Tabs = (props: IProps) => {
-	const { tabList, defaultValue } = props;
+	const { tabList, defaultValue, allowNullValue = false } = props;
 	const [value, setValue] = useState(
-		defaultValue || tabList.filter((e) => !e.hide)[0].value
+		defaultValue ? defaultValue : allowNullValue ? '' : tabList.filter((e) => !e.hide)[0].value
 	);
 
 	const onChange = (val: string) => {
@@ -58,6 +93,7 @@ const Tabs = (props: IProps) => {
 	};
 
 	return (
+		<ThemeProvider theme={theme}>
 		<TabContext value={value}>
 			<Box sx={{ borderBottom: 1, borderColor: "#F0F2F5" }}>
 				<TabList
@@ -74,6 +110,7 @@ const Tabs = (props: IProps) => {
 									label={labelRender(item, key)}
 									value={item.value}
 									id={item.value}
+									disabled={item.disabled}
 								/>
 							);
 						})}
@@ -93,6 +130,7 @@ const Tabs = (props: IProps) => {
 					);
 				})}
 		</TabContext>
+		</ThemeProvider>
 	);
 };
 const handleEqual = (prvProps: IProps, nextProps: IProps) => {

src/views/WorkFlowEdit/components/ParameterSetting/index.module.css

@@ -133,3 +133,6 @@
 	line-height: 22px;
 	color: rgba(138, 144, 153, 1);
 }
+.paramsGroup{
+	padding-bottom: 24px;
+}
\ No newline at end of file