From ad9c64ce2edbc0c2f7b5f8550111430e5d5a9caf Mon Sep 17 00:00:00 2001
From: xuyucheng <Nd17cCxTS4SSDDh21SaA>
Date: Mon, 25 Apr 2022 17:05:17 +0800
Subject: [PATCH] mode

---
 src/components/table.js                       |   4 +-
 src/pages/home/branch/dashboard/dashboard.js  |   2 +-
 .../companyDetails/businessInformation.js     |  51 +++++++-
 .../company/companyDetails/creditAnalysis.js  |   1 +
 .../company/companyDetails/esgAnalysis.js     |  24 ++--
 .../companyDetails/financialAnalysis.js       |  25 +++-
 .../company/companyDetails/financialData.js   |  60 ++++++---
 .../manage/company/companyDetails/index.css   |   4 +
 .../manage/company/companyDetails/index.js    |  44 ++++---
 .../company/companyDetails/operationalRisk.js | 120 +++++++++++++++++-
 src/utils/utils.js                            |   6 +-
 11 files changed, 275 insertions(+), 66 deletions(-)

diff --git a/src/components/table.js b/src/components/table.js
index a683e6b..77370aa 100644
--- a/src/components/table.js
+++ b/src/components/table.js
@@ -20,7 +20,7 @@ class FeTable extends Component {
         total: props.total,
         defaultPageSize: props.defaultPageSize ||10,
         current: props.current || 1,
-        maxHeight: props.maxHeight || 'auto'
+        minHeight: props.minHeight || 'auto'
       }
     }
     return null
@@ -46,7 +46,7 @@ class FeTable extends Component {
   render() {
     return (
       <React.Fragment>
-        <Table bordered style={{ marginBottom: 20 }} dataSource={this.state.data} columns={this.state.columns} scroll={{y:this.state.maxHeight}} onRow={record => {return {
+        <Table bordered style={{ marginBottom: 20 }} dataSource={this.state.data} columns={this.state.columns} scroll={{y:this.state.minHeight}} onRow={record => {return {
             onClick: event => this.jumpRow(event, record)
           }
         }} pagination={{defaultPageSize:this.state.defaultPageSize,current:this.state.current,total: this.state.total,onChange:this.onChange.bind(this),showSizeChanger:true,
diff --git a/src/pages/home/branch/dashboard/dashboard.js b/src/pages/home/branch/dashboard/dashboard.js
index d03644e..7543c62 100644
--- a/src/pages/home/branch/dashboard/dashboard.js
+++ b/src/pages/home/branch/dashboard/dashboard.js
@@ -290,7 +290,7 @@ class Dashboard extends Component {
           </Col>
           <Col span={16}>
             <Card title="新增企业信息" style={{ height: 575 }}>
-              <FeTable maxHeight={350} defaultPageSize={5} data={this.state.company} columns={this.state.columns} current={this.state.form.page_no} callback={this.callback.bind(this)} total={this.state.total} pageChange={this.pageChange.bind(this)} onShowSizeChange={this.onShowSizeChange.bind(this)}></FeTable>
+              <FeTable minHeight={350} defaultPageSize={5} data={this.state.company} columns={this.state.columns} current={this.state.form.page_no} callback={this.callback.bind(this)} total={this.state.total} pageChange={this.pageChange.bind(this)} onShowSizeChange={this.onShowSizeChange.bind(this)}></FeTable>
             </Card>
           </Col>
         </Row>
diff --git a/src/pages/home/branch/manage/company/companyDetails/businessInformation.js b/src/pages/home/branch/manage/company/companyDetails/businessInformation.js
index 298f317..15f8e34 100644
--- a/src/pages/home/branch/manage/company/companyDetails/businessInformation.js
+++ b/src/pages/home/branch/manage/company/companyDetails/businessInformation.js
@@ -6,7 +6,15 @@ import "./index.css"
 import { getColumn } from "@/utils/utils"
 
 function BusinessInformation(props) {
-  const [value, setValue] = useState({})
+  const [value, setValue] = useState({ })
+  const [stockholderPage,setStockholderPage] = useState({
+    current: 1,
+    pageSize: 10
+  })
+  const [memberPage,setMemberPage] = useState({
+    current: 1,
+    pageSize: 10
+  })
 
   useEffect(() => {
     if (!Array.isArray(props.updateTime)) {
@@ -16,20 +24,53 @@ function BusinessInformation(props) {
         })
       }
     }
-  }, [props.cid,props.updateTime,props.table])
+  }, [props.cid, props.updateTime, props.table])
+
+  function pageChange(current, pageSize) {
+    setMemberPage({
+      current,
+      pageSize
+    })
+  }
+
+  function onShowSizeChange(current, pageSize) {
+    setMemberPage({
+      current,
+      pageSize
+    })
+  }
+
+  function stockPageChange(current, pageSize) {
+    setStockholderPage({
+      current,
+      pageSize
+    })
+  }
+
+  function onStockShowSizeChange(current, pageSize) {
+    setStockholderPage({
+      current,
+      pageSize
+    })
+  }
+
+  function getPageData(data, page, size) {
+    return data.slice((page - 1) * size, page * size)
+  }
 
   return (
     <>
       <h1 className='title_h'>工商信息</h1>
       <Descriptions>
         {value['工商信息'] && Object.keys(value['工商信息']).map((key, index) => {
-          return <Descriptions.Item label={key}>{value['工商信息'][key]}</Descriptions.Item>
+          return key !== "经营范围" ? <Descriptions.Item label={key}>{value['工商信息'][key]}</Descriptions.Item> : null
         })}
+        {value['工商信息'] && <Descriptions.Item label="经营范围">{value['工商信息']['经营范围']}</Descriptions.Item>}
       </Descriptions>
       <h1 className='title_h'>股东信息</h1>
-      <FeTable data={value['股东信息']} columns={getColumn(value['股东信息'])} />
+      {value['股东信息'] && <FeTable data={getPageData(value['股东信息'], stockholderPage.current, stockholderPage.pageSize)} columns={getColumn(value['股东信息'])} current={stockholderPage.current} pageChange={stockPageChange} onShowSizeChange={onStockShowSizeChange} total={value['股东信息'].length}/>}
       <h1 className='title_h'>主要成员</h1>
-      <FeTable data={value['主要成员']} columns={getColumn(value['主要成员'])} />
+      {value['主要成员'] && <FeTable data={getPageData(value['主要成员'], memberPage.current, memberPage.pageSize)} columns={getColumn(value['主要成员'])} current={memberPage.current} pageChange={pageChange} onShowSizeChange={onShowSizeChange} total={value['主要成员'].length} />}
     </>
   )
 }
diff --git a/src/pages/home/branch/manage/company/companyDetails/creditAnalysis.js b/src/pages/home/branch/manage/company/companyDetails/creditAnalysis.js
index 83d434e..851ade0 100644
--- a/src/pages/home/branch/manage/company/companyDetails/creditAnalysis.js
+++ b/src/pages/home/branch/manage/company/companyDetails/creditAnalysis.js
@@ -97,6 +97,7 @@ function CreditAnalysis(props) {
           })
         }
       </Row>
+      <p style={{ fontWeight: 800 }}>历史级别</p>
       <FeTable data={value['历史级别']} columns={getColumn(value['历史级别'])} />
     </>
   )
diff --git a/src/pages/home/branch/manage/company/companyDetails/esgAnalysis.js b/src/pages/home/branch/manage/company/companyDetails/esgAnalysis.js
index 2abf658..52aff74 100644
--- a/src/pages/home/branch/manage/company/companyDetails/esgAnalysis.js
+++ b/src/pages/home/branch/manage/company/companyDetails/esgAnalysis.js
@@ -1,9 +1,9 @@
 import React, { useState, useEffect } from 'react'
-import { Row, Col, Descriptions,Empty } from 'antd'
-import api from "@/api/request"
+import { Empty } from 'antd'
+// import api from "@/api/request"
 import "./index.css"
-import { getColumn } from "@/utils/utils"
-import FeTable from "@/components/table"
+// import { getColumn } from "@/utils/utils"
+// import FeTable from "@/components/table"
 import * as echarts from 'echarts/lib/echarts'
 import "echarts/lib/chart/pie";
 import "echarts/lib/component/tooltip"
@@ -53,17 +53,17 @@ const issueScore = [
 ]
 
 function EsgAnalysis(props) {
-  const [value, setValue] = useState({})
+  // const [value, setValue] = useState({})
 
   useEffect(() => {
-    if (props.table === 'ESG评价分析') {
-      api.post("/admin/company/esg_rating", { cid: props.cid, update_time: props.updateTime }).then(res => {
-        setValue(res)
-        for (let i = 0; i < 3; i++) {
+    // if (props.table === 'ESG评价分析') {
+    //   api.post("/admin/company/esg_rating", { cid: props.cid, update_time: props.updateTime }).then(res => {
+    //     setValue(res)
+    //     for (let i = 0; i < 3; i++) {
           // initRing("ring" + i, res['实质性议题得分情况'][issueScore[i].name], i)
-        }
-      })
-    }
+        // }
+    //   })
+    // }
   }, [props.cid,props.updateTime,props.table])
 
   function initRing(id, param, i) {
diff --git a/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js b/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js
index 64897f8..71b2352 100644
--- a/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js
+++ b/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js
@@ -12,13 +12,19 @@ import { getColumn } from "@/utils/utils"
 
 function FinancialAnalysis(props) {
   const [value, setValue] = useState({})
+  const [page,setPage] = useState(1)
+  const [size,setSize] = useState(10)
 
   useEffect(() => {
     if (props.table === '财务分析') {
       api.post("/admin/company/financial_analysis", { cid: props.cid, update_time: props.updateTime }).then(res => {
         setValue(res)
         if (Object.keys(res).length !== 0) {
-          // initDoubleBar("bar-1", res["财务得分去年比较"])
+          var data = {}
+          res["财务得分年度比较"].forEach(item=>{
+            data[Object.keys(item)[0]] = item[Object.keys(item)[0]]
+          })
+          initDoubleBar("bar-1", data)
           initDoubleBar("bar-2", res["财务得分同行比较"])
           initBar("bar-3", res["财务得分较去年变化"])
           initBar("bar-4", res["财务得分较同行差异"])
@@ -94,7 +100,6 @@ function FinancialAnalysis(props) {
     }
   }
 
-
   function initBar(id, param) {
     const myChart = echarts.init(document.getElementById(id))
     myChart.setOption({
@@ -151,6 +156,20 @@ function FinancialAnalysis(props) {
     }
   }
 
+  function pageChange(current, pageSize){
+    setPage(current)
+    setSize(pageSize)
+  }
+
+  function onShowSizeChange(current, pageSize){
+    setPage(current)
+    setSize(pageSize)
+  }
+
+  function getPageData(data,page,size){
+    return data.slice((page-1)*size,page*size)
+  }
+
   return (
     <>
       <Descriptions>
@@ -177,7 +196,7 @@ function FinancialAnalysis(props) {
           <div id='bar-4' style={{ height: 250 }}></div>
         </Col>
       </Row>
-      <FeTable data={value['指标详情']} columns={getColumn(value['指标详情'])} />
+      {value['指标详情']&&<FeTable data={getPageData(value['指标详情'],page,size)} columns={getColumn(value['指标详情'])} current={page} pageChange={pageChange} onShowSizeChange={onShowSizeChange} total={value['指标详情'].length}/>}
     </>
   )
 }
diff --git a/src/pages/home/branch/manage/company/companyDetails/financialData.js b/src/pages/home/branch/manage/company/companyDetails/financialData.js
index 906c64d..ea84cd6 100644
--- a/src/pages/home/branch/manage/company/companyDetails/financialData.js
+++ b/src/pages/home/branch/manage/company/companyDetails/financialData.js
@@ -1,9 +1,8 @@
 import React, { useState, useEffect } from 'react'
-import { } from 'antd'
 import api from "@/api/request"
 import "./index.css"
-import { getColumn } from "@/utils/utils"
 import FeTable from "@/components/table"
+import { Empty } from 'antd'
 
 function FinancialData(props) {
   const [profits, setProfits] = useState([])
@@ -12,18 +11,33 @@ function FinancialData(props) {
   const [supplement, setSupplement] = useState([])
 
   useEffect(() => {
-    if (props.table === '财务数据' && props.updateTime !== "") {
-      api.post("/admin/company/financial_data", { cid: props.cid, report_date: props.updateTime }).then(res => {
-        if (res) {
-          setProfits([...profits, res['资产负债表']])
-          setAssets([...assets, res['利润表']])
-          setFinancial([...financial, res['财务指标']])
-          setSupplement([...supplement, res['补充数据表']])
-        }
-      })
+    if (props.table === '财务数据') {
+      const pro = []
+      const ass = []
+      const fin = []
+      const sup = []
+      for (let i in props.updateTime) {
+        getFinancial(function (data) {
+          pro.push(data['资产负债表'])
+          ass.push(data['利润表'])
+          fin.push(data['财务指标'])
+          sup.push(data['补充数据表'])
+          setTimeout(() => {
+            setProfits(pro)
+            setAssets(ass)
+            setFinancial(fin)
+            setSupplement(sup)
+          }, 100)
+        }, { cid: props.cid, report_date: props.updateTime[i] })
+      }
     }
   }, [props.cid, props.updateTime, props.table])
 
+  function getFinancial(callback, params) {
+    api.post("/admin/company/financial_data", params).then(res => {
+      callback(res)
+    })
+  }
 
   function analysisArray(params) {
     var columns = []
@@ -72,13 +86,29 @@ function FinancialData(props) {
   return (
     <>
       <p>资产负债表</p>
-      {profits.length !== 0 && analysisArray(profits)}
+      {profits.length !== 0 ? analysisArray(profits) : <Empty description={
+        <span>
+          请选择时间
+        </span>
+      } style={{height:300}}/>}
       <p>利润表</p>
-      {assets.length!==0&&analysisArray(assets)}
+      {assets.length !== 0 ? analysisArray(assets): <Empty description={
+        <span>
+          请选择时间
+        </span>
+      } style={{height:300}}/>}
       <p>财务指标</p>
-      {financial.length!==0&&analysisArray(financial)}
+      {financial.length !== 0 ? analysisArray(financial): <Empty description={
+        <span>
+          请选择时间
+        </span>
+      } style={{height:300}}/>}
       <p>补充数据表</p>
-      {supplement.length!==0&&analysisArray(supplement)}
+      {supplement.length !== 0 ? analysisArray(supplement): <Empty description={
+        <span>
+          请选择时间
+        </span>
+      } style={{height:300}}/>}
     </>
   )
 }
diff --git a/src/pages/home/branch/manage/company/companyDetails/index.css b/src/pages/home/branch/manage/company/companyDetails/index.css
index d31f2d0..8cca235 100644
--- a/src/pages/home/branch/manage/company/companyDetails/index.css
+++ b/src/pages/home/branch/manage/company/companyDetails/index.css
@@ -10,4 +10,8 @@
 .table-span{
   margin: 5px 0;
   display: block;
+}
+
+.ant-checkbox-wrapper{
+  margin: 5px 0;
 }
\ No newline at end of file
diff --git a/src/pages/home/branch/manage/company/companyDetails/index.js b/src/pages/home/branch/manage/company/companyDetails/index.js
index a3c441c..43e22c9 100644
--- a/src/pages/home/branch/manage/company/companyDetails/index.js
+++ b/src/pages/home/branch/manage/company/companyDetails/index.js
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react'
-import { Card, Tabs, Row, Layout, Descriptions } from 'antd'
+import { Card, Tabs, Row, Layout, Descriptions, Checkbox, Radio } from 'antd'
 import api from "@/api/request"
 import BusinessInformation from './businessInformation';
 import FinancialData from "./financialData"
@@ -15,19 +15,20 @@ const { TabPane } = Tabs;
 const { Sider, Content } = Layout;
 
 const tab = [
-  { title: "工商信息", key: "0", content: function (cid, updateTime,tabPane) { return <BusinessInformation cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "财务数据", key: "1", content: function (cid, updateTime,tabPane) { return <FinancialData cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "经营风险", key: "2", content: function (cid, updateTime,tabPane) { return <OperationalRisk cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "财务分析", key: "3", content: function (cid, updateTime,tabPane) { return <FinancialAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "综合信用分析", key: "4", content: function (cid, updateTime,tabPane) { return <CreditAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "ESG评价分析", key: "5", content: function (cid, updateTime,tabPane) { return <EsgAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
-  { title: "评价记录", key: "6", content: function (cid, updateTime,tabPane) { return <EvaluationRecords cid={cid} table={tabPane} /> } },
+  { title: "工商信息", key: "0", content: function (cid, updateTime, tabPane) { return <BusinessInformation cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "财务数据", key: "1", content: function (cid, updateTime, tabPane) { return <FinancialData cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "经营风险", key: "2", content: function (cid, updateTime, tabPane) { return <OperationalRisk cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "财务分析", key: "3", content: function (cid, updateTime, tabPane) { return <FinancialAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "综合信用分析", key: "4", content: function (cid, updateTime, tabPane) { return <CreditAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "ESG评价分析", key: "5", content: function (cid, updateTime, tabPane) { return <EsgAnalysis cid={cid} updateTime={updateTime} table={tabPane} /> } },
+  { title: "评价记录", key: "6", content: function (cid, updateTime, tabPane) { return <EvaluationRecords cid={cid} table={tabPane} /> } },
 ]
 
 function CompanyDetails(props) {
   const [value, setValue] = useState({})
   const [tabPane, setTabPane] = useState(tab[0].title)
   const [updateTime, setUpdateTime] = useState([])
+  const [updateTimeArray, setUpdateTimeArray] = useState([])
   const [targetUpdateTime, setTargetUpdateTime] = useState("")
 
   useEffect(() => {
@@ -39,8 +40,11 @@ function CompanyDetails(props) {
   useEffect(() => {
     api.post("/admin/company/update_time", { cid: props.cid, table: tabPane }).then(res => {
       if (res.update_time) {
-        // setTargetUpdate(res.update_time[0])
-        setUpdateTime(res.update_time)
+        const data = res.update_time.map(item => {
+          return { label: item, value: item }
+        })
+        setUpdateTime(data)
+        setTargetUpdateTime(res.update_time[0])
       } else {
         setUpdateTime([])
       }
@@ -51,8 +55,12 @@ function CompanyDetails(props) {
     setTabPane(tab[key].title)
   }
 
-  function setTargetUpdate(param) {
-    setTargetUpdateTime(param)
+  function setTargetUpdate(e) {
+    setTargetUpdateTime(e.target.value)
+  }
+
+  function setTargetUpdateArray(e) {
+    setUpdateTimeArray(e)
   }
 
   return (
@@ -73,14 +81,14 @@ function CompanyDetails(props) {
         {tab.map(item => {
           return <TabPane tab={item.title} key={item.key}>
             <Layout style={{ background: '#fff' }}>
-              <Content style={{ background: '#fff', margin: "0 0 40px 0", padding: "20px 20px 20px 0" }}>{item.content(props.cid, targetUpdateTime,tabPane)}</Content>
+              <Content style={{ background: '#fff', margin: "0 0 40px 0", padding: "20px 20px 20px 0" }}>{tabPane === '财务数据' ? item.content(props.cid, updateTimeArray, tabPane) : item.content(props.cid, targetUpdateTime, tabPane)}</Content>
               <Sider style={{ background: '#fff', padding: 20 }} className='sider-box'>
                 <p>更新日期</p>
-                {
-                  updateTime.map(item => {
-                    return <p><span onClick={setTargetUpdate.bind(this, item)} style={{cursor:"pointer"}}>{item}</span></p>
-                  })
-                }
+                <p>{
+                  tabPane === '财务数据' ? <Checkbox.Group options={updateTime} onChange={setTargetUpdateArray} /> : <Radio.Group onChange={setTargetUpdate} value={targetUpdateTime}>{updateTime.map(item => {
+                    return <Radio value={item.value}>{item.label}</Radio>
+                  })}</Radio.Group>
+                }</p>
                 <Row align='middle'><span>返回条数</span><p style={{ margin: "0 5px" }}>{updateTime.length}</p><span>条</span></Row>
               </Sider>
             </Layout>
diff --git a/src/pages/home/branch/manage/company/companyDetails/operationalRisk.js b/src/pages/home/branch/manage/company/companyDetails/operationalRisk.js
index b97f8f4..456e125 100644
--- a/src/pages/home/branch/manage/company/companyDetails/operationalRisk.js
+++ b/src/pages/home/branch/manage/company/companyDetails/operationalRisk.js
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react'
-import { Descriptions, Row, Col } from 'antd'
+import { Descriptions, Row, Col, Drawer, Button } from 'antd'
 import FeTable from "@/components/table"
 import api from "@/api/request"
 import { getColumn } from "@/utils/utils"
@@ -7,6 +7,25 @@ import "./index.css"
 
 function OperationalRisk(props) {
   const [value, setValue] = useState({})
+  const [compliancePage, setCompliancePage] = useState({
+    current: 1,
+    pageSize: 10
+  })
+  const [alterationPage, setAlterationPage] = useState({
+    current: 1,
+    pageSize: 10
+  })
+  const [businessPage, setBusinessPage] = useState({
+    current: 1,
+    pageSize: 10
+  })
+  const [rimPage, setRimPage] = useState({
+    current: 1,
+    pageSize: 10
+  })
+  const [visible, setVisible] = useState(false);
+  const [expand, setExpand] = useState([])
+
 
   useEffect(() => {
     if (props.table === '经营风险') {
@@ -16,6 +35,95 @@ function OperationalRisk(props) {
     }
   }, [props.cid, props.updateTime, props.table])
 
+  function compliancePageChange(current, pageSize) {
+    setCompliancePage({
+      current,
+      pageSize
+    })
+  }
+
+  function onComplianceShowSizeChange(current, pageSize) {
+    setCompliancePage({
+      current,
+      pageSize
+    })
+  }
+
+  function alterationPageChange(current, pageSize) {
+    setAlterationPage({
+      current,
+      pageSize
+    })
+  }
+
+  function onAlterationShowSizeChange(current, pageSize) {
+    setAlterationPage({
+      current,
+      pageSize
+    })
+  }
+
+  function businessPageChange(current, pageSize) {
+    setBusinessPage({
+      current,
+      pageSize
+    })
+  }
+
+  function onBusinessShowSizeChange(current, pageSize) {
+    setBusinessPage({
+      current,
+      pageSize
+    })
+  }
+
+  function rimPageChange(current, pageSize) {
+    setRimPage({
+      current,
+      pageSize
+    })
+  }
+
+  function onRimShowSizeChange(current, pageSize) {
+    setRimPage({
+      current,
+      pageSize
+    })
+  }
+
+  function getPageData(data, page, size) {
+    return data.slice((page - 1) * size, page * size)
+  }
+
+  function slot() {
+    return <>
+      <Button type="primary">
+        Open
+      </Button>
+      <Drawer title="详情" placement="right" onClose={onClose} visible={visible} key={value['类型']} maskStyle={{ background: 'transparent' }}>
+        {expand.map((item, index) => {
+          return <p><span key={index}>{index + 1}.{item}</span></p>
+        })}
+      </Drawer>
+    </>
+  }
+
+
+  function showDrawer() {
+    setVisible(true);
+  };
+
+  function onClose() {
+    setVisible(false);
+  };
+
+  function callback(e, value) {
+    if (e === "Open") {
+      showDrawer()
+      setExpand(value['详情'])
+    }
+  }
+
   return (
     <>
       <Descriptions column={4}>
@@ -27,15 +135,15 @@ function OperationalRisk(props) {
       <Row justify='space-between'>
         <Col span={12} style={{ paddingRight: 20 }}>
           <p>合规风险</p>
-          <FeTable data={value['合规风险统计']} columns={getColumn(value['合规风险统计'])}></FeTable>
-          <p>经营风险</p>
-          <FeTable data={value['经营风险']} columns={getColumn(value['经营风险'])}></FeTable>
+          {value['合规风险统计'] && <FeTable data={getPageData(value['合规风险统计'], compliancePage.current, compliancePage.pageSize)} columns={getColumn(value['合规风险统计'])} minHeight={300} current={compliancePage.current} pageChange={compliancePageChange} onShowSizeChange={onComplianceShowSizeChange} total={value['合规风险统计'].length} />}
           <p>变更记录</p>
-          <FeTable data={value['变更记录统计']} columns={getColumn(value['变更记录统计'])}></FeTable>
+          {value['变更记录统计'] && <FeTable data={getPageData(value['变更记录统计'], alterationPage.current, alterationPage.pageSize)} columns={getColumn(value['变更记录统计'])} minHeight={300} current={alterationPage.current} pageChange={alterationPageChange} onShowSizeChange={onAlterationShowSizeChange} total={value['变更记录统计'].length} />}
         </Col>
         <Col span={12} style={{ paddingLeft: 20 }}>
+          <p>经营风险</p>
+          {value['经营风险统计'] && <FeTable data={getPageData(value['经营风险统计'], businessPage.current, businessPage.pageSize)} columns={getColumn(value['经营风险统计'])} minHeight={300} current={businessPage.current} pageChange={businessPageChange} onShowSizeChange={onBusinessShowSizeChange} total={value['经营风险统计'].length} />}
           <p>周边风险</p>
-          <FeTable data={value['周边风险统计']} columns={getColumn(value['周边风险统计'])}></FeTable>
+          {value['周边风险统计'] && <FeTable data={getPageData(value['周边风险统计'], rimPage.current, rimPage.pageSize)} columns={getColumn(value['周边风险统计'], slot())} minHeight={300} current={rimPage.current} pageChange={rimPageChange} onShowSizeChange={onRimShowSizeChange} total={value['周边风险统计'].length} callback={callback} />}
         </Col>
       </Row>
     </>
diff --git a/src/utils/utils.js b/src/utils/utils.js
index dac5b08..e067d87 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -1,4 +1,4 @@
-export function getColumn(params) {
+export function getColumn(params, slot) {
   return Array.isArray(params) && params.length !== 0 ? Object.keys(params[0]).map((key, index) => {
     return {
       title: key,
@@ -6,9 +6,7 @@ export function getColumn(params) {
       key: index,
       align: 'center',
       render: record => {
-        return Array.isArray(record) ? record.map(item => {
-          return <span className='table-span'>{item}</span>
-        }) : <span>{record}</span>
+        return Array.isArray(record) && slot ? slot : <span>{record}</span>
       }
     }
   }) : []