统计报表 表格表头显示调整

src/views/statisticalReport/index.vue

@@ -83,14 +83,23 @@
                                     <el-table-column prop='hours' label="预计拍照" width="100px" align="center">
                                         <template slot-scope="scope">
                                             <span>{{ scope.row.hours.length * 2 }}</span>
+                                            <!-- <el-tooltip placement="top">
+                                                <div slot="content">{{scope.row.hours.length}}</div>
+                                                <span>{{ scope.row.hours.length * 2 }}</span>
+                                            </el-tooltip> -->
                                         </template>
                                     </el-table-column>
-                                    <el-table-column prop='total' label="拍照总数" width="100px"
+                                    <el-table-column prop='total' label="拍照总数" width="100px" align="center"></el-table-column>
-                                        align="center"></el-table-column>
+                                    <el-table-column prop='presets' label="多出数量" width="100px" align="center">
-                                    <el-table-column prop='presets' label="多出图片" :formatter="handlePresetsMany"
+                                        <template #default="{ row }">
-                                        min-width="35%"></el-table-column>
+                                            <el-tooltip placement="top" popper-class="eltooltip">
-                                    <el-table-column prop='presets' label="缺少图片" :formatter="handlePresetsFew"
+                                                <div slot="content">{{handlePresetsMany(row).txt}}</div>
-                                        min-width="65%"></el-table-column>
+                                                <span>{{handlePresetsMany(row).number}}</span>
+                                            </el-tooltip>
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column prop='' label='缺少数量' width="100px" :formatter="countLackPicture" align="center"></el-table-column>
+                                    <el-table-column prop='presets' label="缺少图片详细时间点" :formatter="handlePresetsFew" min-width="65%"></el-table-column>
 
                                 </el-table>
                             </template>
@@ -196,31 +205,30 @@ export default {
     },
     methods: {
         //照片多的处理
-        handlePresetsMany(row, column, cellValue) {
+        handlePresetsMany(row) {
+            let result = {txt: "" , number: 0};
             if (row.wrongCount == 0) {
-                return "无";
+                return result;
             } else {
-                var txt = "";
                 row.hours.forEach(data => {
                     if (data.base < data.timeList.length) {
                         let hour = parseInt(data.hour.substring(11, 13));
-                        txt += hour + "点" + data.wrongDetail + "张 , ";
+                        result.txt += hour + "点" + data.wrongDetail + "张 , ";
-                        return;
+                        result.number += data.timeList.length - data.base;
                     }
                 });
-                if ("" == txt) {
-                    return "无";
-                } else {
-                    return txt;
-                }
             }
+            if (result.txt=="") {
+                result.txt = "无";
+            }
+            return result;
         },
         //照片少的处理
         handlePresetsFew(row, column, cellValue) {
             if (row.wrongCount == 0) {
                 return "无";
             } else {
-                var txt = "";
+                let txt = "";
                 row.hours.forEach(data => {
                     if (data.base > data.timeList.length) {
                         let hour = data.hour.substring(11, 13);
@@ -237,12 +245,11 @@ export default {
                             }
                         });
                         if (xi == 0) {
-                            txt += hour + ":00点少1张 , ";
+                            txt += hour + ":00 , ";
                         }
                         if (da == 0) {
-                            txt += hour + ":30点少1张 , ";
+                            txt += hour + ":30 , ";
                         }
-                        return;
                     }
                 });
                 if ("" == txt) {
@@ -252,6 +259,20 @@ export default {
                 }
             }
         },
+        //计数缺少图片数量
+        countLackPicture(row, column, cellValue){
+            let number = 0;
+            if (row.wrongCount == 0) {
+                return number;
+            } else {
+                row.hours.forEach(data => {
+                    if (data.base > data.timeList.length) {
+                        number += data.base - data.timeList.length;
+                    }
+                });
+            }
+            return number;
+        },
         setDefaultImage(e) {
             e.target.src = defaultImage;
         },
@@ -390,6 +411,7 @@ export default {
                     a.presetList = presetList;
                 });
                 this.picList = dataList;
+                console.log(dataList);
                 this.loading = false;
                 // console.log(res.data);
             }).catch((err) => {
@@ -605,5 +627,10 @@ export default {
             }
         }
     }
+
+   
 }
+.eltooltip{
+        max-width:50%;
+    }
 </style>