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 {
return (
<Switch>
<Route path='/login' component={Docking}/>
<PrivateRoute path='/' component={Index}/>
{/* <PrivateRoute path='/' component={Index}/> */}
<PrivateRoute path='/' component={Docking}/>
</Switch>
)
}
......
src/routes/Home/TargetDetails/index.js
......@@ -496,7 +496,7 @@ export default class TargetDetails extends Component {
columns={columnsMutation}
/>
</Panel>
<Panel header="Drug & Clinical imformation" key="4">
<Panel header="Drug & Clinical information" key="4">
<Table
bordered
rowKey='item'
......
src/routes/Home/index.js
import React from "react";
import {
Form,
Input,
Button,
Select,
Tabs,
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";
import React from 'react';
import { Form, Input, Button, Select, Tabs, 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 { Option } = Select;
const { Meta } = Card;
class Home extends React.Component {
state = {
select_db: "Ligands",
data: "",
select_db: 'Ligands',
data: '',
page: 1,
page_size: 10,
data_type: "smile",
target_class: "",
data_type: 'smile',
target_class: '',
// target_families:'',
searchData: {
antibodyName: "",
species: "",
antibodyType: "",
antigenName: "",
clinicalIndication: "",
companies: "",
status: "",
antibodyName: '',
species: '',
antibodyType: '',
antigenName: '',
clinicalIndication: '',
companies: '',
status: '',
pageNum: 1,
pageSize: 10,
},
......@@ -47,17 +35,17 @@ class Home extends React.Component {
StatusList: [],
draw: false,
classList: [],
classData: "All Class",
classData: 'All Class',
allClassList: {},
childClassList: [],
list: [
{
name: "general search",
name: 'general search',
state: true,
searchType: 1,
},
{
name: "cdr search",
name: 'cdr search',
state: false,
searchType: 2,
},
......@@ -117,7 +105,7 @@ class Home extends React.Component {
console.log(qs.parse(this.props.location.search.slice(1)));
this.setState({ loading: true });
request
.get("/common/codes")
.get('/common/codes')
.then((res) => {
console.log(res);
if (res.data.code === 0) {
......@@ -161,7 +149,7 @@ class Home extends React.Component {
clinicalIndication: this.state.searchData.clinicalIndication,
};
this.props.history.push({
pathname: "/home/AutoimmuneDiseases",
pathname: '/home/AutoimmuneDiseases',
search: qs.stringify(data),
});
};
......@@ -169,7 +157,7 @@ class Home extends React.Component {
getList = () => {
let data = this.state.searchData;
this.props.history.push({
pathname: "/home/StructureSearch",
pathname: '/home/StructureSearch',
search: qs.stringify(data),
});
};
......@@ -224,10 +212,10 @@ class Home extends React.Component {
wrapperCol: { span: 13, offset: 8 },
};
return (
<div className="home">
<div className='home'>
<LogoTitlte />
<div className="home-div">
<div className="top-div">
<div className='home-div'>
<div className='top-div'>
{/* <Tabs onChange={this.callback} type="card">
<TabPane tab="search" key="1">
<Button type="primary" onClick={this.getList} >结构搜索</Button>
......@@ -237,8 +225,8 @@ class Home extends React.Component {
</TabPane>
</Tabs> */}
<div className="home-top-div">
<div className="left-div">
<div className='home-top-div'>
<div className='left-div'>
{list.map((item, index) => {
// return (
// <Button
......@@ -253,67 +241,27 @@ class Home extends React.Component {
// );
})}
</div>
<div className="right-div">
<div className='right-div'>
{list[0].state && (
<Button type="primary" onClick={this.getList}>
<Button type='primary' onClick={this.getList}>
结构搜索
</Button>
)}
{list[1].state && (
<Button type="primary">docking retrosynthesis</Button>
)}
{list[1].state && <Button type='primary'>docking retrosynthesis</Button>}
</div>
</div>
</div>
</div>
<div className="cardLIst">
<Card
hoverable
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"
/>
<div className='cardLIst'>
<Card hoverable 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
hoverable
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 hoverable 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
hoverable
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 hoverable 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>
</div>
</div>
);
......
src/routes/Index/index.js
import React from 'react'
import {Layout} from 'antd'
import SiderNav from '../../components/SiderNav'
import ContentMain from '../../components/ContentMain'
import HeaderBar from '../../components/HeaderBar'
import React from 'react';
import { Layout } from 'antd';
import SiderNav from '../../components/SiderNav';
import ContentMain from '../../components/ContentMain';
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 = {
collapsed: false
}
collapsed: false,
};
toggle = () => {
// console.log(this) 状态提升后，到底是谁调用的它
this.setState({
collapsed: !this.state.collapsed
})
}
collapsed: !this.state.collapsed,
});
};
render() {
// 设置Sider的minHeight可以使左右自适应对齐
return (
<div id='page'>
<Layout>
<Sider collapsible
trigger={null}
collapsed={this.state.collapsed}
>
<SiderNav/>
<Sider collapsible trigger={null} collapsed={this.state.collapsed}>
<SiderNav />
</Sider>
<Layout>
<Header style={{background: '#fff', padding: '0 16px'}}>
<HeaderBar collapsed={this.state.collapsed} onToggle={this.toggle}/>
<Header style={{ background: '#fff', padding: '0 16px' }}>
<HeaderBar collapsed={this.state.collapsed} onToggle={this.toggle} />
</Header>
<Content>
<ContentMain/>
<ContentMain />
</Content>
{/* <Footer></Footer> */}
</Layout>
......@@ -43,4 +39,4 @@ class Index extends React.Component{
);
}
}
export default Index
\ No newline at end of file
export default Index;
src/routes/Login/LoginForm.js
......@@ -132,7 +132,7 @@ class LoginForm extends React.Component {
const {focusItem,} = this.state
return (
<div className={this.props.className}>
<h3 className='title'>管理员登录</h3>
<h3 className='title'>管理员登录 </h3>
<Form onSubmit={this.loginSubmit}>
<Form.Item help={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 { bind } from "file-loader";
axios.defaults.timeout = 15000;
console.log(window.localStorage.getItem('token'));
//设置请求得基准地址
axios.defaults.baseURL = 'http://tcal.atelligence-ai.com/';
const request = axios.create();
//设置请求头
import { getQueryString } from './utils';
import { message } from 'antd';
// document.onkeydown = function() {
// var e = window.event || arguments[0];
// if (e.keyCode == 123) {
// return false;
// } else if (e.ctrlKey && e.shiftKey && e.keyCode == 73) {
// return false;
// }
// };
// document.oncontextmenu = function() {
// return false;
// };
//禁用F12功能
function disableF12() {
document.onkeydown = function() {
var e = window.event || arguments[0];
if (e.keyCode == 123) {
return false;
} else if (e.ctrlKey && e.shiftKey && e.keyCode == 73) {
return false;
}
};
//禁用鼠标右键
document.oncontextmenu = function() {
return false;
};
}
// disableF12();
// axios.defaults.headers['content-type'] ='application/json';
// request.interceptors.request.use(config => {
// // 给请求头加token的字段,值为token
//对axios二次封装
// console.log('getQueryString', getQueryString('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;
src/utils/utils.js
......@@ -64,3 +64,17 @@ export function preloadingImages(arr) {
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