asder

config/routes.ts

@@ -109,6 +109,11 @@ export default [
             path: "/work/dobustrain/:id",
             component: "./dobustrain",
           },
+          {
+            name: "我的实训",
+            path: "/work/mybustrain",
+            component: "./mybustrain",
+          },
         ],
       },
       {

src/components/ProductCard/sxcard.jsx

@@ -70,7 +70,7 @@ export default function ShopProductCard({
           <Label
             variant="filled"
             color={
-              (type === 1 && "warning") || (type === 3 && "default") || "info"
+              (type === 1 && "warning") || (type === 2 && "info") || (type === 3 && "default") || (type === 4 && "error") || "danger"
             }
             sx={{
               zIndex: 9,

src/layouts/dashboard/nav/config.jsx

@@ -41,7 +41,7 @@ const navConfig = [
     children:[
       {
         title: "我的实训",
-        path: "/work/usera",
+        path: "/work/mybustrain",
         icon: icon("ic_training"),
       },
       {

src/pages/bustrain/index.jsx

@@ -7,11 +7,15 @@ import ShopProductCard from "@/components/ProductCard/sxcard";
 import { doFetch } from "@/utils/doFetch";
 import PRODUCTS from "@/_mock/products";
 import { Box, Container, Grid, Stack, Typography } from "@mui/material";
+import Checkbox from "@mui/material/Checkbox";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import FormGroup from "@mui/material/FormGroup";
 import { useRequest } from "ahooks";
-import { Empty, message } from "antd";
+import { Empty, Input, message } from "antd";
 import { useMemo, useState } from "react";
 import "./index.less";
 
+
 function Lessons() {
   const [dialogprops, setdialogprops] = useState({
     open: false,
@@ -19,7 +23,7 @@ function Lessons() {
   const [params, setparams] = useState({
     trainName: "",
     status: null,
-    type: null,
+    typeList: ["1", "2", "3", "4", "5"],
   });
 
   const handleClose = () => {
@@ -42,16 +46,18 @@ function Lessons() {
 
   const datalist = useRequest(
     async () => {
+      
       let res = await doFetch({ url: "/busTrain/list", params });
       return res?.data?.dataList;
     },
     {
       debounceWait: 400,
+      refreshDeps: [params],
     }
   );
 
   const edit = (row) => {
-    console.log(row);
+    
     setdialogprops({
       open: true,
       defaultFormValue: { ...row },
@@ -258,6 +264,111 @@ function Lessons() {
       >
         <Typography variant="h5">实训管理</Typography>
         <Stack spacing={2} direction="row">
+          <FormControlLabel
+            control={
+              <Checkbox
+                checked={params?.typeList?.length === 5}
+                indeterminate={
+                  params?.typeList?.length > 0 && params?.typeList?.length < 5
+                }
+              />
+            }
+            label="全部"
+            onChange={(e) => {
+              setparams((s) => {
+                let news = [];
+                if (e.target.checked) {
+                  news = ["1", "2", "3", "4", "5"];
+                }
+                return {
+                  ...s,
+                  typeList: news,
+                };
+              });
+            }}
+          />
+          <FormGroup
+            row
+            value={params?.typeList ?? []}
+            onChange={(e) => {
+              let val = e.target.value;
+              setparams((s) => {
+                let news = [...s?.typeList];
+                if (news.includes(val)) {
+                  news = news.filter((it) => it !== val);
+                } else {
+                  news = [...news, val];
+                }
+                console.log(news);
+                return {
+                  ...s,
+                  typeList: news,
+                };
+              });
+            }}
+          >
+            <FormControlLabel
+              control={
+                <Checkbox
+                  checked={params?.typeList?.includes("1")}
+                  color={"warning"}
+                />
+              }
+              label="待发布"
+              value={1}
+            />
+            <FormControlLabel
+              control={
+                <Checkbox
+                  checked={params?.typeList?.includes("2")}
+                  color={"info"}
+                />
+              }
+              label="已发布"
+              value={2}
+            />
+            <FormControlLabel
+              control={
+                <Checkbox
+                  checked={params?.typeList?.includes("3")}
+                  color={"default"}
+                />
+              }
+              label="已发布(暂停)"
+              value={3}
+            />
+            <FormControlLabel
+              control={
+                <Checkbox
+                  checked={params?.typeList?.includes("4")}
+                  color={"default"}
+                />
+              }
+              label="已结束"
+              value={4}
+            />
+            <FormControlLabel
+              control={
+                <Checkbox
+                  checked={params?.typeList?.includes("5")}
+                  color={"default"}
+                />
+              }
+              label="已关闭"
+              value={5}
+            />
+          </FormGroup>
+          <Input
+            placeholder="请输入课程名称"
+            style={{ width: 200 }}
+            value={params?.trainName}
+            onChange={(e) => {
+              setparams((s) => ({
+                ...s,
+                trainName: e.target.value,
+              }));
+            }}
+          ></Input>
           <ImportExcel></ImportExcel>
           <PremButton
             btn={{

src/pages/lessons/index.jsx

@@ -5,6 +5,7 @@ import PremButton from "@/components/PremButton";
 import ShopProductCard from "@/components/ProductCard";
 import ShopProductLoadingCard from "@/components/ProductCard/loading";
 import { doFetch } from "@/utils/doFetch";
+import generateColor from "@/utils/pickColor";
 import PRODUCTS from "@/_mock/products";
 import { Box, Container, Grid, Stack, Typography } from "@mui/material";
 import Checkbox from "@mui/material/Checkbox";
@@ -50,7 +51,7 @@ function Lessons() {
     },
     {
       debounceWait: 400,
-      refreshDeps:[params]
+      refreshDeps: [params],
     }
   );
 
@@ -312,12 +313,17 @@ function Lessons() {
             />
           </FormGroup>
 
-          <Input placeholder="请输入课程名称" style={{ width: 200 }} value={params?.courseName} onChange={(e)=>{
-            setparams(s=>({
+          <Input
+            placeholder="请输入课程名称"
+            style={{ width: 200 }}
+            value={params?.courseName}
+            onChange={(e) => {
+              setparams((s) => ({
                 ...s,
-              courseName:e.target.value
-            }))
-          }}></Input>
+                courseName: e.target.value,
+              }));
+            }}
+          ></Input>
 
           <ImportExcel></ImportExcel>
 

src/pages/mybustrain/index.less

+.white {
+  .ant-pro-card {
+    background-color: #f6f6f6 !important;
+  }
+  .ant-table-tbody,td {
+    background-color: #f9f9f9 !important;
+  }
+}

src/utils/pickColor.js

+export default function generateColor(baseColor) {
+  // 生成背景色
+  const backgroundColor = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+
+  // 计算附加色 1
+  const color1 = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+  color1.r -= Math.round((color1.r - baseColor.r) * 0.25);
+  color1.g -= Math.round((color1.g - baseColor.g) * 0.25);
+  color1.b -= Math.round((color1.b - baseColor.b) * 0.25);
+
+  // 计算附加色 2
+  const color2 = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+  color2.r -= Math.round((color2.r - baseColor.r) * 0.5);
+  color2.g -= Math.round((color2.g - baseColor.g) * 0.5);
+  color2.b -= Math.round((color2.b - baseColor.b) * 0.5);
+
+  // 计算警告色
+  const warningColor = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+  warningColor.r -= Math.round((warningColor.r - baseColor.r) * 0.3);
+  warningColor.g -= Math.round((warningColor.g - baseColor.g) * 0.3);
+  warningColor.b -= Math.round((warningColor.b - baseColor.b) * 0.3);
+
+  // 计算成功色
+  const successColor = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+  successColor.r -= Math.round((successColor.r - baseColor.r) * 0.2);
+  successColor.g -= Math.round((successColor.g - baseColor.g) * 0.2);
+  successColor.b -= Math.round((successColor.b - baseColor.b) * 0.2);
+
+  // 计算失败色
+  const failureColor = {
+    r: 255,
+    g: 255,
+    b: 255,
+  };
+  failureColor.r -= Math.round((failureColor.r - baseColor.r) * 0.2);
+  failureColor.g -= Math.round((failureColor.g - baseColor.g) * 0.2);
+  failureColor.b -= Math.round((failureColor.b - baseColor.b) * 0.2);
+
+  // 转换为十六进制颜色值
+  function rgbToHex(rgbColor) {
+    const { r, g, b } = rgbColor;
+    const red = Math.round(r);
+    const green = Math.round(g);
+    const blue = Math.round(b);
+
+    const hexRed = red.toString(16).padStart(2, "0");
+    const hexGreen = green.toString(16).padStart(2, "0");
+    const hexBlue = blue.toString(16).padStart(2, "0");
+
+    return `#${hexRed}${hexGreen}${hexBlue}`;
+  }
+
+  const hexBaseColor = baseColor;
+  const hexBackgroundColor = rgbToHex(backgroundColor);
+  const hexColor1 = rgbToHex(color1);
+  const hexColor2 = rgbToHex(color2);
+  const hexWarningColor = rgbToHex(warningColor);
+  const hexSuccessColor = rgbToHex(successColor);
+  const hexFailureColor = rgbToHex(failureColor);
+
+  return {
+    baseColor: hexBaseColor,
+    backgroundColor: hexBackgroundColor,
+    color1: hexColor1,
+    color2: hexColor2,
+    warningColor: hexWarningColor,
+    successColor: hexSuccessColor,
+    failureColor: hexFailureColor,
+  };
+}
+
+function generateColorScheme(baseColor) {
+  // 将基础色转换为 RGB 格式
+  const rgbBaseColor = hexToRGB(baseColor);
+
+  // 生成配色方案
+  const colorScheme = {
+    baseColor: baseColor,
+    backgroundColor: rgbBaseColor,
+    color1: "",
+    color2: "",
+    warningColor: "",
+    successColor: "",
+    failureColor: "",
+  };
+
+  // 生成其他颜色
+  const colors = [
+    { name: "color1", offset: 0.25 },
+    { name: "color2", offset: 0.5 },
+    { name: "warningColor", offset: 0.3 },
+    { name: "successColor", offset: 0.2 },
+    { name: "failureColor", offset: 0.2 },
+  ];
+
+  for (const color of colors) {
+    const newColor = generateOffsetColor(rgbBaseColor, color.offset);
+    colorScheme[color.name] = rgbToHex(newColor);
+  }
+
+  return colorScheme;
+}