手动结算订单支持自定义输入金额和充电度数

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

@@ -9,11 +9,18 @@
       <el-dialog
         title="提示"
         :visible.sync="dialogVisible"
-        width="30%"
+        width="35%"
         >
         <span>平台收到充电桩传来的最后一次实时监测数据<br/></span>
-        <span v-if="lastMonitorData != null">时间:{{lastMonitorData.dateTime}}, 消费金额:{{lastMonitorData.chargingAmount}}, 充电度数:{{lastMonitorData.chargingDegree}}</span>
-        <el-empty v-if="lastMonitorData == null" :image-size="50" description="未查询到实时监测数据"/>
+
+        <el-table style="width: 100%" :data="monitorDataList" border>
+          <el-table-column prop="dateTime" label="时间" align="center"/>
+          <el-table-column prop="chargingAmount" label="消费金额" align="center"/>
+          <el-table-column prop="chargingDegree" label="充电度数" align="center"/>
+        </el-table>
+
+        <el-divider>下面可以输入自定义消费金额和充电度数</el-divider>
+
         <el-form :model="manualSettlementParam">
           <el-form-item label="消费金额" label-width="80px">
             <el-input v-model="manualSettlementParam.chargingAmount" autocomplete="off"></el-input>
@@ -208,6 +215,7 @@ export default {
       dialogVisible: false,
       // 最后一次实时监测数据
       lastMonitorData: {},
+      monitorDataList: [this.lastMonitorData],
       // 手动结算参数
       manualSettlementParam: {},
     };