page finish

config/routes.ts

@@ -144,6 +144,16 @@ export default [
             path: "/work/myrecord",
             component: "./myrecord",
           },
+          {
+            name: "教学情况",
+            path: "/work/situation",
+            component: "./situation",
+          },
+          {
+            name: "学习记录",
+            path: "/work/studyrecord",
+            component: "./studyrecord",
+          },
         ],
       },
       {

src/components/logo copy/Logo.jsx

-import PropTypes from 'prop-types';
-import { forwardRef } from 'react';
-import { Link as RouterLink } from 'react-router-dom';
-// @mui
-import { useTheme } from '@mui/material/styles';
-import { Box, Link } from '@mui/material';
-
-// ----------------------------------------------------------------------
-
-const Logo = forwardRef(({ disabledLink = false, sx, ...other }, ref) => {
-  const theme = useTheme();
-
-  const PRIMARY_LIGHT = theme.palette.primary.light;
-
-  const PRIMARY_MAIN = theme.palette.primary.main;
-
-  const PRIMARY_DARK = theme.palette.primary.dark;
-
-  // OR using local (public folder)
-  // -------------------------------------------------------
-  // const logo = (
-  //   <Box
-  //     component="img"
-  //     src="/logo/logo_single.svg" => your path
-  //     sx={{ width: 40, height: 40, cursor: 'pointer', ...sx }}
-  //   />
-  // );
-
-  const logo = (
-    <Box
-      ref={ref}
-      component="div"
-      sx={{
-        width: 40,
-        height: 40,
-        display: 'inline-flex',
-        ...sx,
-      }}
-      {...other}
-    >
-      <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 512 512">
-        <defs>
-          <linearGradient id="BG1" x1="100%" x2="50%" y1="9.946%" y2="50%">
-            <stop offset="0%" stopColor={PRIMARY_DARK} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-
-          <linearGradient id="BG2" x1="50%" x2="50%" y1="0%" y2="100%">
-            <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-
-          <linearGradient id="BG3" x1="50%" x2="50%" y1="0%" y2="100%">
-            <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-        </defs>
-
-        <g fill={PRIMARY_MAIN} fillRule="evenodd" stroke="none" strokeWidth="1">
-          <path
-            fill="url(#BG1)"
-            d="M183.168 285.573l-2.918 5.298-2.973 5.363-2.846 5.095-2.274 4.043-2.186 3.857-2.506 4.383-1.6 2.774-2.294 3.939-1.099 1.869-1.416 2.388-1.025 1.713-1.317 2.18-.95 1.558-1.514 2.447-.866 1.38-.833 1.312-.802 1.246-.77 1.18-.739 1.111-.935 1.38-.664.956-.425.6-.41.572-.59.8-.376.497-.537.69-.171.214c-10.76 13.37-22.496 23.493-36.93 29.334-30.346 14.262-68.07 14.929-97.202-2.704l72.347-124.682 2.8-1.72c49.257-29.326 73.08 1.117 94.02 40.927z"
-          />
-          <path
-            fill="url(#BG2)"
-            d="M444.31 229.726c-46.27-80.956-94.1-157.228-149.043-45.344-7.516 14.384-12.995 42.337-25.267 42.337v-.142c-12.272 0-17.75-27.953-25.265-42.337C189.79 72.356 141.96 148.628 95.69 229.584c-3.483 6.106-6.828 11.932-9.69 16.996 106.038-67.127 97.11 135.667 184 137.278V384c86.891-1.611 77.962-204.405 184-137.28-2.86-5.062-6.206-10.888-9.69-16.994"
-          />
-          <path
-            fill="url(#BG3)"
-            d="M450 384c26.509 0 48-21.491 48-48s-21.491-48-48-48-48 21.491-48 48 21.491 48 48 48"
-          />
-        </g>
-      </svg>
-    </Box>
-  );
-
-  if (disabledLink) {
-    return <>{logo}</>;
-  }
-
-  return (
-    <Link to="/" component={RouterLink} sx={{ display: 'contents' }}>
-      {logo}
-    </Link>
-  );
-});
-
-Logo.propTypes = {
-  sx: PropTypes.object,
-  disabledLink: PropTypes.bool,
-};
-
-export default Logo;

src/components/logo copy/index.jsx

-export { default } from './Logo';

src/layouts/dashboard/nav/config.jsx

@@ -31,7 +31,7 @@ const navConfig = [
       },
       {
         title: "教学情况",
-        path: "/work/userc",
+        path: "/work/situation",
         icon: icon("ic_jiaoxue"),
       },
     ],
@@ -68,7 +68,7 @@ const navConfig = [
       },
       {
         title: "学习记录",
-        path: "/work/userc",
+        path: "/work/studyrecord",
         icon: icon("ic_list"),
       },
     

src/pages/myrecord/index.jsx

 import AutoTable from "@/components/AutoTable";
+import DraggableDialog from "@/components/DraggableDialog";
+import PremButton from "@/components/PremButton";
+import { doFetch } from "@/utils/doFetch";
+import { ProDescriptions } from "@ant-design/pro-components";
 import { Box, Container, Stack, Typography } from "@mui/material";
-import { useMemo, useRef } from "react";
+import dayjs from "dayjs";
+import duration from "dayjs/plugin/duration";
+import { useMemo, useRef, useState } from "react";
 import "./index.less";
 
+dayjs.extend(duration);
+
 function Record() {
   const actionRef = useRef();
+  const [dialogprops, setdialogprops] = useState({
+    open: false,
+  });
+  const handleClose = () => {
+    setdialogprops((s) => ({
+      ...s,
+      open: false,
+    }));
+  };
+  const detailcolumns = [
+    { title: "学生姓名", dataIndex: "studentName", key: "studentName" },
+    { title: "学生账号", dataIndex: "studentAccount", key: "studentAccount" },
+    { title: "课程名称", dataIndex: "courseName", key: "courseName" },
+    { title: "实训名称", dataIndex: "trainName", key: "trainName" },
+    { title: "实验名称", dataIndex: "experimentName", key: "experimentName" },
+    {
+      title: "实验时长（分钟）",
+      dataIndex: "testTime",
+      key: "testTime",
+    },
+
+    { title: "分数", dataIndex: "score", key: "score", hideInSearch: true },
+    { title: "权重", dataIndex: "weight", key: "weight", hideInSearch: true },
+    { title: "分数", dataIndex: "scoreWeight", key: "scoreWeight" },
+    {
+      title: "提交时间",
+      dataIndex: "finishTime",
+      key: "finishTimeRange",
+    },
+    {
+      title: "批阅人",
+      dataIndex: "reviewUserName",
+      key: "reviewUserName",
+    },
+    {
+      title: "批阅时间",
+      dataIndex: "reviewTime",
+      key: "reviewTime",
+    },
+  ];
+
+  const detail = (text, row, _, action) => {
+    return (
+      <PremButton
+        btn={{
+          size: "small",
+          variant: "text",
+          color: "inherit",
+          onClick: async () => {
+            let res = await doFetch({
+              url: "/studentExperiment/detail",
+              params: { id: row?.id },
+            });
+
+            setdialogprops({
+              open: true,
+              defaultFormValue: { ...res?.data?.data },
+              title: "详情",
+              maxWidth: "md",
+              footer: false,
+            });
+          },
+        }}
+      >
+        详情
+      </PremButton>
+    );
+  };
 
   const columns = useMemo(() => {
     let res = [
@@ -39,14 +115,34 @@ function Record() {
           { label: "已批阅", value: "2" },
         ],
       },
+      {
+        title: "操作",
+        valueType: "option",
+        width: 78,
+        render: (text, row, _, action) => [detail(text, row, _, action)],
+      },
     ];
     return res;
   }, []);
 
   return (
     <Container maxWidth={false}>
+      <DraggableDialog
+        handleClose={handleClose}
+        dialogprops={dialogprops}
+        maxWidth={dialogprops?.maxWidth ?? "sm"}
+        footer={false}
+      >
+        <ProDescriptions
+          columns={detailcolumns}
+          column={2}
+          style={{ marginBottom: 12 }}
+          dataSource={dialogprops?.defaultFormValue}
+        ></ProDescriptions>
+      </DraggableDialog>
+
       <Stack direction={"row"} mb={2}>
-        <Typography variant="h5">成绩单</Typography>
+        <Typography variant="h5">我的成绩</Typography>
       </Stack>
 
       <Box boxShadow={"0 0 18px #f0f0f0"} borderRadius={2}>

src/pages/situation/index.jsx

+import AutoTable from "@/components/AutoTable";
+import { Box, Container, Stack, Typography } from "@mui/material";
+import dayjs from "dayjs";
+import duration from "dayjs/plugin/duration";
+import { useMemo, useRef } from "react";
+import "./index.less";
+
+dayjs.extend(duration);
+
+function Record() {
+  const actionRef = useRef();
+
+  const columns = useMemo(() => {
+    let res = [
+      { title: "姓名", dataIndex: "studentName", key: "studentName" },
+      { title: "账号", dataIndex: "studentAccount", key: "studentAccount" },
+      { title: "课程名称", dataIndex: "courseName", key: "courseName" },
+      { title: "实训名称", dataIndex: "trainName", key: "trainName" },
+      { title: "实验名称", dataIndex: "experimentName", key: "experimentName" },
+      {
+        title: "开始学习时间",
+        dataIndex: "fromTime",
+        key: "fromTimeRange",
+        valueType: "dateTimeRange",
+      },
+      {
+        title: "完成学习时间",
+        dataIndex: "toTime",
+        key: "toTimeRange",
+        valueType: "dateTimeRange",
+      },
+      {
+        title: "学习时长",
+        dataIndex: "duration",
+        key: "duration",
+        hideInSearch: true,
+        render: (txt, row) => {
+          let text = row?.duration ?? 0;
+          const duration = dayjs.duration(text, "seconds");
+          const H = duration.format("HH");
+          const m = duration.format("mm");
+          const s = duration.format("ss");
+          const resH = H != "00" ? `${H}小时` : "";
+          const resm = m != "00" ? `${m}分钟` : "";
+          const ress = s != "00" ? `${s}秒` : "-";
+          return resH + resm + ress;
+        },
+      },
+    ];
+    return res;
+  }, []);
+
+  return (
+    <Container maxWidth={false}>
+      <Stack direction={"row"} mb={2}>
+        <Typography variant="h5">教学情况</Typography>
+      </Stack>
+
+      <Box boxShadow={"0 0 18px #f0f0f0"} borderRadius={2}>
+        <AutoTable
+          actionRef={actionRef}
+          scroll={{ x: 1366 }}
+          columns={[...columns]}
+          path={"/studyRecord/teacher/page"}
+        ></AutoTable>
+      </Box>
+    </Container>
+  );
+}
+
+export default Record;

src/pages/situation/index.less

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

src/pages/studyrecord/index.jsx

+import AutoTable from "@/components/AutoTable";
+import { Box, Container, Stack, Typography } from "@mui/material";
+import dayjs from "dayjs";
+import duration from "dayjs/plugin/duration";
+import { useMemo, useRef } from "react";
+import "./index.less";
+
+dayjs.extend(duration);
+
+function Record() {
+  const actionRef = useRef();
+
+  const columns = useMemo(() => {
+    let res = [
+      {
+        title: "开始学习时间",
+        dataIndex: "fromTime",
+        key: "fromTimeRange",
+        valueType: "dateTimeRange",
+      },
+      {
+        title: "结束学习时间",
+        dataIndex: "toTime",
+        key: "toTimeRange",
+        valueType: "dateTimeRange",
+      },
+      { title: "课程名称", dataIndex: "courseName", key: "courseName" },
+      { title: "实训名称", dataIndex: "trainName", key: "trainName" },
+      { title: "实验名称", dataIndex: "experimentName", key: "experimentName" },
+      {
+        title: "学习时长",
+        dataIndex: "duration",
+        key: "duration",
+        formItemProps: {
+          rules: [{ required: false, message: "此项为必填项" }],
+        },
+        hideInSearch: true,
+        render: (txt, row) => {
+          let text = row?.duration ?? 0;
+          const duration = dayjs.duration(text, "seconds");
+          const H = duration.format("HH");
+          const m = duration.format("mm");
+          const s = duration.format("ss");
+          const resH = H != "00" ? `${H}小时` : "";
+          const resm = m != "00" ? `${m}分钟` : "";
+          const ress = s != "00" ? `${s}秒` : "-";
+          return resH + resm + ress;
+        },
+      },
+    ];
+    return res;
+  }, []);
+
+  return (
+    <Container maxWidth={false}>
+      <Stack direction={"row"} mb={2}>
+        <Typography variant="h5">学习记录</Typography>
+      </Stack>
+
+      <Box boxShadow={"0 0 18px #f0f0f0"} borderRadius={2}>
+        <AutoTable
+          actionRef={actionRef}
+          scroll={{ x: 1366 }}
+          columns={[...columns]}
+          path={"/studyRecord/student/page"}
+        ></AutoTable>
+      </Box>
+    </Container>
+  );
+}
+
+export default Record;

src/pages/studyrecord/index.less

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