feat: 增加至少勾选一项逻辑交互

src/components/mui/MyMultipleMenu.tsx

@@ -90,6 +90,7 @@ type IMyMultipleMenuProps = {
 	selectAllText?: string; // 全选的文字
 	showHiddenIcon?: boolean; // 是否显示 展开收起箭头
 	iconColor?: string; // 展开收起箭头的颜色
+	topContent?: any; // 在全选上面的元素   在全选上面  常用于解释说明
 };
 
 const MyMultipleMenu = (props: IMyMultipleMenuProps) => {
@@ -102,6 +103,7 @@ const MyMultipleMenu = (props: IMyMultipleMenuProps) => {
 		selectAllText = "全部",
 		showHiddenIcon = true,
 		iconColor,
+		topContent = null,
 	} = props;
 	// 下拉框展示的相对位置参考元素
 	const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
@@ -182,6 +184,7 @@ const MyMultipleMenu = (props: IMyMultipleMenuProps) => {
 						"aria-labelledby": "basic-button",
 					}}
 				>
+					{topContent}
 					{showSelectAll && (
 						<MenuItem onClick={() => handleMenuAllClick()} key="indeterminate">
 							<Checkbox

src/components/mui/MyTableNew.tsx

@@ -359,8 +359,8 @@ const MyTable = (props: IMyTableProps) => {
 		}
 		return (
 			<TableBody>
-				{rows.map((row) => (
-					<TableRow key={row[tableKey]}>
+				{rows.map((row, rowIndex) => (
+					<TableRow key={row[tableKey] || rowIndex}>
 						{hasCheckbox && (
 							<TableCell
 								align="left"

src/components/mui/MyTooltip.tsx

@@ -8,6 +8,7 @@
  */
 import { Tooltip, TooltipProps } from "@mui/material";
 import { ThemeProvider, createTheme } from "@mui/material/styles";
+import { useMemo } from "react";
 
 interface IMyTooltipProps extends Omit<TooltipProps, "title"> {
 	title?: string | boolean;
@@ -20,7 +21,14 @@ const theme = createTheme({
 				tooltip: {
 					backgroundColor: "rgba(7, 19, 38, .8)",
 					color: "#fff",
+					padding: "0",
 				},
+				// tooltipPlacementTop: {
+				// maxHeight: "45vh",
+				// overflow: "overlay",
+				// boxSizing: "border-box",
+				// },
+				// MuiTooltip-tooltip MuiTooltip-tooltipArrow MuiTooltip-tooltipPlacementTop css-1315pvc-MuiTooltip-tooltip
 				arrow: {
 					"&:before": {
 						backgroundColor: "#071326",
@@ -34,12 +42,27 @@ const theme = createTheme({
 
 const MyTooltip = (props: IMyTooltipProps) => {
 	const { title = false, children, placement = "top", ...other } = props;
+
+	const randerTitle = useMemo(() => {
+		if (title) {
+			return (
+				<div
+					style={{ maxHeight: "36vh", overflow: "overlay", padding: "4px 8px" }}
+				>
+					{title}
+				</div>
+			);
+		} else {
+			return "";
+		}
+	}, [title]);
+
 	return (
 		<ThemeProvider theme={theme}>
 			<Tooltip
 				// interactive={true}
 				arrow
-				title={title || ''}
+				title={randerTitle}
 				placement={placement}
 				{...other}
 			>

src/views/Project/ProjectData/SeeDataset/index.module.css

@@ -161,3 +161,10 @@
 .borderTop {
 	border-top: 1px solid rgba(240, 242, 245, 1);
 }
+
+.topContent {
+	padding: 4px 16px;
+	color: rgba(138, 144, 153, 1);
+	line-height: 20px;
+	font-size: 12px;
+}

src/views/Project/ProjectData/SeeDataset/index.tsx

@@ -214,6 +214,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
 	// 显示数据变化
 	const handleSetShowData = (e: any) => {
 		if (e.length === 0) {
+			setShowData([dataTypes[0].value]);
 			return;
 		}
 		setShowData(e);
@@ -412,6 +413,9 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
 								setValue={(e: any) => handleSetShowData(e)}
 								showSelectAll={true}
 								iconColor="rgba(138, 144, 153, 1)"
+								topContent={
+									<div className={style.topContent}>至少勾选一项</div>
+								}
 							>
 								<span className={style.selectShowData}>
 									选择显示数据({showData.length})