Skip to content

C
computingPlatform
Commit f61ca308 by wangshufen
Options

feature:登录功能添加token校验

parent 050ea14e
Showing with 196 additions and 147 deletions
.eslintrc.js 0 → 100644
module.exports = {
root: true, //此项是用来告诉eslint找当前配置文件不能往父级查找
env: {
node: true,
},
// "off" -> 0 关闭规则 "warn" -> 1 开启警告规则 "error" -> 2 开启错误规则
rules: {
'generator-star-spacing': 'off',
'no-tabs': 'off',
'no-unused-vars': 'off', //声明的变量未使用
'no-console': 'off',
'no-irregular-whitespace': 'off',
'no-debugger': 'off',
eqeqeq: 'off', // 使用全等
},
parser: 'babel-eslint',
parserOptions: {
ecmaVersion: 7,
sourceType: 'module',
},
};
jsconfig.json 0 → 100644
{
"compilerOptions": {
"baseUrl": "./",
"experimentalDecorators": true,
"paths": {
"@/*": ["src/*"]
}
},
"exclude": ["node_modules", ".vscode", "library", "local", "settings", "temp", "build"]
}
src/App.js
...@@ -14,7 +14,8 @@ class App extends Component { ...@@ -14,7 +14,8 @@ class App extends Component {
return ( return (
<Switch> <Switch>
<Route path='/login' component={Docking}/> <Route path='/login' component={Docking}/>
<PrivateRoute path='/' component={Index}/> {/* <PrivateRoute path='/' component={Index}/> */}
<PrivateRoute path='/' component={Docking}/>
</Switch> </Switch>
) )
} }
......
src/routes/Home/TargetDetails/index.js
...@@ -496,7 +496,7 @@ export default class TargetDetails extends Component { ...@@ -496,7 +496,7 @@ export default class TargetDetails extends Component {
columns={columnsMutation} columns={columnsMutation}
/> />
</Panel> </Panel>
<Panel header="Drug & Clinical imformation" key="4"> <Panel header="Drug & Clinical information" key="4">
<Table <Table
bordered bordered
rowKey='item' rowKey='item'
......
src/routes/Home/index.js
import React from "react"; import React from 'react';
import { import { Form, Input, Button, Select, Tabs, message, Radio, Checkbox, Row, Col, Card } from 'antd';
Form, import LogoTitlte from '../../components/LogoTitlte/index';
Input, import { Jsme } from 'jsme-react';
Button, import qs from 'qs';
Select, import request from '../../utils/request';
Tabs, import './style.css';
message,
Radio,
Checkbox,
Row,
Col,
Card
} from "antd";
import LogoTitlte from "../../components/LogoTitlte/index";
import { Jsme } from "jsme-react";
import qs from "qs";
import request from "../../utils/request";
import "./style.css";
const { TabPane } = Tabs; const { TabPane } = Tabs;
const { Option } = Select; const { Option } = Select;
const { Meta } = Card; const { Meta } = Card;
class Home extends React.Component { class Home extends React.Component {
state = { state = {
select_db: "Ligands", select_db: 'Ligands',
data: "", data: '',
page: 1, page: 1,
page_size: 10, page_size: 10,
data_type: "smile", data_type: 'smile',
target_class: "", target_class: '',
// target_families:'', // target_families:'',
searchData: { searchData: {
antibodyName: "", antibodyName: '',
species: "", species: '',
antibodyType: "", antibodyType: '',
antigenName: "", antigenName: '',
clinicalIndication: "", clinicalIndication: '',
companies: "", companies: '',
status: "", status: '',
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
}, },
...@@ -47,17 +35,17 @@ class Home extends React.Component { ...@@ -47,17 +35,17 @@ class Home extends React.Component {
StatusList: [], StatusList: [],
draw: false, draw: false,
classList: [], classList: [],
classData: "All Class", classData: 'All Class',
allClassList: {}, allClassList: {},
childClassList: [], childClassList: [],
list: [ list: [
{ {
name: "general search", name: 'general search',
state: true, state: true,
searchType: 1, searchType: 1,
}, },
{ {
name: "cdr search", name: 'cdr search',
state: false, state: false,
searchType: 2, searchType: 2,
}, },
...@@ -117,7 +105,7 @@ class Home extends React.Component { ...@@ -117,7 +105,7 @@ class Home extends React.Component {
console.log(qs.parse(this.props.location.search.slice(1))); console.log(qs.parse(this.props.location.search.slice(1)));
this.setState({ loading: true }); this.setState({ loading: true });
request request
.get("/common/codes") .get('/common/codes')
.then((res) => { .then((res) => {
console.log(res); console.log(res);
if (res.data.code === 0) { if (res.data.code === 0) {
...@@ -161,7 +149,7 @@ class Home extends React.Component { ...@@ -161,7 +149,7 @@ class Home extends React.Component {
clinicalIndication: this.state.searchData.clinicalIndication, clinicalIndication: this.state.searchData.clinicalIndication,
}; };
this.props.history.push({ this.props.history.push({
pathname: "/home/AutoimmuneDiseases", pathname: '/home/AutoimmuneDiseases',
search: qs.stringify(data), search: qs.stringify(data),
}); });
}; };
...@@ -169,7 +157,7 @@ class Home extends React.Component { ...@@ -169,7 +157,7 @@ class Home extends React.Component {
getList = () => { getList = () => {
let data = this.state.searchData; let data = this.state.searchData;
this.props.history.push({ this.props.history.push({
pathname: "/home/StructureSearch", pathname: '/home/StructureSearch',
search: qs.stringify(data), search: qs.stringify(data),
}); });
}; };
...@@ -224,10 +212,10 @@ class Home extends React.Component { ...@@ -224,10 +212,10 @@ class Home extends React.Component {
wrapperCol: { span: 13, offset: 8 }, wrapperCol: { span: 13, offset: 8 },
}; };
return ( return (
<div className="home"> <div className='home'>
<LogoTitlte /> <LogoTitlte />
<div className="home-div"> <div className='home-div'>
<div className="top-div"> <div className='top-div'>
{/* <Tabs onChange={this.callback} type="card"> {/* <Tabs onChange={this.callback} type="card">
<TabPane tab="search" key="1"> <TabPane tab="search" key="1">
<Button type="primary" onClick={this.getList} >结构搜索</Button> <Button type="primary" onClick={this.getList} >结构搜索</Button>
...@@ -237,8 +225,8 @@ class Home extends React.Component { ...@@ -237,8 +225,8 @@ class Home extends React.Component {
</TabPane> </TabPane>
</Tabs> */} </Tabs> */}
<div className="home-top-div"> <div className='home-top-div'>
<div className="left-div"> <div className='left-div'>
{list.map((item, index) => { {list.map((item, index) => {
// return ( // return (
// <Button // <Button
...@@ -253,67 +241,27 @@ class Home extends React.Component { ...@@ -253,67 +241,27 @@ class Home extends React.Component {
// ); // );
})} })}
</div> </div>
<div className="right-div"> <div className='right-div'>
{list[0].state && ( {list[0].state && (
<Button type="primary" onClick={this.getList}> <Button type='primary' onClick={this.getList}>
结构搜索 结构搜索
</Button> </Button>
)} )}
{list[1].state && ( {list[1].state && <Button type='primary'>docking retrosynthesis</Button>}
<Button type="primary">docking retrosynthesis</Button>
)}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="cardLIst"> <div className='cardLIst'>
<Card <Card hoverable style={{ width: 240 }} cover={<img alt='example' src='http://52.83.169.190:3003/images/soluImg2.png' />}>
hoverable <Meta title='模块' description='Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean' />
style={{ width: 240 }}
cover={
<img
alt="example"
src="http://52.83.169.190:3003/images/soluImg2.png"
/>
}
>
<Meta
title="模块"
description="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean"
/>
</Card> </Card>
<Card <Card hoverable style={{ width: 240 }} cover={<img alt='example' src='http://52.83.169.190:3003/images/soluImg2.png' />}>
hoverable <Meta title='模块' description='Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean' />
style={{ width: 240 }}
cover={
<img
alt="example"
src="http://52.83.169.190:3003/images/soluImg2.png"
/>
}
>
<Meta
title="模块"
description="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean"
/>
</Card> </Card>
<Card <Card hoverable style={{ width: 240 }} cover={<img alt='example' src='http://52.83.169.190:3003/images/soluImg2.png' />}>
hoverable <Meta title='模块' description='Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean' />
style={{ width: 240 }}
cover={
<img
alt="example"
src="http://52.83.169.190:3003/images/soluImg2.png"
/>
}
>
<Meta
title="模块"
description="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean"
/>
</Card> </Card>
</div> </div>
</div> </div>
); );
......
src/routes/Index/index.js
import React from 'react' import React from 'react';
import {Layout} from 'antd' import { Layout } from 'antd';
import SiderNav from '../../components/SiderNav' import SiderNav from '../../components/SiderNav';
import ContentMain from '../../components/ContentMain' import ContentMain from '../../components/ContentMain';
import HeaderBar from '../../components/HeaderBar' import HeaderBar from '../../components/HeaderBar';
const {Sider, Header, Content, Footer} = Layout const { Sider, Header, Content, Footer } = Layout;
class Index extends React.Component {
class Index extends React.Component{
state = { state = {
collapsed: false collapsed: false,
} };
toggle = () => { toggle = () => {
// console.log(this) 状态提升后，到底是谁调用的它 // console.log(this) 状态提升后，到底是谁调用的它
this.setState({ this.setState({
collapsed: !this.state.collapsed collapsed: !this.state.collapsed,
}) });
} };
render() { render() {
// 设置Sider的minHeight可以使左右自适应对齐 // 设置Sider的minHeight可以使左右自适应对齐
return ( return (
<div id='page'> <div id='page'>
<Layout> <Layout>
<Sider collapsible <Sider collapsible trigger={null} collapsed={this.state.collapsed}>
trigger={null} <SiderNav />
collapsed={this.state.collapsed}
>
<SiderNav/>
</Sider> </Sider>
<Layout> <Layout>
<Header style={{background: '#fff', padding: '0 16px'}}> <Header style={{ background: '#fff', padding: '0 16px' }}>
<HeaderBar collapsed={this.state.collapsed} onToggle={this.toggle}/> <HeaderBar collapsed={this.state.collapsed} onToggle={this.toggle} />
</Header> </Header>
<Content> <Content>
<ContentMain/> <ContentMain />
</Content> </Content>
{/* <Footer></Footer> */} {/* <Footer></Footer> */}
</Layout> </Layout>
...@@ -43,4 +39,4 @@ class Index extends React.Component{ ...@@ -43,4 +39,4 @@ class Index extends React.Component{
); );
} }
} }
export default Index export default Index;
\ No newline at end of file
src/routes/Login/LoginForm.js
...@@ -132,7 +132,7 @@ class LoginForm extends React.Component { ...@@ -132,7 +132,7 @@ class LoginForm extends React.Component {
const {focusItem,} = this.state const {focusItem,} = this.state
return ( return (
<div className={this.props.className}> <div className={this.props.className}>
<h3 className='title'>管理员登录</h3> <h3 className='title'>管理员登录 </h3>
<Form onSubmit={this.loginSubmit}> <Form onSubmit={this.loginSubmit}>
<Form.Item help={getFieldError('userAccount') && <Form.Item help={getFieldError('userAccount') &&
<PromptBox info={getFieldError('userAccount')} width={calculateWidth(getFieldError('userAccount'))}/>}> <PromptBox info={getFieldError('userAccount')} width={calculateWidth(getFieldError('userAccount'))}/>}>
......
src/utils/request.js
// import axios from 'axios';
// axios.defaults.timeout = 15000
// export const request = axios.create({
// baseURL: 'http://52.83.230.236:9001/yszh/1/api/',
// });
import axios from 'axios'; import axios from 'axios';
// import { bind } from "file-loader"; import { getQueryString } from './utils';
axios.defaults.timeout = 15000; import { message } from 'antd';
console.log(window.localStorage.getItem('token'));
//设置请求得基准地址
axios.defaults.baseURL = 'http://tcal.atelligence-ai.com/';
const request = axios.create();
//设置请求头
// document.onkeydown = function() { //禁用F12功能
// var e = window.event || arguments[0]; function disableF12() {
// if (e.keyCode == 123) { document.onkeydown = function() {
// return false; var e = window.event || arguments[0];
// } else if (e.ctrlKey && e.shiftKey && e.keyCode == 73) { if (e.keyCode == 123) {
// return false; return false;
// } } else if (e.ctrlKey && e.shiftKey && e.keyCode == 73) {
// }; return false;
// document.oncontextmenu = function() { }
// return false; };
// }; //禁用鼠标右键
document.oncontextmenu = function() {
return false;
};
}
// disableF12();
// axios.defaults.headers['content-type'] ='application/json'; //对axios二次封装
// request.interceptors.request.use(config => { // console.log('getQueryString', getQueryString('token'));
// // 给请求头加token的字段,值为token // console.log('localStorage', localStorage.getItem('token'));
const token = getQueryString('token') || localStorage.getItem('token');
const request = axios.create({
baseURL: 'http://tcal.atelligence-ai.com/',
timeout: 15000,
headers: {
// 'Content-Type': 'application/json',
accessToken: token,
},
});
// config.headers.accessToken = window.localStorage.getItem('token') function checkToken(config) {
request
.get('http://69.235.144.91:8048/yszh-login/auth/checkToken')
.then((res) => {
console.log(res);
if (res.data.code === 200) {
console.log('token 检验通过');
return config;
} else {
// message.error('请重新登录');
console.log('token校验没通过 返回登录页');
// window.open('http://localhost:3000/#/login', '_self');
window.open('http://69.235.144.91:3048/#/login', '_self');
}
})
.catch((err) => {
console.log('token校验报错 返回登录页');
// message.error('请重新登录');
window.open('http://69.235.144.91:3048/#/login', '_self');
console.log('err', err);
});
}
checkToken();
// return config //拦截器
// }) request.interceptors.request.use((config) => {
// alert('拦截器..');
console.log('token---', '拦截器方法校验token');
if (!!token) {
checkToken(config);
} else {
console.log('token为空....');
window.open('http://69.235.144.91:3048/#/login', '_self');
}
// return config;
});
request.interceptors.response.use(
(res) => {
return res.data;
},
(err) => {
if (err && err.response) {
switch (err.response.status) {
case 400:
console.log('请求错误');
break;
case 401:
console.log('未授权访问');
break;
case 404:
console.log('页面未找到');
break;
default:
console.log('其他错误信息');
}
}
return err;
}
);
//导出
export default request; export default request;
src/utils/utils.js
...@@ -64,3 +64,17 @@ export function preloadingImages(arr) { ...@@ -64,3 +64,17 @@ export function preloadingImages(arr) {
img.src = item img.src = item
}) })
} }
/**
* 获取URL中指定的参数
*/
export function getQueryString(name) {
let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
let r = window.location.hash.split('?')[1] && window.location.hash.split('?')[1].match(reg); //获取url中"?"符后的字符串并正则匹配
let context = '';
if (r != null) context = decodeURIComponent(r[2]);
reg = null;
r = null;
return context == null || context == '' || context == 'undefined' ? '' : context;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment