加入登录人信息

Mr Ke

2020-04-06 91d2b58b9024c358a743e0b42ff53915fb6b8e09

加入登录人信息

 src/components/common/HeadView/index.jsx

@@ -6,7 +6,7 @@

/** 头部组件 */

import React from 'react';
import React, { useEffect } from 'react';
import { Layout, Menu, Dropdown, Icon, Row, Col, message } from 'antd';
const { Header } = Layout;
import './index.scss';
@@ -30,17 +30,24 @@

export default function MenuView({ }) {

  var loginUser = window.localStorage.getItem('loginUser') || '{}';
  loginUser = JSON.parse(loginUser);
  console.log(loginUser)
  return (
    <Header style={{ background: '#fff', padding: 0, boxShadow: 'inset 0 -1px 0 0 #E5E5E5' }}>
      <Row type="flex" align="middle" justify="end" >
        <Col style={{ marginRight: 40 }}>
          <Dropdown overlay={menu}>
            <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
              登陆人<Icon type="down" />
            </a>
          </Dropdown>
        </Col>
      </Row>
      {
        (loginUser && Object.keys(loginUser).length) &&
        <Row type="flex" align="middle" justify="end" >
          <Col style={{ marginRight: 40 }}>
            {loginUser.trueName}&nbsp;&nbsp;&nbsp;
            <Dropdown overlay={menu}>
              <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
                [{loginUser.dept} | {loginUser.post}]<Icon type="caret-down" />
              </a>
            </Dropdown>
          </Col>
        </Row>
      }
    </Header>
  );
}

 src/components/common/NotifyList/index.jsx

@@ -7,6 +7,7 @@
/** 通知列表 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Alert } from 'antd';
import fetch from '../../../api/request';

import './index.scss';

@@ -16,30 +17,45 @@
    this.config = {
    };
    this.state = {
      content: ''
    };
  }

  componentWillMount() { }
  componentWillMount() {
    fetch({
      url: `api/document/getNewNotice`
    }).then(res => {
      console.log('res', res);
      this.setState({
        content: res.documentContent || ''
      })
    })
  }

  componentDidMount() { }

  renderDom = () => {
    let { content } = this.state;
    return <div className="notify-list-main-dom">
      <span className="notify-list-main-dom-msg">最新通知：公司本部从XX时间开始，调整省略很长很长的内容调整省略很长很长的内容公司本部从XX时间开始，调整省略很长很长的内容调整省略很长很长的内容公司本部从XX时间开始，调整省略很长很长的内容调整省略很长很长的内容</span>
      <span className="notify-list-main-dom-msg">最新通知：{content}</span>
      <span className="notify-list-main-dom-fuc">[查看全部]</span>
    </div>
  }

  render() {
    let { content } = this.state;

    return (
      <div className="notify-list-main">
        <Alert
          // message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
          message={this.renderDom()}
          type="warning"
          closable={false}
        // onClose={onClose}
        />
        {
          content &&
          <Alert
            // message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
            message={this.renderDom()}
            type="warning"
            closable={false}
          />
        }
      </div>
    )
  }

 src/components/page/index/rulesList/index.jsx

@@ -6,6 +6,7 @@

/** 工作制度 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Button } from 'antd';
import TableView from '../../../common/TableView';
import SearchFormView from '../../../common/SearchFormView';
import moment from 'moment';
@@ -35,8 +36,8 @@

  cancle = (id) => {
    console.log(id)
  //   // this.props.history.push("/document/create?id=" + id);
  this.props.history.push({ pathname: "/document/create" });
    //   // this.props.history.push("/document/create?id=" + id);
    this.props.history.push({ pathname: "/document/create" });
  }

  renderColumns = () => {
@@ -45,7 +46,7 @@
      { title: '通知内容', dataIndex: 'documentContent' },
      { title: '接受情况', dataIndex: 'groupType', render: (cur, item) => <span>{item.readNumber || 0}/{item.noticeNumber || 0}</span> },
      { title: '通知时间', dataIndex: 'createTime', render: (cur, item) => cur !== "" && cur != null ? moment(cur).format("YYYY-MM-DD HH:mm") : "" },
      { title: '操作', render: (text, record) => <a href="" onClick={() => this.cancle(record.id)}>查看</a> }
      { title: '操作', render: (text, record) => <a onClick={() => this.cancle(record.id)}>查看</a> }
    ];
  }


 src/pages/login/login.jsx

@@ -14,121 +14,121 @@
import fetch from '../../api/request';

class NormalLoginForm extends React.Component {
    constructor(props) {
        super(props);
        this.config = {
            navigationBarTitleText: '',
        };
        this.state = {
            btnLoading: false
        };
    }
    componentWillMount() {
        document.title = '用户登录'
    }

    handleSubmit = e => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                console.log('Received values of form: ', values);
                this.setState({
                    btnLoading: true
                });
                fetch({
                    url: `api/account/login`,
                    method: 'POST',
                    data: {
                        ...values
                    }
                }).then(res => {
                    this.setState({
                        btnLoading: false
                    })
                    if (res) {
                        this.handleRes(res);
                    }
                })
            }
        });
  constructor(props) {
    super(props);
    this.config = {
      navigationBarTitleText: '',
    };
    this.state = {
      btnLoading: false
    };
  }
  componentWillMount() {
    document.title = '用户登录'
  }

    handleRes = (res) => {

        // 将token放入缓存
        window.localStorage.setItem('token', res.token);

  handleSubmit = e => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        console.log('Received values of form: ', values);
        this.setState({
          btnLoading: true
        });
        fetch({
            url: `api/resource/getResource`,
          url: `api/account/login`,
          method: 'POST',
          data: {
            ...values
          }
        }).then(res => {
            console.log('res', res);
            if (res) {
                window.localStorage.setItem('menu', JSON.stringify(res));
                message.success('登录成功');
                this.props.history.push({ pathname: "/index" });
            }
          this.setState({
            btnLoading: false
          })
          if (res) {
            this.handleRes(res);
          }
        })
      }
    });
  };

  handleRes = (res) => {

    }
    // 将token放入缓存
    window.localStorage.setItem('token', res.token);
    window.localStorage.setItem('loginUser', JSON.stringify(res));  //登录的用户信息

    render() {
        const { getFieldDecorator } = this.props.form;
        const { btnLoading } = this.state;
        return (
            <div className="login-main">
                <div className="login-div">
                    <div className="login-div-top">
                        <img className="login-div-top-img" src={logo} />
                    </div>
                    <div className="login-div-content">
                        <div className="login-div-content-div">
                            <div className="login-div-content-div-title">登录OA云平台</div>
                            <Form onSubmit={this.handleSubmit} className="login-form">
                                <Form.Item className="login-div-content-form-flex" >
                                    {getFieldDecorator('account', {
                                        rules: [{ required: true, message: '请输入账号!' }],
                                    })(
                                        <Input
                                            style={{ width: '32vh', height: '5vh', margin: '12px' }}
                                            prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
                                            placeholder="请输入账号"
                                        />,
                                    )}
                                </Form.Item>
                                <Form.Item className="login-div-content-form-flex">
                                    {getFieldDecorator('credential', {
                                        rules: [{ required: true, message: '请输入密码!' }],
                                        initialValue: 'admin'
                                    })(
                                        <Input
                                            style={{ width: '32vh', height: '5vh', margin: '12px' }}
                                            prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
                                            type="password"
                                            placeholder="请输入密码"
                                        />,
                                    )}
                                </Form.Item>
                                <Form.Item className="login-div-content-form-flex">
                                    {/* {getFieldDecorator('remember', {
    // 获取登录用户的菜单权限
    fetch({
      url: `api/resource/getResource`,
    }).then(res => {
      console.log('res', res);
      if (res) {
        window.localStorage.setItem('menu', JSON.stringify(res));
        message.success('登录成功');
        this.props.history.push({ pathname: "/index" });
      }
    })
  }

  render() {
    const { getFieldDecorator } = this.props.form;
    const { btnLoading } = this.state;
    return (
      <div className="login-main">
        <div className="login-div">
          <div className="login-div-top">
            <img className="login-div-top-img" src={logo} />
          </div>
          <div className="login-div-content">
            <div className="login-div-content-div">
              <div className="login-div-content-div-title">登录OA云平台</div>
              <Form onSubmit={this.handleSubmit} className="login-form">
                <Form.Item className="login-div-content-form-flex" >
                  {getFieldDecorator('account', {
                    rules: [{ required: true, message: '请输入账号!' }],
                  })(
                    <Input
                      style={{ width: '32vh', height: '5vh', margin: '12px' }}
                      prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
                      placeholder="请输入账号"
                    />,
                  )}
                </Form.Item>
                <Form.Item className="login-div-content-form-flex">
                  {getFieldDecorator('credential', {
                    rules: [{ required: true, message: '请输入密码!' }],
                    initialValue: 'admin'
                  })(
                    <Input
                      style={{ width: '32vh', height: '5vh', margin: '12px' }}
                      prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
                      type="password"
                      placeholder="请输入密码"
                    />,
                  )}
                </Form.Item>
                <Form.Item className="login-div-content-form-flex">
                  {/* {getFieldDecorator('remember', {
                            valuePropName: 'checked',
                            initialValue: true,
                        })(<Checkbox>记住</Checkbox>)}
                        <a className="login-form-forgot" href="">
                            忘记密码
                        </a> */}
                                    <Button type="primary" htmlType="submit" className="login-form-button" loading={btnLoading}>登录</Button>
                                </Form.Item>
                            </Form>

                        </div>
                    </div>
                    <div className="login-div-bottom">2011 10215489广州恒巨信息科技有限公司 版权所有 - 粤ICP备10215489号</div>
                </div>
                  <Button type="primary" htmlType="submit" className="login-form-button" loading={btnLoading}>登录</Button>
                </Form.Item>
              </Form>

            </div>
        );
    }
          </div>
          <div className="login-div-bottom">2011 10215489广州恒巨信息科技有限公司 版权所有 - 粤ICP备10215489号</div>
        </div>

      </div>
    );
  }
}

const WrappedNormalLoginForm = Form.create({ name: 'normal_login' })(NormalLoginForm);