6.28 党建攻坚第二版

src/pages/PartyMemberTopic/ActivityStyle/index.tsx

@@ -1,49 +1,30 @@
 import React, { useEffect, useState } from 'react';
 import '../Style/ld_style.less';
-import { Input, List, Pagination } from 'antd';
-import topic_activity_default2 from '@/assets/topic/topic_activity_default2.jpg'
+import { Input, List, Spin } from 'antd';
+import topic_activity_default from '@/assets/topic/topic_activity_default.jpg'
 import time_icon from '@/assets/topic/timeIcon.png'
 import { getGracefulList } from './service';
-import { formatTime, getImageUrl } from '../utils';
+import { getImageUrl } from '../utils';
 import { history } from 'umi';
 
 const { Search } = Input;
 
-const data = [
-  {
-    title: '集团党支部',
-    name: '张三',
-    position: '党委书记',
-  },
-  {
-    title: '集团党支部',
-    name: '李四',
-    position: '党委副书记',
-  },
-  {
-    title: '集团党支部',
-    name: '李四',
-    position: '党委副书记',
-  },
-  {
-    title: '集团党支部',
-    name: '李四',
-    position: '党委副书记',
-  }
-];
-
-
-
 const PersonInfor: React.FC<{}> = () => {
   //graceful data
   const [gracefulList, setGracefulList] = useState<any[]>([]);
+  //loading
+  const [loading, setLoading] = useState<boolean>(false);
+
   //get graceful
-  const getGracefulData = () => {
-    getGracefulList().then(async res => {
+  const getGracefulData = (value: string) => {
+    setLoading(true);
+    getGracefulList({ param: value }).then(async res => {
       if (res?.code == 200) {
-        const data = await getImageUrl(res?.data, 'image', topic_activity_default2);
+        const data = await getImageUrl(res?.data, 'image', topic_activity_default);
         setGracefulList(data);
       }
+    }).finally(() => {
+      setLoading(false);
     })
   }
   //onclick
@@ -61,7 +42,7 @@ const PersonInfor: React.FC<{}> = () => {
   }
 
   useEffect(() => {
-    getGracefulData();
+    getGracefulData('');
   }, [])
   return (
     <div className="page-container">
@@ -71,38 +52,41 @@ const PersonInfor: React.FC<{}> = () => {
           <span onClick={() => toGoBack()}>上一页</span>
         </div>
       </div>
-      <div className="search">
-        <span className="text"><span>活动风采</span></span>
-        <div className="search-box">
-          <Search
-            placeholder="输入标题"
-            allowClear
-            enterButton="搜索"
-            style={{ width: 322 }}
+      <Spin spinning={loading}>
+        <div className="search">
+          <span className="text"><span>活动风采</span></span>
+          <div className="search-box">
+            <Search
+              placeholder="输入标题"
+              allowClear
+              enterButton="搜索"
+              style={{ width: 322 }}
+              onSearch={getGracefulData}
+            />
+          </div>
+        </div>
+        <div className="list-content">
+          <List
+            itemLayout="horizontal"
+            pagination={{
+              size: 'small',
+              showTotal: (total) => `共 ${total} 条`,
+              pageSize: 10,
+            }}
+            dataSource={gracefulList}
+            renderItem={item => (
+              <List.Item>
+                <div className="list-pic">
+                  <img src={item.imageUrl} />
+                  <p className="tit"><span onClick={() => clickTitle(item)}>{item.title}</span></p>
+                  <p className="detail">{item.secordTitle}</p>
+                  <span className="time"><img src={time_icon} />{item.createTime}</span>
+                </div>
+              </List.Item>
+            )}
           />
         </div>
-      </div>
-      <div className="list-content">
-        <List
-          itemLayout="horizontal"
-          pagination={{
-            size: 'small',
-            showTotal: (total) => `共 ${total} 条`,
-            pageSize: 10,
-          }}
-          dataSource={gracefulList}
-          renderItem={item => (
-            <List.Item>
-              <div className="list-pic">
-                <img src={item.imageUrl} />
-                <p className="tit" onClick={() => clickTitle(item)}>{item.title}</p>
-                <p className="detail">{item.content}</p>
-                <span className="time"><img src={time_icon} />{item.createTime}</span>
-              </div>
-            </List.Item>
-          )}
-        />
-      </div>
+      </Spin>
     </div>
   )
 }

src/pages/PartyMemberTopic/ActivityStyle/service.ts

@@ -1,6 +1,9 @@
 import request from '@/utils/request';
 
 //活动风采列表
-export async function getGracefulList() {
-    return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/eventStyle/list');
+export async function getGracefulList(data: any) {
+    return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/eventStyle/list', {
+        method: 'POST',
+        data: { ...data }
+    });
 }