From 0bd9e1222d867893b66044b04754d9cc967d472e Mon Sep 17 00:00:00 2001
From: liuwh <hugeinfo123>
Date: Mon, 06 Apr 2020 16:49:45 +0800
Subject: [PATCH] 新建文档

---
 src/components/common/HotListTableView/index.jsx |  135 +++++++++++++++++++++++++++++++++++++++-----
 1 files changed, 119 insertions(+), 16 deletions(-)

diff --git a/src/components/common/HotListTableView/index.jsx b/src/components/common/HotListTableView/index.jsx
index 0e30d9d..8469970 100644
--- a/src/components/common/HotListTableView/index.jsx
+++ b/src/components/common/HotListTableView/index.jsx
@@ -8,8 +8,10 @@
 import React, { ReactNode, ReactEventHandler, Component } from 'react';
 import BreadcrumbView from '../BreadcrumbView';
 import TableView from '../TableView';
+import fetch from '../../../api/request';
+import moment from 'moment';
 
-import { Tabs } from 'antd';
+import { Tabs, Skeleton } from 'antd';
 
 const { TabPane } = Tabs;
 
@@ -21,30 +23,131 @@
     this.config = {
     };
     this.state = {
+      keywordlist: ['全部'],
+      formData: {
+        __key: Date.now(),
+        keyword: '',
+        page: 1,
+        size: 10,
+      },
+      loading: false
     };
   }
 
   componentWillMount() { }
 
-  componentDidMount() { }
+  componentDidMount() {
+    let { keywordlist } = this.state;
+    // 设置骨架屏
+    this.setState({
+      loading: true
+    })
+    fetch({
+      url: `api/news/keywordlist`
+    }).then(res => {
+      console.log('res', res);
+      this.setState({
+        loading: false
+      })
+      if (res) {
+        this.setState({
+          keywordlist: keywordlist.concat(res)
+        })
+      }
+    })
+  }
+
+  setFormData = data => {
+    console.log('form', data);
+    this.setState({
+      formData: data,
+    });
+  }
+
+  renderColumns = () => {
+    return [
+      {
+        title: '标题',
+        dataIndex: 'title',
+        key: 'title',
+        render: (cur, item) => {
+          return <a dangerouslySetInnerHTML={{ __html: cur }} onClick={() => {
+            window.open(item.url)
+          }}>
+          </a>
+        }
+      },
+      {
+        title: '发布时间',
+        key: 'create_time',
+        dataIndex: 'create_time',
+
+        render: (cur) => {
+          return (
+            <React.Fragment>
+              {cur && moment(cur).format("YYYY-MM-DD HH:mm")}
+            </React.Fragment>
+          );
+        },
+      },
+      {
+        title: '来源',
+        dataIndex: 'keyword',
+        key: 'keyword',
+      },
+    ];
+  }
+
+  tabChange = (tab) => {
+    console.log('tab', tab);
+    let { formData } = this.state
+    if (tab == '全部') {
+      tab = '';
+    }
+    this.setState({
+      formData: {
+        __key: Date.now(),
+        keyword: tab,
+        page: 1,
+        size: 10,
+      }
+    })
+  }
 
   render() {
+    let { keywordlist, formData, loading } = this.state;
+    let tableParams = {
+      url: `api/news/newslist`,
+      formData,
+      key: formData.__key,
+      columns: this.renderColumns(),
+      extraFromData: {
+      },
+      setFormData: this.setFormData
+    }
     return (
       <div className="hot-list-table-view-main">
-        <BreadcrumbView data={[{ name: '行业热点知识库' }]} />
-        <div className="hot-list-table-view-main-content">
-          <Tabs defaultActiveKey="1" >
-            <TabPane tab="Tab 1" key="1">
-              Content of Tab Pane 1
-            </TabPane>
-            <TabPane tab="Tab 2" key="2">
-              Content of Tab Pane 2
-            </TabPane>
-            <TabPane tab="Tab 3" key="3">
-              Content of Tab Pane 3
-            </TabPane>
-          </Tabs>
-        </div>
+        {
+          loading ? <div style={{ padding: 10 }}>
+            <Skeleton />
+          </div>
+            :
+            <React.Fragment>
+              <BreadcrumbView data={[{ name: '行业热点知识库' }]} />
+              <div className="hot-list-table-view-main-content">
+                <Tabs defaultActiveKey={'全部'} onChange={this.tabChange}>
+                  {
+                    keywordlist.length &&
+                    keywordlist.map((key) => (
+                      <TabPane tab={key} key={key}>
+                      </TabPane>
+                    ))
+                  }
+                </Tabs>
+                <TableView {...tableParams} />
+              </div>
+            </React.Fragment>
+        }
       </div>
     )
   }

--
Gitblit v1.8.0