4.28 高质量运营

2023-04-28 14:30:32 +08:00
parent eae7846d98
commit a7e390941a
55 changed files with 4281 additions and 0 deletions
--- a/src/pages/HighQualityOperation/ClassroomList.tsx
+++ b/src/pages/HighQualityOperation/ClassroomList.tsx
@ -0,0 +1,102 @@
+import React, { useEffect, useState } from 'react';
+import './style.less';
+import { Input, List, Spin } from 'antd';
+import { formatTime } from './utils';
+import { history } from 'umi';
+import { getClassroomList } from './Home/service';
+
+const { Search } = Input;
+
+const ClassroomList: React.FC<{}> = () => {
+  //project data
+  const [classroomList, setClassroomList] = useState<any[]>([]);
+  //loading
+  const [loading, setLoading] = useState<boolean>(false);
+  //page
+  const [page, setPage] = useState<number>(1);
+
+  //get project
+  const getClassroomData = (value: string) => {
+    setLoading(true);
+    getClassroomList({ param: value }).then(res => {
+      if (res?.code == 200) {
+        setClassroomList(res?.data);
+        setPage(1);
+      }
+    }).finally(() => {
+      setLoading(false);
+    })
+  }
+
+  //onclick
+  const clickTitle = (data: any) => {
+    history.push({ pathname: "/highQualityOperation/detail", state: { detail: data } });
+  }
+  //to home
+  const toHome = () => {
+    history.push("/highQualityOperation/home");
+  }
+  //to previous page
+  const toPreviousPage = () => {
+    setPage((page) => page - 1);
+  }
+  //to next page
+  const toNextPage = () => {
+    setPage((page) => page + 1);
+  }
+
+  useEffect(() => {
+    getClassroomData('');
+  }, [])
+
+  return (
+    <div className="h-page-container">
+      <div className="top-banner">
+        <div className="back-home">
+          <span onClick={() => toHome()}>返回首页</span>
+          {page > 1 && <span onClick={() => toPreviousPage()}>上一页</span>}
+          {classroomList.length != 0 && page < Math.ceil(classroomList.length / 10) && <span onClick={() => toNextPage()}>下一页</span>}
+        </div>
+      </div>
+      <Spin spinning={loading}>
+        <div className="search">
+          <span className="text"><span>运营提升小课堂</span></span>
+          <div className="search-box">
+            <Search
+              placeholder="输入标题"
+              allowClear
+              enterButton="搜索"
+              style={{ width: 322 }}
+              onSearch={getClassroomData}
+            />
+          </div>
+        </div>
+        <div className="list-content">
+          <List
+            itemLayout="horizontal"
+            pagination={{
+              size: 'small',
+              onChange: page => {
+                setPage(page);
+              },
+              current: page,
+              showTotal: (total) => `共 ${total} 条`,
+              pageSize: 10,
+            }}
+            dataSource={classroomList}
+            renderItem={item => (
+              <List.Item>
+                <div className="list-box">
+                  <p onClick={() => clickTitle(item)}>{item.title}</p>
+                  <span>{formatTime(item.createTime, 'YYYY-MM-DD')}</span>
+                </div>
+              </List.Item>
+            )}
+          />
+        </div>
+      </Spin>
+    </div>
+  )
+}
+
+export default ClassroomList;