Skip to content

L
LoginSystem
Commit 13542d34 by wangshufen
Options

fixed:登录模块修改

parent f1f79fcc
Showing with 186 additions and 177 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/*"]
}
}
}
\ No newline at end of file
src/App.js
...@@ -8,6 +8,7 @@ import './App.css' ...@@ -8,6 +8,7 @@ import './App.css'
import './assets/font/iconfont.css' import './assets/font/iconfont.css'
var baseURL = 'http://52.83.169.190:8005 ' var baseURL = 'http://52.83.169.190:8005 '
class App extends Component { class App extends Component {
render () { render () {
return ( return (
......
src/components/ContentMain/index.js
...@@ -37,7 +37,7 @@ class ContentMain extends React.Component { ...@@ -37,7 +37,7 @@ class ContentMain extends React.Component {
<PrivateRoute exact path='/home/SequenceDetails' component={SequenceDetails}/> <PrivateRoute exact path='/home/SequenceDetails' component={SequenceDetails}/>
<PrivateRoute exact path='/computationalTools/ProteinTools' component={ProteinTools}/> <PrivateRoute exact path='/computationalTools/ProteinTools' component={ProteinTools}/>
<PrivateRoute exact path='/computationalTools/MultipleSequenceAlignment' component={MultipleSequenceAlignment}/> <PrivateRoute exact path='/computationalTools/MultipleSequenceAlignment' component={MultipleSequenceAlignment}/>
<Redirect exact from='/' to='/home'/> <Redirect exact from='/' to='/login'/>
</Switch> </Switch>
</div> </div>
) )
......
src/index.js
...@@ -9,7 +9,6 @@ import { Provider } from 'mobx-react' ...@@ -9,7 +9,6 @@ import { Provider } from 'mobx-react'
import { LocaleProvider } from 'antd' import { LocaleProvider } from 'antd'
import zh_CN from 'antd/lib/locale-provider/zh_CN' import zh_CN from 'antd/lib/locale-provider/zh_CN'
import store from './store' import store from './store'
//打包时，用的HashRouter并加上了basename，因为放在服务器的二级目录下 //打包时，用的HashRouter并加上了basename，因为放在服务器的二级目录下
ReactDOM.render( ReactDOM.render(
<HashRouter> <HashRouter>
......
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 './index.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 "./index.css";
const { TabPane } = Tabs; const { TabPane } = Tabs;
const { Option } = Select; const { Option } = Select;
const { Meta } = Card; const { Meta } = Card;
...@@ -24,27 +12,22 @@ const { Meta } = Card; ...@@ -24,27 +12,22 @@ const { Meta } = Card;
class Home extends React.Component { class Home extends React.Component {
state = { state = {
// list: qs.parse(this.props.location.search.slice(1)) // list: qs.parse(this.props.location.search.slice(1))
list: [ list: [],
]
}; };
componentDidMount() { componentDidMount() {
if (qs.parse(this.props.location.search.slice(1))) { if (qs.parse(this.props.location.search.slice(1))) {
let list=qs.parse(this.props.location.search.slice(1)) let list = qs.parse(this.props.location.search.slice(1));
var arr = Array.from(Object.values(list),x=>x); var arr = Array.from(Object.values(list), (x) => x);
this.setState({ this.setState({
list:arr list: arr,
}) });
} }
}
getList=(e)=>{
this.setState({
list:e
})
} }
getList = (e) => {
this.setState({
list: e,
});
};
getantibodyName = (e) => { getantibodyName = (e) => {
const { value } = e.target; const { value } = e.target;
let searchData = this.state.searchData; let searchData = this.state.searchData;
...@@ -94,7 +77,7 @@ class Home extends React.Component { ...@@ -94,7 +77,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) {
...@@ -138,7 +121,7 @@ class Home extends React.Component { ...@@ -138,7 +121,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),
}); });
}; };
...@@ -146,7 +129,7 @@ class Home extends React.Component { ...@@ -146,7 +129,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),
}); });
}; };
...@@ -184,9 +167,10 @@ class Home extends React.Component { ...@@ -184,9 +167,10 @@ class Home extends React.Component {
list: newList, list: newList,
}); });
}; };
getOne=(e)=>{ getOne = (e) => {
window.open(e) console.log('token=========',e + `?token=${localStorage.getItem('token')}`);
} window.open(e + `?token=${localStorage.getItem('token')}`);
};
render() { render() {
const { list } = this.state; const { list } = this.state;
...@@ -204,8 +188,8 @@ class Home extends React.Component { ...@@ -204,8 +188,8 @@ class Home extends React.Component {
wrapperCol: { span: 13, offset: 8 }, wrapperCol: { span: 13, offset: 8 },
}; };
return ( return (
<div className="Docking-div"> <div className='Docking-div'>
<div className="Docking-center"> <div className='Docking-center'>
{/* <div className="logo-topdiv"> {/* <div className="logo-topdiv">
<img <img
alt="example" alt="example"
...@@ -213,52 +197,41 @@ class Home extends React.Component { ...@@ -213,52 +197,41 @@ class Home extends React.Component {
src={require("../../../assets/img/logo.png")} src={require("../../../assets/img/logo.png")}
/> />
</div> */} </div> */}
<div className="top-div"> <div className='top-div'>
<Card <Card
hoverable hoverable
style={{ style={{
width: "100%", width: '100%',
// backgroundColor: "#00FF00", // backgroundColor: "#00FF00",
textAlign: "center", textAlign: 'center',
fontSize: "30px", fontSize: '30px',
fontWeight: 600, fontWeight: 600,
height: "150px", height: '150px',
lineHeight: "100px", lineHeight: '100px',
}} }}
> >
<div className="Computational-div"> <div className='Computational-div'>
<div>welcome to our platform</div> <div>welcome to our platform</div>
</div> </div>
</Card> </Card>
</div> </div>
<div className="home-center"> <div className='home-center'>
<div className="left-div"> <div className='left-div'>
{list.map((item, index) => { {list.map((item, index) => {
return ( return (
<Button <Button type={item.state ? 'primary' : ''} size='large' onClick={() => this.getListOne(index, item.name)} key={index}>
type={item.state ? "primary" : ""}
size="large"
onClick={() => this.getListOne(index, item.name)}
key={index}
>
{item.name} {item.name}
</Button> </Button>
); );
})} })}
</div> </div>
<div className="right-div" > <div className='right-div'>
{list.map((item, index) => { {list.map((item, index) => {
return ( return (
<a <a className={item.state ? '' : 'displaydiv'} size='large' onClick={() => this.getOne(item.url)} key={index}>
className={item.state ? "" : "displaydiv"} 欢迎进入{item.name}平台
size="large"
onClick={() => this.getOne(item.url)}
key={index}
>
欢迎进入{item.name}平台
</a> </a>
); );
})} })}
......
src/routes/Login/AccountLogin.js
import React, { Component } from "react"; import React, { Component } from 'react';
import { inject, observer } from 'mobx-react/index' import { inject, observer } from 'mobx-react/index';
import { withRouter } from 'react-router-dom' import { withRouter } from 'react-router-dom';
import { Input, Button, Card, message, Form, Icon, Row, Col } from "antd"; import { Input, Button, Card, message, Form, Icon, Row, Col } from 'antd';
import "./AccountLogin.css"; import './AccountLogin.css';
import request from "../../utils/request"; import request from '../../utils/request';
import qs from 'qs' import qs from 'qs';
const { TextArea } = Input; const { TextArea } = Input;
@withRouter @inject('appStore') @observer @Form.create() @withRouter
@inject('appStore')
@observer
@Form.create()
export default class ProteinView extends Component { export default class ProteinView extends Component {
state = { state = {
sequence: "", sequence: '',
loading: false, loading: false,
listData: {}, listData: {},
imgUrl: "", imgUrl: '',
}; };
componentDidMount() { componentDidMount() {
this.getImg(); this.getImg();
...@@ -26,7 +29,7 @@ export default class ProteinView extends Component { ...@@ -26,7 +29,7 @@ export default class ProteinView extends Component {
getList() { getList() {
this.setState({ loading: true }); this.setState({ loading: true });
request request
.post("/tool/calc-protein-property", { sequence: this.state.sequence }) .post('/tool/calc-protein-property', { sequence: this.state.sequence })
.then((res) => { .then((res) => {
console.log(res); console.log(res);
this.setState({ loading: false }); this.setState({ loading: false });
...@@ -43,11 +46,11 @@ export default class ProteinView extends Component { ...@@ -43,11 +46,11 @@ export default class ProteinView extends Component {
} }
getImg = () => { getImg = () => {
request request
.get("yszh-login/auth/getPicCaptchCode") .get('yszh-login/auth/getPicCaptchCode')
.then((res) => { .then((res) => {
console.log(res.request.responseURL); console.log(res.request.responseURL);
var num = Math.ceil(Math.random() * 10000) var num = Math.ceil(Math.random() * 10000);
this.setState({ imgUrl: res.request.responseURL+'?num='+ num }); this.setState({ imgUrl: res.request.responseURL + '?num=' + num });
}) })
.catch((err) => { .catch((err) => {
this.setState({ loading: false }); this.setState({ loading: false });
...@@ -67,24 +70,28 @@ export default class ProteinView extends Component { ...@@ -67,24 +70,28 @@ export default class ProteinView extends Component {
userAccount: userAccount, userAccount: userAccount,
userPwd: userPwd, userPwd: userPwd,
picCaptcha: picCaptcha, picCaptcha: picCaptcha,
type: "1", type: '1',
}; };
if (!err) { if (!err) {
request request
.post("yszh-login/pub/login", data) .post('yszh-login/pub/login', data)
.then((res) => { .then((res) => {
console.log(res); console.log(res);
this.setState({ loading: false }); this.setState({ loading: false });
if (res.data.code === 200) { if (res.data.code === 200) {
message.success("登录成功"); message.success('登录成功');
console.log(res.data.result.indexVOList); window.localStorage.setItem('token', res.data.result.token);
window.localStorage.setItem('token', res.data.result.token) let indexVOList = res.data.result.indexVOList;
let indexVOList=res.data.result.indexVOList console.log('indexVOList', indexVOList);
indexVOList[0].state=true // indexVOList.push({ name: 'Kinase', url: 'http://172.16.20.12:3001/#/Kinase', state: false });
// indexVOList.push({ name: 'Computed', url: 'http://172.16.20.12:3002/#/home/Docking', state: false });
indexVOList[0].state = true;
console.log(indexVOList); console.log(indexVOList);
this.props.appStore.toggleLogin(true, {username: 'hahah'}) this.props.appStore.toggleLogin(true, { username: 'hahah' });
const {from} = {from: {pathname: '/home',search: qs.stringify(indexVOList),}} const { from } = { from: { pathname: '/home', search: qs.stringify(indexVOList) } };
this.props.history.push(from) console.log('qs.stringify(indexVOList)', qs.stringify(indexVOList));
console.log('from', from);
this.props.history.push(from);
} else { } else {
message.error(res.data.message); message.error(res.data.message);
} }
...@@ -103,61 +110,36 @@ export default class ProteinView extends Component { ...@@ -103,61 +110,36 @@ export default class ProteinView extends Component {
const { getFieldDecorator } = this.props.form; const { getFieldDecorator } = this.props.form;
return ( return (
<Form onSubmit={this.handleSubmit} className="login-form"> <Form onSubmit={this.handleSubmit} className='login-form'>
<Form.Item> <Form.Item>
{getFieldDecorator("userAccount", { {getFieldDecorator('userAccount', {
rules: [{ required: true, message: "帐号不能为空" }], rules: [{ required: true, message: '帐号不能为空' }],
})( })(<Input prefix={<Icon type='user' style={{ color: 'rgba(0,0,0,.25)' }} />} placeholder='请输入帐号' />)}
<Input
prefix={<Icon type="user" style={{ color: "rgba(0,0,0,.25)" }} />}
placeholder="请输入帐号"
/>
)}
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator("userPwd", { {getFieldDecorator('userPwd', {
rules: [ rules: [{ required: true, message: '密码不能为空' }, { pattern: '^[^ ]+$', message: '密码不能有空格' }],
{ required: true, message: "密码不能为空" }, })(<Input prefix={<Icon type='lock' style={{ color: 'rgba(0,0,0,.25)' }} />} type='password' placeholder='密码' />)}
{ pattern: "^[^ ]+$", message: "密码不能有空格" },
],
})(
<Input
prefix={<Icon type="lock" style={{ color: "rgba(0,0,0,.25)" }} />}
type="password"
placeholder="密码"
/>
)}
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator("picCaptcha", { {getFieldDecorator('picCaptcha', {
validateFirst: true, validateFirst: true,
rules: [{ required: true, message: "请输入验证码" }], rules: [{ required: true, message: '请输入验证码' }],
})( })(
<Row> <Row>
<Col span={15}> <Col span={15}>
<Input maxLength={5} placeholder="验证码" /> <Input maxLength={5} placeholder='验证码' />
</Col> </Col>
<Col span={9}> <Col span={9}>
<div className="Verification-code" onClick={this.getImg}> <div className='Verification-code' onClick={this.getImg}>
<img <img className='VerifyCodeImg' id='showImg' src={this.state.imgUrl} alt='' />
className="VerifyCodeImg"
id="showImg"
src={this.state.imgUrl}
alt=""
/>
</div> </div>
</Col> </Col>
</Row> </Row>
)} )}
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button <Button type='primary' style={{ width: '100%' }} htmlType='submit' className='login-form-button'>
type="primary"
style={{ width: "100%" }}
htmlType="submit"
className="login-form-button"
>
登录 登录
</Button> </Button>
</Form.Item> </Form.Item>
......
src/utils/request.js
// import axios from 'axios'; import axios from 'axios';
// axios.defaults.timeout = 15000 import { getQueryString } from './utils';
// export const request = axios.create({ //禁用F12功能
// baseURL: 'http://52.83.230.236:9001/yszh/1/api/', function disableF12() {
// }); document.onkeydown = function() {
import axios from "axios"; var e = window.event || arguments[0];
// import { bind } from "file-loader"; if (e.keyCode == 123) {
axios.defaults.timeout = 15000 return false;
console.log(window.localStorage.getItem('token')); } else if (e.ctrlKey && e.shiftKey && e.keyCode == 73) {
//设置请求得基准地址 return false;
axios.defaults.baseURL = 'http://69.235.144.91:8048/' }
const request = axios.create(); };
//设置请求头 //禁用鼠标右键
// document.onkeydown = function () { document.oncontextmenu = function() {
// var e = window.event || arguments[0] return false;
// if (e.keyCode == 123) { };
// return false }
// } else if ((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)) { // disableF12();
// return false
// }
// }
// document.oncontextmenu = function () {
// return false
// }
// console.log('window.location.href', window.location);
// console.log('window-----', localStorage.getItem('token'));
// console.log('getQueryString', getQueryString('token'));
// console.log('localStorage', localStorage.getItem('token'));
const baseURL = 'http://69.235.144.91:8048/';
const token = getQueryString('token') || localStorage.getItem('token');
const request = axios.create({
baseURL,
timeout: 15000,
headers: {
// 'Content-Type': 'application/json',
accessToken: token,
},
});
axios.defaults.headers['content-type'] ='application/json'; // request.interceptors.request.use((config) => {
request.interceptors.request.use(config => { // return config;
// 给请求头加token的字段,值为token // });
// request.interceptors.response.use(
config.headers.token = window.localStorage.getItem('token') // (res) => {
// return res;
// },
// (err) => {
// console.log('err', err);
// return err;
// }
// );
return config
})
//导出
export default request; export default request;
src/utils/utils.js
...@@ -2,9 +2,9 @@ function accMul(arg1, arg2) { ...@@ -2,9 +2,9 @@ function accMul(arg1, arg2) {
let m = 0; let m = 0;
const s1 = arg1.toString(); const s1 = arg1.toString();
const s2 = arg2.toString(); const s2 = arg2.toString();
m += s1.split(".").length > 1 ? s1.split(".")[1].length : 0; m += s1.split('.').length > 1 ? s1.split('.')[1].length : 0;
m += s2.split(".").length > 1 ? s2.split(".")[1].length : 0; m += s2.split('.').length > 1 ? s2.split('.')[1].length : 0;
return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / 10 ** m; return (Number(s1.replace('.', '')) * Number(s2.replace('.', ''))) / 10 ** m;
} }
export function digitUppercase(n) { export function digitUppercase(n) {
...@@ -33,7 +33,6 @@ export function digitUppercase(n) { ...@@ -33,7 +33,6 @@ export function digitUppercase(n) {
.replace(/^整$/, '零元整'); .replace(/^整$/, '零元整');
} }
/** /**
* 生成指定区间的随机整数 * 生成指定区间的随机整数
* @param min * @param min
...@@ -49,8 +48,8 @@ export function randomNum(min, max) { ...@@ -49,8 +48,8 @@ export function randomNum(min, max) {
* @param str * @param str
* @returns {number} * @returns {number}
*/ */
export function calculateWidth(arr){ export function calculateWidth(arr) {
return 30 + arr[0].length*15 return 30 + arr[0].length * 15;
} }
/** /**
...@@ -59,8 +58,22 @@ export function calculateWidth(arr){ ...@@ -59,8 +58,22 @@ export function calculateWidth(arr){
* @constructor * @constructor
*/ */
export function preloadingImages(arr) { export function preloadingImages(arr) {
arr.forEach(item=>{ arr.forEach((item) => {
const img = new Image() const img = new Image();
img.src = item img.src = item;
}) });
} }
\ No newline at end of file
/**
* 获取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;
}
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