From 670f2bf231e1d72cbf6c95c1a37a98b48a34e859 Mon Sep 17 00:00:00 2001
From: yunkexin <760754045@qq.com>
Date: Mon, 8 Jun 2026 15:20:41 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A3=8E=E9=99=A9=E7=AE=A1=E6=8E=A7=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E5=B0=8F=E8=AE=A1=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/FullOther/RiskControl.js | 304 ++++++++++++++++++++--------
 1 file changed, 222 insertions(+), 82 deletions(-)

diff --git a/src/layout/FullOther/RiskControl.js b/src/layout/FullOther/RiskControl.js
index f07baae..6dee6d4 100644
--- a/src/layout/FullOther/RiskControl.js
+++ b/src/layout/FullOther/RiskControl.js
@@ -46,7 +46,7 @@ class RiskControl extends React.Component {
     this.echartsInstances.stackBarChart = echarts.init(chartDom);
 
     const { riskSubData } = this.props;
-    const riskList = riskSubData?.riskList || [];
+    const riskList = riskSubData?.riskList.filter((item) => item.companyName !== '小计') || [];
 
     if (riskList.length === 0) {
       this.echartsInstances.stackBarChart.setOption({
@@ -324,6 +324,8 @@ class RiskControl extends React.Component {
     this.setupResizeHandler('typeBarChart', this.renderTypeBarChart);
   };
 
+  // 表格: 各公司风险统计明细表
+  // 表格: 各公司风险统计明细表
   // 表格: 各公司风险统计明细表
   renderRiskTable = () => {
     const { riskSubData } = this.props;
@@ -333,100 +335,238 @@ class RiskControl extends React.Component {
       return <div style={{ textAlign: 'center', padding: '50px', color: '#999' }}>暂无风险数据</div>;
     }
 
-    // 表格列配置（与 trainingContent 样式保持一致）
-    const columns = [
-      {
-        title: '公司名称',
-        dataIndex: 'companyName',
-        key: 'companyName',
-        align: 'center',
-        width: 120,
-        render: (text) => <strong>{text}</strong>,
-      },
-      {
-        title: '重大风险',
-        dataIndex: 'majorCount',
-        key: 'majorCount',
-        align: 'center',
-        width: 100,
-        render: (text) => <span style={{ color: '#c92a2a', fontWeight: 'bold' }}>{text}</span>,
-      },
-      {
-        title: '较大风险',
-        dataIndex: 'largerCount',
-        key: 'largerCount',
-        align: 'center',
-        width: 100,
-        render: (text) => <span style={{ color: '#ffa94d', fontWeight: 'bold' }}>{text}</span>,
-      },
-      {
-        title: '一般风险',
-        dataIndex: 'generalCount',
-        key: 'generalCount',
-        align: 'center',
-        width: 100,
-        render: (text) => <span style={{ color: '#ffe066', fontWeight: 'bold' }}>{text}</span>,
-      },
-      {
-        title: '低风险',
-        dataIndex: 'lowCount',
-        key: 'lowCount',
-        align: 'center',
-        width: 100,
-        render: (text) => <span style={{ color: '#4285F4', fontWeight: 'bold' }}>{text}</span>,
-      },
-      {
-        title: '小计',
-        dataIndex: 'totalCount',
-        key: 'totalCount',
-        align: 'center',
-        width: 100,
-        render: (text) => <strong style={{ color: '#000', fontSize: '14px' }}>{text}</strong>,
-      },
-    ];
+    const filteredRiskList = riskList.filter((item) => item.companyName !== '小计');
 
-    const tableData = riskList.map((item, index) => ({
-      key: index,
-      companyName: item.companyName,
-      majorCount: item.majorCount,
-      largerCount: item.largerCount,
-      generalCount: item.generalCount,
-      lowCount: item.lowCount,
-      totalCount: item.totalCount,
-    }));
-
-    // 合计行
     const summary = {
-      majorTotal: riskList.reduce((sum, item) => sum + (item.majorCount || 0), 0),
-      largerTotal: riskList.reduce((sum, item) => sum + (item.largerCount || 0), 0),
-      generalTotal: riskList.reduce((sum, item) => sum + (item.generalCount || 0), 0),
-      lowTotal: riskList.reduce((sum, item) => sum + (item.lowCount || 0), 0),
-      totalAll: riskList.reduce((sum, item) => sum + (item.totalCount || 0), 0),
+      majorTotal: filteredRiskList.reduce((sum, item) => sum + (item.majorCount || 0), 0),
+      largerTotal: filteredRiskList.reduce((sum, item) => sum + (item.largerCount || 0), 0),
+      generalTotal: filteredRiskList.reduce((sum, item) => sum + (item.generalCount || 0), 0),
+      lowTotal: filteredRiskList.reduce((sum, item) => sum + (item.lowCount || 0), 0),
+      totalAll: filteredRiskList.reduce((sum, item) => sum + (item.totalCount || 0), 0),
     };
-    const scrollConfig = columns.length > 10 ? { x: columns.length * 100, y: 360 } : { y: 360 };
+
+    const totalWidth = 620;
+
     return (
-      <div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+      <div
+        style={{
+          height: '100%',
+          display: 'flex',
+          flexDirection: 'column',
+          overflow: 'hidden',
+        }}
+      >
         <div
           style={{
             textAlign: 'center',
-            padding: '20px 0 0 0',
+            padding: '16px 0',
             fontWeight: 'bold',
-            fontSize: '17px',
+            fontSize: '16px',
             color: '#000',
+            flexShrink: 0,
+            borderBottom: '1px solid #f0f0f0',
           }}
         >
           各家公司的风险统计情况
         </div>
-        <div style={{ flex: 1, padding: '10px' }}>
-          <Table
-            columns={columns}
-            dataSource={tableData}
-            pagination={false}
-            scroll={scrollConfig}
-            size="small"
-            bordered
-            className={styles.certificateTable}
-          />
+
+        {/* 表格滚动区域 */}
+        <div
+          style={{
+            flex: 1,
+            overflow: 'auto',
+            minHeight: 0,
+            position: 'relative',
+            marginLeft: '20px',
+          }}
+        >
+          <table
+            style={{
+              width: '100%',
+              borderCollapse: 'collapse',
+              fontSize: '14px',
+              minWidth: totalWidth,
+            }}
+          >
+            {/* 表头 - 使用 sticky 固定 */}
+            <thead>
+              <tr style={{ backgroundColor: '#4285f4', position: 'sticky', top: 0, zIndex: 20 }}>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 120,
+                  }}
+                >
+                  公司名称
+                </th>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 100,
+                  }}
+                >
+                  重大风险
+                </th>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 100,
+                  }}
+                >
+                  较大风险
+                </th>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 100,
+                  }}
+                >
+                  一般风险
+                </th>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 100,
+                  }}
+                >
+                  低风险
+                </th>
+                <th
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #e8e8e8',
+                    color: '#fff',
+                    fontWeight: 'bold',
+                    width: 100,
+                  }}
+                >
+                  小计
+                </th>
+              </tr>
+            </thead>
+
+            <tbody>
+              {filteredRiskList.map((item, index) => (
+                <tr key={index} style={{ backgroundColor: '#fff' }}>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <strong>{item.companyName}</strong>
+                  </td>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <span style={{ color: '#c92a2a', fontWeight: 'bold' }}>{item.majorCount}</span>
+                  </td>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <span style={{ color: '#ffa94d', fontWeight: 'bold' }}>{item.largerCount}</span>
+                  </td>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <span style={{ color: '#ffe066', fontWeight: 'bold' }}>{item.generalCount}</span>
+                  </td>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <span style={{ color: '#4285F4', fontWeight: 'bold' }}>{item.lowCount}</span>
+                  </td>
+                  <td style={{ padding: '8px', textAlign: 'center', border: '1px solid #f0f0f0' }}>
+                    <strong>{item.totalCount}</strong>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+
+            {/* 合计行 - 使用 sticky 固定在底部 */}
+            <tfoot>
+              <tr style={{ backgroundColor: '#fafafa', position: 'sticky', bottom: 0, zIndex: 10 }}>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  合计
+                </td>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    color: '#c92a2a',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  {summary.majorTotal}
+                </td>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    color: '#ffa94d',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  {summary.largerTotal}
+                </td>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    color: '#ffe066',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  {summary.generalTotal}
+                </td>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    color: '#4285F4',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  {summary.lowTotal}
+                </td>
+                <td
+                  style={{
+                    padding: '10px 8px',
+                    textAlign: 'center',
+                    border: '1px solid #f0f0f0',
+                    fontWeight: 'bold',
+                    backgroundColor: '#fafafa',
+                  }}
+                >
+                  {summary.totalAll}
+                </td>
+              </tr>
+            </tfoot>
+          </table>
         </div>
       </div>
     );