From 0817793961918c1123328bca9a78ca29d95738b8 Mon Sep 17 00:00:00 2001
From: Junjie <xjj@123>
Date: 星期四, 28 三月 2024 14:54:27 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/pages/map/drawer/shelf/view.jsx | 46 ++++++++++++++++++++++++++++++++++++++++------
1 files changed, 40 insertions(+), 6 deletions(-)
diff --git a/zy-asrs-flow/src/pages/map/drawer/shelf/view.jsx b/zy-asrs-flow/src/pages/map/drawer/shelf/view.jsx
index 331d381..93b021f 100644
--- a/zy-asrs-flow/src/pages/map/drawer/shelf/view.jsx
+++ b/zy-asrs-flow/src/pages/map/drawer/shelf/view.jsx
@@ -1,28 +1,62 @@
import React, { useState, useRef, useEffect } from 'react';
-import { Card, Form, Button } from 'antd';
+import { Spin, Form, Button } from 'antd';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
+import { LoadingOutlined } from '@ant-design/icons';
import { createStyles } from 'antd-style';
import * as Utils from '../../utils'
import Http from '@/utils/http';
+import ShelfThree from './shelfThree'
const useStyles = createStyles(({ token, css }) => {
-
+ return {
+ threeContainer: {
+ zIndex: 99,
+ width: '500px',
+ height: '600px',
+ },
+ }
})
+
+let shelfThree;
const ShelfView = (props) => {
const intl = useIntl();
const { styles } = useStyles();
-
const refContainer = useRef();
+ const [loading, setLoading] = React.useState(false);
+
+ const startThree = () => {
+ shelfThree = new ShelfThree(refContainer.current);
+ shelfThree.startup();
+ }
+
+ const endThree = () => {
+ if (shelfThree) {
+ shelfThree.destroy();
+ shelfThree = null;
+ }
+ }
useEffect(() => {
+ setLoading(true);
+ endThree();
+ setTimeout(() => {
+ setLoading(false);
+ startThree();
+ }, 300)
- }, []);
+ return endThree;
+ }, [props.data.uuid]);
return (
<>
- <div style={{zIndex: 99}} ref={refContainer}></div>
- <h1>{props.data.uuid}</h1>
+ <Spin
+ spinning={loading}
+ indicator={<LoadingOutlined spin />}
+ size={'large'}
+ >
+ <div ref={refContainer} className={styles.threeContainer}></div>
+ </Spin>
</>
)
}
--
Gitblit v1.9.1