|
@ -1,5 +1,10 @@ |
|
|
import React, { useEffect, useState, useRef } from 'react' |
|
|
import React, { useEffect, useState, useRef } from 'react' |
|
|
import { Col, Row } from 'antd'; |
|
|
import { push } from 'react-router-redux'; |
|
|
|
|
|
import { connect } from 'react-redux'; |
|
|
|
|
|
import { |
|
|
|
|
|
SettingOutlined |
|
|
|
|
|
} from '@ant-design/icons'; |
|
|
|
|
|
import { Col, Row, Button, Modal, Input } from 'antd'; |
|
|
import '../style.less' |
|
|
import '../style.less' |
|
|
|
|
|
|
|
|
function calculateIntersection (cx, cy, d, angle) { |
|
|
function calculateIntersection (cx, cy, d, angle) { |
|
@ -33,6 +38,7 @@ function calculateIntersection (cx, cy, d, angle) { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function Index (props) { |
|
|
function Index (props) { |
|
|
|
|
|
const { dispatch } = props |
|
|
const xyCvs = useRef() |
|
|
const xyCvs = useRef() |
|
|
const xzCvs = useRef() |
|
|
const xzCvs = useRef() |
|
|
const [darkModde] = useState(true) |
|
|
const [darkModde] = useState(true) |
|
@ -42,6 +48,7 @@ function Index (props) { |
|
|
subTextColor: '#D3D3D3', |
|
|
subTextColor: '#D3D3D3', |
|
|
shadow: '#303030' |
|
|
shadow: '#303030' |
|
|
}) |
|
|
}) |
|
|
|
|
|
const [isModalOpen, setIsModalOpen] = useState(false); |
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
console.log(FS_API_ROOT, window.FS_API_ROOT); |
|
|
console.log(FS_API_ROOT, window.FS_API_ROOT); |
|
@ -411,13 +418,20 @@ function Index (props) { |
|
|
boxShadow: `0 0 10px ${darkModde ? darkColor.shadow : 'rgba(0, 0, 0, 0.2)'}`, |
|
|
boxShadow: `0 0 10px ${darkModde ? darkColor.shadow : 'rgba(0, 0, 0, 0.2)'}`, |
|
|
color: darkModde ? darkColor.textColor : 'auto' |
|
|
color: darkModde ? darkColor.textColor : 'auto' |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<div style={{ |
|
|
<div style={{ |
|
|
height: '100vh', padding: 8, |
|
|
height: '100vh', padding: 8, |
|
|
color: darkModde ? darkColor.textColor : 'auto', |
|
|
color: darkModde ? darkColor.textColor : 'auto', |
|
|
background: darkModde ? darkColor.background : 'auto' |
|
|
background: darkModde ? darkColor.background : 'auto' |
|
|
}}> |
|
|
}}> |
|
|
<div style={{ height: '80%', padding: 8 }}> |
|
|
<div style={{ padding: '0 8px 8px', textAlign: 'right' }}> |
|
|
|
|
|
<Button type="primary" size={'large'} style={{}} icon={<SettingOutlined />} onClick={() => setIsModalOpen(true)}> |
|
|
|
|
|
设置 |
|
|
|
|
|
</Button> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div style={{ height: 'calc(80% - 40px)', padding: 8 }}> |
|
|
<Row style={{ height: '100%' }}> |
|
|
<Row style={{ height: '100%' }}> |
|
|
<Col span={12} id="canvasArea" style={{ paddingRight: 8, maxHeight: '100%' }}> |
|
|
<Col span={12} id="canvasArea" style={{ paddingRight: 8, maxHeight: '100%' }}> |
|
|
<div className='card' style={cardStyle}> |
|
|
<div className='card' style={cardStyle}> |
|
@ -493,11 +507,24 @@ function Index (props) { |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
</Row> |
|
|
</Row> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<Modal title="密码验证" open={isModalOpen} |
|
|
|
|
|
onOk={() => { |
|
|
|
|
|
dispatch(push('/setup')); |
|
|
|
|
|
}} |
|
|
|
|
|
onCancel={() => { |
|
|
|
|
|
setIsModalOpen(false) |
|
|
|
|
|
}} |
|
|
|
|
|
> |
|
|
|
|
|
<Input.Password size="large" placeholder="请输入密码" /> |
|
|
|
|
|
</Modal> |
|
|
</div> |
|
|
</div> |
|
|
) |
|
|
) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
export default Index |
|
|
function mapStateToProps (state) { |
|
|
|
|
|
const { auth } = state; |
|
|
|
|
|
return {} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
export default connect(mapStateToProps)(Index); |