修改

src/views/sale/components/transportFreight/saleTruckSettlement/bmsTruckDetailsOrderNew.vue

@@ -67,7 +67,7 @@
             style="width:150px"
           >
           </el-date-picker>
-          <el-button type="primary" class="btn" @click="onclick">
+          <el-button type="primary" class="btn" @click="getSteelReport">
             <i class="el-icon-search"></i>
           </el-button>
         </el-form-item>
@@ -359,17 +359,10 @@
               border
               style="width: 100%; margin-top: 20px"
               :height="maxHeight"
-              :row-class-name="tableRowClassName"
-              @cell-click="cellClik"
-              @cell-mouse-enter="cellMouse1"
-              @cell-mouse-leave="cellLeave1"
-              @row-click="rowClick"
               :cell-style="cellStyle"
               @filter-change="filterChange"
-              :key="saleSteelKey"
               id="salesLogisticsStat_saleSteelReports_table"
               individual-panel
-              @resetTable="reset"
             >
             <el-table-column type="selection" width="30" label="选择"></el-table-column>
             <el-table-column

src/views/sale/components/transportFreight/saleTruckSettlement/bmsTruckStatementNew.vue

@@ -0,0 +1,421 @@
+// 新计费账单
+<template>
+  <div class="steel_inbound" style="width:100%">
+    <div class="sache">
+      <el-input placeholder="请输入收货客户" v-model="input" clearable> </el-input>
+      <el-date-picker
+            v-model="startTime"
+            type="date"
+            placeholder="选择日期"
+            style="width:150px"
+          >
+          </el-date-picker>
+          <span>至</span>
+          <el-date-picker
+            v-model="endTime"
+            type="date"
+            placeholder="选择日期"
+            style="width:150px"
+          >
+      </el-date-picker>
+      <el-button type="primary" class="btn" @click="onclick">
+        <i class="el-icon-search"></i>查询
+      </el-button>
+    </div>
+    <div class="table">
+      <dilTable v-bind.sync="options">
+        <el-table-column fixed="right" label="操作" width="180">
+          <template slot-scope="scope">
+            <el-button
+              type="text"
+              size="small"
+              @click="showPhoto(scope.row)"
+            >
+              查看发票
+            </el-button>
+            <el-button
+              type="text"
+              size="small"
+              @click="showDetails(scope.row)"
+            >
+              查看详单
+            </el-button>
+            <el-button
+              type="text"
+              size="small"
+              @click="deleteStatement(scope.row)"
+            >
+              删除账单
+            </el-button>
+          </template>
+        </el-table-column>
+      </dilTable>
+    </div>
+    <!-- 发票图片 -->
+    <el-dialog
+      title="发票图片"
+      :visible.sync="isShowPhoto"
+    >
+      <div  v-for="(item, i) in photoList" :key="i">
+          <el-image :src="item" fit="fill" :preview-src-list="photoList" style="width:300px;height:300px">
+            <div slot="error" class="image-slot">
+              <span>图片加载失败</span>
+            </div>
+          </el-image>
+      </div>
+    </el-dialog>
+    <!-- 查询账单底下的计费详单-->
+    <el-dialog
+      title="详单信息"
+      :visible.sync="isShowDetails"
+      style="height:600px;width:100%"
+      >
+       <div class="table1">
+            <el-table
+              :data="visibleList1"
+              :span-method="objectSpanMethod1"
+              ref="tableRef1"
+              border
+              style="width: 100%; margin-top: 20px"
+              :height="350"
+              id="salesLogisticsStat_saleSteelReports_table"
+              individual-panel
+            >
+            <el-table-column
+                width="50"
+                label="序号"
+                align="center"
+                :resizable="false"
+                fixed="left"
+              >
+                <template slot-scope="scope">{{
+                  scope.row.group + 1
+                }}</template>
+              </el-table-column>
+              <el-table-column
+                prop="orderTime"
+                label="订单日期"
+                width="110px"
+                align="center"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="saleMakeDate"
+                label="制单时间"
+                width="110px"
+                align="center"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="capacityNo"
+                column-key="capacityNo"
+                label="车牌号"
+                align="center"
+                width="90px"
+                sortable
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="addressPlace"
+                label="收货地址"
+                width="250px"
+                sortable
+                column-key="addressPlace"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="actualAddress"
+                label="实际收货地址"
+                width="250px"
+                sortable
+                column-key="actualAddress"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="priceValue"
+                label="最终运价"
+                width="100px"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="detailsAmount"
+                label="最终运费"
+                width="100px"
+              ></el-table-column>
+              <el-table-column
+                prop="netWeight"
+                label="净重"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="materialWeight"
+                label="理重"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="materialName"
+                column-key="materialNameList"
+                label="物资名称"
+                align="center"
+                width="150px"
+                sortable
+              >
+              </el-table-column>
+              <el-table-column
+                prop="materialSpe"
+                label="物资规格"
+                column-key="materialSpe"
+                align="center"
+                sortable
+                width="120px"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="materialPlanNumber"
+                label="计划件数"
+                align="center"
+                width="50px"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="materialNum"
+                label="装车件数"
+                align="center"
+                width="50px"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="saleRemark"
+                column-key="saleRemark"
+                label="摘要"
+                width="150px"
+                align="center"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="actualCity"
+                label="卸货城市"
+                width="120px"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="areaName"
+                label="分区"
+                width="150px"
+                align="center"
+                column-key="saleAreaList"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="unloadType"
+                label="卸货类别"
+                width="60px"
+              >
+              </el-table-column>
+              <el-table-column
+                prop="paymentCustomer"
+                label="付款单位"
+                width="120px"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="consingneeSettlementMethod"
+                label="结算方式"
+                width="120px"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+              <el-table-column
+                prop="saleOrderReceiveCustomer"
+                label="收款单位"
+                width="120px"
+                show-overflow-tooltip
+              >
+              </el-table-column>
+            </el-table>
+          </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getCookie } from '@/utils/util.js'
+import { sjTime } from '@/utils/sharedJsFile'
+export default {
+  data(){
+    return{
+      input:"",
+      userId:null,
+      photoList:[],
+      isShowPhoto:false,
+      isShowDetails:false,
+      startTime:null,
+      endTime:null,
+      spanArr1:[],
+      visibleList1:[],
+      options:{
+        requestUrl:""
+      },
+      orgCodeList: [
+        'wuliuyunshubu',
+        'dagangadmin',
+        'shichangxinxibu',
+        'zidonghuabu'
+      ],
+      mergeList1: [
+        '选择',
+        '序号',
+        '整车操作',
+        '销售订单状态',
+        '销售订单号',
+        '发货单位',
+        '司机电话',
+        '运输订单号',
+        '签收地址',
+        '签收时间',
+        '抵达地址',
+        '抵达时间',
+        '出厂时间',
+        '进厂时间',
+        '运单状态',
+        '车牌号',
+        '承运商',
+        '客户',
+        '收货地址',
+        '实际收货地址',
+        '业务员',
+        '送货单打印',
+        '收货客户电话',
+        '是否自提',
+        '订单日期',
+        '短信发送',
+        '销售片区',
+        '抵达时间',
+        '签收时间',
+        '最终运价',
+        '摘要'
+      ],
+    }
+  },
+  created(){
+    if (!this.orgCodeList.includes(getCookie('orgCode'))) {
+      this.userId=getCookie("userId");
+    }
+    this.startTime=new Date();
+    this.endTime=new Date();
+    this.startTime.setDate(1);
+    this.onclick();
+  },
+  methods:{
+    onclick(){
+      if (this.startTime && this.endTime) {
+        let startTime = sjTime(this.startTime)
+        let endTime = sjTime(this.endTime)
+        this.options.requestUrl = "/api/v1/bms/getTruckStatementList?apiId=179&con="+this.input
+        +"&userId="+this.userId
+        +"&i="+new Date()
+        +"&startTime="+startTime
+        +"&endTime="+endTime
+      }else{
+         this.options.requestUrl = "/api/v1/bms/getTruckStatementList?apiId=179&con="+this.input
+        +"&userId="+this.userId
+        +"&i="+new Date()
+      }
+    },
+    showPhoto(row){
+      this.photoList=[];
+      this.isShowPhoto=true;
+      this.axios
+        .post('/api/v1/bms/getStatementPhoto?statementId=' + row.statementId)
+        .then(res => {
+          console.log('statementPhoto:', res)
+          if (res.data) {
+            this.photoList = res.data
+          }
+      })
+    },
+    showDetails(row){
+      this.isShowDetails=true;
+      this.visibleList1=[];
+      let map={
+        statementId:row.statementId
+      }
+      this.axios
+        .post('/api/v1/bms/findDetailsForStatement',map)
+        .then(res => {
+          console.log('findDetailsForStatement:', res)
+          this.visibleList1=res.data.data;
+          this.getSpanArr1(this.visibleList1);
+      })
+    },
+    deleteStatement(row){
+      this.$confirm('此操作将永久删除该账单, 是否继续?', '提示',{
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(()=>{
+         this.axios
+        .post('/api/v1/bms/deleteConvertedTruckStatement/' + row.statementId)
+        .then(res => {
+          this.$message.success(res.data.data);
+          this.onclick();
+        })
+      }).catch(()=>{
+
+      });
+      
+    },
+    getSpanArr1(data) {
+      //每次调用方法初始化
+      this.spanArr1 = []
+      for (var i = 0; i < data.length; i++) {
+        if (i === 0) {
+          this.spanArr1.push(1)
+          data[i].group = i
+          this.pos = 0
+        } else {
+          // 判断当前元素与上一个元素是否相同
+          if (data[i].saleOrderMaterialId === data[i - 1].saleOrderMaterialId) {
+            this.spanArr1[this.pos] += 1
+            data[i].group = data[i - 1].group
+            this.spanArr1.push(0)
+          } else {
+            this.spanArr1.push(1)
+            this.pos = i
+            data[i].group = data[i - 1].group + 1
+          }
+        }
+      }
+    },
+    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
+      if (this.mergeList1.indexOf(column.label) != -1) {
+        const _row = this.spanArr1[rowIndex]
+        const _col = _row > 0 ? 1 : 0
+        return {
+          rowspan: _row,
+          colspan: _col
+        }
+      }
+    },
+  }
+}
+</script>
+
+<style lang="scss" scode>
+.steel_inbound{
+  .sache{
+    padding: 1.25rem 0.375rem;
+			.el-input {
+			width: 20%;
+			margin-right: 1.25rem;
+			}
+  }
+}
+</style>

src/views/sale/router/index.js

@@ -107,6 +107,7 @@ import bmsTruckDetailsOrderNew from "../components/transportFreight/saleTruckSet
 import bmsTruckFormula from "../components/transportFreight/saleTruckSettlement/bmsTruckFormula.vue";
 import bmsTruckInvoice from "../components/transportFreight/saleTruckSettlement/bmsTruckInvoice.vue";
 import bmsTruckStatement from "../components/transportFreight/saleTruckSettlement/bmsTruckStatement.vue";
+import bmsTruckStatementNew from "../components/transportFreight/saleTruckSettlement/bmsTruckStatementNew.vue";
 import getBmsTruckStatementOrder from "../components/transportFreight/saleTruckSettlement/getBmsTruckStatementOrder.vue";
 import getTransportResult from "../components/transportFreight/saleTruckSettlement/getTransportResult.vue";
 import mapTest from "../components/offSiteTransportation/mapTest.vue";
@@ -724,6 +725,12 @@ const constantRouterMap = [
         meta: { code: "xtpzgl-yhgl" },
         component: bmsTruckStatement
       },
+      {
+        path: "bmsTruckStatementNew",
+        name: "bmsTruckStatementNew",
+        meta: { code: "xtpzgl-yhgl" },
+        component: bmsTruckStatementNew
+      },
       {
         path: "getBmsTruckStatementOrder/:statementId",
         name: "getBmsTruckStatementOrder",