From 562ece16c022e154197e01170e9d0363ec0b9859 Mon Sep 17 00:00:00 2001
From: Mr Ke <kelq@hugeinfo.com.cn>
Date: Mon, 06 Apr 2020 16:43:03 +0800
Subject: [PATCH] 登录、菜单权限
---
src/components/common/MenuView/index.jsx | 2
src/index.js | 2
src/api/request.js | 7
src/pages/index/workbench.jsx | 6
src/components/common/TopListTableView/index.jsx | 26 +-
src/components/common/TopListTableView/index.scss | 15 +
src/components/common/HotListTableView/index.jsx | 135 +++++++++++-
src/index.css | 8
src/components/common/TopListTableView/tagList.js | 83 ++++++++
src/pages/menu/menu.jsx | 17 +
src/components/common/HeadView/index.jsx | 34 +++
src/menu/menu.data.js | 101 +++++++--
src/style/reset.scss | 48 ++++
package.json | 1
src/pages/login/login.jsx | 38 ++-
src/pages/Index.jsx | 9
src/components/common/HotListTableView/index.scss | 10
src/api/httpurl.js | 4
18 files changed, 439 insertions(+), 107 deletions(-)
diff --git a/package.json b/package.json
index 7762c24..013ae08 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
"less": "^3.11.1",
"less-loader": "^5.0.0",
"mockjs": "^1.0.1-beta3",
+ "moment": "^2.24.0",
"react-app-rewired": "^2.1.5"
}
}
diff --git a/src/api/httpurl.js b/src/api/httpurl.js
index 8cbaac2..c5ae97a 100644
--- a/src/api/httpurl.js
+++ b/src/api/httpurl.js
@@ -1,6 +1,6 @@
//内网测试地址
-let StagingUrl = 'http://192.168.0.107:8902';
-// let StagingUrl = "http://g185t82524.51mypc.cn";
+// let StagingUrl = 'http://192.168.0.103:9072';
+let StagingUrl = "http://oa.hugeinfo.com.cn";
// let StagingUrl = "http://30z165r838.qicp.vip";
diff --git a/src/api/request.js b/src/api/request.js
index 106447f..2228239 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -5,11 +5,7 @@
const CODE_SUCCESS = '200';
-let token = window.localStorage.getItem('token') || undefined;
-let loginUser = window.localStorage.getItem('loginUser') || undefined;
-let posId = loginUser ? JSON.parse(loginUser).posId : undefined;
-
-let recognitionParams = ['posId'].reduce((p, n) => {
+let recognitionParams = [].reduce((p, n) => {
if (eval(n)) {
p[n] = eval(n);
return p;
@@ -38,6 +34,7 @@
autoLogin = true,
headers = {}
} = options;
+ let token = window.localStorage.getItem('token') || undefined;
headers['Content-type'] = 'application/json';
headers['Accept'] = 'application/json';
diff --git a/src/components/common/HeadView/index.jsx b/src/components/common/HeadView/index.jsx
index 96ed163..f133c44 100644
--- a/src/components/common/HeadView/index.jsx
+++ b/src/components/common/HeadView/index.jsx
@@ -7,14 +7,40 @@
/** 头部组件 */
import React from 'react';
-import { Layout } from 'antd';
+import { Layout, Menu, Dropdown, Icon, Row, Col, message } from 'antd';
const { Header } = Layout;
import './index.scss';
+const menu = (
+ <Menu>
+ <Menu.Item>
+ <a onClick={() => {
+ // 清空用户相关信息
+ window.localStorage.setItem('menu', '');
+ window.localStorage.setItem('token', '');
+ message.success('退出成功！');
+ window.location.href = window.location.origin + '/#/login';
+ }}>
+ 退出
+ </a>
+ </Menu.Item>
+
+ </Menu>
+);
export default function MenuView({ }) {
- return (
- <Header style={{ background: '#fff', padding: 0, boxShadow: 'inset 0 -1px 0 0 #E5E5E5' }} />
- );
+ 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>
+ </Header>
+ );
}
diff --git a/src/components/common/HotListTableView/index.jsx b/src/components/common/HotListTableView/index.jsx
index 0e30d9d..8469970 100644
--- a/src/components/common/HotListTableView/index.jsx
+++ b/src/components/common/HotListTableView/index.jsx
@@ -8,8 +8,10 @@
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import BreadcrumbView from '../BreadcrumbView';
import TableView from '../TableView';
+import fetch from '../../../api/request';
+import moment from 'moment';
-import { Tabs } from 'antd';
+import { Tabs, Skeleton } from 'antd';
const { TabPane } = Tabs;
@@ -21,30 +23,131 @@
this.config = {
};
this.state = {
+ keywordlist: ['全部'],
+ formData: {
+ __key: Date.now(),
+ keyword: '',
+ page: 1,
+ size: 10,
+ },
+ loading: false
};
}
componentWillMount() { }
- componentDidMount() { }
+ componentDidMount() {
+ let { keywordlist } = this.state;
+ // 设置骨架屏
+ this.setState({
+ loading: true
+ })
+ fetch({
+ url: `api/news/keywordlist`
+ }).then(res => {
+ console.log('res', res);
+ this.setState({
+ loading: false
+ })
+ if (res) {
+ this.setState({
+ keywordlist: keywordlist.concat(res)
+ })
+ }
+ })
+ }
+
+ setFormData = data => {
+ console.log('form', data);
+ this.setState({
+ formData: data,
+ });
+ }
+
+ renderColumns = () => {
+ return [
+ {
+ title: '标题',
+ dataIndex: 'title',
+ key: 'title',
+ render: (cur, item) => {
+ return <a dangerouslySetInnerHTML={{ __html: cur }} onClick={() => {
+ window.open(item.url)
+ }}>
+ </a>
+ }
+ },
+ {
+ title: '发布时间',
+ key: 'create_time',
+ dataIndex: 'create_time',
+
+ render: (cur) => {
+ return (
+ <React.Fragment>
+ {cur && moment(cur).format("YYYY-MM-DD HH:mm")}
+ </React.Fragment>
+ );
+ },
+ },
+ {
+ title: '来源',
+ dataIndex: 'keyword',
+ key: 'keyword',
+ },
+ ];
+ }
+
+ tabChange = (tab) => {
+ console.log('tab', tab);
+ let { formData } = this.state
+ if (tab == '全部') {
+ tab = '';
+ }
+ this.setState({
+ formData: {
+ __key: Date.now(),
+ keyword: tab,
+ page: 1,
+ size: 10,
+ }
+ })
+ }
render() {
+ let { keywordlist, formData, loading } = this.state;
+ let tableParams = {
+ url: `api/news/newslist`,
+ formData,
+ key: formData.__key,
+ columns: this.renderColumns(),
+ extraFromData: {
+ },
+ setFormData: this.setFormData
+ }
return (
<div className="hot-list-table-view-main">
- <BreadcrumbView data={[{ name: '行业热点知识库' }]} />
- <div className="hot-list-table-view-main-content">
- <Tabs defaultActiveKey="1" >
- <TabPane tab="Tab 1" key="1">
- Content of Tab Pane 1
- </TabPane>
- <TabPane tab="Tab 2" key="2">
- Content of Tab Pane 2
- </TabPane>
- <TabPane tab="Tab 3" key="3">
- Content of Tab Pane 3
- </TabPane>
- </Tabs>
- </div>
+ {
+ loading ? <div style={{ padding: 10 }}>
+ <Skeleton />
+ </div>
+ :
+ <React.Fragment>
+ <BreadcrumbView data={[{ name: '行业热点知识库' }]} />
+ <div className="hot-list-table-view-main-content">
+ <Tabs defaultActiveKey={'全部'} onChange={this.tabChange}>
+ {
+ keywordlist.length &&
+ keywordlist.map((key) => (
+ <TabPane tab={key} key={key}>
+ </TabPane>
+ ))
+ }
+ </Tabs>
+ <TableView {...tableParams} />
+ </div>
+ </React.Fragment>
+ }
</div>
)
}
diff --git a/src/components/common/HotListTableView/index.scss b/src/components/common/HotListTableView/index.scss
index a3c6610..27b7399 100644
--- a/src/components/common/HotListTableView/index.scss
+++ b/src/components/common/HotListTableView/index.scss
@@ -8,10 +8,18 @@
.hot-list-table-view {
&-main {
margin: 24px 0;
+ padding-bottom: 24px;
background: #fff;
&-content {
- margin: 0 24px 24px 24px;
+ margin: 0 24px;
border: 1px solid #e6e6e6;
}
+ & .ant-tabs-nav .ant-tabs-tab {
+ padding: 10px !important;
+ font-size: 12px;
+ }
+ & .ant-tabs-bar {
+ margin-bottom: 0 !important;
+ }
}
}
diff --git a/src/components/common/MenuView/index.jsx b/src/components/common/MenuView/index.jsx
index 7b9e76b..378fbb7 100644
--- a/src/components/common/MenuView/index.jsx
+++ b/src/components/common/MenuView/index.jsx
@@ -71,7 +71,7 @@
title={name.length > 10 ? name : undefined}
onClick={() => {
if (type == 'open') {
- window.open('/#' + path);
+ window.open(path);
} else {
history.replace(path);
}
diff --git a/src/components/common/TopListTableView/index.jsx b/src/components/common/TopListTableView/index.jsx
index 6adcb29..0b8423b 100644
--- a/src/components/common/TopListTableView/index.jsx
+++ b/src/components/common/TopListTableView/index.jsx
@@ -7,6 +7,7 @@
/** 榜单table列表 */
import React, { ReactNode, ReactEventHandler, Component } from 'react';
import { Table, Row, Col } from 'antd';
+import { tagList } from './tagList';
import './index.scss';
@@ -16,23 +17,26 @@
this.config = {
};
this.state = {
+ topList: []
};
}
- componentWillMount() { }
+ componentWillMount() {
+ this.setState({
+ topList: tagList
+ })
+ }
componentDidMount() { }
- renderDom = () => {
+ renderDom = ({ name, columns }) => {
return <div className="top-list-table-view-main-table">
- <div className="top-list-table-view-main-table-title">主题</div>
+ <div className="top-list-table-view-main-table-title">{name}
+ <span className="top-list-table-view-main-table-title-fuc">查看</span>
+ </div>
<Table
dataSource={[{ age: 1 }]}
- columns={[{
- title: '年龄',
- dataIndex: 'age',
- key: 'age'
- }]}
+ columns={columns}
size="small"
bordered={false}
pagination={false}
@@ -41,13 +45,13 @@
}
render() {
-
+ let { topList } = this.state;
return (
<div className="top-list-table-view-main">
<Row type="flex" gutter={12}>
{
- [1, 2, 3].map((item, idx) => {
- return <Col span={24 / 3} key={idx}>{this.renderDom()}</Col>;
+ topList.map((item, idx) => {
+ return <Col span={24 / 3} key={idx}>{this.renderDom(item)}</Col>;
})
}
</Row>
diff --git a/src/components/common/TopListTableView/index.scss b/src/components/common/TopListTableView/index.scss
index 369fd80..979a821 100644
--- a/src/components/common/TopListTableView/index.scss
+++ b/src/components/common/TopListTableView/index.scss
@@ -167,8 +167,21 @@
color: #323232;
text-align: center;
line-height: 22px;
- padding-bottom: 15px;
+ margin-bottom: 15px;
font-weight: bold;
+ position: relative;
+ &-fuc {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ font-family: PingFangSC-Medium;
+ font-size: 12px;
+ color: #559de6;
+ text-align: center;
+ line-height: 20px;
+ margin-right: 20px;
+ cursor: pointer;
+ }
}
}
}
diff --git a/src/components/common/TopListTableView/tagList.js b/src/components/common/TopListTableView/tagList.js
new file mode 100644
index 0000000..646b9e4
--- /dev/null
+++ b/src/components/common/TopListTableView/tagList.js
@@ -0,0 +1,83 @@
+/* eslint-disable */
+export const tagList = [
+ {
+ name: '考勤榜单',
+ columns: [
+ {
+ title: '名词',
+ dataIndex: 'index',
+ key: 'index'
+ },
+ {
+ title: '姓名',
+ dataIndex: 'name',
+ key: 'name'
+ },
+ {
+ title: '部门',
+ dataIndex: 'part',
+ key: 'part'
+ },
+ {
+ title: '次数',
+ dataIndex: 'count',
+ key: 'count'
+ },
+ {
+ title: '时长(分)',
+ dataIndex: 'time',
+ key: 'timer'
+ }
+ ]
+ },
+ {
+ name: '绩效榜单',
+ columns: [
+ {
+ title: '名词',
+ dataIndex: 'index',
+ key: 'index'
+ },
+ {
+ title: '姓名',
+ dataIndex: 'name',
+ key: 'name'
+ },
+ {
+ title: '部门',
+ dataIndex: 'part',
+ key: 'part'
+ },
+ {
+ title: '绩效得分',
+ dataIndex: 'score',
+ key: 'score'
+ }
+ ]
+ },
+ {
+ name: '缺陷榜单',
+ columns: [
+ {
+ title: '名词',
+ dataIndex: 'index',
+ key: 'index'
+ },
+ {
+ title: '姓名',
+ dataIndex: 'name',
+ key: 'name'
+ },
+ {
+ title: '部门',
+ dataIndex: 'part',
+ key: 'part'
+ },
+ {
+ title: '缺陷数',
+ dataIndex: 'quexianshu',
+ key: 'quexianshu'
+ }
+ ]
+ }
+];
diff --git a/src/index.css b/src/index.css
index 83b8ff5..355764e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -22,6 +22,8 @@
height: 100%;
}
-/* .ant-layout-sider-trigger {
- background: #58bc58;
-} */
+* {
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+}
+
diff --git a/src/index.js b/src/index.js
index fe268fd..45762db 100644
--- a/src/index.js
+++ b/src/index.js
@@ -41,7 +41,7 @@
<Content>
<Switch>
{/* 首页 */}
- <Route path="/index/workbench" component={Workbench} />
+ <Route path="/index" component={Workbench} />
<Route path="/login" component={Login} />
diff --git a/src/menu/menu.data.js b/src/menu/menu.data.js
index f2ca0af..ebd45cf 100644
--- a/src/menu/menu.data.js
+++ b/src/menu/menu.data.js
@@ -9,38 +9,81 @@
name: '首页',
path: '/app',
icon: 'home',
- permKey: 'menu.home',
- children: [{
- key: 'index_workbench',
+ permKey: 'index',
+ children: [
+ {
+ key: 'index',
name: '工作台',
- path: '/index/workbench',
- permKey: '/index/workbench',
+ path: '/index',
+ permKey: '/index',
children: []
- }],
+ },
+ {
+ key: '/index/rules',
+ name: '规章制度',
+ path: '/index/rules',
+ permKey: '/index/rules',
+ children: []
+ }
+ ]
},
- // {
- // key: 'collect',
- // name: '信息采集',
- // path: '/collect',
- // icon: 'user',
- // permKey: 'menu.users',
- // children: [
- // {
- // key: 'collect_jurisdictionPersonMgt',
- // name: '辖区人口管理',
- // path: '/collect/jurisdictionPersonMgt',
- // permKey: 'collect_jurisdictionPersonMgt',
- // children: [],
- // },
- // {
- // key: 'collect_personhouseMgt',
- // name: '查人查房管理',
- // path: '/collect/personhouseMgt',
- // permKey: 'collect_personhouseMgt',
- // children: [],
- // }
- // ],
- // },
+ {
+ key: 'workOffice',
+ name: '办公',
+ path: 'http://120.79.193.119:9090/',
+ icon: 'desktop',
+ permKey: 'workOffice',
+ children: [
+ {
+ key: 'workOffice',
+ name: 'GitBilt',
+ path: 'http://120.79.193.119:9090/',
+ permKey: 'http://120.79.193.119:9090/',
+ children: [],
+ type: 'open'
+ },
+ {
+ key: 'workOffice',
+ name: 'Teambition',
+ path: 'https://account.teambition.com/login/password',
+ permKey: 'https://account.teambition.com/login/password',
+ children: [],
+ type: 'open'
+ }
+ ]
+ },
+ {
+ key: 'document',
+ name: '文档管理',
+ path: '/document',
+ icon: 'file',
+ permKey: 'document',
+ children: [
+ {
+ key: '/document/create',
+ name: '新建文档',
+ path: '/document/create',
+ permKey: '/document/create',
+ children: []
+ }
+ ]
+ },
+ {
+ key: 'logManage',
+ name: '系统管理',
+ path: '/logManage',
+ icon: 'setting',
+ permKey: 'logManage',
+ children: [
+ {
+ key: '/logManage/browseLog',
+ name: '浏览日志',
+ path: '/logManage/browseLog',
+ permKey: '/logManage/browseLog',
+ children: []
+ }
+ ]
+ }
];
export default menus;
diff --git a/src/pages/Index.jsx b/src/pages/Index.jsx
index dc5b9da..9cbd063 100644
--- a/src/pages/Index.jsx
+++ b/src/pages/Index.jsx
@@ -20,15 +20,6 @@
componentDidMount() {
document.title = 'Index';
- fetch({
- url: 'hik-common/api/opus/user/loginTest',
- params: {
- loginName: 'lilinl',
- passWord: 'qweqw',
- }
- }).then(res => {
- console.log('res', res);
- })
}
render() {
diff --git a/src/pages/index/workbench.jsx b/src/pages/index/workbench.jsx
index 569a806..52203d1 100644
--- a/src/pages/index/workbench.jsx
+++ b/src/pages/index/workbench.jsx
@@ -26,9 +26,11 @@
render() {
return (
- <div className="workbench-page-main">
+ <div className="workbench-page-main flex-box-column">
<BreadcrumbView data={[{ name: '工作台' }]} />
- <WorkbenchPage />
+ <div className="flex-1">
+ <WorkbenchPage />
+ </div>
</div>
)
}
diff --git a/src/pages/login/login.jsx b/src/pages/login/login.jsx
index c967383..8d6150e 100644
--- a/src/pages/login/login.jsx
+++ b/src/pages/login/login.jsx
@@ -36,8 +36,9 @@
btnLoading: true
});
fetch({
- url: `hik-common/api/opus/user/loginTest`,
- params: {
+ url: `api/account/login`,
+ method: 'POST',
+ data: {
...values
}
}).then(res => {
@@ -53,18 +54,21 @@
};
handleRes = (res) => {
- let loginUser = {};
- let curPosIndex = window.localStorage.getItem('curPosIndex');
- curPosIndex = (curPosIndex || curPosIndex == {}) || 0;
- loginUser = res.user[curPosIndex];
- window.localStorage.setItem('user', res);
+ // 将token放入缓存
window.localStorage.setItem('token', res.token);
- window.localStorage.setItem('curPosIndex', curPosIndex);
- window.localStorage.setItem('loginUser', JSON.stringify(loginUser));
- message.success('登录成功', () => {
- this.props.history.push({ pathname: "/index" });
+
+ 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" });
+ }
})
+
}
@@ -82,24 +86,24 @@
<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('loginName', {
+ {getFieldDecorator('account', {
rules: [{ required: true, message: '请输入账号!' }],
})(
<Input
- style={{ width: '32vh',height: '5vh',margin:'12px' }}
+ 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('passWord', {
+ {getFieldDecorator('credential', {
rules: [{ required: true, message: '请输入密码!' }],
- initialValue: 'psw'
+ initialValue: 'admin'
})(
<Input
- style={{ width: '32vh',height: '5vh',margin:'12px' }}
- prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)'}} />}
+ style={{ width: '32vh', height: '5vh', margin: '12px' }}
+ prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
type="password"
placeholder="请输入密码"
/>,
diff --git a/src/pages/menu/menu.jsx b/src/pages/menu/menu.jsx
index 70b99ce..83d581b 100644
--- a/src/pages/menu/menu.jsx
+++ b/src/pages/menu/menu.jsx
@@ -10,8 +10,8 @@
import { Spin, Layout, Menu, Icon } from 'antd';
import MenView from '../../components/common/MenuView';
import { menus, getMenuListByPermission } from '../../menu';
+import fetch from '../../api/request';
-// import Fetch from '../fetch';
const { Sider } = Layout;
function find(data, pathname) {
@@ -39,9 +39,20 @@
};
}
- componentDidMount() {
- this.setState({ data: menus });
+ componentWillMount() {
+ // 获取从登录页面记录在缓存里的菜单数据
+ let menu = window.localStorage.getItem('menu') ? JSON.parse(window.localStorage.getItem('menu')) : [];
+ let permList = menu && menu.map(({ symbol }) => (symbol)).concat(menu.map(({ moduleSymbol }) => (moduleSymbol))).reduce((p, n) => {
+ if (p.indexOf(n) == -1) {
+ return p.concat(n)
+ } else {
+ return p
+ }
+ }, []);
+ console.log(getMenuListByPermission(menus, permList) )
+ this.setState({ data: getMenuListByPermission(menus, permList) });
}
+ componentDidMount() { }
onCollapse = collapsed => {
this.setState({ collapsed });
diff --git a/src/style/reset.scss b/src/style/reset.scss
index 791988d..802dc2e 100644
--- a/src/style/reset.scss
+++ b/src/style/reset.scss
@@ -2,7 +2,51 @@
margin-bottom: 20px;
}
-.ant-layout-sider-trigger{
- background: #CC4E45;
+.ant-layout-sider-trigger {
+ background: #cc4e45;
}
+.ant-layout-sider {
+ background-color: #fff !important;
+}
+
+*::-webkit-scrollbar {
+ /*滚动条整体样式*/
+ width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
+ height: 1px;
+}
+*::-webkit-scrollbar-thumb {
+ /*滚动条里面小方块*/
+ border-radius: 2.5px;
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+ background: #848484;
+}
+*::-webkit-scrollbar-track {
+ /*滚动条里面轨道*/
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+ border-radius: 2.5px;
+ background: #ededed;
+}
+
+.ant-layout {
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+}
+
+.ant-layout-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.flex-box-column {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+}
+
+.flex-1 {
+ flex: 1;
+ overflow-y: auto;
+}
--
Gitblit v1.8.0