Kaynağa Gözat

perf(monthlyAssessSum): 优化月度考核汇总页面渲染与数据处理逻辑

1.  更新表格列字段与标题,匹配后端接口返回字段
2.  调整饼图半径为50%优化展示效果
3.  优化图表标题,增加动态业务标题展示
4.  调整空行格式统一代码风格
5.  重构数据过滤逻辑,先执行Promise.all再过滤无效数据
6.  移除冗余注释,新增调试日志便于排查问题
huoyi 4 hafta önce
ebeveyn
işleme
c228ec0b8d

+ 27 - 26
src/views/performanceManage/monthlyAssessSum/index.vue

@@ -147,27 +147,26 @@
147
           <!-- 左边表格 -->
147
           <!-- 左边表格 -->
148
           <div class="table-section">
148
           <div class="table-section">
149
             <el-table :data="item.tableData" border style="width: 100%;">
149
             <el-table :data="item.tableData" border style="width: 100%;">
150
-              <el-table-column prop="brigade" label="大队" align="center" min-width="100" />
151
-              <el-table-column prop="assessmentGroup" label="考核组" align="center" min-width="100" />
152
-              <el-table-column prop="groupCount" label="考核组人数" align="center" min-width="120" />
153
-              <el-table-column prop="calculatedImprovement" label="测算待改进人数" align="center" min-width="140" />
154
-              <el-table-column prop="improvementCount" label="待改进人数" align="center" min-width="120" />
155
-              <el-table-column prop="exemption1" label="豁免" align="center" min-width="80" />
156
-              <el-table-column prop="actualImprovement" label="实际待改进人数" align="center" min-width="140" />
157
-              <el-table-column prop="unqualifiedCount" label="不称职人数" align="center" min-width="120" />
158
-              <el-table-column prop="exemption2" label="豁免" align="center" min-width="80" />
159
-              <el-table-column prop="actualUnqualified" label="实际不称职人数" align="center" min-width="140" />
150
+              <el-table-column prop="assessmentTeam" label="考核组" align="center" min-width="100" />
151
+              <el-table-column prop="assessmentTeamCount" label="考核组人数" align="center" min-width="120" />
152
+              <el-table-column prop="estimatedImprovementCount" label="测算待改进人数" align="center" min-width="140" />
153
+              <el-table-column prop="improvementTotalCount" label="待改进人数" align="center" min-width="120" />
154
+              <el-table-column prop="improvementExemptedCount" label="豁免" align="center" min-width="80" />
155
+              <el-table-column prop="actualImprovementCount" label="实际待改进人数" align="center" min-width="140" />
156
+              <el-table-column prop="incompetentTotalCount" label="不称职人数" align="center" min-width="120" />
157
+              <el-table-column prop="incompetentExemptedCount" label="豁免" align="center" min-width="80" />
158
+              <el-table-column prop="actualIncompetentCount" label="实际不称职人数" align="center" min-width="140" />
160
             </el-table>
159
             </el-table>
161
           </div>
160
           </div>
162
 
161
 
163
           <!-- 右边柱状图和饼状图 -->
162
           <!-- 右边柱状图和饼状图 -->
164
           <div class="chart-section">
163
           <div class="chart-section">
165
             <div class="bar-chart-container">
164
             <div class="bar-chart-container">
166
-              <div class="chart-title">考核分数分布</div>
165
+              <div class="chart-title">{{ item.title }}考核人数与待改进情况</div>
167
               <div :ref="el => setTraversalChartRef(el, `barChart_${index}`)" class="bar-chart"></div>
166
               <div :ref="el => setTraversalChartRef(el, `barChart_${index}`)" class="bar-chart"></div>
168
             </div>
167
             </div>
169
             <div class="pie-chart-container">
168
             <div class="pie-chart-container">
170
-              <div class="pie-chart-title">岗位分布</div>
169
+              <div class="pie-chart-title">{{ item.title }}考核人数占比</div>
171
               <div :ref="el => setTraversalChartRef(el, `pieChart3_${index}`)" class="pie-chart"></div>
170
               <div :ref="el => setTraversalChartRef(el, `pieChart3_${index}`)" class="pie-chart"></div>
172
             </div>
171
             </div>
173
           </div>
172
           </div>
@@ -314,7 +313,7 @@ const initCharts = () => {
314
         tooltip: { trigger: 'item' },
313
         tooltip: { trigger: 'item' },
315
         series: [{
314
         series: [{
316
           type: 'pie',
315
           type: 'pie',
317
-          radius: '70%',
316
+          radius: '50%',
318
           data: [
317
           data: [
319
             { value: 120, name: '一队' },
318
             { value: 120, name: '一队' },
320
             { value: 150, name: '二队' },
319
             { value: 150, name: '二队' },
@@ -331,7 +330,7 @@ const initCharts = () => {
331
         tooltip: { trigger: 'item' },
330
         tooltip: { trigger: 'item' },
332
         series: [{
331
         series: [{
333
           type: 'pie',
332
           type: 'pie',
334
-          radius: '70%',
333
+          radius: '50%',
335
           data: [
334
           data: [
336
             { value: 45, name: '优秀' },
335
             { value: 45, name: '优秀' },
337
             { value: 280, name: '合格' },
336
             { value: 280, name: '合格' },
@@ -348,7 +347,7 @@ const initCharts = () => {
348
         tooltip: { trigger: 'item' },
347
         tooltip: { trigger: 'item' },
349
         series: [{
348
         series: [{
350
           type: 'pie',
349
           type: 'pie',
351
-          radius: '70%',
350
+          radius: '50%',
352
           data: [
351
           data: [
353
             { value: 150, name: '安检员' },
352
             { value: 150, name: '安检员' },
354
             { value: 120, name: '设备操作员' },
353
             { value: 120, name: '设备操作员' },
@@ -366,7 +365,7 @@ const initCharts = () => {
366
         tooltip: { trigger: 'item' },
365
         tooltip: { trigger: 'item' },
367
         series: [{
366
         series: [{
368
           type: 'pie',
367
           type: 'pie',
369
-          radius: '70%',
368
+          radius: '50%',
370
           data: [
369
           data: [
371
             { value: 35, name: '优秀' },
370
             { value: 35, name: '优秀' },
372
             { value: 320, name: '合格' },
371
             { value: 320, name: '合格' },
@@ -491,11 +490,11 @@ const getList = async () => {
491
       }
490
       }
492
       return formatted
491
       return formatted
493
     }
492
     }
494
-    
493
+
495
     // 获取大队列表
494
     // 获取大队列表
496
     const brigadeListRes = await listDept()
495
     const brigadeListRes = await listDept()
497
     const brigadeList = (brigadeListRes.data || []).filter(item => item.deptType === 'BRIGADE' && item.isFunctionalDept == 0)
496
     const brigadeList = (brigadeListRes.data || []).filter(item => item.deptType === 'BRIGADE' && item.isFunctionalDept == 0)
498
-    
497
+
499
     // 其他接口调用
498
     // 其他接口调用
500
     const formattedQueryParams = formatParams(queryParams)
499
     const formattedQueryParams = formatParams(queryParams)
501
     const results = await Promise.allSettled([
500
     const results = await Promise.allSettled([
@@ -522,23 +521,23 @@ const getList = async () => {
522
         getBrigadeImprovementDistribution(brigadeParams),
521
         getBrigadeImprovementDistribution(brigadeParams),
523
         getBrigadeIncompetentDistribution(brigadeParams)
522
         getBrigadeIncompetentDistribution(brigadeParams)
524
       ])
523
       ])
525
-      
524
+
526
       const [deptTeamStatRes, brigadeImproveRes, brigadeIncompRes] = brigadeResults
525
       const [deptTeamStatRes, brigadeImproveRes, brigadeIncompRes] = brigadeResults
527
-      
526
+
528
       const statisticsData = deptTeamStatRes.status === 'fulfilled' ? (deptTeamStatRes.value.data || []) : []
527
       const statisticsData = deptTeamStatRes.status === 'fulfilled' ? (deptTeamStatRes.value.data || []) : []
529
       const brigadeImproveData = brigadeImproveRes.status === 'fulfilled' ? (brigadeImproveRes.value.data || []) : []
528
       const brigadeImproveData = brigadeImproveRes.status === 'fulfilled' ? (brigadeImproveRes.value.data || []) : []
530
       const brigadeIncompData = brigadeIncompRes.status === 'fulfilled' ? (brigadeIncompRes.value.data || []) : []
529
       const brigadeIncompData = brigadeIncompRes.status === 'fulfilled' ? (brigadeIncompRes.value.data || []) : []
531
-      
530
+
532
       // 解析表格数据
531
       // 解析表格数据
533
       let tableData = []
532
       let tableData = []
534
       if (statisticsData.length > 0 && statisticsData[0].assessmentTeams) {
533
       if (statisticsData.length > 0 && statisticsData[0].assessmentTeams) {
535
         tableData = statisticsData[0].assessmentTeams
534
         tableData = statisticsData[0].assessmentTeams
536
       }
535
       }
537
-      
536
+
538
       // 计算总计用于标题
537
       // 计算总计用于标题
539
       const totalImprovement = tableData.reduce((sum, item) => sum + (item.actualImprovementCount || 0), 0)
538
       const totalImprovement = tableData.reduce((sum, item) => sum + (item.actualImprovementCount || 0), 0)
540
       const totalIncompetent = tableData.reduce((sum, item) => sum + (item.actualIncompetentCount || 0), 0)
539
       const totalIncompetent = tableData.reduce((sum, item) => sum + (item.actualIncompetentCount || 0), 0)
541
-      
540
+
542
       return {
541
       return {
543
         title: brigade.deptName,
542
         title: brigade.deptName,
544
         deptId: brigade.deptId,
543
         deptId: brigade.deptId,
@@ -550,8 +549,10 @@ const getList = async () => {
550
       }
549
       }
551
     })
550
     })
552
 
551
 
553
-    traversalData1.value = await Promise.all(brigadeDataPromises.filter(item => item.tableData?.length > 0 || item.improveData?.length > 0 || item.incompData?.length > 0))
554
-
552
+    traversalData1.value = await Promise.all(brigadeDataPromises)
553
+    traversalData1.value = traversalData1.value.filter(item => item.tableData?.length > 0 || item.improveData?.length > 0 || item.incompData?.length > 0)
554
+    console.log(traversalData1.value)
555
+    // debugger
555
     if (scoreDistRes.status === 'fulfilled' && scoreDistRes.value.data) {
556
     if (scoreDistRes.status === 'fulfilled' && scoreDistRes.value.data) {
556
       const data = scoreDistRes.value.data
557
       const data = scoreDistRes.value.data
557
       if (overallBarChartInstance && Array.isArray(data)) {
558
       if (overallBarChartInstance && Array.isArray(data)) {
@@ -704,7 +705,7 @@ const getList = async () => {
704
           pieData: deptPieData.map(p => ({ name: p.assessmentTeam, value: p.count }))
705
           pieData: deptPieData.map(p => ({ name: p.assessmentTeam, value: p.count }))
705
         }
706
         }
706
       })
707
       })
707
-
708
+    
708
       nextTick(() => {
709
       nextTick(() => {
709
         traversalData2.value.forEach((item, index) => {
710
         traversalData2.value.forEach((item, index) => {
710
           const chartKey = `barChart_${index}`
711
           const chartKey = `barChart_${index}`