修改

src/views/statisticalReport/components/Ship_dynamic_table.vue

@@ -198,6 +198,12 @@ export default {
                 vertical: 'center',//竖直居中
                 wrapText: true,//自动换行
               },
+              border: { // 设置边框
+                  top: { style: 'thin' },
+                  bottom: { style: 'thin' },
+                  left: { style: 'thin' },
+                  right: { style: 'thin' }
+              }
             }
           }
        })

src/views/statisticalReport/components/tableItem.vue

@@ -55,6 +55,43 @@
             >{{ item.value }}</span
           >
         </div>
+        <el-divider></el-divider>
+        <div class="appendSlot">
+             <el-table
+          ref="loadTable"
+          highlight-current-row
+          border
+          show-summary
+          :data="loadTable"
+          :span-method="objectSpanMethod1"
+          :row-style="{height:'40px'}"
+          style="font-size: 18px">
+          <el-table-column
+          align="center"
+            prop="materialName"
+            width="200px"
+            label="物资名">
+          </el-table-column>
+          <el-table-column
+          align="center"
+            prop="resultForeignShipName"
+            width="200px"
+            label="船号">
+          </el-table-column>
+           <el-table-column
+          align="center"
+            prop="num"
+            width="200px"
+            label="装车量">
+          </el-table-column>
+           <el-table-column
+          align="center"
+            prop="time"
+            width="200px"
+            label="时间">
+          </el-table-column>
+        </el-table>
+        </div >
       </div>
     </el-table>
   </div>
@@ -105,13 +142,16 @@ export default {
       runStockString:null,
       stockStringArr: [],
       downStockStringArr: [],
-      runStockStringArr:[]
+      runStockStringArr:[],
+      spanArr:[],
+      loadTable:[]
     };
   },
   mounted() {
     this.getStockString();
     this.getDownStockString();
     this.getRunStockList();
+    this.searchLoadData();
   },
   methods: {
     getStockString() {
@@ -389,7 +429,62 @@ export default {
           colspan: 17
         };
       }
-    }
+    },
+    //查询装车数据
+    searchLoadData(){
+      let map={
+
+      };
+      this.axios.post('/api/v1/tms/getLoadData',map).then((res)=>{
+        if(res.data.code == "200"){
+          this.getSpanArr(res.data.data);
+          this.loadTable=res.data.data;
+          this.count=0;
+          this.loadTable.forEach((item)=>{
+            this.count+=item.num;
+          });
+        }else {
+          this.$message({
+              type: "error", 
+              message: res.data.data,
+          });
+        }
+      })
+    },
+    //处理数据,得到合并数组
+    getSpanArr(data) {
+        this.spanArr=[];
+        for (let i = 0; i < data.length; i++) {
+            if (i == 0) {
+                this.spanArr.push(1);
+                this.spanIndex = 0;
+            } else {
+                // 判断当前行与前一行内容是否相同
+                if (data[i].materialName == data[i - 1].materialName) {
+                    this.spanArr[this.spanIndex] += 1; // 相同的话，当前下标所代表的值加一，例如：第一列的前三行可合并
+                    this.spanArr.push(0);// 记录完毕后，再往数组里添加一个元素0，作为下一次合并的初始值
+                } else {
+                    this.spanArr.push(1); // 否则，依旧是一行
+                    this.spanIndex = i;
+                }
+            }
+        }
+    },
+    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
+        if (columnIndex === 0) {
+            const _row = this.spanArr[rowIndex]; // 行数
+            const _col = _row > 0 ? 1 : 0; // 列数
+            return {
+                rowspan: _row,
+                colspan: _col
+            };
+        }else if(rowIndex===0 && columnIndex === 3){
+           return {
+                rowspan: this.loadTable.length,
+                colspan: 1
+            };
+        }
+    },
   }
 };
 </script>
@@ -406,7 +501,7 @@ export default {
 <style lang="scss" scoped>
 .el-table {
   .appendSlot {
-    margin-left: 10%;
+    margin-left: 5%;
     font-size: 18px;
     line-height: 20px;
     .normalFirst {