update 订单详情 new收费明细

jsowell-ui/src/views/order/order/orderDetail.vue

@@ -117,6 +117,19 @@
       <div class="marginTop"></div>
     </el-card>
 
+    <el-card class="cardStyle">
+      <h3>收费明细new</h3>
+        <el-table :data="tableData" border show-summary :summary-method="getSummaries">
+          <el-table-column prop="periodType" label="时段类型" width="180" align="center"/>
+          <el-table-column prop="electricityPrice" label="电费单价(元/千瓦时)" align="center"/>
+          <el-table-column prop="servicePrice" label="服务费单价(元/千瓦时)" align="center"/>
+          <el-table-column prop="usedElectricity" label="用电量(千瓦时)" align="center"/>
+          <el-table-column prop="electricityAmount" label="电费金额(元)" align="center"/>
+          <el-table-column prop="serviceAmount" label="服务费金额(元)" align="center"/>
+        </el-table>
+      <div class="marginTop"></div>
+    </el-card>
+
     <el-card class="cardStyle">
       <h3>实时订单数据</h3>
       <el-table style="width: 100%" :data="orderRealTimeInfo" border>
@@ -225,12 +238,36 @@ export default {
         chargingAmount: null,
         chargingDegree: null,
       },
+      tableData: []
     };
   },
   created() {
     this.getOrderDetail();
   },
   methods: {
+    getSummaries(param) {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '总价';
+          return;
+        }
+        const values = data.map(item => Number(item[column.property]));
+        if (column.property === 'usedElectricity' ||column.property ==='electricityAmount' || column.property==='serviceAmount' ) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index];
+        }
+      });
+      return sums;
+    },
     clickManualSettlement() {
       this.dialogVisible = true;
     },
@@ -264,6 +301,7 @@ export default {
       console.log("this.pileIn", this.pileIn);
       this.orderRealTimeInfo = [data.orderRealTimeInfo];
       this.orderDetail = [data.billingDetails];
+      this.tableData = data.chargeDetails;
       this.lastMonitorData = data.lastMonitorData;
     },
   },