asd

src/components/DraggableDialog/index.jsx

@@ -75,7 +75,7 @@ export default function DraggableDialog({
               loadingPosition="start"
               startIcon={<SendOutlined />}
               onClick={() => {
-                console.log(formRef?.current?.submit());
+                formRef?.current?.submit();
               }}
             >
               提交

src/components/IconFont/index.jsx

@@ -4,7 +4,7 @@ import { createFromIconfontCN } from '@ant-design/icons';
 import font from './font/iconfont'
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4010447_84s57xv2oi7.js',
+  scriptUrl: '//at.alicdn.com/t/c/font_4010447_t59htoi0vc8.js',
 });
 
 export default IconFont;

src/components/InitForm/FormItems.jsx

@@ -1111,21 +1111,14 @@ function UploadImg({ value, onChange, fieldProps }) {
     accept: ".jpg,.png,.jpeg",
     listType: "picture-card",
     beforeUpload: beforeUpload,
-    defaultFileList: value,
+    fileList: value,
     headers: { token },
     onChange(info) {
       let {
         file: { status },
         fileList,
       } = info;
-      if (status == "error") {
-        message.error(`${info.file.name} 上传失败`);
-      } else if (status === "done") {
-        const transfile = fileList.map((it) => {
-          return it?.response ? it?.response.data.dataList[0] : it;
-        });
-        onChange(transfile);
-      }
+      onChange(fileList);
     },
     onRemove(file) {
       let uid = file?.response?.data?.dataList[0]?.uid ?? file?.uid;
@@ -1206,13 +1199,26 @@ function UploadImage({ item, colProps }) {
   let col = item.colProps ?? colProps;
   return (
     <Col {...col}>
-      <Form.Item
+      <ProForm.Item
         name={item.key ?? item.dataIndex}
         label={item.title}
         {...item.formItemProps}
+        transform={(value) => {
+          const key = item.key ?? item.dataIndex;
+          const transvalue = value?.map((it) => {
+            if (it.response) {
+              return it?.response?.data?.dataList[0];
+            } else {
+              return it;
+            }
+          });
+          return {
+            [key]: transvalue,
+          };
+        }}
       >
         <UploadImg fieldProps={{ ...item?.fieldProps }} />
-      </Form.Item>
+      </ProForm.Item>
     </Col>
   );
 }

src/components/InitForm/index.jsx

@@ -158,7 +158,7 @@ function InitForm({
       }}
       autoFocusFirstInput
       onValuesChange={(changedValues, allValues) => {
-        onValuesChange?.(changedValues, allValues);
+        onValuesChange?.(changedValues, allValues,proformRef);
       }}
     >
       <FormRender

src/components/ProductCard/index.jsx

@@ -64,6 +64,7 @@ export default function ShopProductCard({
               zIndex: 9,
               top: 20,
               left: 20,
+
               position: "absolute",
               textTransform: "uppercase",
             }}
@@ -82,6 +83,7 @@ export default function ShopProductCard({
           sx={{ borderRadius: 2, overflow: "hidden" }}
         >
           <Box className="masker"></Box>
+          {type == 1 && (
             <Box className="edit">
               <Tooltip title="编辑">
                 <IconButton
@@ -94,6 +96,7 @@ export default function ShopProductCard({
                   ></EditIcon>
                 </IconButton>
               </Tooltip>
+
               <Tooltip title={confirm ? "确认删除" : "删除"}>
                 {confirm ? (
                   <IconButton
@@ -101,12 +104,15 @@ export default function ShopProductCard({
                     onClick={() => {
                       remove(product);
                     }}
+                    sx={{ marginLeft: 2 }}
                   >
                     <CheckIcon
                       style={{
                         fontSize: 20,
                         color:
-                        confirm === "1" ? colors.grey[500] : colors.green[500],
+                          confirm === "1"
+                            ? colors.grey[500]
+                            : colors.green[500],
                       }}
                     ></CheckIcon>
                   </IconButton>
@@ -117,7 +123,7 @@ export default function ShopProductCard({
 
                       setTimeout(() => {
                         setconfirm(true);
-                    }, 1000);
+                      }, 200);
 
                       setTimeout(() => {
                         setconfirm(false);
@@ -131,74 +137,19 @@ export default function ShopProductCard({
                 )}
               </Tooltip>
             </Box>
+          )}
 
           <Stack
             direction="row"
             alignItems="center"
-            justifyContent="space-around"
+            justifyContent="space-between"
             width={"100%"}
             className="stackani"
+            padding={"0px 12px"}
           >
-            <Tooltip title="备课">
-              <IconButton
-                onClick={() => {
-                  history.push("/work/dolessons/" + product.id);
-                }}
-              >
-                <IconFont
-                  type="icon-beike"
-                  style={{ fontSize: 20, color: "#ffffff" }}
-                ></IconFont>
-              </IconButton>
-            </Tooltip>
-            <Tooltip title="授权">
-              <IconButton
-                onClick={() => {
-                  authorized(product);
-                }}
-              >
-                <IconFont
-                  type="icon-shouquanguanli"
-                  style={{ fontSize: 20, color: "#ffffff" }}
-                ></IconFont>
-              </IconButton>
-            </Tooltip>
-            {type == 3 ? null : (
-              <Tooltip title={type == 1 ? "发布" : type == 2 ? "取消发布" : ""}>
-                <IconButton
-                  onClick={() => {
-                    publish(product);
-                  }}
-                >
-                  {type == 1 ? (
-                    <IconFont
-                      type="icon-fabu"
-                      style={{ fontSize: 20, color: "#ffffff" }}
-                    ></IconFont>
-                  ) : (
-                    <IconFont
-                      type="icon-undo"
-                      style={{ fontSize: 20, color: "#ffffff" }}
-                    ></IconFont>
-                  )}
-                </IconButton>
-              </Tooltip>
-            )}
-
-            <Tooltip title="复制创建">
-              <IconButton
-                onClick={() => {
-                  copy(product);
-                }}
-              >
-                <IconFont
-                  type="icon-fuzhi"
-                  style={{ fontSize: 20, color: "#ffffff" }}
-                ></IconFont>
-              </IconButton>
-            </Tooltip>
+            <div></div>
 
-            {type == 2 && (
+            {type !== 3 && (
               <Tooltip title={shut ? "确认关闭" : "关闭"}>
                 {shut ? (
                   <IconButton
@@ -222,7 +173,7 @@ export default function ShopProductCard({
 
                       setTimeout(() => {
                         setshut(true);
-                      }, 1000);
+                      }, 200);
 
                       setTimeout(() => {
                         setshut(false);
@@ -249,9 +200,12 @@ export default function ShopProductCard({
           overflow={"hidden"}
           alignItems={"center"}
         >
+          <Tooltip title={courseName}>
             <Typography variant="subtitle2" noWrap>
               {courseName}
             </Typography>
+          </Tooltip>
+
           <Box width={60} textAlign={"right"} flexShrink={0}>
             <Tooltip title={createTime}>
               <Typography
@@ -266,6 +220,83 @@ export default function ShopProductCard({
             </Tooltip>
           </Box>
         </Stack>
+        <Stack
+          direction={"row"}
+          justifyContent={"space-between"}
+          alignItems={"center"}
+        >
+          <Stack direction={"row"} spacing={1}>
+            {type == 3 ? (
+              <div></div>
+            ) : (
+              <Tooltip title={type == 1 ? "发布" : type == 2 ? "取消发布" : ""}>
+                <IconButton
+                  onClick={() => {
+                    publish(product);
+                  }}
+                >
+                  {type == 1 ? (
+                    <IconFont
+                      type="icon-fabu"
+                      style={{ fontSize: 20, color: colors.blue[600] }}
+                    ></IconFont>
+                  ) : (
+                    <IconFont
+                      type="icon-undo"
+                      style={{ fontSize: 20, color: colors.red[600] }}
+                    ></IconFont>
+                  )}
+                </IconButton>
+              </Tooltip>
+            )}
+            {type === 1 ? (
+              <Tooltip title="授权">
+                <IconButton
+                  onClick={() => {
+                    authorized(product);
+                  }}
+                >
+                  <IconFont
+                    type="icon-shouquanguanli"
+                    style={{ fontSize: 20, color: colors.blue[600] }}
+                  ></IconFont>
+                </IconButton>
+              </Tooltip>
+            ) : (
+              <div></div>
+            )}
+          </Stack>
+
+          <Stack direction={"row"} spacing={1}>
+            {type === 1 && (
+              <Tooltip title="备课">
+                <IconButton
+                  onClick={() => {
+                    history.push("/work/dolessons/" + product.id);
+                  }}
+                >
+                  <IconFont
+                    type="icon-beike"
+                    style={{ fontSize: 20, color: "#333333" }}
+                  ></IconFont>
+                </IconButton>
+              </Tooltip>
+            )}
+
+            <Tooltip title="复制创建">
+              <IconButton
+                onClick={() => {
+                  copy(product);
+                }}
+              >
+                <IconFont
+                  type="icon-fuzhi"
+                  style={{ fontSize: 20, color: "#333" }}
+                ></IconFont>
+              </IconButton>
+            </Tooltip>
+          </Stack>
+        </Stack>
       </Stack>
     </Card>
   );

src/components/ProductCard/loading.jsx

@@ -48,7 +48,8 @@ export default function ShopProductLoadingCard({ product, loading }) {
         />
       </Box>
 
-      <Stack spacing={2} sx={{ p: 2 }}>
+      <Stack spacing={2} sx={{ p: 2.5 }}>
+        <Skeleton animation="wave"/>
         <Skeleton animation="wave"/>
       </Stack>
     </Card>

src/components/ProductCard/sxcard.jsx

+import PropTypes from "prop-types";
+// @mui
+import {
+  Box,
+  Card,
+  colors,
+  IconButton,
+  Stack,
+  Tooltip,
+  Typography,
+} from "@mui/material";
+import { styled } from "@mui/material/styles";
+// utils
+// components
+import IconFont from "@/components/IconFont";
+import Label from "@/components/label";
+import difftime from "@/utils/difftime";
+import AccessTimeFilledIcon from "@mui/icons-material/AccessTimeFilled";
+import CheckIcon from "@mui/icons-material/Check";
+import DeleteIcon from "@mui/icons-material/Delete";
+import EditIcon from "@mui/icons-material/Edit";
+import { history } from "@umijs/max";
+import { Progress } from "antd";
+import dayjs from "dayjs";
+import GroupIcon from '@mui/icons-material/Group';
+import { useState } from "react";
+
+// ----------------------------------------------------------------------
+
+const StyledProductImg = styled("img")({
+  top: 0,
+  width: "92%",
+  height: "92%",
+  marginTop: "4%",
+  objectFit: "cover",
+  position: "absolute",
+});
+
+ShopProductCard.propTypes = {
+  product: PropTypes.object,
+};
+
+export default function ShopProductCard({
+  product,
+  remove,
+  edit,
+  copy,
+  publish,
+  authorized,
+}) {
+  const {
+    trainName,
+    picUrl,
+    createTime,
+    typeName,
+    type,
+    deadline,
+    sectionNum,
+    experimentNum,
+    studentNum,
+    totalSubmitExperimentNum,
+    totalExperimentNum,
+
+  } = product;
+  const [confirm, setconfirm] = useState(false);
+
+  return (
+    <Card sx={{ borderRadius: 3 }} className="hovered" id="jikl">
+      <Box sx={{ pt: "66%", position: "relative" }} className="center">
+        {typeName && (
+          <Label
+            variant="filled"
+            color={
+              (type === 1 && "warning") || (type === 3 && "default") || "info"
+            }
+            sx={{
+              zIndex: 9,
+              top: 20,
+              left: 20,
+
+              position: "absolute",
+              textTransform: "uppercase",
+            }}
+          >
+            {typeName}
+          </Label>
+        )}
+        <StyledProductImg
+          alt={trainName}
+          src={picUrl ?? DEFAULT_404_IMG}
+          sx={{ borderRadius: 2 }}
+        />
+
+        <Box
+          className="actionhover"
+          sx={{ borderRadius: 2, overflow: "hidden" }}
+        >
+          <Box className="masker"></Box>
+          {type == 1 && (
+            <Box className="edit">
+              <Tooltip title="编辑">
+                <IconButton
+                  onClick={() => {
+                    edit(product);
+                  }}
+                >
+                  <EditIcon
+                    style={{ fontSize: 20, color: colors.blue[200] }}
+                  ></EditIcon>
+                </IconButton>
+              </Tooltip>
+
+              <Tooltip title={confirm ? "确认删除" : "删除"}>
+                {confirm ? (
+                  <IconButton
+                    disabled={confirm === "1"}
+                    onClick={() => {
+                      remove(product);
+                    }}
+                    sx={{ marginLeft: 2 }}
+                  >
+                    <CheckIcon
+                      style={{
+                        fontSize: 20,
+                        color:
+                          confirm === "1"
+                            ? colors.grey[500]
+                            : colors.green[500],
+                      }}
+                    ></CheckIcon>
+                  </IconButton>
+                ) : (
+                  <IconButton
+                    onClick={() => {
+                      setconfirm("1");
+
+                      setTimeout(() => {
+                        setconfirm(true);
+                      }, 200);
+
+                      setTimeout(() => {
+                        setconfirm(false);
+                      }, 3000);
+                    }}
+                  >
+                    <DeleteIcon
+                      style={{ fontSize: 20, color: colors.red[500] }}
+                    ></DeleteIcon>
+                  </IconButton>
+                )}
+              </Tooltip>
+            </Box>
+          )}
+
+          <Stack
+            direction="row"
+            alignItems="center"
+            justifyContent="space-between"
+            width={"100%"}
+            className="stackani"
+            padding={"0px 12px"}
+          >
+            <Tooltip title={"协作教师"}>
+              <IconButton
+                onClick={() => {
+                  publish(product, { type: 3 });
+                }}
+              >
+                <GroupIcon
+                  style={{
+                    fontSize: 24,
+                    color: "#fff",
+                  }}
+                ></GroupIcon>
+              </IconButton>
+            </Tooltip>
+            
+            <Tooltip title={"成绩管理"}>
+              <IconButton
+                onClick={() => {
+                  publish(product, { type: 3 });
+                }}
+              >
+                <IconFont
+                  type="icon-chengjidan"
+                  style={{
+                    fontSize: 20,
+                    color: "#fff",
+                  }}
+                ></IconFont>
+              </IconButton>
+            </Tooltip>
+          </Stack>
+        </Box>
+      </Box>
+
+      <Stack spacing={1} sx={{ p: 2 }}>
+        <Stack
+          direction={"row"}
+          justifyContent={"space-between"}
+          width={"100%"}
+          overflow={"hidden"}
+          alignItems={"center"}
+        >
+          <div className="center">
+            <Progress
+              type="circle"
+              size={20}
+              percent={parseInt(Math.random() * 100)}
+              strokeColor={{
+                "0%": "#00c6fb",
+                "100%": "#005bea",
+              }}
+            />
+            <Tooltip title={trainName}>
+              <Typography
+                variant="subtitle2"
+                noWrap
+                sx={{
+                  paddingLeft: 1,
+                }}
+              >
+                {trainName}
+              </Typography>
+            </Tooltip>
+          </div>
+
+          <Box width={60} textAlign={"right"} flexShrink={0}>
+            <Tooltip title={createTime}>
+              <Typography
+                component="span"
+                variant="body2"
+                sx={{
+                  color: "text.disabled",
+                }}
+              >
+                {difftime(dayjs(), dayjs(createTime))}
+              </Typography>
+            </Tooltip>
+          </Box>
+        </Stack>
+
+        <Stack
+          direction={"row"}
+          justifyContent={"space-between"}
+          width={"100%"}
+          overflow={"hidden"}
+          alignItems={"center"}
+        >
+          <Stack direction={"row"} alignItems={"center"}>
+            <AccessTimeFilledIcon
+              sx={{ color: colors.grey[800], fontSize: 20 }}
+            />
+            <Typography
+              component="span"
+              variant="body2"
+              sx={{
+                paddingLeft: 1,
+              }}
+            >
+              截止日期: {deadline}
+            </Typography>
+          </Stack>
+        </Stack>
+
+        <Stack
+          direction={"row"}
+          justifyContent={"space-between"}
+          alignItems={"center"}
+          padding={"0 2px"}
+        >
+          <Stack direction={"row"} spacing={2} alignItems={"center"}>
+            {type === 1 && (
+              <Tooltip title="备课">
+                <Stack
+                  direction={"row"}
+                  alignItems={"center"}
+                  onClick={() => {
+                    history.push("/work/dolessons/" + product.id);
+                  }}
+                  sx={{ cursor: "pointer" }}
+                >
+                  <IconFont
+                    type="icon-beike"
+                    style={{ fontSize: 16, opacity: 0.6 }}
+                  ></IconFont>
+
+                  <Typography
+                    component="span"
+                    variant="body2"
+                    sx={{
+                      color: "text.disabled",
+                      paddingLeft: 1.2,
+                      fontSize: 12,
+                      margin: 0,
+                    }}
+                  >
+                    {sectionNum}课时/{experimentNum}实验
+                  </Typography>
+                </Stack>
+              </Tooltip>
+            )}
+
+            {type === 1 ? (
+              <Tooltip title="授权">
+                <Stack
+                  direction={"row"}
+                  alignItems={"center"}
+                  onClick={() => {
+                    history.push("/work/dolessons/" + product.id);
+                  }}
+                  sx={{ cursor: "pointer" }}
+                >
+                  <IconFont
+                    type="icon-shouquanguanli"
+                    style={{ fontSize: 16, color: "#999" }}
+                  ></IconFont>
+                  <Typography
+                    component="a"
+                    variant="body2"
+                    sx={{
+                      color: "text.disabled",
+                      paddingLeft: 1.2,
+                      fontSize: 12,
+                      margin: 0,
+                    }}
+                  >
+                    {studentNum}学生
+                  </Typography>
+                </Stack>
+              </Tooltip>
+            ) : (
+              <div></div>
+            )}
+          </Stack>
+
+          <Stack direction={"row"} spacing={1}>
+            {type == 3 ? (
+              <div></div>
+            ) : (
+              <Tooltip title={type == 1 ? "发布" : type == 2 ? "取消发布" : ""}>
+                <IconButton
+                  onClick={() => {
+                    publish(product);
+                  }}
+                >
+                  {type == 1 ? (
+                    <IconFont
+                      type="icon-fabu"
+                      style={{ fontSize: 20, color: colors.blue[600] }}
+                    ></IconFont>
+                  ) : (
+                    <IconFont
+                      type="icon-undo"
+                      style={{ fontSize: 20, color: colors.red[600] }}
+                    ></IconFont>
+                  )}
+                </IconButton>
+              </Tooltip>
+            )}
+          </Stack>
+        </Stack>
+      </Stack>
+    </Card>
+  );
+}

src/global.css

-html,
-body,
-#root {
-  height: 100%;
-  margin: 0 !important;
-  padding: 0 !important;
-  overflow: hidden;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-}
-pre {
-  margin: 0 !important;
-}
-.colorWeak {
-  filter: invert(80%);
-}
-.bf-content {
-  font-size: 14px !important;
-}
-.ant-layout {
-  min-height: 100vh;
-}
-.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed {
-  left: unset;
-}
-canvas {
-  display: block;
-}
-body {
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-.oneline {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-ul,
-ol {
-  list-style: none;
-}
-@media (max-width: 768px) {
-  .ant-table {
-    width: 100%;
-    overflow-x: auto;
-  }
-  .ant-table-thead > tr > th,
-  .ant-table-tbody > tr > th,
-  .ant-table-thead > tr > td,
-  .ant-table-tbody > tr > td {
-    white-space: pre;
-  }
-  .ant-table-thead > tr > th > span,
-  .ant-table-tbody > tr > th > span,
-  .ant-table-thead > tr > td > span,
-  .ant-table-tbody > tr > td > span {
-    display: block;
-  }
-}
-.bgtext {
-  letter-spacing: 0px !important;
-  text-transform: uppercase;
-  background-image: linear-gradient(145deg, #91daff 0%, #7bd1ff 25%, #ffa7ea 50%, #7bd1ff 75%, #91daff 100%);
-  background-clip: text;
-  animation: bgmove 20s linear 0s infinite alternate forwards;
-  -webkit-text-fill-color: transparent;
-}
-.center {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.centerl {
-  display: flex;
-  align-items: center;
-}
-.spread {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.columns {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  justify-content: flex-start;
-}
-.bglight {
-  background-image: linear-gradient(145deg, #dbf3ff 0%, #c9ecff 25%, #ffdcf7 50%, #c9ecff 75%, #dbf3ff 100%);
-  background-size: 400% 400%;
-  animation: bgmove 20s linear 0s infinite alternate forwards;
-}
-@keyframes bgmove {
-  0% {
-    background-position: 0% 50%;
-  }
-  50% {
-    background-position: 100% 50%;
-  }
-  100% {
-    background-position: 0% 50%;
-  }
-}
-form .ant-space {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-}
-.ant-popover-arrow {
-  display: none !important;
-}
-.ant-popconfirm-description {
-  font-size: 12px !important;
-}
-.ant-card-head {
-  padding: 0 8px !important;
-  border: none !important;
-}
-.hovercard .icon {
-  transform: scale(0);
-  transition: all 0.4s;
-}
-.hovercard:hover {
-  transform: scale(1);
-}
-.ant-card-actions {
-  background-color: rgba(255, 255, 255, 0) !important;
-}
-.ant-typography {
-  margin: 0 !important;
-  margin-right: 12px !important;
-  inset-inline-start: 0 !important;
-}
-.ant-typography .ant-input {
-  background-color: rgba(161, 161, 161, 0.553);
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.ant-typography .ant-input:focus {
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.bf-link-editor .buttons {
-  box-sizing: content-box !important;
-}
-.bf-container {
-  display: flex !important;
-  flex-direction: column !important;
-}
-.bf-container .bf-content {
-  flex: 1 !important;
-}
-.ant-segmented {
-  background-color: transparent !important;
-}
-.ant-segmented-item-selected div {
-  color: #0062be;
-  font-weight: bolder;
-  transition: all 0.4s;
-}
-.borderani {
-  box-shadow: 0 0 6px #0062be;
-}
-@keyframes lager {
-  from {
-    background-color: rgba(20, 119, 246, 0.8);
-    transform: scale(1);
-  }
-  to {
-    background-color: rgba(20, 119, 246, 0);
-    transform: scale(1.4);
-  }
-}
-.borderanis {
-  box-shadow: 0 0 6px #0062be;
-}
-.limit img {
-  max-width: 100% !important;
-}
-.limit video {
-  max-width: 100% !important;
-}
-.limit blockquote {
-  margin: 0 0 10px;
-  padding: 15px 20px;
-  color: #666;
-  font-style: italic;
-  background-color: #f1f2f3;
-  border-left: 5px solid #ccc;
-}
-.limit pre {
-  max-width: 100%;
-  max-height: 100%;
-  margin: 10px 0;
-  padding: 15px;
-  overflow: auto;
-  color: #666;
-  font-weight: 400;
-  font-size: 14px;
-  font-family: monospace;
-  line-height: 16px;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  background-color: #f1f2f3;
-  border-radius: 3px;
-}
-.limit * {
-  word-break: break-all !important;
-}
-.ant-pro-form-login-header {
-  height: auto !important;
-}
-.ant-pro-form-login-logo {
-  width: auto !important;
-  height: auto !important;
-  border-radius: 0 !important;
-}
-.ant-pro-form-login-logo img {
-  width: auto !important;
-  height: 100px !important;
-  border-radius: 0 !important;
-}
-.cards .ant-card-body {
-  padding: 8px !important;
-  padding-top: 0 !important;
-}
-.ant-card-extra {
-  display: flex;
-  gap: 6px;
-}
-.sorts {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 30px;
-  height: 30px;
-  background-color: rgba(0, 0, 0, 0.05);
-  border-radius: 6px;
-  cursor: pointer;
-  transition: all 0.4s;
-}
-.sorts:hover {
-  background-color: #dce6fc;
-}
-.sorts * {
-  transition: all 0.4s;
-}
-.ant-drawer-header {
-  flex: none !important;
-  height: 70px !important;
-  padding: 18px !important;
-}
-.ant-drawer-content {
-  background-color: #ffffff !important;
-}
-.ant-drawer-body {
-  padding: 0 !important;
-}
-*:focus {
-  outline: none !important;
-}
-.ant-segmented-item-label {
-  overflow: visible !important;
-}
-.badge {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 18px;
-  margin-left: 6px;
-  padding: 0 6px;
-  color: #ffffff !important;
-  font-size: 12px !important;
-  background-color: #ff4800;
-  border-radius: 20px !important;
-}
-.info {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 0 18px 0 12px;
-}
-.info b {
-  margin-top: 8px;
-}
-.hoveremoji {
-  width: 30px;
-  overflow: hidden;
-  transition: all 0.4s;
-}
-.hoveremoji:hover {
-  width: 298px;
-}
-.hoveremoji .emoji {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 24px;
-  height: 24px;
-  border-radius: 4px;
-}
-.hoveremoji .emoji:hover {
-  background-color: #ffffff !important;
-}
-.emojis {
-  display: flex;
-  gap: 3px;
-  align-items: center;
-  padding: 1px 6px 1px 4px;
-  border: 1px solid #ddd;
-  border-radius: 20px;
-  cursor: default;
-  cursor: pointer;
-}
-h4 {
-  margin: 0 !important;
-}
-.ant-list-item {
-  padding: 9px 18px !important;
-}
-.ant-list-item:hover {
-  background-color: #daebf4;
-}
-.ant-list-item-meta {
-  align-items: center !important;
-}
-.rightcontent {
-  position: fixed;
-  top: 136px;
-  right: 0;
-  height: calc(100vh - 150px);
-  margin: 0 !important;
-  overflow: hidden;
-  border-radius: 8px;
-  transition: all 0.4s;
-}
-.rightcontent .hovers {
-  position: absolute;
-  right: 0;
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  width: 0px;
-  height: 100%;
-  border-radius: 8px;
-  cursor: pointer;
-  transition: all 0.4s;
-}
-.rightcontent .hovers span {
-  opacity: 0;
-  transition: all 0.2s;
-}
-.rightcontent .hovers::after {
-  position: absolute;
-  top: 0;
-  right: 12px;
-  width: 0;
-  height: 100%;
-  background-color: transparent;
-  border: 1px solid transparent;
-  border-radius: 8px;
-  cursor: pointer;
-  transition: all 0.4s;
-  content: "";
-}
-.rightcontent:hover .hovers {
-  width: 50px;
-}
-.rightcontent:hover .hovers > span {
-  opacity: 0.8;
-}
-.rightcontent:hover .hovers::after {
-  position: absolute;
-  top: 0;
-  right: 12px;
-  width: 50px;
-  height: 100%;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  box-shadow: 0 0 12px #dddddd;
-  cursor: pointer;
-  content: "";
-}
-.rightcontent .scrollcontian {
-  height: calc(100vh - 200px);
-  overflow: hidden;
-}
-.rightcontent .scrollcontian > div > div:last-child {
-  opacity: 0 !important;
-}
-.ant-list-item-action {
-  margin-inline-start: 12px !important;
-}
-.ant-drawer-extra {
-  display: flex !important;
-  gap: 8px !important;
-}
-.diycard {
-  margin-bottom: 6px;
-  padding: 4px 6px;
-  background-color: rgba(215, 240, 250, 0.499);
-  border-radius: 4px;
-  cursor: pointer !important;
-}
-.diycard > * {
-  font-size: 13px !important;
-}
-.react-resizable {
-  position: relative;
-}
-.table-cell {
-  display: -webkit-box;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-}
-.react-resizable-handle {
-  position: absolute;
-  right: -5px;
-  bottom: 0;
-  z-index: 999;
-  width: 10px;
-  height: 100%;
-  background: transparent;
-  cursor: col-resize;
-}
-.ant-pro-card {
-  border-radius: 12px !important;
-}
-.ant-pro-card-body {
-  padding-inline: 0 !important;
-}
-.ant-pro-table-list-toolbar-container {
-  padding-inline: 8px;
-}
-.ant-pro-table-list-toolbar-right {
-  flex: 1 !important;
-  flex-direction: row !important;
-  align-items: center !important;
-  justify-content: space-between !important;
-}
-.ant-pro-table-list-toolbar-left {
-  flex: 0;
-}
-.ant-table-pagination.ant-pagination {
-  padding-inline: 8px;
-}
-.ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:last-child,
-.ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:first-child {
-  border-radius: 0 !important;
-}
-.ant-popover-arrow {
-  display: none !important;
-}
-.ant-upload {
-  overflow: hidden !important;
-}
-.MuiDrawer-paper {
-  z-index: 992 !important;
-}
-.MuiAppBar-root {
-  z-index: 990 !important;
-}
-.MuiDialog-root {
-  z-index: 999 !important;
-}
-.ant-tabs-nav {
-  margin-bottom: 0 !important;
-}
-.ant-tabs-nav::before {
-  border: none !important;
-}
-.ant-tabs-ink-bar-animated {
-  display: none !important;
-}
-.ant-tabs-tab-btn {
-  font-weight: bolder !important;
-}
-.ant-image-mask {
-  border-radius: 50%;
-}
-.hovered .actionhover {
-  position: absolute;
-  top: 6%;
-  display: flex;
-  align-items: flex-end;
-  width: 92%;
-  height: 92%;
-}
-.hovered .actionhover * {
-  transition: all 0.2s;
-}
-.hovered .actionhover .edit {
-  position: absolute;
-  top: 8px;
-  right: 8px;
-  transform: translateY(-80px);
-}
-.hovered .actionhover .masker {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.75);
-  opacity: 0;
-}
-.hovered .actionhover .stackani {
-  transform: translateY(80px);
-  margin-bottom: 8px;
-}
-.hovered:hover .actionhover {
-  position: absolute;
-  top: 6%;
-  display: flex;
-  align-items: flex-end;
-  width: 92%;
-  height: 92%;
-}
-.hovered:hover .actionhover .edit {
-  transform: translateY(0px);
-}
-.hovered:hover .actionhover .masker {
-  opacity: 1;
-}
-.hovered:hover .actionhover .stackani {
-  transform: translateY(0px);
-}
-.selecttable .ant-pro-table-list-toolbar-container {
-  margin-bottom: 24px!important;
-}
-.selecttable .ant-pagination-options > div {
-  width: auto!important;
-}

src/global.less

@@ -569,7 +569,7 @@ h4 {
     .edit {
       position: absolute;
       top: 8px;
-      right: 8px;
+      right: 11px;
       transform: translateY(-80px);
     }
 

src/pages/bustrain/index.jsx

@@ -2,8 +2,8 @@ import DraggableDialog from "@/components/DraggableDialog";
 import ImportExcel from "@/components/ImportExcel";
 import InitForm from "@/components/InitForm";
 import PremButton from "@/components/PremButton";
-import ShopProductCard from "@/components/ProductCard";
 import ShopProductLoadingCard from "@/components/ProductCard/loading";
+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";
@@ -51,6 +51,7 @@ function Lessons() {
   );
 
   const edit = (row) => {
+    console.log(row);
     setdialogprops({
       open: true,
       defaultFormValue: { ...row },
@@ -120,7 +121,6 @@ function Lessons() {
         dataIndex: "deadline",
         key: "deadline",
         valueType: "date",
-       
       },
       {
         title: "实训封面",
@@ -152,6 +152,27 @@ function Lessons() {
           <InitForm
             fields={columns}
             defaultFormValue={dialogprops?.defaultFormValue}
+            onValuesChange={async (changedValues, allValues, formRef) => {
+              console.log(changedValues);
+              if (Object.keys(changedValues)[0] === "courseId") {
+                let id = Object.values(changedValues)?.[0] ?? null;
+                let res = await doFetch({
+                  url: "/sysCourse/detail",
+                  params: { id },
+                });
+                let pic = res?.data?.data?.pic ?? [];
+                console.log(pic);
+                formRef?.current?.setFieldsValue({
+                  pic: [
+                    {
+                      uid: "1655501390426017792",
+                      url: "https://ng-website.oss-cn-hangzhou.aliyuncs.com/2023/05/08/1655501389482299392Bl6w2X.jpg",
+                      name: "a1.jpg",
+                    },
+                  ],
+                });
+              }
+            }}
             onFinish={(val, extra) => {
               let postdata = { ...val },
                 url = "/busTrain/saveOrUpdate";
@@ -270,7 +291,7 @@ function Lessons() {
           {datalist?.loading && !datalist?.data ? (
             PRODUCTS?.map((product, i) => {
               return (
-                <Grid key={product.id} item xs={12} sm={4} md={3} lg={2.4}>
+                <Grid key={product.id} item xs={12} sm={6} md={4} lg={3} xl={2.4}>
                   <ShopProductLoadingCard product={product} />
                 </Grid>
               );
@@ -281,7 +302,7 @@ function Lessons() {
             </Grid>
           ) : (
             datalist?.data?.map?.((product) => (
-              <Grid key={product.id} item xs={12} sm={4} md={3} lg={2.4}>
+              <Grid key={product.id} item xs={12} sm={6} md={4} lg={3} xl={2.4}>
                 <ShopProductCard
                   product={product}
                   loading={datalist?.loading}

src/pages/lessons/index.jsx

@@ -257,7 +257,7 @@ function Lessons() {
           {datalist?.loading && !datalist?.data ? (
             PRODUCTS?.map((product, i) => {
               return (
-                <Grid key={product.id} item xs={12} sm={4} md={3} lg={2.4}>
+                <Grid key={product.id} item xs={12} sm={6} md={4} lg={3} xl={2.4}>
                   <ShopProductLoadingCard product={product} />
                 </Grid>
               );
@@ -268,7 +268,7 @@ function Lessons() {
             </Grid>
           ) : (
             datalist?.data?.map?.((product) => (
-              <Grid key={product.id} item xs={12} sm={4} md={3} lg={2.4}>
+              <Grid key={product.id} item xs={12} sm={6} md={4} lg={3} xl={2.4}>
                 <ShopProductCard
                   product={product}
                   loading={datalist?.loading}