From 91d2b58b9024c358a743e0b42ff53915fb6b8e09 Mon Sep 17 00:00:00 2001 From: Mr Ke <kelq@hugeinfo.com.cn> Date: Mon, 06 Apr 2020 18:56:51 +0800 Subject: [PATCH] 加入登录人信息 --- src/components/common/HeadView/index.jsx | 27 +++-- src/components/page/index/rulesList/index.jsx | 7 src/pages/login/login.jsx | 198 +++++++++++++++++++------------------- src/components/common/NotifyList/index.jsx | 34 +++++- 4 files changed, 145 insertions(+), 121 deletions(-) diff --git a/src/components/common/HeadView/index.jsx b/src/components/common/HeadView/index.jsx index f133c44..759af0d 100644 --- a/src/components/common/HeadView/index.jsx +++ b/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} + <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> ); } diff --git a/src/components/common/NotifyList/index.jsx b/src/components/common/NotifyList/index.jsx index 4c7b328..a2e651a 100644 --- a/src/components/common/NotifyList/index.jsx +++ b/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> ) } diff --git a/src/components/page/index/rulesList/index.jsx b/src/components/page/index/rulesList/index.jsx index b465e0e..c8ecf96 100644 --- a/src/components/page/index/rulesList/index.jsx +++ b/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> } ]; } diff --git a/src/pages/login/login.jsx b/src/pages/login/login.jsx index 8d6150e..b5b4827 100644 --- a/src/pages/login/login.jsx +++ b/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); -- Gitblit v1.8.0