接口

src/common/fetch.ts

@@ -47,15 +47,15 @@ export function api(url: string, options: Options) {
         res.json().then((r: any) => {
           let msg = r.error || r.msg || 'error';
           message.error(msg);
-          // if (r.error) {
-          //   if (r.error.match(/token/)) {
-          //     message.error('登录过期，请重新登录');
-          //     window.location.href = '/inclass-partners/login';
-          //   }
-          // }
-          // if (options.error && typeof options.error === 'function') {
-          //   options.error(r);
-          // }
+          if (r.error) {
+            if (r.error.match(/token/)) {
+              message.error('登录过期，请重新登录');
+              window.location.href = '/inclass-partners/login';
+            }
+          }
+          if (options.error && typeof options.error === 'function') {
+            options.error(r);
+          }
         });
       }
     })

src/pages/exchangeCode/index.tsx

@@ -13,26 +13,28 @@ const FormItem = Form.Item;
 const PAGE_SIZE = 10;
 
 const ExchangeCode: React.FC = () => {
-  const [courseName, set_courseName] = useState('');
+  const [dataSource, set_dataSource] = useState([]);
   const [totalCount, set_totalCount] = useState(0);
-  const [current, set_current] = useState(1);
+
+  const [class_name, set_className] = useState('');
+  const [page, set_page] = useState(1);
   const [limit, set_limit] = useState(PAGE_SIZE);
 
   useEffect(() => {
-    getList(courseName, current, limit);
+    getList(class_name, page, limit);
   }, []);
 
-  const getList = (courseName: string, current: number, limit: number) => {
+  const getList = (class_name: string, page: number, limit: number) => {
     api(`/51business/api/course/back/redeem`, {
       type: 'GET',
       data: {
-        courseName: courseName,
+        class_name: class_name,
         limit: limit,
-        page: current
+        page: page
       }
     }).then(r => {
-      console.log(r);
-      // set_totalCount(r.total_count);
+      set_dataSource(r.list);
+      set_totalCount(r.total_count);
     });
   };
 
@@ -49,33 +51,22 @@ const ExchangeCode: React.FC = () => {
   };
 
   const submitData = () => {
-    getList(courseName, 1, limit);
+    getList(class_name, page, limit);
   };
 
   const resetData = () => {
-    // set_current(1);
-    // set_pageSize(pageSize);
-    // set_courseName('');
-    getList('', 1, limit);
+    set_className('');
+    set_page(1);
+    set_limit(PAGE_SIZE);
+    getList(class_name, page, limit);
   };
 
   const handleTableChange = (args: any) => {
-    // set_current(args.current);
-    // set_pageSize(args.pageSize);
-    getList(courseName, args.current, args.pageSize);
+    set_page(args.current);
+    set_limit(args.pageSize);
+    getList(class_name, args.current, args.pageSize);
   };
 
-  let dataSource = [];
-  for (let i = 0; i < 25; i++) {
-    dataSource.push({
-      id: i,
-      courseName: '我都唔',
-      code: 'woeopwr',
-      status: 1,
-      date: '2020-05-20'
-    });
-  }
-
   return (
     <BasicPage>
       <div className="content">
@@ -83,10 +74,10 @@ const ExchangeCode: React.FC = () => {
           <Col md={6} sm={12}>
             <FormItem label="已购课程名称：">
               <Input
-                value={courseName}
+                value={class_name}
                 placeholder="请输入"
                 onChange={e => {
-                  set_courseName(e.target.value);
+                  set_className(e.target.value);
                 }}
               />
             </FormItem>
@@ -126,8 +117,8 @@ const ExchangeCode: React.FC = () => {
         dataSource={dataSource}
         handleTableChange={handleTableChange}
         pageSize={limit}
+        current={page}
         totalCount={totalCount}
-        current={current}
       />
     </BasicPage>
   );

src/pages/exchangeCode/list.tsx

@@ -4,10 +4,11 @@ const { Column } = Table;
 
 interface DeatilI {
   id: string | number;
-  courseName: string | number;
+  class_name: string | number;
   code: string | number;
-  status: string | number;
-  date: string;
+  channel: string | number;
+  is_used: string | number;
+  created_time: string | number;
 }
 
 interface ColsI {
@@ -32,8 +33,8 @@ const columns = [
   },
   {
     title: '课程名称',
-    dataIndex: 'courseName',
-    key: 'courseName'
+    dataIndex: 'class_name',
+    key: 'class_name'
   },
   {
     title: '兑换码',
@@ -41,14 +42,22 @@ const columns = [
     key: 'code'
   },
   {
+    title: '生成渠道',
+    dataIndex: 'channel',
+    key: 'channel'
+  },
+  {
     title: '兑换情况',
-    dataIndex: 'status',
-    key: 'status'
+    dataIndex: 'is_used',
+    key: 'is_used',
+    render: (row: any) => {
+      return <span>{row ? '已使用' : '未使用'}</span>;
+    }
   },
   {
     title: '兑换时间',
-    dataIndex: 'date',
-    key: 'date'
+    dataIndex: 'created_time',
+    key: 'created_time'
   }
 ];
 
@@ -68,9 +77,10 @@ const List: React.FC<DataSourceI> = props => {
         pagination={{
           pageSize: props.pageSize,
           current: props.current,
+          total: props.totalCount,
           showSizeChanger: true,
           showTotal: (total, range) =>
-            `${range[1] - range[0] + 1} of ${total} items`
+            `每页${range[1] - range[0] + 1}条，总计${total} 条`
         }}
       >
         {Cols(columns)}

src/pages/generateCode/index.tsx

-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import { Form, Input, Button, Select, message } from 'antd';
 import BasicPage from '../../layout/basicPage';
 import { api } from '../../common/fetch';
@@ -14,8 +14,24 @@ const tailLayout = {
 };
 
 const GenerateCode: React.FC = () => {
+  const [courseData, set_courseData] = useState([]);
+  const [classData, set_classData] = useState([]);
+  const [institution_name, set_institutionName] = useState('');
   const [form] = Form.useForm();
 
+  useEffect(() => {
+    getClassData(institution_name);
+  }, []);
+
+  const getClassData = (institution_name?: string | number) => {
+    api(`/51business/api/course/back/class`, {
+      data: { institution_name, page: 1, limit: 20 },
+      type: 'GET'
+    }).then((r: any) => {
+      set_courseData(r.list);
+    });
+  };
+
   const onFinish = (values: any) => {
     api(`/51business/api/course/back/redeem`, {
       type: 'POST',
@@ -32,27 +48,33 @@ const GenerateCode: React.FC = () => {
     form.resetFields();
   };
 
-  const It = [
-    {
-      name: '趣选课',
-      id: 1
-    },
-    {
-      name: '我连网',
-      id: 2
-    }
-  ];
-
+  const onChange = (val: any) => {
+    form.resetFields(['class_id']);
+    let d: any = courseData[val - 1];
+    set_classData((d && d.class) || []);
+  };
+  const onSearch = (val: string) => {
+    getClassData(val);
+  };
   return (
     <BasicPage>
       <Form {...layout} form={form} name="control-hooks" onFinish={onFinish}>
-        {/* <Form.Item
+        <Form.Item
           name="institution"
           label="机构名称："
           rules={[{ required: true, message: '请选择机构' }]}
         >
-          <Select placeholder="请选择机构" allowClear>
-            {It.map(item => {
+          <Select
+            placeholder="请选择机构"
+            allowClear
+            showSearch
+            onChange={onChange}
+            onSearch={onSearch}
+            filterOption={(input, option: any) =>
+              option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            }
+          >
+            {courseData.map((item: any) => {
               return (
                 <Option value={item.id} key={item.id}>
                   {item.name}
@@ -60,14 +82,14 @@ const GenerateCode: React.FC = () => {
               );
             })}
           </Select>
-        </Form.Item> */}
+        </Form.Item>
         <Form.Item
           name="class_id"
           label="课程名称："
           rules={[{ required: true, message: '请选择课程' }]}
         >
           <Select placeholder="请选择课程名称" allowClear>
-            {It.map(item => {
+            {classData.map((item: any) => {
               return (
                 <Option value={item.id} key={item.id}>
                   {item.name}

src/pages/login/index.tsx

-import React, { useState, useMemo } from 'react';
+import React, { useState, useMemo, useRef } from 'react';
 import { Input, message, Button, Modal } from 'antd';
 import { UserOutlined, UnlockOutlined } from '@ant-design/icons';
 import { withRouter, RouteComponentProps } from 'react-router-dom';
@@ -16,6 +16,9 @@ const Login: React.FC<RouteComponentProps> = () => {
   const [password, set_password] = useState('');
   const [isEnable, set_Enable] = useState(false);
   const [showModal, set_showModal] = useState(false);
+
+  const loginBtnRef = useRef(null);
+
   const onChangeInp = (e: any, name: string) => {
     let obj: any = {
       passport: (e: string) => {
@@ -83,7 +86,7 @@ const Login: React.FC<RouteComponentProps> = () => {
       ? ['btn', 'loginItem', 'btn_act']
       : ['btn', 'loginItem'];
     return (
-      <button className={styleBtn.join(' ')} onClick={submit}>
+      <button className={styleBtn.join(' ')} onClick={submit} ref={loginBtnRef}>
         {props.title}
       </button>
     );
@@ -110,7 +113,7 @@ const Login: React.FC<RouteComponentProps> = () => {
                 fontWeight: 'bold'
               }}
             >
-              趣选课供销后台
+              趣选课合作后台
             </h3>
           </div>
           <div className="loginItem">
@@ -128,6 +131,10 @@ const Login: React.FC<RouteComponentProps> = () => {
               placeholder="请输入你的密码"
               value={password}
               autoComplete="new-password"
+              onPressEnter={() => {
+                let cur = loginBtnRef.current;
+                console.log(cur);
+              }}
               onChange={(e: any) => onChangeInp(e, 'password')}
               prefix={<UnlockOutlined />}
             />

src/pages/orderList/index.tsx

@@ -15,13 +15,13 @@ const FormItem = Form.Item;
 const { RangePicker } = DatePicker;
 moment.locale('zh-cn');
 
-const PAGE_SIZE = 2;
+const PAGE_SIZE = 10;
 
 interface FilterData {
   class_name?: string;
   user_name?: string;
-  start_date?: string;
-  end_date?: string;
+  start_time?: string;
+  end_time?: string;
   current?: number;
   limit?: number;
 }
@@ -29,8 +29,8 @@ interface FilterData {
 const OrderList: React.FC = () => {
   const [class_name, set_className] = useState('');
   const [user_name, set_userName] = useState('');
-  const [start_date, set_startDate] = useState('');
-  const [end_date, set_endDate] = useState('');
+  const [start_time, set_startTime] = useState('');
+  const [end_time, set_endTime] = useState('');
 
   const [dataSource, set_dataSource] = useState([]);
   const [totalCount, set_totalCount] = useState(0);
@@ -55,8 +55,8 @@ const OrderList: React.FC = () => {
     getList({
       class_name,
       user_name,
-      start_date,
-      end_date,
+      start_time,
+      end_time,
       current,
       limit
     });
@@ -65,23 +65,22 @@ const OrderList: React.FC = () => {
   const getList = ({
     class_name = '',
     user_name = '',
-    start_date = '',
-    end_date = '',
+    start_time = '',
+    end_time = '',
     current = 1,
     limit = PAGE_SIZE
   }: FilterData) => {
     api(`/51business/api/course/back/order`, {
       type: 'GET',
       data: {
-        // class_name,
-        // user_name,
-        // start_date,
-        // end_date,
+        class_name,
+        user_name,
+        start_time: start_time ? start_time + ' 00:00:00' : '',
+        end_time: end_time ? end_time + ' 23:59:59' : '',
         page: current,
         limit: limit
       }
     }).then(r => {
-      console.log(r);
       set_dataSource(r.list);
       set_totalCount(r.total_count);
     });
@@ -93,13 +92,13 @@ const OrderList: React.FC = () => {
       data: {
         class_name,
         user_name,
-        start_date,
-        end_date,
+        start_time,
+        end_time,
         product: 'JSON.stringify(info.product)'
       },
       responseType: 'arrayBuffer'
     }).then(r => {
-      excelFn(r, `分析明细${start_date}_${end_date}`);
+      excelFn(r, `分析明细${start_time}_${end_time}`);
     });
   };
 
@@ -108,10 +107,10 @@ const OrderList: React.FC = () => {
       class_name: () => set_className(val),
       user_name: () => set_userName(val),
       dates: () => {
-        let start_date = (val && moment(val[0]).format('YYYY-MM-DD')) || '';
-        let end_date = (val && moment(val[1]).format('YYYY-MM-DD')) || '';
-        set_startDate(start_date);
-        set_endDate(end_date);
+        let start_time = (val && moment(val[0]).format('YYYY-MM-DD')) || '';
+        let end_time = (val && moment(val[1]).format('YYYY-MM-DD')) || '';
+        set_startTime(start_time);
+        set_endTime(end_time);
       }
     };
     obj[type] && obj[type]();
@@ -132,8 +131,8 @@ const OrderList: React.FC = () => {
     getList({
       class_name,
       user_name,
-      start_date,
-      end_date,
+      start_time,
+      end_time,
       current: args.current,
       limit: args.pageSize
     });
@@ -145,8 +144,8 @@ const OrderList: React.FC = () => {
     getList({
       class_name,
       user_name,
-      start_date,
-      end_date,
+      start_time,
+      end_time,
       current: 1,
       limit: PAGE_SIZE
     });
@@ -172,7 +171,7 @@ const OrderList: React.FC = () => {
                 <Input
                   placeholder="请输入"
                   onChange={e => {
-                    changeValue('userName', e.target.value);
+                    changeValue('user_name', e.target.value);
                   }}
                 />
               </FormItem>

src/pages/orderList/list.tsx

@@ -98,7 +98,7 @@ const List: React.FC<DataSourceI> = props => {
           total: props.totalCount,
           showSizeChanger: true,
           showTotal: (total, range) =>
-            `${range[1] - range[0] + 1} of ${total} items`
+            `每页${range[1] - range[0] + 1}条，总计${total} 条`
         }}
       >
         {Cols(columns)}