提交 4c27e74c authored 作者: 吴强's avatar 吴强

#添加了toolBar,就是操作bim 模型的工具栏。费了我好大的功夫。慢慢摸索吧

#添加了一个组件,用来记录tag 标签,目前尚未完工。
上级 4c44e507
import React from 'react';
import { Button, Card, Form, Input,Select } from 'antd';
import { connect } from 'dva';
const FormItem = Form.Item;
class AddTagsForm extends React.Component {
constructor(props) {
super(props);
this.state = {
};
}
handleSubmit = (e) => {
e.preventDefault();
this.props.form.validateFields((err, values) => {
});
};
render() {
const { getFieldDecorator } = this.props.form;
return(
<Card
title="标签登记"
headStyle={{textAlign: "Center"}}
style={{width: 350}}
>
<Form onSubmit={this.handleSubmit}>
<FormItem label="标签类型">
{
getFieldDecorator('TagType',{
rules: [
{
required: true,
whitespace: true,
},
]
})(<Select />)
}
</FormItem>
<FormItem label="标签名称">
{
getFieldDecorator('TagName',{
rules: [
{
required: true,
whitespace: true,
},
]
})(<Input />)
}
</FormItem>
<FormItem label="标签描述">
{
getFieldDecorator('TagDescription',{
})(<Input />)
}
</FormItem>
<FormItem label="标签位置">
{
getFieldDecorator('TagPosition',{
rules: [
{
required: true,
whitespace: true,
},
]
})(<Input />)
}
</FormItem>
<FormItem label="标签图标">
{
getFieldDecorator('TagIcon',{
})(<Select />)
}
</FormItem>
<FormItem>
<Button type="primary" htmlType="submit">Search</Button>
<Button type="primary">取消</Button>
</FormItem>
</Form>
</Card>
);
}
}
// 这里的写法一定要记清楚,不是Form.create(<AddTagsForm/>);写错之后无比的蛋疼
const AddTagForm =Form.create()(AddTagsForm);
export default connect()(AddTagForm);
......@@ -50,6 +50,14 @@ ul,li,button{
margin:0;
padding:0;
}
.tagsForm {
width: 500px;
height: auto;
position: relative;
z-index: 9999;
float: right;
}
......
......@@ -7,15 +7,17 @@ import SetModelColor from 'SetModelColor';
import SetClickMode from 'SetClickMode';
import { Button, Menu, Icon, Tooltip } from 'antd';
import '../utils/OnClickPosition';
import AddTagForm from '../components/AddTagsForm';
const filesurl= '../../public/model/house1/house1List.json';
const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;
class IndexPage extends React.Component{
constructor(props) {
super(props);
this.state = {liVisible: false};
this.state = {
liVisible: false,
num: -1,
};
}
SetModelColor = () => {
SetModelColor('testtag1',0,0,255);
......@@ -30,15 +32,19 @@ class IndexPage extends React.Component{
SetClickMode(0);
AddModel(filesurl, 'testtag1');
}
ModelSettingMenuClick = (liVisible) => {
ModelSettingMenuClick = (liVisible,num) => {
console.info(liVisible);
if (liVisible === true) {
this.setState({ liVisible: false });
} else {
} else {
this.setState({ liVisible: true });
}
this.setState({ num: num });
};
// 添加标签 pos 是变迁
AddPositionFlag = () => {
};
......@@ -51,24 +57,70 @@ class IndexPage extends React.Component{
<li>
<Tooltip title="模型颜色设置">
<Button type="primary" onClick={this.SetModelColor}>
<Icon type="mail"></Icon>
<Icon type="mail"/>
</Button>
</Tooltip>
</li>
<li>
<Tooltip title="模型设置">
<Button type="primary" onClick={this.ModelSettingMenuClick.bind(undefined,this.state.liVisible)}>模型设置</Button>
<Button type="primary" onClick={this.ModelSettingMenuClick.bind(undefined,this.state.liVisible,1)}>
<Icon type="mail"/>
</Button>
</Tooltip>
{
this.state.liVisible&&<ul className={styles.clearfix}>
this.state.num === 1 && this.state.liVisible && <ul className={styles.clearfix}>
<li>
<Button type="primary">查看模式</Button>
<Tooltip title="显示模型">
<Button type="primary">
<Icon type="mail"/>
</Button>
</Tooltip>
</li>
<li>
<Button type="primary">坐标拾取模式</Button>
<Tooltip title="隐藏模型">
<Button type="primary">
<Icon type="mail"/>
</Button>
</Tooltip>
</li>
<li>
<Button type="primary" onClick={this.SetClickMode.bind(undefined,'2')}>ID拾取模式</Button>
<Tooltip title="模型半透明">
<Button type="primary">
<Icon type="mail"/>
</Button>
</Tooltip>
</li>
<li>
<Tooltip title="模型半透明恢复">
<Button type="primary">
<Icon type="mail"/>
</Button>
</Tooltip>
</li>
</ul>
}
</li>
<li>
<Tooltip title="标签管理">
<Button type="primary" onClick={this.ModelSettingMenuClick.bind(undefined,this.state.liVisible,2)}>
<Icon type="mail"/>
</Button>
</Tooltip>
{
this.state.num === 2 && this.state.liVisible && <ul className={styles.clearfix}>
<li>
<Tooltip title="添加标签" placement="right">
<Button type="primary" onClick={this.AddPositionFlag}>
<Icon type="pushpin"/>
</Button>
</Tooltip>
</li>
<li>
<Tooltip title="显示所有标签">
<Button type="primary" placement="right">
<Icon type="flag"/>
</Button>
</Tooltip>
</li>
</ul>
}
......@@ -76,6 +128,11 @@ class IndexPage extends React.Component{
</ul>
</div>
</div>
{
<div className={styles.tagsForm}>
<AddTagForm/>
</div>
}
<div id="webglContainer" className={styles.webglContainer1}/>
</div>
);
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论