调整看板

2026-05-08 14:30:49 +08:00 · 2026-05-08 14:30:49 +08:00 · dcdd7bc7f9
commit dcdd7bc7f9
parent f761c24893
7 changed files with 57 additions and 44 deletions
--- a/src/layout/FullOther/ClassBuild.js
+++ b/src/layout/FullOther/ClassBuild.js
@ -70,8 +70,8 @@ class ClassBuild extends React.Component {
    }

    // 注意：数据结构是 { companyName: '邦泰', rate: '52%' }
-    const companyNames = companyList.map((item) => item.companyName);
-    const rates = companyList.map((item) => {
+    const companyNames = companyList?.map((item) => item.companyName);
+    const rates = companyList?.map((item) => {
      // 处理 rate 可能是字符串带百分号的情况
      const rateValue = typeof item.rate === 'string' ? parseFloat(item.rate.replace('%', '')) : item.rate;
      return isNaN(rateValue) ? 0 : rateValue;
--- a/src/layout/FullOther/DangerJob.js
+++ b/src/layout/FullOther/DangerJob.js
@ -102,7 +102,18 @@ class DangerJob extends React.Component {
        companyName = selectedCompanyObj?.NAME || '';
      }
      return (
-        <div style={{ textAlign: 'center', padding: '50px', color: '#999' }}>
+        <div
+          style={{
+            textAlign: 'center',
+            padding: '50px',
+            color: '#999',
+            fontSize: '26px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            flex: 1,
+          }}
+        >
          {selectedCompany ? `${companyName}暂无危险作业数据` : '暂无危险作业数据'}
        </div>
      );
--- a/src/layout/FullOther/HiddenSolve.js
+++ b/src/layout/FullOther/HiddenSolve.js
@ -122,18 +122,17 @@ class HiddenSolve extends React.Component {
      },
      legend: {
        data: ['重大隐患', '一般隐患'],
-        orient: 'vertical',
        right: '3%',
-        top: '5%',
-        itemGap: 16,
-        itemWidth: 18,
-        itemHeight: 12,
-        textStyle: { color: '#000', fontSize: 14 },
+        top: '10%',
+        itemGap: 12,
+        itemWidth: 16,
+        itemHeight: 10,
+        textStyle: { color: '#000', fontSize: 12 },
      },
      grid: {
        left: '8%',
        right: '5%',
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
@ -275,18 +274,17 @@ class HiddenSolve extends React.Component {
      },
      legend: {
        data: ['重大隐患量', '重大隐患未整改量', '一般隐患量', '一般隐患未整改量'],
-        orient: 'vertical',
        right: '3%',
-        top: '5%',
+        top: '10%',
        itemGap: 12,
-        itemWidth: 18,
-        itemHeight: 12,
+        itemWidth: 16,
+        itemHeight: 10,
        textStyle: { color: '#000', fontSize: 12 },
      },
      grid: {
        left: '8%',
        right: '5%',
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
--- a/src/layout/FullOther/HomeContent.js
+++ b/src/layout/FullOther/HomeContent.js
@ -92,7 +92,7 @@ class HomeContent extends React.Component {
          label: {
            show: true,
            position: 'inside',
-            formatter: '{a|{b}：{c}}\n\n\n{e|({d}%)}', // 添加 \n 换行符
+            formatter: '{d}%', // 添加 \n 换行符
            color: '#000',
            textBorderWidth: 0,
            rich: {
@ -194,7 +194,7 @@ class HomeContent extends React.Component {
      },
      legend: {
        data: legendData,
-        right: 0,
+        right: '3%',
        top: '10%',
        itemGap: 12,
        itemWidth: 16,
@ -405,7 +405,7 @@ class HomeContent extends React.Component {
      this.echartsInstances.backLogChart = echarts.init(backLogCharts);
      this.echartsInstances.backLogChart.setOption({
        title: {
-          text: '当月工作培训统计数量',
+          text: '当月培训统计数量',
          x: 'center',
          y: '25%',
          textStyle: { fontSize: 16, color: '#999' },
@ -428,7 +428,7 @@ class HomeContent extends React.Component {

    const option = {
      title: {
-        text: '当月工作培训统计数量',
+        text: '当月培训统计数量',
        x: 'center',
        y: '5%',
        textStyle: { fontSize: 16, color: '#000' },
@ -446,18 +446,17 @@ class HomeContent extends React.Component {
      },
      legend: {
        data: ['培训人次', '培训场次'],
-        orient: 'vertical',
-        right: 0,
-        top: 'middle',
-        itemGap: 16,
-        itemWidth: 18,
-        itemHeight: 12,
-        textStyle: { color: '#000', fontSize: 14 },
+        right: '3%',
+        top: '10%',
+        itemGap: 12,
+        itemWidth: 16,
+        itemHeight: 10,
+        textStyle: { color: '#000', fontSize: 12 },
      },
      grid: {
        left: '5%',
        right: '5%',
-        top: '18%',
+        top: '28%',
        bottom: '5%',
        containLabel: true,
      },
--- a/src/layout/FullOther/RiskControl.js
+++ b/src/layout/FullOther/RiskControl.js
@ -96,18 +96,17 @@ class RiskControl extends React.Component {
      },
      legend: {
        data: ['重大风险', '较大风险', '一般风险', '低风险'],
-        orient: 'vertical',
        right: '3%',
-        top: '5%',
-        itemGap: 16,
-        itemWidth: 18,
-        itemHeight: 12,
-        textStyle: { color: '#000', fontSize: 14 },
+        top: '10%',
+        itemGap: 12,
+        itemWidth: 16,
+        itemHeight: 10,
+        textStyle: { color: '#000', fontSize: 12 },
      },
      grid: {
        left: '8%',
        right: '5%',
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
@ -281,7 +280,7 @@ class RiskControl extends React.Component {
          axisTick: { show: false },
          axisLabel: {
            textStyle: { color: '#000' },
-            // rotate: typeNames.length > 4 ? 15 : 0,
+            rotate: typeNames.length > 4 ? 15 : 0,
            interval: 0,
            fontSize: 12,
          },
--- a/src/layout/FullOther/TrainingContent.js
+++ b/src/layout/FullOther/TrainingContent.js
@ -98,7 +98,7 @@ class TrainingContent extends React.Component {
      legend: {
        data: ['培训人次', '培训场次'],
        right: '3%', // 靠右
-        top: '5%', // 垂直居中
+        top: '10%', // 垂直居中
        itemGap: 16,
        itemWidth: 18,
        itemHeight: 12,
@ -107,7 +107,7 @@ class TrainingContent extends React.Component {
      grid: {
        left: '5%',
        right: '5%', // 为右侧垂直图例留出空间
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
@ -267,7 +267,7 @@ class TrainingContent extends React.Component {
      legend: {
        data: ['培训人次', '培训场次'],
        right: '3%', // 靠右
-        top: '5%', // 垂直居中
+        top: '10%', // 垂直居中
        itemGap: 16,
        itemWidth: 18,
        itemHeight: 12,
@ -276,7 +276,7 @@ class TrainingContent extends React.Component {
      grid: {
        left: '5%',
        right: '5%', // 为右侧垂直图例留出空间
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
@ -416,7 +416,7 @@ class TrainingContent extends React.Component {
      legend: {
        data: ['培训人次', '培训场次'],
        right: '3%', // 靠右
-        top: '5%', // 垂直居中
+        top: '10%', // 垂直居中
        itemGap: 16,
        itemWidth: 18,
        itemHeight: 12,
@ -425,7 +425,7 @@ class TrainingContent extends React.Component {
      grid: {
        left: '5%',
        right: '5%', // 为右侧垂直图例留出空间
-        top: '18%',
+        top: '28%',
        bottom: '8%',
        containLabel: true,
      },
@ -512,6 +512,8 @@ class TrainingContent extends React.Component {
    const headers = trainingSubIDCard[0] || [];
    // 数据行（从第二行开始）
    const dataRows = trainingSubIDCard.slice(1);
+    // 生成稳定的 key，当数据变化时强制重新创建表格
+    const tableKey = `${headers.join('-')}-${dataRows.length}`;
    // 计算每列的最小宽度（根据表头文字长度）
    const getColumnWidth = (header) => {
      const chineseCharWidth = 14; // 中文字符宽度(px)
@ -530,7 +532,7 @@ class TrainingContent extends React.Component {
      key: `col${index}`,
      align: 'center',
      width: getColumnWidth(header),
-      fixed: index === 0 ? 'left' : index === headers.length - 1 ? 'right' : undefined,
+      fixed: index === 0 ? 'left' : undefined,
      render: (text) => {
        if (header === '小计') {
          return <strong style={{ color: '#4285f4' }}>{text}</strong>;
@ -553,11 +555,12 @@ class TrainingContent extends React.Component {
    });

    // 横向滚动配置（当列数过多时）
-    const scrollConfig = columns.length > 10 ? { x: columns.length * 100, y: 380 } : { y: 380 };
+    const scrollConfig = { x: columns.length * 100, y: 380 };

    return (
      <div style={{ height: '100%', overflow: 'hidden', padding: '10px' }}>
        <Table
+          key={tableKey} // 添加 key 属性，数据变化时强制重新渲染
          columns={columns}
          dataSource={tableData}
          pagination={false}
@ -617,6 +620,9 @@ class TrainingContent extends React.Component {

  componentDidUpdate(prevProps) {
    // 当 trainingSubData 或 trainingSubDataMonth 变化时重新渲染图表
+    if (prevProps.trainingSubData !== this.props.trainingSubData) {
+      this.renderChart1();
+    }
    if (
      prevProps.trainingSubDataMonth !== this.props.trainingSubDataMonth ||
      prevProps.selectedMonth !== this.props.selectedMonth
--- a/src/layout/FullScreenInter.js
+++ b/src/layout/FullScreenInter.js
@ -75,7 +75,7 @@ class FullScreen extends React.Component {

      // 其他页面数据
      riskSubData: {},
-      classSubData: {},
+      classSubData: [],
      dangerSubData: {},
      dangerCompanyData: [],
      selectedDangerCompany: '',