|
@@ -1,30 +1,51 @@
|
|
|
-import { Button, Radio } from 'antd';
|
|
|
|
|
|
|
+import { Button, Col, Radio, Row } from 'antd';
|
|
|
import { useState } from 'react';
|
|
import { useState } from 'react';
|
|
|
import { service } from '..';
|
|
import { service } from '..';
|
|
|
|
|
+import styles from './index.less';
|
|
|
|
|
|
|
|
interface Props {
|
|
interface Props {
|
|
|
changeView: (view: any) => void;
|
|
changeView: (view: any) => void;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
const Init = (props: Props) => {
|
|
const Init = (props: Props) => {
|
|
|
- const options = [
|
|
|
|
|
- { label: '设备接入视图', value: 'device' },
|
|
|
|
|
- { label: '运维管理视图', value: 'ops' },
|
|
|
|
|
- { label: '综合管理视图', value: 'comprehensive' },
|
|
|
|
|
- ];
|
|
|
|
|
-
|
|
|
|
|
const [value, setValue] = useState<string>('device');
|
|
const [value, setValue] = useState<string>('device');
|
|
|
|
|
|
|
|
|
|
+ const viewMap = [
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '设备接入视图',
|
|
|
|
|
+ img: require('/public/images/home/device.png'),
|
|
|
|
|
+ value: 'device',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '运维管理视图',
|
|
|
|
|
+ img: require('/public/images/home/ops.png'),
|
|
|
|
|
+ value: 'ops',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '综合管理视图',
|
|
|
|
|
+ img: require('/public/images/home/comprehensive.png'),
|
|
|
|
|
+ value: 'comprehensive',
|
|
|
|
|
+ },
|
|
|
|
|
+ ];
|
|
|
return (
|
|
return (
|
|
|
<div>
|
|
<div>
|
|
|
- <Radio.Group
|
|
|
|
|
- options={options}
|
|
|
|
|
- value={value}
|
|
|
|
|
- onChange={(e) => setValue(e.target.value)}
|
|
|
|
|
- optionType="button"
|
|
|
|
|
- />
|
|
|
|
|
- <div>
|
|
|
|
|
|
|
+ <div className={styles.title}>请选择首页视图</div>
|
|
|
|
|
+ <Radio.Group value={value} onChange={(e) => setValue(e.target.value)}>
|
|
|
|
|
+ <Row gutter={24}>
|
|
|
|
|
+ {viewMap.map((item) => (
|
|
|
|
|
+ <Col span={8} key={item.value}>
|
|
|
|
|
+ <div className={styles.item}>
|
|
|
|
|
+ <img src={item.img} className={styles.item} />
|
|
|
|
|
+ <Radio value={item.value}>{item.title}</Radio>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ ))}
|
|
|
|
|
+ </Row>
|
|
|
|
|
+ </Radio.Group>
|
|
|
|
|
+
|
|
|
|
|
+ <div style={{ textAlign: 'center', marginTop: 30 }}>
|
|
|
<Button
|
|
<Button
|
|
|
|
|
+ type="primary"
|
|
|
onClick={() => {
|
|
onClick={() => {
|
|
|
service
|
|
service
|
|
|
.setView({
|
|
.setView({
|