From d8a0c2c70bef137985ffbd398bd956ef54b84711 Mon Sep 17 00:00:00 2001
From: lizhenhua <1075222162@qq.com>
Date: Thu, 24 Jul 2025 00:04:42 +0800
Subject: [PATCH] kaifa gongnn

---
 api/commonRequest.js                         |    8 +-
 pages/newDataAnalysis/overallEfficiency.html | 1549 ++++++++----------
 2 files changed, 684 insertions(+), 873 deletions(-)

diff --git a/api/commonRequest.js b/api/commonRequest.js
index 9f581f5..a29832e 100644
--- a/api/commonRequest.js
+++ b/api/commonRequest.js
@@ -8,13 +8,13 @@ let aqEnnable = false // 参数加密开关
 
 //const URL_IP="http://sgwpdm.ah.sgcc.com.cn/jjgdweb/zhgd-web"
 
-const URL_IP="http://sgwpdm.ah.sgcc.com.cn/ahsfs/zhgd-web"
+//const URL_IP="http://sgwpdm.ah.sgcc.com.cn/ahsfs/zhgd-web"
 //前端
-// const URL_IP="http://127.0.0.1:63343/ah_jjzhgd_webscreen"
+ const URL_IP="http://127.0.0.1:13030/ah_jjzhgd_webscreen"
 //  const commonUrl = "http://192.168.0.38:13030/zhgd/";
 
-// const commonUrl = "http://sgwpdm.ah.sgcc.com.cn/zhgd/";
- const commonUrl = "http://127.0.0.1:13030/zhgd/";
+const commonUrl = "http://127.0.0.1:13030/zhgd/";
+//  const commonUrl = "http://192.168.1.105:18080/zhgd/";
 //  const imgUrl = "http://192.168.0.38:13030/zhgd/file/files/";
 const imgUrl = "http://sgwpdm.ah.sgcc.com.cn/zhgd/file/files/";
 // //前端路径
diff --git a/pages/newDataAnalysis/overallEfficiency.html b/pages/newDataAnalysis/overallEfficiency.html
index 5d25bc6..d110abd 100644
--- a/pages/newDataAnalysis/overallEfficiency.html
+++ b/pages/newDataAnalysis/overallEfficiency.html
@@ -18,64 +18,78 @@
             --dark: #333;
             --gray: #e4e7eb;
             --card-shadow: 0 4px 15px rgba(0,0,0,0.08);
+            --bg-color: #ffffff;
         }
-        
+
         * {
             margin: 0;
             padding: 0;
             box-sizing: border-box;
             font-family: 'Noto Sans SC', sans-serif;
         }
-        
+
         body {
-            /* background: linear-gradient(135deg, #f0f4f8 0%, #dfe7ee 100%); */
+            background: #f0f2f5;
             color: var(--dark);
             min-height: 100vh;
             overflow-x: hidden;
+            padding: 20px;
         }
-        
+
         .container {
             max-width: 1400px;
             margin: 0 auto;
             padding: 20px;
         }
-        
-        /* 简化后的顶部控制栏 */
-        .control-bar {
+
+        header {
             display: flex;
-            justify-content: flex-end;
-            margin-bottom: 20px;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 30px;
+            padding-bottom: 20px;
+            border-bottom: 1px solid var(--gray);
         }
-        
-        .date-selector {
-            background: #c2c2c2;
-            padding: 10px 15px;
-            border-radius: 8px;
+
+        .logo {
             display: flex;
             align-items: center;
-            gap: 10px;
-            box-shadow: var(--card-shadow);
+            gap: 15px;
         }
-        
-        .date-selector select {
-            background: transparent;
-            border: 1px solid var(--gray);
-            color: var(--dark);
-            padding: 5px 10px;
-            border-radius: 5px;
-            outline: none;
+
+        .logo-icon {
+            background: var(--primary);
+            color: white;
+            width: 50px;
+            height: 50px;
+            border-radius: 12px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 24px;
         }
-        
+
+        .logo-text {
+            font-size: 1.8rem;
+            font-weight: 700;
+            color: var(--primary);
+        }
+
+        .last-update {
+            color: #666;
+            font-size: 0.9rem;
+        }
+
         /* 仪表盘样式 */
         .dashboard {
             display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
             gap: 20px;
             margin-bottom: 25px;
         }
-        
+
         .kpi-card {
-            background: #c2c2c2;
+            background: var(--bg-color);
             border-radius: 12px;
             padding: 25px;
             box-shadow: var(--card-shadow);
@@ -85,19 +99,19 @@
             cursor: pointer;
             border-top: 4px solid var(--primary);
         }
-        
+
         .kpi-card:hover {
             transform: translateY(-5px);
             box-shadow: 0 10px 20px rgba(0,0,0,0.1);
         }
-        
+
         .kpi-header {
             display: flex;
             justify-content: space-between;
             margin-bottom: 15px;
             align-items: flex-start;
         }
-        
+
         .kpi-icon {
             width: 50px;
             height: 50px;
@@ -107,99 +121,63 @@
             justify-content: center;
             font-size: 24px;
         }
-        
+
         .kpi-icon.blue {
             background: rgba(26, 58, 95, 0.1);
             color: var(--primary);
         }
-        
+
         .kpi-icon.green {
             background: rgba(76, 175, 80, 0.1);
             color: var(--accent);
         }
-        
+
         .kpi-icon.orange {
             background: rgba(255, 152, 0, 0.1);
             color: var(--warning);
         }
-        
+
         .kpi-icon.red {
             background: rgba(244, 67, 54, 0.1);
             color: var(--danger);
         }
-        
+
         .kpi-title {
             font-size: 1rem;
             font-weight: 500;
             color: #666;
         }
-        
+
         .kpi-value {
             font-size: 2.2rem;
             font-weight: 700;
             margin: 10px 0;
         }
-        
+
         .kpi-trend {
             display: flex;
             align-items: center;
             font-size: 0.9rem;
             gap: 5px;
         }
-        
+
         .trend-up {
             color: var(--accent);
         }
-        
+
         .trend-down {
             color: var(--danger);
         }
-        
-        /* 图表容器 */
-        .charts-container {
-            display: grid;
-            grid-template-columns: 2fr 1fr;
-            gap: 20px;
-            margin-bottom: 25px;
-        }
-        
-        @media (max-width: 900px) {
-            .charts-container {
-                grid-template-columns: 1fr;
-            }
-        }
-        
-        .chart-card {
-            background: #c2c2c2;
-            border-radius: 12px;
-            padding: 20px;
-            box-shadow: var(--card-shadow);
-        }
-        
-        .chart-header {
-            margin-bottom: 15px;
-            font-weight: 500;
-            color: var(--primary);
-            font-size: 1.1rem;
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-        
-        .chart-container {
-            height: 300px;
-            width: 100%;
-        }
-        
+
         /* 分析部分 */
         .analysis-section {
-            background: #c2c2c2;
+            background: var(--bg-color);
             border-radius: 12px;
             padding: 25px;
             box-shadow: var(--card-shadow);
             margin-bottom: 25px;
         }
-        
+
         .section-title {
             font-size: 1.3rem;
             color: var(--primary);
@@ -207,13 +185,13 @@
             padding-bottom: 10px;
             border-bottom: 1px solid var(--gray);
         }
-        
+
         .bottleneck-container {
             display: grid;
             grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
             gap: 20px;
         }
-        
+
         .bottleneck-card {
             border-left: 4px solid var(--warning);
             padding: 15px;
@@ -222,12 +200,12 @@
             transition: all 0.3s;
             cursor: pointer;
         }
-        
+
         .bottleneck-card:hover {
             transform: translateX(5px);
             background: #fff1cc;
         }
-        
+
         .bottleneck-title {
             font-weight: 500;
             margin-bottom: 8px;
@@ -235,19 +213,19 @@
             align-items: center;
             gap: 8px;
         }
-        
+
         .bottleneck-desc {
             font-size: 0.9rem;
             color: #666;
             margin-bottom: 10px;
         }
-        
+
         .optimization-card {
             background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
             border-radius: 8px;
             padding: 20px;
         }
-        
+
         .suggestion-item {
             display: flex;
             gap: 15px;
@@ -256,20 +234,20 @@
             cursor: pointer;
             transition: all 0.3s;
         }
-        
+
         .suggestion-item:hover {
             background: rgba(255,255,255,0.5);
             border-radius: 8px;
             padding: 15px;
         }
-        
+
         .suggestion-item:last-child {
             border-bottom: none;
         }
-        
+
         .suggestion-icon {
             background: var(--accent);
-            color: #c2c2c2;
+            color: var(--bg-color);
             width: 40px;
             height: 40px;
             border-radius: 50%;
@@ -279,45 +257,27 @@
             flex-shrink: 0;
             font-weight: bold;
         }
-        
+
         .suggestion-content h4 {
             margin-bottom: 5px;
             color: var(--primary);
         }
-        
+
         .suggestion-content p {
             color: #666;
             font-size: 0.9rem;
         }
-        
+
         .priority-high {
             color: var(--danger);
             font-weight: 500;
         }
-        
+
         .priority-medium {
             color: var(--warning);
             font-weight: 500;
         }
-        
-        .action-btn {
-            background: var(--secondary);
-            color: white;
-            border: none;
-            padding: 8px 15px;
-            border-radius: 6px;
-            cursor: pointer;
-            font-size: 0.9rem;
-            display: flex;
-            align-items: center;
-            gap: 5px;
-            transition: all 0.3s;
-        }
-        
-        .action-btn:hover {
-            background: var(--primary);
-        }
-        
+
         /* 二级页面样式 */
         .secondary-page {
             position: fixed;
@@ -334,12 +294,12 @@
             visibility: hidden;
             transition: all 0.3s;
         }
-        
+
         .secondary-page.active {
             opacity: 1;
             visibility: visible;
         }
-        
+
         .page-content {
             background: white;
             width: 90%;
@@ -352,24 +312,27 @@
             transform: translateY(20px);
             transition: transform 0.4s;
         }
-        
+
         .secondary-page.active .page-content {
             transform: translateY(0);
         }
-        
+
         .page-header {
             padding: 20px;
             display: flex;
             justify-content: space-between;
             align-items: center;
+            background: #f5f5f5;
+            border-bottom: 1px solid #e0e0e0;
         }
-        
+
         .page-header h3 {
             font-size: 1.5rem;
+            color: var(--primary);
         }
-        
+
         .close-btn {
-            background: rgba(255,255,255,0.2);
+            background: rgba(0,0,0,0.1);
             width: 40px;
             height: 40px;
             border-radius: 50%;
@@ -380,75 +343,75 @@
             font-size: 1.2rem;
             transition: all 0.3s;
         }
-        
+
         .close-btn:hover {
-            background: rgba(255,255,255,0.3);
+            background: rgba(0,0,0,0.2);
         }
-        
+
         .page-body {
             padding: 30px;
             overflow-y: auto;
         }
-        
+
         .detail-grid {
             display: grid;
             grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
             gap: 20px;
             margin-bottom: 30px;
         }
-        
+
         .detail-card {
             background: var(--light);
             border-radius: 10px;
             padding: 20px;
             box-shadow: var(--card-shadow);
         }
-        
+
         .detail-card h4 {
             color: var(--primary);
             margin-bottom: 15px;
             padding-bottom: 10px;
             border-bottom: 1px solid var(--gray);
         }
-        
+
         .data-row {
             display: flex;
             justify-content: space-between;
             padding: 8px 0;
             border-bottom: 1px dashed #ddd;
         }
-        
+
         .data-row:last-child {
             border-bottom: none;
         }
-        
+
         .progress-container {
             margin: 15px 0;
         }
-        
+
         .progress-label {
             display: flex;
             justify-content: space-between;
             margin-bottom: 5px;
         }
-        
+
         .progress-bar {
             height: 10px;
             background: #e0e0e0;
             border-radius: 5px;
             overflow: hidden;
         }
-        
+
         .progress-fill {
             height: 100%;
             border-radius: 5px;
         }
-        
+
         .detail-chart {
             height: 300px;
             margin: 30px 0;
         }
-        
+
         /* 页脚 */
         footer {
             text-align: center;
@@ -457,7 +420,7 @@
             font-size: 0.9rem;
             margin-top: 20px;
         }
-        
+
         .stat-badge {
             display: inline-block;
             padding: 3px 8px;
@@ -465,780 +428,628 @@
             font-size: 0.8rem;
             font-weight: 500;
         }
-        
+
         .badge-green {
             background: rgba(76, 175, 80, 0.2);
             color: var(--accent);
         }
-        
+
         .badge-orange {
             background: rgba(255, 152, 0, 0.2);
             color: var(--warning);
         }
-        
+
         .badge-red {
             background: rgba(244, 67, 54, 0.2);
             color: var(--danger);
         }
+
+        .chart-container {
+            display: flex;
+            flex-wrap: wrap;
+            gap: 20px;
+            margin-top: 20px;
+        }
+
+        .chart-box {
+            flex: 1 1 400px;
+            min-height: 300px;
+            background: white;
+            border-radius: 10px;
+            padding: 15px;
+            box-shadow: var(--card-shadow);
+        }
+
+        .table-container {
+            margin-top: 20px;
+            overflow-x: auto;
+        }
+
+        .data-table {
+            width: 100%;
+            border-collapse: collapse;
+            background: white;
+            border-radius: 8px;
+            overflow: hidden;
+            box-shadow: var(--card-shadow);
+        }
+
+        .data-table th {
+            background: var(--primary);
+            color: white;
+            padding: 12px 15px;
+            text-align: left;
+        }
+
+        .data-table td {
+            padding: 10px 15px;
+            border-bottom: 1px solid var(--gray);
+        }
+
+        .data-table tr:nth-child(even) {
+            background: var(--light);
+        }
+
+        .data-table tr:hover {
+            background: rgba(26, 58, 95, 0.05);
+        }
     </style>
 </head>
 <body>
     <div class="container">
-        
+        <header>
+            <div class="logo">
+                <div class="logo-icon">
+                    <i class="fas fa-hard-hat"></i>
+                </div>
+                <div class="logo-text">工地整体效能分析系统</div>
+            </div>
+            <div class="last-update">最后更新: 2023-11-16 14:30</div>
+        </header>
+
         <!-- 主仪表盘 -->
-        <div class="dashboard">
-            <div class="kpi-card" onclick="openPage('personnel')">
-                <div class="kpi-header">
-                    <div>
-                        <div class="kpi-title">人员利用率</div>
-                        <div class="kpi-value">78.3%</div>
-                    </div>
-                    <div class="kpi-icon blue">
-                        <i class="fas fa-users"></i>
-                    </div>
-                </div>
-                <div class="kpi-trend trend-up">
-                    <i class="fas fa-arrow-up"></i> 较上周提高 5.2%
-                </div>
-                <div class="kpi-trend">
-                    平均闲置时间 1.2 小时/天
-                </div>
-            </div>
-            
-            <div class="kpi-card" onclick="openPage('equipment')">
-                <div class="kpi-header">
-                    <div>
-                        <div class="kpi-title">设备使用率</div>
-                        <div class="kpi-value">64.8%</div>
-                    </div>
-                    <div class="kpi-icon orange">
-                        <i class="fas fa-tools"></i>
-                    </div>
-                </div>
-                <div class="kpi-trend trend-down">
-                    <i class="fas fa-arrow-down"></i> 下降 2.1%
-                </div>
-                <div class="kpi-trend">
-                    主要设备故障率 3.7%
-                </div>
-            </div>
-            
-            <div class="kpi-card" onclick="openPage('progress')">
-                <div class="kpi-header">
-                    <div>
-                        <div class="kpi-title">工程进度</div>
-                        <div class="kpi-value">72.5%</div>
-                    </div>
-                    <div class="kpi-icon green">
-                        <i class="fas fa-tasks"></i>
-                    </div>
-                </div>
-                <div class="kpi-trend trend-up">
-                    <i class="fas fa-arrow-up"></i> 较计划超前 2 天
-                </div>
-                <div class="kpi-trend">
-                    本周完成进度 8.3%
-                </div>
-            </div>
-            
-            <div class="kpi-card" onclick="openPage('safety')">
-                <div class="kpi-header">
-                    <div>
-                        <div class="kpi-title">安全合规率</div>
-                        <div class="kpi-value">94.6%</div>
-                    </div>
-                    <div class="kpi-icon red">
-                        <i class="fas fa-shield-alt"></i>
-                    </div>
-                </div>
-                <div class="kpi-trend trend-up">
-                    <i class="fas fa-arrow-up"></i> 提高 3.4%
-                </div>
-                <div class="kpi-trend">
-                    本周安全事件 2 起
-                </div>
-            </div>
-        </div>
-        
-        <div class="charts-container">
-            <div class="chart-card">
-                <div class="chart-header">
-                    <span>多源数据综合分析</span>
-                </div>
-                <div class="chart-container" id="radarChart"></div>
-            </div>
-            
-            <div class="chart-card">
-                <div class="chart-header">
-                    <span>效能瓶颈分布</span>
-                </div>
-                <div class="chart-container" id="bottleneckChart"></div>
-            </div>
-        </div>
-        
+        <div class="dashboard" id="dashboard"></div>
+
+        <!-- 瓶颈分析 -->
         <div class="analysis-section">
             <div class="section-title">瓶颈识别与分析</div>
-            <div class="bottleneck-container">
-                <div class="bottleneck-card" onclick="openPage('bottleneck')">
-                    <div class="bottleneck-title">
-                        <span><i class="fas fa-cogs"></i> 设备调度瓶颈</span>
-                    </div>
-                    <div class="bottleneck-desc">
-                        混凝土搅拌机使用率高达92%，等待时间过长，影响3个作业面进度
-                    </div>
-                    <div class="kpi-trend">
-                        <span class="badge-red">高影响</span> 预计延误: 3天
-                    </div>
-                </div>
-                
-                <div class="bottleneck-card" onclick="openPage('bottleneck')">
-                    <div class="bottleneck-title">
-                        <span><i class="fas fa-user-graduate"></i> 人员技能瓶颈</span>
-                    </div>
-                    <div class="bottleneck-desc">
-                        高级焊工短缺，导致钢结构安装进度滞后15%
-                    </div>
-                    <div class="kpi-trend">
-                        <span class="badge-orange">中影响</span> 影响范围: 2号楼
-                    </div>
-                </div>
-                
-                <div class="bottleneck-card" onclick="openPage('bottleneck')">
-                    <div class="bottleneck-title">
-                        <span><i class="fas fa-pallet"></i> 物料供应瓶颈</span>
-                    </div>
-                    <div class="bottleneck-desc">
-                        钢筋供应延迟，影响2号楼主体施工进度
-                    </div>
-                    <div class="kpi-trend">
-                        <span class="badge-red">高影响</span> 延误天数: 5天
-                    </div>
-                </div>
-            </div>
+            <div class="bottleneck-container" id="bottleneck-container"></div>
         </div>
-        
+
+        <!-- 优化建议 -->
         <div class="analysis-section">
             <div class="section-title">优化建议与措施</div>
-            <div class="optimization-card">
-                <div class="suggestion-item" onclick="openPage('suggestion1')">
-                    <div class="suggestion-icon">1</div>
-                    <div class="suggestion-content">
-                        <h4>设备调度优化 <span class="priority-high">(高优先级)</span></h4>
-                        <p>调整混凝土搅拌机使用时段，增加夜间预制工作，预计可提升设备利用率15%</p>
-                    </div>
-                </div>
-                
-                <div class="suggestion-item" onclick="openPage('suggestion2')">
-                    <div class="suggestion-icon">2</div>
-                    <div class="suggestion-content">
-                        <h4>技能培训计划 <span class="priority-medium">(中优先级)</span></h4>
-                        <p>开展焊工技能提升培训，同时外聘2名高级焊工，预计可缩短工期5天</p>
-                    </div>
-                </div>
-                
-                <div class="suggestion-item" onclick="openPage('suggestion3')">
-                    <div class="suggestion-icon">3</div>
-                    <div class="suggestion-content">
-                        <h4>供应链优化 <span class="priority-high">(高优先级)</span></h4>
-                        <p>建立备用供应商机制，增加钢筋库存缓冲，确保施工连续性</p>
-                    </div>
-                </div>
-            </div>
+            <div class="optimization-card" id="suggestion-container"></div>
         </div>
-        
+
         <footer>
-            <p>工地整体效能分析系统 © 2023 | 数据更新时间: 2023-11-15 14:30</p>
+            <p id="footer-text">工地整体效能分析</p>
         </footer>
     </div>
 
-    <!-- 二级页面：人员效能分析 -->
-    <div class="secondary-page" id="personnel-page">
-        <div class="page-content">
-            <div class="page-header">
-                <h3><i class="fas fa-users"></i> 人员效能分析</h3>
-                <div class="close-btn" onclick="closePage('personnel')">
-                    <i class="fas fa-times"></i>
-                </div>
-            </div>
-            <div class="page-body">
-                <div class="detail-grid">
-                    <div class="detail-card">
-                        <h4>核心指标</h4>
-                        <div class="data-row">
-                            <span>总工人数</span>
-                            <span>186人</span>
-                        </div>
-                        <div class="data-row">
-                            <span>人员利用率</span>
-                            <span>78.3%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>平均出勤率</span>
-                            <span>95.2%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>加班工时</span>
-                            <span>342小时/周</span>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>技能分布</h4>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>高级技工</span>
-                                <span>32%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 32%; background: var(--primary);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>中级技工</span>
-                                <span>45%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 45%; background: var(--secondary);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>普通工人</span>
-                                <span>23%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 23%; background: var(--accent);"></div>
-                            </div>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>效能趋势</h4>
-                        <div class="data-row">
-                            <span>本周变化</span>
-                            <span class="trend-up">+5.2%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>上月同期</span>
-                            <span>73.5%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>目标值</span>
-                            <span>85.0%</span>
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="detail-chart" id="personnel-chart"></div>
-                
-                <h4>优化建议</h4>
-                <p>1. 调整班组结构，平衡各工种人员分配，减少待工时间</p>
-                <p>2. 加强新工人培训，提高工作效率</p>
-                <p>3. 优化排班计划，减少不必要的加班</p>
-            </div>
-        </div>
-    </div>
-    
-    <!-- 设备分析页面 -->
-    <div class="secondary-page" id="equipment-page">
-        <div class="page-content">
-            <div class="page-header">
-                <h3><i class="fas fa-tools"></i> 设备使用分析</h3>
-                <div class="close-btn" onclick="closePage('equipment')">
-                    <i class="fas fa-times"></i>
-                </div>
-            </div>
-            <div class="page-body">
-                <div class="detail-grid">
-                    <div class="detail-card">
-                        <h4>设备概况</h4>
-                        <div class="data-row">
-                            <span>设备总数</span>
-                            <span>42台</span>
-                        </div>
-                        <div class="data-row">
-                            <span>设备使用率</span>
-                            <span>64.8%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>平均故障率</span>
-                            <span>3.7%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>待机设备数</span>
-                            <span>15台</span>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>关键设备状态</h4>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>混凝土搅拌机</span>
-                                <span>92%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 92%; background: var(--danger);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>塔式起重机</span>
-                                <span>78%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 78%; background: var(--warning);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>挖掘机</span>
-                                <span>65%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 65%; background: var(--accent);"></div>
-                            </div>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>维护情况</h4>
-                        <div class="data-row">
-                            <span>本周维护次数</span>
-                            <span>18次</span>
-                        </div>
-                        <div class="data-row">
-                            <span>待处理故障</span>
-                            <span>3项</span>
-                        </div>
-                        <div class="data-row">
-                            <span>平均响应时间</span>
-                            <span>2.5小时</span>
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="detail-chart" id="equipment-chart"></div>
-                
-                <h4>优化建议</h4>
-                <p>1. 优化混凝土搅拌机调度计划，增加使用时段</p>
-                <p>2. 对塔式起重机进行预防性维护，减少故障率</p>
-                <p>3. 重新分配闲置设备，提高整体利用率</p>
-            </div>
-        </div>
-    </div>
-    
-    <!-- 进度分析页面 -->
-    <div class="secondary-page" id="progress-page">
-        <div class="page-content">
-            <div class="page-header">
-                <h3><i class="fas fa-tasks"></i> 工程进度分析</h3>
-                <div class="close-btn" onclick="closePage('progress')">
-                    <i class="fas fa-times"></i>
-                </div>
-            </div>
-            <div class="page-body">
-                <div class="detail-grid">
-                    <div class="detail-card">
-                        <h4>总体进度</h4>
-                        <div class="data-row">
-                            <span>项目完成率</span>
-                            <span>72.5%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>计划进度</span>
-                            <span>70.3%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>超前/滞后</span>
-                            <span class="trend-up">+2.2% (超前2天)</span>
-                        </div>
-                        <div class="data-row">
-                            <span>关键路径进度</span>
-                            <span>68.7%</span>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>各区域进度</h4>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>1号楼</span>
-                                <span>85%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 85%; background: var(--accent);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>2号楼</span>
-                                <span>65%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 65%; background: var(--warning);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>3号楼</span>
-                                <span>78%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 78%; background: var(--accent);"></div>
-                            </div>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>本周进展</h4>
-                        <div class="data-row">
-                            <span>完成工作量</span>
-                            <span>8.3%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>计划工作量</span>
-                            <span>7.5%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>差异</span>
-                            <span class="trend-up">+0.8%</span>
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="detail-chart" id="progress-chart"></div>
-                
-                <h4>优化建议</h4>
-                <p>1. 重点监控2号楼进度，增加施工资源投入</p>
-                <p>2. 优化关键路径任务分配，减少依赖等待时间</p>
-                <p>3. 提前准备下阶段所需材料，避免进度延误</p>
-            </div>
-        </div>
-    </div>
-    
-    <!-- 安全分析页面 -->
-    <div class="secondary-page" id="safety-page">
-        <div class="page-content">
-            <div class="page-header">
-                <h3><i class="fas fa-shield-alt"></i> 安全合规分析</h3>
-                <div class="close-btn" onclick="closePage('safety')">
-                    <i class="fas fa-times"></i>
-                </div>
-            </div>
-            <div class="page-body">
-                <div class="detail-grid">
-                    <div class="detail-card">
-                        <h4>安全指标</h4>
-                        <div class="data-row">
-                            <span>安全合规率</span>
-                            <span>94.6%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>安全检查合格率</span>
-                            <span>92.3%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>本周安全事件</span>
-                            <span>2起</span>
-                        </div>
-                        <div class="data-row">
-                            <span>整改完成率</span>
-                            <span>87.5%</span>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>事件类型分布</h4>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>高空作业违规</span>
-                                <span>45%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 45%; background: var(--danger);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>设备操作不当</span>
-                                <span>30%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 30%; background: var(--warning);"></div>
-                            </div>
-                        </div>
-                        <div class="progress-container">
-                            <div class="progress-label">
-                                <span>现场管理疏漏</span>
-                                <span>25%</span>
-                            </div>
-                            <div class="progress-bar">
-                                <div class="progress-fill" style="width: 25%; background: var(--accent);"></div>
-                            </div>
-                        </div>
-                    </div>
-                    
-                    <div class="detail-card">
-                        <h4>安全趋势</h4>
-                        <div class="data-row">
-                            <span>本周变化</span>
-                            <span class="trend-up">+3.4%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>上月同期</span>
-                            <span>91.2%</span>
-                        </div>
-                        <div class="data-row">
-                            <span>目标值</span>
-                            <span>95.0%</span>
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="detail-chart" id="safety-chart"></div>
-                
-                <h4>优化建议</h4>
-                <p>1. 加强高空作业安全培训与监督</p>
-                <p>2. 完善设备操作规范，实施持证上岗制度</p>
-                <p>3. 强化现场安全管理，增加巡查频次</p>
-            </div>
-        </div>
-    </div>
-    
+    <!-- 二级页面容器 -->
+    <div id="secondary-pages"></div>
+    <script src="../../js/publics/sm4.js" type="text/javascript"></script>
+    <script src="../../js/publics/jquery-3.6.0.min.js" type="text/javascript"></script>
+    <script src="../../js/publics/public.js"></script>
+    <script src="../../plugin/scroll/jquery.nicescroll.min.js"></script>
+    <script src="../../js/publics/aescbc.js"></script>
+    <script src="../../js/publics/sm3.js"></script>
+    <script src="../../api/commonRequest.js"></script>
     <script>
-        // 初始化雷达图 - 多源数据分析
-        const radarChart = echarts.init(document.getElementById('radarChart'));
-        const radarOption = {
-            tooltip: { trigger: 'item' },
-            radar: {
-                indicator: [
-                    { name: '人员利用率', max: 100 },
-                    { name: '设备使用率', max: 100 },
-                    { name: '工程进度率', max: 100 },
-                    { name: '安全合规率', max: 100 },
-                    { name: '物料周转率', max: 100 },
-                    { name: '能源效率', max: 100 }
-                ],
-                shape: 'circle',
-                radius: '65%'
-            },
-            series: [{
-                type: 'radar',
-                data: [
-                    {
-                        value: [78, 65, 72, 94, 68, 75],
-                        name: '当前效能',
-                        areaStyle: { color: 'rgba(44, 92, 140, 0.5)' },
-                        lineStyle: { color: '#2c5c8c', width: 2 },
-                        symbol: 'circle',
-                        symbolSize: 8
+        // 示例数据 - 模拟后台返回的数据结构
+      /*  const pageData = {
+            "personnelPage": [
+                {
+                    "page_id": "personnel",
+                    "type": "chart",
+                    "content": "{\"data\": [60, 70, 78, 80], \"title\": \"人员利用率趋势\"}"
+                },
+                {
+                    "page_id": "personnel",
+                    "type": "table",
+                    "content": "{\"headers\": [\"工种\", \"数量\", \"利用率\"], \"rows\": [[\"焊工\", \"42人\", \"85%\"], [\"电工\", \"28人\", \"76%\"], [\"木工\", \"35人\", \"68%\"], [\"混凝土工\", \"53人\", \"92%\"]]}"
+                }
+            ],
+            "footer": "工地整体效能分析系统 © 2023 | 数据更新时间: 2023-11-16 14:30",
+            "bottlenecks": [
+                {
+                    "id": 1,
+                    "title": "人员调配不均",
+                    "description": "部分岗位人员长期闲置，部分岗位人力不足",
+                    "impact": "高影响",
+                    "delay": "影响范围: 整个项目"
+                },
+                {
+                    "id": 2,
+                    "title": "设备维护不足",
+                    "description": "关键设备缺乏定期维护，导致故障率上升",
+                    "impact": "中影响",
+                    "delay": "预计延误: 2天"
+                },
+                {
+                    "id": 3,
+                    "title": "物料供应延迟",
+                    "description": "钢筋和水泥供应不及时，影响施工进度",
+                    "impact": "高影响",
+                    "delay": "延误天数: 3天"
+                }
+            ],
+            "equipmentPage": [
+                {
+                    "page_id": "equipment",
+                    "type": "chart",
+                    "content": "{\"data\": [85, 92, 78, 88, 65], \"title\": \"设备完好率趋势\"}"
+                },
+                {
+                    "page_id": "equipment",
+                    "type": "table",
+                    "content": "{\"headers\": [\"设备\", \"状态\", \"使用率\"], \"rows\": [[\"塔吊\", \"正常\", \"85%\"], [\"吊篮\", \"故障\", \"0%\"], [\"挖掘机\", \"正常\", \"92%\"], [\"搅拌机\", \"维护中\", \"65%\"], [\"起重机\", \"正常\", \"78%\"]]}"
+                }
+            ],
+            "suggestions": [
+                {
+                    "id": 1,
+                    "title": "优化施工流程",
+                    "description": "通过流程再造提升资源使用效率",
+                    "priority": "高优先级"
+                },
+                {
+                    "id": 2,
+                    "title": "加强设备维护",
+                    "description": "建立设备定期维护计划，减少故障率",
+                    "priority": "中优先级"
+                },
+                {
+                    "id": 3,
+                    "title": "物料供应保障",
+                    "description": "与供应商建立长期合作关系，确保物料及时供应",
+                    "priority": "高优先级"
+                }
+            ],
+            "kpis": [
+                {
+                    "id": "equipment",
+                    "title": "设备完好率",
+                    "value": "91.2%",
+                    "icon": "tools",
+                    "color": "green",
+                    "trend": {
+                        "value": 2.3,
+                        "direction": "up",
+                        "text": "较上月提高 2.3%"
                     },
+                    "description": "故障率下降至 1.8%"
+                },
+                {
+                    "id": "personnel",
+                    "title": "人员利用率",
+                    "value": "78.3%",
+                    "icon": "users",
+                    "color": "blue",
+                    "trend": {
+                        "value": 5.2,
+                        "direction": "up",
+                        "text": "较上周提高 5.2%"
+                    },
+                    "description": "平均闲置时间 1.2 小时/天"
+                },
+                {
+                    "id": "progress",
+                    "title": "工程进度",
+                    "value": "72.5%",
+                    "icon": "tasks",
+                    "color": "orange",
+                    "trend": {
+                        "value": 8.3,
+                        "direction": "up",
+                        "text": "较计划超前 2 天"
+                    },
+                    "description": "本周完成进度 8.3%"
+                }
+            ],
+            "progressPage": [
+                {
+                    "page_id": "progress",
+                    "type": "chart",
+                    "content": "{\"data\": [45, 60, 72, 85], \"title\": \"工程进度趋势\"}"
+                },
+                {
+                    "page_id": "progress",
+                    "type": "table",
+                    "content": "{\"headers\": [\"区域\", \"进度\", \"状态\"], \"rows\": [[\"1号楼\", \"85%\", \"超前\"], [\"2号楼\", \"65%\", \"滞后\"], [\"3号楼\", \"78%\", \"正常\"], [\"地下车库\", \"92%\", \"超前\"]]}"
+                }
+            ]
+        }; */
+			let pageData = {};
+		    let url = commonUrl + "screen/Dashapi/pages/dashInfo";
+		    ajaxRequest(url, "get", "", true, function () {
+		    }, function (result) {
+				console.log("22222222222222222")
+		        console.log(JSON.stringify(result));
+		       pageData=result;
+			   initPage();
+		    }, function (xhr, status, error) {
+		            error(xhr, status, error)
+		        }, "application/json",aqEnnable);
+        // 渲染主页面
+        function renderMainPage() {
+            // 渲染KPI卡片
+            const dashboard = document.getElementById('dashboard');
+            dashboard.innerHTML = '';
+
+            pageData.kpis.forEach(kpi => {
+                const kpiCard = document.createElement('div');
+                kpiCard.className = 'kpi-card';
+                kpiCard.onclick = () => openPage(kpi.id);
+
+                kpiCard.innerHTML = `
+                    <div class="kpi-header">
+                        <div>
+                            <div class="kpi-title">${kpi.title}</div>
+                            <div class="kpi-value">${kpi.value}</div>
+                        </div>
+                        <div class="kpi-icon ${kpi.color}">
+                            <i class="fas fa-${kpi.icon}"></i>
+                        </div>
+                    </div>
+                    <div class="kpi-trend trend-${kpi.trend.direction}">
+                        <i class="fas fa-arrow-${kpi.trend.direction}"></i> ${kpi.trend.text}
+                    </div>
+                    <div class="kpi-trend">
+                        ${kpi.description}
+                    </div>
+                `;
+
+                dashboard.appendChild(kpiCard);
+            });
+
+            // 渲染瓶颈分析
+            const bottleneckContainer = document.getElementById('bottleneck-container');
+            bottleneckContainer.innerHTML = '';
+
+            pageData.bottlenecks.forEach(bottleneck => {
+                const bottleneckCard = document.createElement('div');
+                bottleneckCard.className = 'bottleneck-card';
+                bottleneckCard.onclick = () => openPage('bottleneck');
+
+                const impactClass = bottleneck.impact === '高影响' ? 'badge-red' :
+                                  bottleneck.impact === '中影响' ? 'badge-orange' : 'badge-green';
+
+                bottleneckCard.innerHTML = `
+                    <div class="bottleneck-title">
+                        <span><i class="fas fa-exclamation-triangle"></i> ${bottleneck.title}</span>
+                    </div>
+                    <div class="bottleneck-desc">
+                        ${bottleneck.description}
+                    </div>
+                    <div class="kpi-trend">
+                        <span class="stat-badge ${impactClass}">${bottleneck.impact}</span> ${bottleneck.delay}
+                    </div>
+                `;
+
+                bottleneckContainer.appendChild(bottleneckCard);
+            });
+
+            // 渲染优化建议
+            const suggestionContainer = document.getElementById('suggestion-container');
+            suggestionContainer.innerHTML = '';
+
+            pageData.suggestions.forEach((suggestion, index) => {
+                const suggestionItem = document.createElement('div');
+                suggestionItem.className = 'suggestion-item';
+                suggestionItem.onclick = () => openPage(suggestion.id);
+
+                const priorityClass = suggestion.priority === '高优先级' ? 'priority-high' :
+                                    suggestion.priority === '中优先级' ? 'priority-medium' : '';
+
+                suggestionItem.innerHTML = `
+                    <div class="suggestion-icon">${index + 1}</div>
+                    <div class="suggestion-content">
+                        <h4>${suggestion.title} <span class="${priorityClass}">(${suggestion.priority})</span></h4>
+                        <p>${suggestion.description}</p>
+                    </div>
+                `;
+
+                suggestionContainer.appendChild(suggestionItem);
+            });
+
+            // 渲染页脚
+            document.getElementById('footer-text').textContent = pageData.footer;
+        }
+
+        // 渲染二级页面
+        function renderSecondaryPages() {
+            const secondaryPages = document.getElementById('secondary-pages');
+            secondaryPages.innerHTML = '';
+
+            // 人员效能分析页面
+            const personnelPage = createSecondaryPage('personnel', '人员效能分析', 'users');
+            secondaryPages.appendChild(personnelPage);
+
+            // 设备使用分析页面
+            const equipmentPage = createSecondaryPage('equipment', '设备使用分析', 'tools');
+            secondaryPages.appendChild(equipmentPage);
+
+            // 工程进度分析页面
+            const progressPage = createSecondaryPage('progress', '工程进度分析', 'tasks');
+            secondaryPages.appendChild(progressPage);
+
+            // 瓶颈分析页面
+            const bottleneckPage = createBottleneckPage();
+            secondaryPages.appendChild(bottleneckPage);
+        }
+
+        // 创建二级页面
+        function createSecondaryPage(id, title, icon) {
+            const page = document.createElement('div');
+            page.className = 'secondary-page';
+            page.id = `${id}-page`;
+
+            page.innerHTML = `
+                <div class="page-content">
+                    <div class="page-header">
+                        <h3><i class="fas fa-${icon}"></i> ${title}</h3>
+                        <div class="close-btn" onclick="closePage('${id}')">
+                            <i class="fas fa-times"></i>
+                        </div>
+                    </div>
+                    <div class="page-body" id="${id}-page-body">
+                        <div class="chart-container" id="${id}-charts"></div>
+                        <div class="table-container" id="${id}-tables"></div>
+                    </div>
+                </div>
+            `;
+
+            return page;
+        }
+
+        // 创建瓶颈分析页面
+        function createBottleneckPage() {
+            const page = document.createElement('div');
+            page.className = 'secondary-page';
+            page.id = 'bottleneck-page';
+
+            page.innerHTML = `
+                <div class="page-content">
+                    <div class="page-header">
+                        <h3><i class="fas fa-exclamation-triangle"></i> 瓶颈详细分析</h3>
+                        <div class="close-btn" onclick="closePage('bottleneck')">
+                            <i class="fas fa-times"></i>
+                        </div>
+                    </div>
+                    <div class="page-body" id="bottleneck-page-body">
+                        <div class="bottleneck-container" id="bottleneck-details"></div>
+                        <div class="chart-container">
+                            <div class="chart-box" id="bottleneck-chart1"></div>
+                            <div class="chart-box" id="bottleneck-chart2"></div>
+                        </div>
+                    </div>
+                </div>
+            `;
+
+            return page;
+        }
+
+        // 渲染二级页面内容
+        function renderSecondaryContent() {
+            // 人员页面
+            renderPageContent('personnel');
+
+            // 设备页面
+            renderPageContent('equipment');
+
+            // 进度页面
+            renderPageContent('progress');
+
+            // 瓶颈页面
+            renderBottleneckContent();
+        }
+
+        function renderPageContent(pageId) {
+            const chartsContainer = document.getElementById(`${pageId}-charts`);
+            const tablesContainer = document.getElementById(`${pageId}-tables`);
+
+            if (!chartsContainer || !tablesContainer) return;
+
+            chartsContainer.innerHTML = '';
+            tablesContainer.innerHTML = '';
+
+            const pageDataItems = pageData[`${pageId}Page`];
+
+            if (pageDataItems && pageDataItems.length > 0) {
+                pageDataItems.forEach(item => {
+                    if (item.type === 'chart') {
+                        const chartBox = document.createElement('div');
+                        chartBox.className = 'chart-box';
+                        chartBox.id = `${pageId}-${item.type}-${Date.now()}`;
+                        chartsContainer.appendChild(chartBox);
+
+                        const content = JSON.parse(item.content);
+                        renderChart(chartBox.id, content.title, content.data);
+                    }
+                    else if (item.type === 'table') {
+                        const content = JSON.parse(item.content);
+                        renderTable(tablesContainer, content.headers, content.rows);
+                    }
+                });
+            }
+        }
+
+        function renderBottleneckContent() {
+            const bottleneckDetails = document.getElementById('bottleneck-details');
+            if (!bottleneckDetails) return;
+
+            bottleneckDetails.innerHTML = '';
+
+            pageData.bottlenecks.forEach(bottleneck => {
+                const impactClass = bottleneck.impact === '高影响' ? 'badge-red' :
+                                  bottleneck.impact === '中影响' ? 'badge-orange' : 'badge-green';
+
+                const bottleneckCard = document.createElement('div');
+                bottleneckCard.className = 'bottleneck-card';
+
+                bottleneckCard.innerHTML = `
+                    <div class="bottleneck-title">
+                        <span><i class="fas fa-exclamation-triangle"></i> ${bottleneck.title}</span>
+                    </div>
+                    <div class="bottleneck-desc">
+                        ${bottleneck.description}
+                    </div>
+                    <div class="kpi-trend">
+                        <span class="stat-badge ${impactClass}">${bottleneck.impact}</span> ${bottleneck.delay}
+                    </div>
+                    <div class="progress-container" style="margin-top: 15px;">
+                        <div class="progress-label">
+                            <span>影响程度</span>
+                            <span>${bottleneck.impact === '高影响' ? '85%' : bottleneck.impact === '中影响' ? '60%' : '30%'}</span>
+                        </div>
+                        <div class="progress-bar">
+                            <div class="progress-fill" style="width: ${bottleneck.impact === '高影响' ? '85%' : bottleneck.impact === '中影响' ? '60%' : '30%'}; background: ${impactClass === 'badge-red' ? 'var(--danger)' : impactClass === 'badge-orange' ? 'var(--warning)' : 'var(--accent)'}"></div>
+                        </div>
+                    </div>
+                `;
+
+                bottleneckDetails.appendChild(bottleneckCard);
+            });
+
+            // 渲染瓶颈图表
+            renderChart('bottleneck-chart1', '瓶颈影响程度', [85, 60, 75]);
+            renderChart('bottleneck-chart2', '解决优先级', [90, 70, 85]);
+        }
+
+        // 渲染图表
+        function renderChart(containerId, title, data) {
+            const chartDom = document.getElementById(containerId);
+            if (!chartDom) return;
+
+            const chart = echarts.init(chartDom);
+            const option = {
+                title: {
+                    text: title,
+                    left: 'center',
+                    textStyle: {
+                        fontSize: 16,
+                        fontWeight: 'bold'
+                    }
+                },
+                tooltip: {
+                    trigger: 'axis'
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '3%',
+                    containLabel: true
+                },
+                xAxis: {
+                    type: 'category',
+                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'].slice(0, data.length)
+                },
+                yAxis: {
+                    type: 'value',
+                    name: '百分比 (%)',
+                    min: 0,
+                    max: 100
+                },
+                series: [
                     {
-                        value: [85, 80, 90, 95, 85, 88],
-                        name: '目标效能',
-                        areaStyle: { color: 'rgba(76, 175, 80, 0.3)' },
-                        lineStyle: { color: '#4caf50', type: 'dashed', width: 2 },
-                        symbol: 'circle',
-                        symbolSize: 8
+                        name: title,
+                        type: 'line',
+                        data: data,
+                        smooth: true,
+                        lineStyle: {
+                            width: 3,
+                            color: '#1a3a5f'
+                        },
+                        itemStyle: {
+                            color: '#2c5c8c'
+                        },
+                        areaStyle: {
+                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                                { offset: 0, color: 'rgba(26, 58, 95, 0.5)' },
+                                { offset: 1, color: 'rgba(26, 58, 95, 0.1)' }
+                            ])
+                        }
                     }
                 ]
-            }]
-        };
-        radarChart.setOption(radarOption);
-        
-        // 初始化饼图 - 瓶颈分布
-        const pieChart = echarts.init(document.getElementById('bottleneckChart'));
-        const pieOption = {
-            tooltip: { trigger: 'item' },
-            legend: { bottom: 10, left: 'center' },
-            series: [
-                {
-                    name: '瓶颈分布',
-                    type: 'pie',
-                    radius: ['40%', '70%'],
-                    avoidLabelOverlap: false,
-                    itemStyle: {
-                        borderRadius: 10,
-                        borderColor: '#fff',
-                        borderWidth: 2
-                    },
-                    label: { show: false },
-                    emphasis: {
-                        label: { show: true, fontSize: '16', fontWeight: 'bold' }
-                    },
-                    data: [
-                        { value: 38, name: '设备瓶颈', itemStyle: { color: '#f44336' } },
-                        { value: 25, name: '人员瓶颈', itemStyle: { color: '#ff9800' } },
-                        { value: 20, name: '物料瓶颈', itemStyle: { color: '#2196f3' } },
-                        { value: 12, name: '工艺瓶颈', itemStyle: { color: '#9c27b0' } },
-                        { value: 5, name: '其他瓶颈', itemStyle: { color: '#607d8b' } }
-                    ]
-                }
-            ]
-        };
-        pieChart.setOption(pieOption);
-        
-        // 初始化人员效能图表
-        const personnelChart = echarts.init(document.getElementById('personnel-chart'));
-        const personnelOption = {
-            tooltip: { trigger: 'axis' },
-            legend: { data: ['人员利用率', '出勤率'], bottom: 10 },
-            grid: { left: '3%', right: '4%', bottom: '15%', top: '5%', containLabel: true },
-            xAxis: {
-                type: 'category',
-                data: ['10月15日', '10月22日', '10月29日', '11月5日', '11月12日']
-            },
-            yAxis: { type: 'value', max: 100, axisLabel: { formatter: '{value}%' } },
-            series: [
-                {
-                    name: '人员利用率',
-                    type: 'line',
-                    data: [70.3, 72.5, 74.8, 76.2, 78.3],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#2c5c8c' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                },
-                {
-                    name: '出勤率',
-                    type: 'line',
-                    data: [92.5, 93.1, 94.2, 94.8, 95.2],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#4caf50' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                }
-            ]
-        };
-        
-        // 设备分析图表
-        const equipmentChart = echarts.init(document.getElementById('equipment-chart'));
-        const equipmentOption = {
-            tooltip: { trigger: 'axis' },
-            legend: { data: ['设备使用率', '故障率'], bottom: 10 },
-            grid: { left: '3%', right: '4%', bottom: '15%', top: '5%', containLabel: true },
-            xAxis: {
-                type: 'category',
-                data: ['10月15日', '10月22日', '10月29日', '11月5日', '11月12日']
-            },
-            yAxis: { type: 'value', max: 100, axisLabel: { formatter: '{value}%' } },
-            series: [
-                {
-                    name: '设备使用率',
-                    type: 'line',
-                    data: [68.2, 67.5, 66.8, 65.3, 64.8],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#2c5c8c' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                },
-                {
-                    name: '故障率',
-                    type: 'line',
-                    data: [2.8, 3.2, 3.5, 3.6, 3.7],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#f44336' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                }
-            ]
-        };
-        
-        // 进度分析图表
-        const progressChart = echarts.init(document.getElementById('progress-chart'));
-        const progressOption = {
-            tooltip: { trigger: 'axis' },
-            legend: { data: ['实际进度', '计划进度'], bottom: 10 },
-            grid: { left: '3%', right: '4%', bottom: '15%', top: '5%', containLabel: true },
-            xAxis: {
-                type: 'category',
-                data: ['10月15日', '10月22日', '10月29日', '11月5日', '11月12日']
-            },
-            yAxis: { type: 'value', max: 100, axisLabel: { formatter: '{value}%' } },
-            series: [
-                {
-                    name: '实际进度',
-                    type: 'line',
-                    data: [58.2, 60.5, 64.8, 68.3, 72.5],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#2c5c8c' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                },
-                {
-                    name: '计划进度',
-                    type: 'line',
-                    data: [60.0, 62.5, 65.8, 69.0, 72.0],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#4caf50', type: 'dashed' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                }
-            ]
-        };
-        
-        // 安全分析图表
-        const safetyChart = echarts.init(document.getElementById('safety-chart'));
-        const safetyOption = {
-            tooltip: { trigger: 'axis' },
-            legend: { data: ['安全合规率'], bottom: 10 },
-            grid: { left: '3%', right: '4%', bottom: '15%', top: '5%', containLabel: true },
-            xAxis: {
-                type: 'category',
-                data: ['10月15日', '10月22日', '10月29日', '11月5日', '11月12日']
-            },
-            yAxis: { type: 'value', max: 100, axisLabel: { formatter: '{value}%' } },
-            series: [
-                {
-                    name: '安全合规率',
-                    type: 'line',
-                    data: [88.5, 90.2, 91.7, 92.8, 94.6],
-                    smooth: true,
-                    lineStyle: { width: 3, color: '#4caf50' },
-                    symbol: 'circle',
-                    symbolSize: 8
-                }
-            ]
-        };
-        
-        // 设置所有图表
-        personnelChart.setOption(personnelOption);
-        equipmentChart.setOption(equipmentOption);
-        progressChart.setOption(progressOption);
-        safetyChart.setOption(safetyOption);
-        
-        // 响应窗口大小变化
-        window.addEventListener('resize', function() {
-            radarChart.resize();
-            pieChart.resize();
-            personnelChart.resize();
-            equipmentChart.resize();
-            progressChart.resize();
-            safetyChart.resize();
-        });
-        
-        // 二级页面控制函数
+            };
+
+            chart.setOption(option);
+
+            // 响应窗口大小变化
+            window.addEventListener('resize', function() {
+                chart.resize();
+            });
+        }
+
+        // 渲染表格
+        function renderTable(container, headers, rows) {
+            const table = document.createElement('table');
+            table.className = 'data-table';
+
+            // 创建表头
+            const thead = document.createElement('thead');
+            const headerRow = document.createElement('tr');
+
+            headers.forEach(header => {
+                const th = document.createElement('th');
+                th.textContent = header;
+                headerRow.appendChild(th);
+            });
+
+            thead.appendChild(headerRow);
+            table.appendChild(thead);
+
+            // 创建表体
+            const tbody = document.createElement('tbody');
+
+            rows.forEach(rowData => {
+                const row = document.createElement('tr');
+
+                rowData.forEach(cellData => {
+                    const td = document.createElement('td');
+                    td.textContent = cellData;
+                    row.appendChild(td);
+                });
+
+                tbody.appendChild(row);
+            });
+
+            table.appendChild(tbody);
+            container.appendChild(table);
+        }
+
+        // 页面控制函数
         function openPage(pageId) {
             document.getElementById(pageId + '-page').classList.add('active');
             document.body.style.overflow = 'hidden';
         }
-        
+
         function closePage(pageId) {
             document.getElementById(pageId + '-page').classList.remove('active');
             document.body.style.overflow = 'auto';
         }
-        
-        // 点击页面外部关闭弹窗
-        document.querySelectorAll('.secondary-page').forEach(page => {
-            page.addEventListener('click', function(e) {
-                if (e.target === this) {
-                    this.classList.remove('active');
-                    document.body.style.overflow = 'auto';
-                }
+
+        // 初始化页面
+        function initPage() {
+            renderMainPage();
+            renderSecondaryPages();
+            renderSecondaryContent();
+
+            // 添加点击页面外部关闭弹窗功能
+            document.querySelectorAll('.secondary-page').forEach(page => {
+                page.addEventListener('click', function(e) {
+                    if (e.target === this) {
+                        const pageId = this.id.replace('-page', '');
+                        closePage(pageId);
+                    }
+                });
             });
-        });
+        }
+
+        // 页面加载完成后初始化
+        // window.onload = initPage;
     </script>
 </body>
-</html>
\ No newline at end of file
+</html>