feature:kiniase功能优化修改

3a8b772b · wangshufen · e08523de · 3a8b772b · 3a8b772b · 3a8b772b
Commit 3a8b772b authored Feb 20, 2023 by wangshufen
8 changed files
--- a/src/routes/Home/TargetDetails/index.js
+++ b/src/routes/Home/TargetDetails/index.js
--- a/src/routes/Kinase/SearchDetails/index.js
+++ b/src/routes/Kinase/SearchDetails/index.js
@@ -950,11 +950,11 @@ export default class SearchDetails extends Component {
              <Table bordered rowKey='dataid' dataSource={DetailsData.Indication} pagination={false} columns={columns2} />
              <Pagination showSizeChanger onShowSizeChange={this.onShowSizeChange3} onChange={this.onChange3} total={total_num3} />
            </Panel>
-            <Panel header='Target' key='1' id='Target'>
+            <Panel header='Target' id='Target' key='1'>
              <Table bordered rowKey='index' dataSource={DetailsData.Target} pagination={false} columns={columns} />
              <Pagination showSizeChanger onShowSizeChange={this.onShowSizeChange2} onChange={this.onChange2} total={total_num} />
            </Panel>
-            <Panel header='Biological Propeties' id='BiologicalPropeties' key='5'>
+            <Panel header='Biological Propeties0' id='BiologicalPropeties' key='5'>
              <div className='Calcilated'>
                <div className='div-list'>
                  <div className='list-one'>
@@ -996,11 +996,11 @@ export default class SearchDetails extends Component {
              </div>
            </Panel>
-            <Panel header='Bioassay' key='2' id='Bioassay'>
+            <Panel header='Bioassay' id='Bioassay' key='2'>
              <Table bordered rowKey='dataid' dataSource={DetailsData.Bioassay} pagination={false} columns={columns3} expandedRowRender={expandedRowRender} />
              <Pagination showSizeChanger onShowSizeChange={this.onShowSizeChange} onChange={this.onChange} total={total_num2} />
            </Panel>
-            <Panel header='Calculated Propeties' key='3' id='CalculatedPropeties'>
+            <Panel header='Calculated Propeties' id='CalculatedPropeties' key='3'>
              <div>
                <div className='Calcilated'>
                  <div className='list-one2'>
@@ -1041,7 +1041,7 @@ export default class SearchDetails extends Component {
                </div>
              </div>
            </Panel>
-            <Panel header='Structure' key='4' id='Structure'>
+            <Panel header='Structure' id='Structure' key='4'>
              <Tabs
                defaultActiveKey='0'
                // type="card"

--- a/src/routes/Kinase/SearchList/index.js
+++ b/src/routes/Kinase/SearchList/index.js
--- a/src/routes/Kinase/TargetDetails/index.js
+++ b/src/routes/Kinase/TargetDetails/index.js
@@ -1232,26 +1232,22 @@ export default class TargetDetails extends Component {
                    <div className='div-list'>
                      <div className='list-one'>
                        <div>Gene name</div>
-                        <div />
                        {targetsDetail.Gene_name.map((item) => {
                          return <Tag>{item}</Tag>;
                        })}
                      </div>
                      <div className='list-one'>
-                        <div>Species</div>
+                        <div>Species00</div>
-                        <div />
                        {targetsDetail.Species}
                      </div>
                      <div className='list-one'>
                        <div>Uniprot id</div>
-                        <div />
                        {targetsDetail.Uniport_id}
                      </div>
-                      {/* <div className="list-one">
+                      <div className='list-one'>
                        <div>Class</div>
-                        <div />
+                        {targetsDetail.Class || ''}
-                        {targetsDetail.Class}
+                      </div>
-                      </div> */}
                    </div>
                  </div>
                </div>

--- a/src/routes/Kinase/index.js
+++ b/src/routes/Kinase/index.js
@@ -3,10 +3,15 @@ import { Form, Input, Button, Select, Tabs, message, Radio, Checkbox, Row, Col }
 import LogoTitlte from '../../components/LogoTitlte/index';
 import { Jsme } from 'jsme-react';
 import qs from 'qs';
+import { inject, observer } from 'mobx-react';
 import request from '../../utils/request';
+import { getQueryString } from '../../utils/utils';
 import './style.css';
+import { withRouter } from 'react-router-dom';
 const { TabPane } = Tabs;
 const { Option } = Select;
+@inject('kinaseSearch')
+@observer
 class Home extends React.Component {
  state = {
    select_db: 'Ligands',
@@ -71,6 +76,7 @@ class Home extends React.Component {
    compoundList: ['DrugName', 'Smiles'],
    targetList: ['TargetName', 'UniprotId'],
    optionsList: [{ label: '查询drug相关靶点', value: 1 }, { label: '查询ligand相关靶点', value: 2, disabled: false }, { label: '是否有PDB结构', value: 3 }],
+    activeKey: this.props.kinaseSearch.activeTabKey || 'Drug',
  };
  // Mutation
  CheckChange = (e) => {
@@ -346,11 +352,18 @@ class Home extends React.Component {
    this.setState(() => ({ searchData: searchData }));
    // this.setState(()=>({data:e }))
  };
  componentDidMount() {
+    console.log('111', this.props.kinaseSearch.searchParams);
+    if (this.props.kinaseSearch.searchParams.drugs_data) {
+      this.state.searchData = this.props.kinaseSearch.searchParams;
+    }
+    // console.log('222',qs.parse(this.props.location.search.slice(1)),)
    // this.getList()
    // this.getSelectList()
    this.getTargetSelectList();
  }
  getSelectList = () => {
    request
      .get('/kinase/target_class/drug')
@@ -373,28 +386,26 @@ class Home extends React.Component {
      });
  };
-  //首页启动调用接口  先checkToken == localStorage.getItem('token')
  getTargetSelectList = () => {
-    localStorage.getItem('token') &&
+    request
-      request
+      .get('/kinase/target_class/target')
-        .get('/kinase/target_class/target')
+      .then((res) => {
-        .then((res) => {
+        console.log(res);
-          console.log(res);
+        if (res.data.code === 200) {
-          if (res.data.code === 200) {
+          console.log(res.data.data);
-            console.log(res.data.data);
-            this.setState({
+          this.setState({
-              TargetClassList: res.data.data,
+            TargetClassList: res.data.data,
-              TargetAllClassList: res.data.data,
+            TargetAllClassList: res.data.data,
-            });
+          });
-            console.log(this.state);
+          console.log(this.state);
-          } else {
+        } else {
-            message.error(res.data.msg);
+          message.error(res.data.msg);
-          }
+        }
-        })
+      })
-        .catch((err) => {
+      .catch((err) => {
-          console.error(err);
+        console.error(err);
-        });
+      });
  };
  getValue = (e) => {
    const { value } = e.target;
@@ -465,6 +476,7 @@ class Home extends React.Component {
  };
  getDrugsList = () => {
    let data = this.state.searchData;
+    this.props.kinaseSearch.addSearchParams(data);
    if (data.drugs_data == '') {
      return message.warning('请输入查询条件！');
    }
@@ -501,6 +513,8 @@ class Home extends React.Component {
    searchData.name = e;
    this.setState(() => ({ searchData: searchData }));
    console.log(this.state.searchData);
+    this.setState({ activeKey: e });
+    this.props.kinaseSearch.setActiveKey(e);
  };
  getJsme = () => {
    console.log(1);
@@ -524,11 +538,11 @@ class Home extends React.Component {
      <div className='home'>
        <div className='home-div'>
          {/* <LogoTitlte></LogoTitlte> */}
-          <Tabs onChange={this.callback} type='card'>
+          <Tabs onChange={this.callback} activeKey={this.state.activeKey} type='card'>
            <TabPane tab='Drug' key='Drug'>
              <div className='top-div'>
                <div>
-                  <Form layout='horizontal'>
+                  <Form onSubmit={this.getDrugsList} layout='horizontal'>
                    <Form.Item label='请输入药物名或Smiles' {...formItemLayout}>
                      <Input placeholder='请输入化合物' style={{ width: 250 }} size='large' onChange={this.getValue} value={this.state.searchData.drugs_data} />
                    </Form.Item>
@@ -556,7 +570,7 @@ class Home extends React.Component {
                      </Radio.Group>
                    </Form.Item>
                    <Form.Item label='' {...formTailLayout}>
-                      <Button type='primary' style={{ width: 150 }} size='large' loading={this.state.loading} onClick={this.getDrugsList}>
+                      <Button type='primary' style={{ width: 150 }} htmlType='submit' size='large' loading={this.state.loading}>
                        Search
                      </Button>
                    </Form.Item>
@@ -679,4 +693,4 @@ class Home extends React.Component {
  }
 }
-export default Home;
+export default withRouter(Home);
--- a/src/store/index.js
+++ b/src/store/index.js
-import appStore from './appStore'
+import appStore from './appStore';
 // import stepFormStore from '../routes/Entry/FormDemo/store'
+import kinaseSearch from './kinaseSearch';
 const store = {
  appStore,
  // stepFormStore
-}
+  kinaseSearch,
-export default store
+};
\ No newline at end of file
+export default store;
--- a/src/store/kinaseSearch.js
+++ b/src/store/kinaseSearch.js
+import { observable, action } from 'mobx';
+class KianseSearch {
+  @observable searchParams = {};
+  @observable activeKey = '';
+  @action addSearchParams(data) {
+    console.log('data', data);
+    this.searchParams = data;
+  }
+  @action setActiveKey = (key) => {
+    console.log('key----',key)
+    this.activeTabKey = key;
+  };
+}
+export default new KianseSearch();
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -17,36 +17,28 @@ function disableF12() {
 }
 // disableF12();
-//对axios二次封装
+// 封装同步Ajax请求
+function checkAjaxToken() {
+  const token = getQueryString('token') || localStorage.getItem('token');
+  let xhr = new XMLHttpRequest();
+  xhr.open('GET', 'http://69.235.144.91:8048/yszh-login/auth/checkToken', false);
+  xhr.setRequestHeader('accessToken', token);
+  xhr.send(null);
+  console.log(xhr); //准备状态
+  if (xhr.status == 200 && JSON.parse(xhr.responseText).code == 200) {
+    // 获取响应结果
+    // console.log(xhr.responseText);
+    token && localStorage.setItem('token', token);
+    return true;
+  } else {
+    console.log('状态码：' + xhr.status + ',原因:' + xhr.responseText);
+    return false;
+  }
+}
+checkAjaxToken();
 const token = getQueryString('token') || localStorage.getItem('token');
-function checkFetchToken() {
-  fetch('http://69.235.144.91:8048/yszh-login/auth/checkToken', {
-    method: 'GET',
-    headers: {
-      accessToken: token,
-    },
-  })
-    .then((res) => res.json())
-    .then((res) => {
-      console.log('fetch--res', res);
-      if (res.code === 200) {
-        //校验通过,存储token
-        token && localStorage.setItem('token', token);
-      } else {
-        alert('token校验失败,返回登录页');
-        // window.open('http://localhost:3000/#/login', '_self');
-        // window.open('http://69.235.144.91:3048/#/login', '_self');
-        window.open('http://ysplatform.atelligence-ai.com/#/login', '_self');
-      }
-    })
-    .catch(function(err) {
-      console.log('err', err);
-      // window.open('http://69.235.144.91:3048/#/login', '_self');
-      window.open('http://ysplatform.atelligence-ai.com/#/login', '_self');
-    });
-}
-checkFetchToken();
 const baseURL = 'http://52.83.169.190:8002/'; //线上正式环境
 // const baseURL = 'http://69.235.144.91:8002/';  测试环境
@@ -62,15 +54,11 @@ const request = axios.create({
 //拦截器
 request.interceptors.request.use((config) => {
-  // alert('拦截器..');
+  console.log('config',config);
-  console.log('token---', '拦截器方法校验token');
+  if (checkAjaxToken()) {
-  console.log(config);
-  if (localStorage.getItem('token')) {
-    config.headers['accessToken'] = localStorage.getItem('token');
    return config;
  } else {
    console.log('token为空....');
-    // window.open('http://69.235.144.91:3048/#/login', '_self');
    window.open('http://ysplatform.atelligence-ai.com/#/login', '_self');
  }
 });