sader

src/components/PointViewer/index.jsx

+/*
+ * @Author: wuhao930406 1148547900@qq.com
+ * @Date: 2023-08-03 11:31:00
+ * @LastEditors: wuhao930406 1148547900@qq.com
+ * @LastEditTime: 2023-08-24 14:27:24
+ * @FilePath: /editor-plus/src/pages/components/GlftBlock/index.jsx
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+ */
+import { Gltf, OrbitControls } from "@react-three/drei";
+import { Canvas } from "@react-three/fiber";
+import "./index.less";
+
+function PointViewer({ url }) {
+  
+  return (
+    <div className="bar-block-component">
+      <Canvas style={{ height: "600px", width: "100%" }} id={"sada"}>
+        <color attach="background" args={["#333"]} />
+        <ambientLight intensity={1} />
+        <OrbitControls></OrbitControls>
+        <pointLight position={[10, 10, 10]} intensity={1} />
+        <Gltf
+          src={"./model.glb"}
+          receiveShadow
+          castShadow
+          position={[0, 0, 0]}
+        />
+      </Canvas>
+    </div>
+  );
+}
+
+export default PointViewer;

src/components/PointViewer/index.less

+.foo-block-element {
+  border-radius: 5px;
+  color: #fff;
+  background-color: #08a9fe;
+  box-shadow: 0 5px 20px rgba(8,169,254,.1);
+}
+.bar-block-component {
+  position: relative;
+  background-color: #f0f0f0;
+  box-shadow: 0 5px 20px rgba(192,57,43,.1);
+}
+.bar-block-component, .foo-block-element {
+  margin: 10px;
+  border-radius: 5px;
+  color: #fff;
+}
+.bar-block-component .button-remove {
+  position: absolute;
+  top: 50%;
+  right: 0px;
+  width: 30px;
+  height: 30px;
+  padding: 0;
+  background-color: transparent;
+  border: none;
+  transform: translateY(-50%);
+  color: red;
+  font-size: 20px;
+  line-height: 30px;
+  text-align: center;
+}
+.bf-content{
+  height: 80vh !important;
+}
\ No newline at end of file

src/pages/checkhomework/index.jsx

 import AutoTable from "@/components/AutoTable";
 import DraggableDialog from "@/components/DraggableDialog";
 import InitForm from "@/components/InitForm";
+import PointViewer from "@/components/PointViewer";
 import PremButton from "@/components/PremButton";
 import SplitDesc from "@/components/SplitDesc";
 import { doFetch } from "@/utils/doFetch";
 import { ProDescriptions } from "@ant-design/pro-components";
 import { Box, Container, Stack, Typography } from "@mui/material";
 import { useRequest } from "ahooks";
-import { Divider, message, Table, Tabs, Tag, Tooltip } from "antd";
+import { Divider, Drawer, message, Table, Tabs, Tag, Tooltip } from "antd";
 import { useMemo, useRef, useState } from "react";
 import "./index.less";
 
@@ -330,6 +331,16 @@ function Checkhomework() {
     ];
   }, [totaldata]);
 
+  const [drawer, setDrawer] = useState({
+    open: false,
+    onClose: () => {
+      setDrawer((s) => ({
+        ...s,
+        open: false,
+      }));
+    },
+  });
+
   return (
     <Container maxWidth={false}>
       <DraggableDialog
@@ -340,7 +351,7 @@ function Checkhomework() {
         loading={loading}
         formRef={formRefc}
         dialogprops={dialogprops}
-        maxWidth={dialogprops?.maxWidth ?? "sm"}
+        maxWidth={dialogprops?.maxWidth ?? "md"}
         formdom={
           dialogprops?.title === "批阅" && (
             <InitForm
@@ -413,7 +424,11 @@ function Checkhomework() {
               dataSource={dialogprops?.defaultFormValue}
             ></ProDescriptions>
 
-            <span style={{ fontSize: 14 }}>实验素养</span>
+            <Divider></Divider>
+
+            <b style={{ fontSize: 14, paddingBottom: 10, display: "block" }}>
+              实验素养
+            </b>
             <Table
               size="small"
               pagination={{
@@ -449,7 +464,15 @@ function Checkhomework() {
               }
             ></Table>
 
-            <span style={{ fontSize: 14 }}>实验报告</span>
+            <Divider></Divider>
+
+            <div style={{ position: "relative" }}>
+              <Drawer {...drawer} getContainer={false} title={false} closable={false}>
+                <PointViewer></PointViewer>
+              </Drawer>
+              <b style={{ fontSize: 14, paddingBottom: 10, display: "block" }}>
+                实验报告
+              </b>
               <Table
                 size="small"
                 pagination={{
@@ -521,7 +544,9 @@ function Checkhomework() {
                                 marginBottom: 6,
                               }}
                             >
-                            <span style={{ paddingRight: 12 }}>{it?.Name}</span>
+                              <span style={{ paddingRight: 12 }}>
+                                {it?.Name}
+                              </span>
                               {it?.PointList?.map((its) => (
                                 <Tooltip
                                   key={its?.id}
@@ -535,7 +560,18 @@ function Checkhomework() {
                                     ></div>
                                   }
                                 >
-                                <Tag>{its.Name}</Tag>
+                                  <Tag
+                                    onClick={() => {
+                                      setDrawer((s) => ({
+                                        ...s,
+                                        position: its.Position,
+                                        open: true,
+                                      }));
+                                    }}
+                                    style={{ cursor: "pointer" }}
+                                  >
+                                    {its.Name}
+                                  </Tag>
                                 </Tooltip>
                               ))}
                             </div>
@@ -546,6 +582,7 @@ function Checkhomework() {
                   },
                 }}
               ></Table>
+            </div>
           </>
         ) : dialogprops?.title === "详情" ? (
           <Stack