<file_sep>import React from 'react';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover,Form, Select, message, DatePicker, Radio, Upload, InputNumber, Slider } from 'antd';
import './projects.less';
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;
const FormItem = Form.Item;
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;
const { TextArea } = Input;

export default class projectFoundComponent extends React.Component {
    
    render() {
        const gridStyle = {
        width: '25%',
        textAlign: 'center',
     };
   
    return (
        <div className="project_contentbox">
            <div className="project_checkbox">
            <div className="project_checktiitle" style={{marginBottom:'30px'}}>项目信息</div>
                <Row gutter={8} style={{ marginTop: '20px' }}>
                    <Col span={24}>
                            <Demo6App />
                    </Col>
                </Row>
            </div>
        </div >
        
       
    )
  }
}



class Demo6 extends React.Component {
    handleSubmit = (e) => {
      e.preventDefault();
      this.props.form.validateFields((err, values) => {
        if (!err) {
          console.log('Received values of form: ', values);
        }
      });
    }
    normFile = (e) => {
      console.log('Upload event:', e);
      if (Array.isArray(e)) {
        return e;
      }
      return e && e.fileList;
    }
    render() {
      const { getFieldDecorator } = this.props.form;
      const formItemLayout = {
        labelCol: { span: 6 },
        wrapperCol: { span: 14 },
      };
      return (
        <Form onSubmit={this.handleSubmit}>
          <FormItem
            label="项目名称"
            {...formItemLayout}
          >
          {getFieldDecorator('projectname', {
              rules: [
                { required: true, message: '请输入项目名称!' },
              ],
            })(
                <Input placeholder="项目名称" />
            )}
           
          </FormItem>
          <FormItem
            {...formItemLayout}
            label="场景分类"
          >
            {getFieldDecorator('select', {
              rules: [
                { required: true, message: '请选择场景分类!' },
              ],
            })(
              <Select placeholder="场景分类">
                <Option value="china">场景分类一</Option>
                <Option value="use">场景分类二</Option>
              </Select>
            )}
          </FormItem>
          <FormItem
            {...formItemLayout}
            label="项目图片"
          >
            <div className="dropbox">
              {getFieldDecorator('dragger', {
                valuePropName: 'fileList',
                getValueFromEvent: this.normFile,
              })(
                <Upload.Dragger name="files" action="/upload.do">
                  <p className="ant-upload-drag-icon">
                    <Icon type="inbox" />
                  </p>
                  <p className="ant-upload-text">上传图片</p>
                  <p className="ant-upload-hint"></p>
                </Upload.Dragger>
              )}
            </div>
          </FormItem>
          <FormItem
            {...formItemLayout}
            label="项目文件"
            extra="支持扩展名zip"
          >
            {getFieldDecorator('upload', {
              valuePropName: 'fileList',
              getValueFromEvent: this.normFile,
            })(
              <Upload name="logo" action="/upload.do" listType="picture">
                <Button>
                  <Icon type="upload" /> 上传文件
                </Button>
              </Upload>
            )}
          </FormItem>
          <FormItem
            label="项目描述"
            {...formItemLayout}
          >
          {getFieldDecorator('projectdepict', {
              rules: [
                { required: true, message: '请输入项目名称!' },
              ],
            })(
                <AutoComplete
                    style={{ width: 368, height: 70 }}
                    onSearch={this.handleSearch}
                    placeholder="请输入"
                >
                    <TextArea onKeyPress={this.handleKeyPress} style={{ height: 70 }} />
                </AutoComplete>
            )}
           
          </FormItem>
          
  
          <FormItem
            wrapperCol={{ span: 12, offset: 6 }}
          >
          <div className="project_fbuttomboxs">
            <Button style={{marginRight:'20px'}}>取消</Button>
            <Button type="primary" htmlType="submit">提交</Button>
          </div>
          </FormItem>
        </Form>
      );
    }
  }
  
  const Demo6App = Form.create()(Demo6);
<file_sep>import React from 'react';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover } from 'antd';
import './projects.less';
import CardDemo from './projectcheck'
import FoundComponent from  './projectfound'

const imgsrc = require('../../assets/img/pone.png');
const imgsrcone = require('../../assets/img/logo.png');
const imgsrcproject = require('../../assets/img/projectone.png');
const imgsrcprojecttwo = require('../../assets/img/projecttwo.png');
const imgsrcprojectthree = require('../../assets/img/projectthree.png');
const imgsrcprojecttwos = require('../../assets/img/projecttwos.png');
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;
const { TextArea } = Input;
const text = <span className="popovertopbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</span>;

export default class ProjectsCardComponent extends React.Component {

  constructor(props) {
    super(props);
    this.onClickButtonReview = this.onClickButtonReview.bind(this);
    this.onClickButtonReviews = this.onClickButtonReviews.bind(this);
    this.state = {
      isShowProjectDetail : false
    };
    this.state = {
      isShowProjectDetails : false
    };
  }


  onClickButtonReviews(){
    this.setState({
      isShowProjectDetails : true
    });
  }
  onClickButtonReview(){
    this.setState({
      isShowProjectDetail : true
    });
  }
  render() {
    if(this.state.isShowProjectDetail == true){
      return(
        <CardDemo/>
      )
    }
      if(this.state.isShowProjectDetails == true){
        return(
          <FoundComponent/>
        )
      }
    
    return (
        <div className="project_contentbox">
            <Row gutter={8} style={{ marginTop: '20px' }}>
              <Col span={4}>
                <Card bodyStyle={{ padding: 0 }} noHovering>
                  <div className="addcard" onClick={this.onClickButtonReviews}>增加项目</div>
                </Card>
              </Col>
              <Col span={4}> 
                
                <Card bodyStyle={{ padding: 0 }} noHovering>
                  <Popover placement="topLeft" title={text} className="popoverboxmid">
                    <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
                  </Popover>
                  <div style={{position:'relative'}}>
                      <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
                      <div style={{ padding: '3px 0px' }} className="projectmenage">
                          <Button className="popoverlook" onClick={this.onClickButtonReview}>查看</Button>
                          <Button className="popoverlook" onClick={this.onClickButtonReview}>修改</Button>
                          <span onClick={() => {
                              Modal.confirm({
                                title: '您确定要删除该项目吗？',
                                content: '删除后，该项目信息及模型将被清除',
                                onOk() {
                                  console.log('OK');
                                },
                                onCancel() {
                                  console.log('Cancel');
                                },
                              });
                            }}  className="projectlook" >
                                  删除
                          </span>
                      </div>
                  </div>
                  <div className="project_contentime">添加于 2017-10-09 17:09</div>
                </Card>
              </Col>
          </Row>
      </div>
    );
  }
}
<file_sep>import React from 'react';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover } from 'antd';
const imgsrc = require('../../assets/img/pone.png');
const imgsrcone = require('../../assets/img/logo.png');
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;
const { TextArea } = Input;
const text = <span>余杭区海创科技中心建模项目余杭区海创科技中心建模项目</span>;

class CardDemo extends React.Component {
  render() {
    const gridStyle = {
      width: '25%',
      textAlign: 'center',
    };

    return (
      <div style={{height:'100%'}}>
        <div className="projectleftbox">
          <div className="project_leftmid">
              <div className="project_logo">
              <img style={{ display: 'block' }} alt="example" src={imgsrcone} />
              </div>
              <ul className="project_leftmenage">
                <li><a href=""><img src="" alt=""/><span>用户管理</span></a></li>
                <li><a href=""><img src="" alt=""/><span>项目管理</span></a></li>
                <li><a href=""><img src="" alt=""/><span>分类管理</span></a></li>
              </ul>
          </div>
        </div>
        <div className="project_topbox">
          <h5>智慧消防管理后台</h5>
          <div className="project_topboxright">
            <Icon type="user" style={{paddingRight:'8px'}}/>登录
          </div>
        </div>
        <div className="project_contentbox">
          <div className="project_contenttitle"><em></em><span>项目管理</span></div>
          <div className="project_contentsearch">
          <Col span={8}>
             <div className="certain-category-search-wrapper" style={{ width: 250,marginTop:15,marginLeft:15 }}>
                <AutoComplete
                    className="certain-category-search"
                    dropdownClassName="certain-category-search-dropdown"
                    dropdownMatchSelectWidth={false}
                    dropdownStyle={{ width: 300 }}
                    size="large"
                    style={{ width: '100%' }}
                    placeholder="请输入项目名称"
                    optionLabelProp="value"
                  >
                <Input suffix={<Icon type="search" className="certain-category-icon" />} />
                </AutoComplete>
             </div>
          </Col>
          </div>
        <Row gutter={8} style={{ marginTop: '20px' }}>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
              <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
              <div style={{ padding: '10px 0px' }} className="projectmenage">
                 <a href="#/projectcheck"><span  className="projectlook" >查看</span></a>
                 <span  className="projectlook" >编辑</span>
                  <span onClick={() => {
                    Modal.confirm({
                      title: '您确定要删除该项目吗？',
                      content: '删除后，该项目信息及模型将被清除',
                      onOk() {
                        console.log('OK');
                      },
                      onCancel() {
                        console.log('Cancel');
                      },
                    });
                  }}  className="projectlook" >
                        删除
                  </span>
                </div>
                </div>
                <div className="project_contentime">添加于 2017-10-09 17:09</div>
                </Card>
              </Col>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
              <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
              <div style={{ padding: '10px 0px' }} className="projectmenage">
              <span  className="projectlook" >查看</span>
              <span  className="projectlook" >编辑</span>
              <span onClick={() => {
                Modal.confirm({
                  title: '您确定要删除该项目吗？',
                  content: '删除后，该项目信息及模型将被清除',
                  onOk() {
                    console.log('OK');
                  },
                  onCancel() {
                    console.log('Cancel');
                  },
                });
              }}  className="projectlook" >
                    删除
              </span>
            </div>
            </div>
            <div className="project_contentime">添加于 2017-10-09 17:09</div>
            </Card>
          </Col>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
              <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
              <div style={{ padding: '10px 0px' }} className="projectmenage">
              <span  className="projectlook" >查看</span>
              <span  className="projectlook" >编辑</span>
              <span onClick={() => {
                Modal.confirm({
                  title: '您确定要删除该项目吗？',
                  content: '删除后，该项目信息及模型将被清除',
                  onOk() {
                    console.log('OK');
                  },
                  onCancel() {
                    console.log('Cancel');
                  },
                });
              }}  className="projectlook" >
                    删除
              </span>
            </div>
            </div>
            <div className="project_contentime">添加于 2017-10-09 17:09</div>
            </Card>
          </Col>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
              <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
              <div style={{ padding: '10px 0px' }} className="projectmenage">
              <span  className="projectlook" >查看</span>
              <span  className="projectlook" >编辑</span>
              <span onClick={() => {
                Modal.confirm({
                  title: '您确定要删除该项目吗？',
                  content: '删除后，该项目信息及模型将被清除',
                  onOk() {
                    console.log('OK');
                  },
                  onCancel() {
                    console.log('Cancel');
                  },
                });
              }}  className="projectlook" >
                    删除
              </span>
            </div>
            </div>
            <div className="project_contentime">添加于 2017-10-09 17:09</div>
            </Card>
          </Col>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
              <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
              <div style={{ padding: '10px 0px' }} className="projectmenage">
              <span  className="projectlook" >查看</span>
              <span  className="projectlook" >编辑</span>
              <span onClick={() => {
                Modal.confirm({
                  title: '您确定要删除该项目吗？',
                  content: '删除后，该项目信息及模型将被清除',
                  onOk() {
                    console.log('OK');
                  },
                  onCancel() {
                    console.log('Cancel');
                  },
                });
              }}  className="projectlook" >
                    删除
              </span>
            </div>
            </div>
            <div className="project_contentime">添加于 2017-10-09 17:09</div>
            </Card>
          </Col>
          <Col span={4}>
            <Card bodyStyle={{ padding: 0 }} noHovering>
              <Popover placement="topLeft" title={text} className="popoverboxmid">
                <Button className="popoverbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</Button>
              </Popover>
              <div style={{position:'relative'}}>
                <img style={{ display: 'block' }} alt="example" width="100%" src={imgsrc} />
                <div style={{ padding: '10px 0px' }} className="projectmenage">
                <span  className="projectlook" >查看</span>
                <span  className="projectlook" >编辑</span>
                <span onClick={() => {
                  Modal.confirm({
                    title: '您确定要删除该项目吗？',
                    content: '删除后，该项目信息及模型将被清除',
                    onOk() {
                      console.log('OK');
                    },
                    onCancel() {
                      console.log('Cancel');
                    },
                  });
                }}  className="projectlook" >
                      删除
                </span>
              </div>
              </div>
              <div className="project_contentime">添加于 2017-10-09 17:09</div>
            </Card>
          </Col>
        </Row>
        </div>
      </div>
    )
  }
}

export default CardDemo;
<file_sep>import React from 'react';
import {Col, Icon,AutoComplete, Input,Popover } from 'antd';
import './projects.less';

export default class ProjectsSearchComponent extends React.Component {

  constructor(props) {
    super(props);
  }

  render() {
    return(
      <div className="project_contentsearch">
        <Col span={8}>
          <div className="certain-category-search-wrapper" style={{ width: 250,marginTop:15,marginLeft:15 }}>
            <AutoComplete
                className="certain-category-search"
                dropdownClassName="certain-category-search-dropdown"
                dropdownMatchSelectWidth={false}
                dropdownStyle={{ width: 300 }}
                size="large"
                style={{ width: '100%' }}
                placeholder="请输入项目名称"
                optionLabelProp="value"
              >
              <Input suffix={<Icon type="search" className="certain-category-icon" />} />
            </AutoComplete>
          </div>
        </Col>
      </div>
    );
    
  }
}
<file_sep>import React from 'react';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover } from 'antd';
const imgsrc = require('../../assets/img/pone.png');
const imgsrcone = require('../../assets/img/logo.png');
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;

class CardDemo extends React.Component {
  render() {
    const gridStyle = {
      width: '25%',
      textAlign: 'center',
    };

    return (
      <div style={{height:'100%'}}>
        <div className="projectleftbox">
          <div className="project_leftmid">
              <div className="project_logo">
              <img style={{ display: 'block' }} alt="example" src={imgsrcone} />
              </div>
              <ul className="project_leftmenage">
                <li><a href=""><img src="" alt=""/><span>用户管理</span></a></li>
                <li><a href=""><img src="" alt=""/><span>项目管理</span></a></li>
                <li><a href=""><img src="" alt=""/><span>分类管理</span></a></li>
              </ul>
          </div>
        </div>
        <div className="project_topbox">
          <h5>智慧消防管理后台</h5>
          <div className="project_topboxright">
            <Icon type="user" style={{paddingRight:'8px'}}/>登录
          </div>
        </div>
        <div className="project_contentbox">
             <div className="project_checkbox">
                 <div className="project_checktiitle">项目信息</div>
             </div>
       
        </div>
      </div>
    )
  }
}

export default CardDemo;
<file_sep>import React from 'react';


export default class MainApp extends React.Component {

  constructor(props) {
    super(props);
    this.isLogin = this.isLogin.bind(this);
  }

  isLogin() {
    return false;  
  }

  render() {

    return (
      <div>
        {
          this.isLogin() == true ?
          <h1 >yyyyy</h1> :
          <h1 >nononon</h1>
        }
      </div>
    );
  }
}

 
<file_sep>import React from 'react';
import LoginPage from '../01_Login/Login/login'
import ProjectsPage from '../08_Projects/projects'

export default class MainApp extends React.Component {

  constructor(props) {
    super(props);
    this.isLogin = this.isLogin.bind(this);
    this.state = {
      isLogin : false
    };
  }

  componentDidMount() {
    this.loginWithRequest();
  }

  loginWithRequest() {
    //TODO: 请求登录接口
    if(true) {
      this.setState({
        isLogin : true
      });
    } else {
      console.log('Please confirm the password!!!');
    }
  }

  isLogin() {
    return this.state.isLogin;
  }



  render() {

    return (
      <div>
        {/*<LoginPage>*/}
        {/*</LoginPage>*/}

          {/*<ProjectsPage > */}
            {/*{this.props.children}*/}
          {/*</ProjectsPage>*/}

        {/*this.isLogin() == true ?*/}
        {/*<ProjectsPage ></ProjectsPage>*/}
        {/*:*/}
        {/*<LoginPage ></LoginPage>*/}


      </div>
    );
  }
}


<file_sep># 更新日志

## 1.0.0

`2017-09-27`      

- 功能     
  - 完成 [#1](https://github.com/huzzbuzz/bear-admin/issues/1) ：菜单布局在顶部时，可配置固定      
  - 完成 [#1](https://github.com/huzzbuzz/bear-admin/issues/1) ：升级 dva.js 至 2.x    
- 其他        
  - 优化代码
<file_sep>import React from 'react';
import { connect } from 'dva';
import { withRouter } from 'dva/router';
import { Spin } from 'antd';
import LayoutLeft from './Layout/Left/Header';
import LayoutTop from './Layout/Left/Layout';
import './App.less';
import './projects.less';
import '../07_ThirdParty/projectone.less';
import Compont from '../07_ThirdParty/projectone';

class App extends React.Component {

  render() {

    const { app } = this.props;
    const { menuMode, fakeGlobal } = app;

    return (
      <div>
        <Spin size="large" spinning={fakeGlobal}>
          {
            
            <Compont {...this.props} ></Compont>
          }
        </Spin>
      </div>
    );
  }
}

export default withRouter(connect(({ app }) => ({ app }))(App));
<file_sep>import React from 'react';
import LayoutDemo1 from './Layout';
// import { Card, Row, Col, Form, Icon, Input, Button, Checkbox, Select, AutoComplete, Tooltip, Cascader } from 'antd';
// const FormItem = Form.Item;
import { Layout } from 'antd';
const { Header, Footer, Sider, Content } = Layout;

export default class LoginPage extends React.Component {

  constructor(props) {
    super(props);
  }

  render() {

    return (
      <div>
       <LayoutDemo1/>

      </div>
    );
  }
}



<file_sep>import React from 'react';
import {Layout}from 'antd';
import {row,column }from 'antd';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover } from 'antd';
import './projects.less';
import CardDemo from './projectcheck'
import FoundComponent from  './projectfound'
import LeftComponent from './projectsLeftComponent'
import SearchComponent from './projectsSearchComponent'
import CardComponent from './projectsCardComponent'
import HeaderComponent from './projectsHeaderComponent'
const { Content ,Sider}=Layout;


const imgsrc = require('../../assets/img/pone.png');
const imgsrcone = require('../../assets/img/logo.png');
const imgsrcproject = require('../../assets/img/projectone.png');
const imgsrcprojecttwo = require('../../assets/img/projecttwo.png');
const imgsrcprojectthree = require('../../assets/img/projectthree.png');
const imgsrcprojecttwos = require('../../assets/img/projecttwos.png');
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;
const { TextArea } = Input;
const text = <span className="popovertopbox">余杭区海创科技中心建模项目余杭区海创科技中心建模项目</span>;

export default class ProjectsPage extends React.Component {

  constructor(props) {
    super(props);
    this.onClickButtonReview = this.onClickButtonReview.bind(this);
    // this.createCards = this.createCards.bind(this);
    this.state = {
      isShowProjectDetail : false
    };
    this.dataSource = {
      card1 : "card1",
      card2 : "card2"
    }
  }

  onClickButtonReview(){
    this.setState({
      isShowProjectDetail : true
    });
  }

  // createCards() {
  //
  //   return (
  //       <CardComponent />
  //     );
    // this.dataSource && this.dataSource.map(() => {
    //   return (
    //     <CardComponent />
    //   );
    // });


  render() {

    return (
      <div>
<Layout>
<Sider>
          <LeftComponent  />
</Sider>
  <Layout>
          <HeaderComponent/>
    CardComponent
    <Content>
      <SearchComponent/>
      <CardComponent/>
    </Content>
          {/*<SearchComponent />*/}
          {/*{*/}
            {/*this.createCards()*/}
          {/*}*/}
          </Layout>

</Layout>
      </div>

    );
  }
}
<file_sep>import React from 'react';
import {Link} from 'dva/router';
import { Card, Row, Col, Icon, Switch, Modal, Button,AutoComplete, Input,Popover } from 'antd';
import './projects.less';
import CardDemo from './projectcheck'


const imgsrc = require('../../assets/img/pone.png');
const imgsrcone = require('../../assets/img/logo.png');
const imgsrcproject = require('../../assets/img/projectone.png');
const imgsrcprojecttwo = require('../../assets/img/projecttwo.png');
const imgsrcprojectthree = require('../../assets/img/projectthree.png');
const imgsrcprojecttwos = require('../../assets/img/projecttwos.png');



export default class ProjectsLeftComponent extends React.Component {

  constructor(props) {
    super(props);
  }

  render() {
    return (
        <div className="projectleftbox">
          <div className="project_leftmid">
              <div className="project_logo">
                 <img style={{ display: 'block' }} alt="example" src={imgsrcone} />
              </div>
              <ul className="project_leftmenage">
                <li>
                  <Link to="/register">

                    <img style={{ display: 'block',margin:'0 auto' }} alt="example" src={imgsrcproject} />
                    <span>用户管理</span>

                  </Link>
                </li>
                <li>

                  <Link to="/projectcheck">
                    <img style={{ display: 'block',margin:'0 auto' }} alt="example" src={imgsrcprojecttwos} />
                    <span>项目管理</span>
                    </Link>ss


                </li>
                <li>
                  <a href="">
                    <img style={{ display: 'block',margin:'0 auto' }} alt="example" src={imgsrcprojectthree} />
                    <span>分类管理</span>
                  </a>
                </li>
              </ul>
          </div>
        </div>
    )
  }
}
<file_sep>import React from 'react';
import { Link } from 'dva/router';
import {history} from 'dva/router'
import log from '../../assets/img/001.png';
import { Layout } from 'antd';
import reqwest from 'reqwest';
// import Demo2  from './Demo2';
import './Layout.less';


import { Card, Row, Col, Form, Icon, Input, Button, Checkbox, } from 'antd';
import './Layout.less';
const FormItem = Form.Item;
const { Header, Footer, Sider, Content } = Layout;



class LayoutDemo extends React.Component {
  render() {
    const head_footer = {
      background: '-webkit-linear-gradient(left,#272E3E,#4E5462); ',
      color: '#fff'
    }

    // const sider = {
      // background: ' #252B39',
      // color: '#fff',
      // lineHeight: '120px'

    // }

    const content ={
       // background: 'rgba(16, 142, 233, 1)',
      color: '#fff',
      // minHeight: '120px',
      // lineHeight: '120px'
    }



    return (
      <div style={{ textAlign: 'center' }}>


        <Layout   className={"layout"}>
          <Sider className="sider" ><img src={log} alt="brand"/></Sider>
          <Layout className={"layout2"}>
            <Header style={head_footer}>智慧消防管理后台
              {/*<label className={"con"} > <Icon className={"circle"} type="user"/><a href="">登录</a></label>*/}
            </Header>
            <Content   style={content} className="content">

              <Card className="card"   noHovering title="登录框">
                    <Demo2Form />
                  </Card>


            </Content>
            {/*<Footer style={Object.assign(head_footer, footer)}>Footer</Footer>*/}
          </Layout>
        </Layout>
      </div>
    )
  }
}


export default LayoutDemo;








class Demo2 extends React.Component {

  constructor(props) {
    super(props);
    this.state = {};
  }

  isOk = () => {

    // let data = {
    //   acctId  : "qiujun",
    //
    //   acctPassword : <PASSWORD>
    //  };

    // const context =this;}
  }

  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {

      if (!err) {
        reqwest({
          url: 'login',
          method: 'POST',
          contentType:"application/json; charset=UTF-8",
          data: JSON.stringify({
              "acctId": values.userName,
              "acctPassword" : <PASSWORD>
            }
          ),
          type: 'json',
        }).then((data)=>{
          if(data.message =="success")
          {

            alert("欢迎"+values.userName+"!!!");
            window.location.href="#/app";
            // this.context.router.push('/ProjectsPage');
          }
          else{
            alert("账号或者密码错误！！！");
            window.location.href="#/"
          }
        });

      }
    });
  }
  render() {
    const { getFieldDecorator } = this.props.form;
    return (
      <div id="components-form-demo-normal-login">
        <Form onSubmit={this.handleSubmit} className="login-form">
          <FormItem>
            {getFieldDecorator('userName', {
              rules: [{ required: true, message: 'Please input your username!' }],
            })(
              <Input    size ="large" prefix={<Icon type="user" style={{ fontSize: 13 }} />} placeholder="Username" />
            )}
          </FormItem>
          <FormItem>
            {getFieldDecorator('password', {
              rules: [{ required: true, message: 'Please input your Password!' }],
            })(
              <Input  size="large"  prefix={<Icon type="lock" style={{ fontSize: 13 }} />} type="password" placeholder="<PASSWORD>" />
            )}
          </FormItem>
          <FormItem>
            {/*{getFieldDecorator('remember', {*/}
              {/*valuePropName: 'checked',*/}
              {/*initialValue: true,*/}
            {/*})(*/}
              {/*<Checkbox>Remember me</Checkbox>*/}
            {/*)}*/}
            {/*<a className="login-form-forgot" href="">Forgot password</a>*/}
            {/*<Link  to="/ProjectsPage"> <Button type="primary" htmlType="submit" className="login-form-button">*/}
              {/*Log in*/}
            {/*</Button>*/}

            {/*</Link>*/}
            <Button   size="large"   type="primary" htmlType="submit" className="login-form-button">
              Log in
            </Button>

            {/*Or <Link   to="/register">register now!</Link>*/}
          </FormItem>
        </Form>
      </div>
    );
  }
}

 const Demo2Form = Form.create()(Demo2);


<file_sep>import React from 'react';
import { connect } from 'dva';
import { withRouter } from 'dva/router';
import MainApp from './mainApp'
class FireControlApp extends React.Component {
  render() {
    return (
      <div>
        <MainApp >


        </MainApp>
      </div>
    );
  }
}

export default withRouter(connect(({ app }) => ({ app }))(FireControlApp));

