feat:封装axios

package.json

@@ -11,6 +11,7 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
+    "@types/qs": "^6.9.5",
     "@types/react": "^16.9.46",
     "@types/react-dom": "^16.9.8",
     "@types/react-router-dom": "^5.1.5",
@@ -59,6 +60,7 @@
     "postcss-normalize": "8.0.1",
     "postcss-preset-env": "6.7.0",
     "postcss-safe-parser": "4.0.1",
+    "qs": "^6.9.4",
     "react": "^16.13.1",
     "react-app-polyfill": "^1.0.6",
     "react-async-component": "^2.0.0",

src/common/js/axios.ts

@@ -6,7 +6,7 @@
  * @Description: 
  * @Copyright: 杭州杰竞科技有限公司 版权所有
  */
-
+import qs from 'qs';
 import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosPromise } from 'axios';
 import { message } from 'antd';
 
@@ -34,14 +34,14 @@ class Axios {
   ): Promise<any> {
     const _url = `${url}?p=w&v=v${VERSION}&userType=${USER_TYPE}&token=${User.getToken()}&uid=${User.getUid()}&tid=${User.getTid()}&aid=${User.getAid()}`;
     return new Promise((resolve, reject) => {
-      const { NewVersion, currentUserInstInfo } = window;
-      const { instId } =  currentUserInstInfo;
+      const { NewVersion = "5.0", currentUserInstInfo } = window;
+      // const { instId } =  currentUserInstInfo;
 
       const instance: AxiosInstance = axios.create({
         timeout: TIME_OUT,
         responseType: 'json',
         headers: {
-          instId,
+          instId: '123',
           p: 'w',
           v: 'VERSION',
           vn: `v${VERSION}`,
@@ -105,6 +105,91 @@ class Axios {
       })
     })
   }
+
+
+}
+
+export default Axios;
+
+/**
+ * @method fetch
+ * @description 封装get方法
+ * @param params
+ * @param url
+ * @returns { Promise }
+ */
+export function fetch(url: string, params: any = {}, verify: boolean = true) {
+  return new Promise((resolve, reject) => {
+    axios.get(url, {
+      params: verify ? getVerifyParams(params) : params,
+    }).then((response) => {
+      resolve(response.data);
+    }).catch((err) => {
+      reject(err);
+    });
+  });
+}
+
+/**
+ * @method post
+ * @description 封装post方法
+ * @param data
+ * @param url
+ * @returns { Promise }
+ */
+
+export function post(url: string, data: any = {}, verify: boolean = true) {
+  const params = verify ? getVerifyParams() : {};
+  const stringifyData = qs.stringify(data);
+
+  return new Promise((resolve, reject) => {
+    axios.post(url, stringifyData, {
+      params,
+    }).then((response) => {
+      resolve(response.data);
+    }).catch((err) => {
+      reject(err);
+    });
+  });
+}
+
+/**
+ * @method getVerifyParams
+ * @description 如果需要验证则在请求参数上带上token和uid等参数
+ * @param data
+ * @returns { void }
+ */
+
+const getVerifyParams = (data: any = {}) => {
+  const params = {
+    // aid: Storage.getAid(),
+    // tid: Storage.getTid(),
+    // token: Storage.getToken(),
+    // uid: Storage.getUid(),
+  };
+
+  return Object.assign({}, data, params);
+};
+
+/**
+ * @method postJSON
+ * @description 封装postJSON方法
+ * @param data
+ * @param url
+ * @returns { Promise }
+ */
+
+export function postJSON(url: string, data: any = {}, verify: boolean = true) {
+  const params = verify ? getVerifyParams() : {};
+  return new Promise((resolve, reject) => {
+    Axios.post("post",url, data).then((response) => {
+      resolve(response.data);
+    }).catch((err) => {
+      reject(err);
+    });
+  });
 }
 
-export default Axios;
\ No newline at end of file
+export function Apollo(url: string, data: any = {}, verify: boolean = true) {
+  return postJSON(`apollo/${url}`, data, verify);
+}
\ No newline at end of file

src/modules/test/index.jsx

 import React from "react";
 import Breadcrumbs from "@/components/Breadcrumbs";
+import PageControl from "@/components/PageControl";
+ 
 class testPage extends React.Component {
   constructor(props) {
     super(props);
@@ -10,15 +12,27 @@ class testPage extends React.Component {
     return (
       <div className="prepare-lesson-page page">
         <div className="content-header">
-          <Breadcrumbs
+          {/* <Breadcrumbs
             navList="选班调班"
             goBack={() => {
               RCHistory.goBack();
             }}
-          />
+          /> */}
+          <div className="title">视频课</div>
         </div>
         <div className="box content-body">
-        <i class="iconfont icontanhao_caise"></i>
+        <i className="iconfont icontanhao_caise"></i>
+        <div className="content" style={{height:"300px"}}></div>
+        <div className="box-footer">
+          <PageControl
+              size="small"
+              current={1}
+              pageSize={10}
+              total={50}
+              toPage={(page) => {
+                
+              }} />
+        </div>
         </div>
       </div>
     );

src/routes/config/mainRoutes.tsx

@@ -6,12 +6,19 @@
  * @Description: 内容线路由配置
  */
 import TestPage from '@/modules/test';
+import EmployeesManagePage from '@/modules/store-manege/EmployeesManagePage';
+
 const mainRoutes = [
   {
     path: '/home',
 		component: TestPage,
 		name: '首页'
   },
+  {
+    path: '/employees-manage',
+		component: EmployeesManagePage,
+		name: '首页'
+  },
 ]
 
 export default mainRoutes;
\ No newline at end of file