Merge branch 'dev' of http://192.168.2.46:8099/jsowell/jsowell-charger-web into dev

# Conflicts: # jsowell-ui/src/views/order/order/orderDetail.vue
2026-06-13 03:39:55 +08:00 · 2024-09-11 14:46:27 +08:00
parent d74349c69e ce6d933128
commit 8ede915365
1 changed files with 461 additions and 416 deletions
--- a/jsowell-ui/src/views/order/order/orderDetail.vue
+++ b/jsowell-ui/src/views/order/order/orderDetail.vue
@@ -1,10 +1,23 @@
 <template>
  <div class="app-container">
-        <el-card class="cardStyle" v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '2'">
+    <el-card
+      class="cardStyle"
+      v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '2'"
+    >
      <div style="margin: 10px">
-                <span style="color: #bf1c1c" v-if="orderInfo.orderStatus === '4'">该笔订单为异常状态，请检查充电桩状态！</span>
-                <span style="color: #bf1c1c" v-if="orderInfo.orderStatus === '2'">该笔订单为待结算状态，如有需要可以手动结算订单！</span>
-                <el-button type="primary" icon="el-icon-search" size="mini" @click="dialogVisible = true">手动结算</el-button>
+        <span style="color: #bf1c1c" v-if="orderInfo.orderStatus === '4'"
+          >该笔订单为异常状态，请检查充电桩状态！</span
+        >
+        <span style="color: #bf1c1c" v-if="orderInfo.orderStatus === '2'"
+          >该笔订单为待结算状态，如有需要可以手动结算订单！</span
+        >
+        <el-button
+          type="primary"
+          icon="el-icon-search"
+          size="mini"
+          @click="dialogVisible = true"
+          >手动结算</el-button
+        >
      </div>

      <el-dialog title="提示" :visible.sync="dialogVisible" width="35%">
@@ -21,14 +34,20 @@
        <div style="display: flex; justify-content: center">
          <el-form :model="manualSettlementParam">
            <el-form-item label="消费金额:" prop="chargingAmount" label-width="80px">
-                            <el-input-number v-model.number="manualSettlementParam.chargingAmount" :precision="2"
+              <el-input-number
+                v-model.number="manualSettlementParam.chargingAmount"
+                :precision="2"
                :controls="false"
-                                             style="width: 50%"/>
+                style="width: 50%"
+              />
            </el-form-item>
            <el-form-item label="充电度数:" prop="chargingDegree" label-width="80px">
-                            <el-input-number v-model.number="manualSettlementParam.chargingDegree" :precision="2"
+              <el-input-number
+                v-model.number="manualSettlementParam.chargingDegree"
+                :precision="2"
                :controls="false"
-                                             style="width: 50%"/>
+                style="width: 50%"
+              />
            </el-form-item>
          </el-form>
        </div>
@@ -41,14 +60,23 @@
    <!-- 进度条-->
    <el-card class="cardStyle">
      <div style="margin: 30px">
-                <div style="text-align: center; margin-bottom: 30px"
-                     v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '6'">
+        <div
+          style="text-align: center; margin-bottom: 30px"
+          v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '6'"
+        >
          停止理由：
          <span style="color: red">{{ orderInfo.stopReasonMsg }}</span>
        </div>
-                <el-steps :active="orderInfo.orderStatus !== '6' ? 2 : 4" align-center finish-status="success">
+        <el-steps
+          :active="orderInfo.orderStatus !== '6' ? 2 : 4"
+          align-center
+          finish-status="success"
+        >
          <el-step title="客户下单" :description="orderInfo.createTime"></el-step>
-                    <el-step title="开始充电" :description="orderInfo.orderStatusDescribe"></el-step>
+          <el-step
+            title="开始充电"
+            :description="orderInfo.orderStatusDescribe"
+          ></el-step>
          <el-step title="结束充电" :description="orderInfo.endTime"></el-step>
          <el-step title="完成充电" description="充电时长"></el-step>
        </el-steps>
@@ -58,64 +86,56 @@
    <!--  订单信息  -->
    <el-card class="cardStyle">
      <h3>订单信息</h3>
-            <el-descriptions direction="vertical" :column="11" border :contentStyle="CS" :label-style="LS">
-                <el-descriptions-item label="订单号">{{
-                        orderInfo.orderCode
-                    }}
+      <el-descriptions
+        direction="vertical"
+        :column="11"
+        border
+        :contentStyle="CS"
+        :label-style="LS"
+      >
+        <el-descriptions-item label="订单号"
+          >{{ orderInfo.orderCode }}
        </el-descriptions-item>
-                <el-descriptions-item label="交易流水号">{{
-                        orderInfo.transactionCode
-                    }}
+        <el-descriptions-item label="交易流水号"
+          >{{ orderInfo.transactionCode }}
        </el-descriptions-item>
-                <el-descriptions-item label="卡号">{{
-                        orderInfo.logicCard
-                    }}
+        <el-descriptions-item label="卡号"
+          >{{ orderInfo.logicCard }}
        </el-descriptions-item>
-                <el-descriptions-item label="vin码">{{
-                        orderInfo.vinCode
-                    }}
+        <el-descriptions-item label="vin码"
+          >{{ orderInfo.vinCode }}
        </el-descriptions-item>
-                <el-descriptions-item label="订单状态描述">{{
-                        orderInfo.orderStatusDescribe
-                    }}
+        <el-descriptions-item label="订单状态描述"
+          >{{ orderInfo.orderStatusDescribe }}
        </el-descriptions-item>
-                <el-descriptions-item label="充电开始时间">{{
-                        orderInfo.startTime
-                    }}
+        <el-descriptions-item label="充电开始时间"
+          >{{ orderInfo.startTime }}
        </el-descriptions-item>
-                <el-descriptions-item label="充电结束时间">{{
-                        orderInfo.endTime
-                    }}
+        <el-descriptions-item label="充电结束时间"
+          >{{ orderInfo.endTime }}
        </el-descriptions-item>
-                <el-descriptions-item label="订单创建时间">{{
-                        orderInfo.createTime
-                    }}
+        <el-descriptions-item label="订单创建时间"
+          >{{ orderInfo.createTime }}
        </el-descriptions-item>
-                <el-descriptions-item label="订单优惠金额">{{
-                        orderInfo.discountAmount
-                    }}
+        <el-descriptions-item label="订单优惠金额"
+          >{{ orderInfo.discountAmount }}
        </el-descriptions-item>
-                <el-descriptions-item label="订单结算金额">{{
-                        orderInfo.settleAmount
-                    }}
+        <el-descriptions-item label="订单结算金额"
+          >{{ orderInfo.settleAmount }}
        </el-descriptions-item>
-                <el-descriptions-item label="订单结算时间">{{
-                        orderInfo.settlementTime
-                    }}
+        <el-descriptions-item label="订单结算时间"
+          >{{ orderInfo.settlementTime }}
        </el-descriptions-item>

-                <el-descriptions-item label="起始SOC">{{
-                        orderInfo.startSOC
-                    }}
+        <el-descriptions-item label="起始SOC"
+          >{{ orderInfo.startSOC }}
        </el-descriptions-item>
-                <el-descriptions-item label="终止SOC">{{
-                        orderInfo.endSOC
-                    }}
+        <el-descriptions-item label="终止SOC"
+          >{{ orderInfo.endSOC }}
        </el-descriptions-item>

-                <el-descriptions-item label="订单停止原因">{{
-                        orderInfo.stopReasonMsg
-                    }}
+        <el-descriptions-item label="订单停止原因"
+          >{{ orderInfo.stopReasonMsg }}
        </el-descriptions-item>
      </el-descriptions>
      <div class="marginTop"></div>
@@ -125,8 +145,16 @@
      <h3>收费明细</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="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" />
@@ -137,30 +165,35 @@
    <!-- 实时订单数据 -->
    <el-card class="cardStyle">
      <h3>订单计费明细</h3>
-            <el-descriptions direction="vertical" :column="5" border :contentStyle="CS" :label-style="LS">
-                <el-descriptions-item label="时间">{{
-                        orderRealTimeInfo.time
-                    }}
+      <el-descriptions
+        direction="vertical"
+        :column="5"
+        border
+        :contentStyle="CS"
+        :label-style="LS"
+      >
+        <el-descriptions-item label="时间"
+          >{{ orderRealTimeInfo.time }}
        </el-descriptions-item>
-                <el-descriptions-item label="消费金额">{{
+        <el-descriptions-item label="消费金额"
+          >{{
            orderRealTimeInfo.orderAmount === "0.0000"
              ? "0"
              : orderRealTimeInfo.orderAmount
          }}
        </el-descriptions-item>
-                <el-descriptions-item label="充电度数">{{
+        <el-descriptions-item label="充电度数"
+          >{{
            orderRealTimeInfo.chargedDegree === "0.0000"
              ? "0"
              : orderRealTimeInfo.chargedDegree
          }}
        </el-descriptions-item>
-                <el-descriptions-item label="充电时长">{{
-                        orderRealTimeInfo.chargingTime
-                    }}
+        <el-descriptions-item label="充电时长"
+          >{{ orderRealTimeInfo.chargingTime }}
        </el-descriptions-item>
-                <el-descriptions-item label="当前soc">{{
-                        orderRealTimeInfo.soc
-                    }}
+        <el-descriptions-item label="当前soc"
+          >{{ orderRealTimeInfo.soc }}
        </el-descriptions-item>
      </el-descriptions>
      <div class="marginTop"></div>
@@ -168,41 +201,38 @@
    <!-- 支付信息 -->
    <el-card class="cardStyle">
      <h3>支付信息</h3>
-<!--            <template v-if="payDetail.length !== 0">
-                <el-descriptions direction="vertical" :column="6" border :contentStyle="CS" :label-style="LS"
-                                 v-for="(item, index) in payDetail" :key="index">
-                    <el-descriptions-item label="支付金额">{{
-                            item.payAmount
-                        }}
+      <template v-if="payDetail.length !== 0">
+        <el-descriptions
+          direction="vertical"
+          :column="6"
+          border
+          :contentStyle="CS"
+          :label-style="LS"
+          v-for="(item, index) in payDetail"
+          :key="index"
+        >
+          <el-descriptions-item label="支付金额"
+            >{{ item.payAmount }}
          </el-descriptions-item>
-                    <el-descriptions-item label="支付方式">{{
-                            item.payModeDesc
-                        }}
+          <el-descriptions-item label="支付方式"
+            >{{ item.payModeDesc }}
          </el-descriptions-item>
-                    &lt;!&ndash;<el-descriptions-item label="支付状态">{{
+          <!--<el-descriptions-item label="支付状态">{{
                      item.payStatus === "1" ? "支付完成" : "待支付"
                    }}
-                    </el-descriptions-item>&ndash;&gt;
-                    <el-descriptions-item label="支付时间">{{
-                            item.payTime
-                        }}
+                    </el-descriptions-item>-->
+          <el-descriptions-item label="支付时间"
+            >{{ item.payTime }}
          </el-descriptions-item>
-                    <el-descriptions-item label="支付流水号">{{
-                            item.outTradeNo
-                        }}
+          <el-descriptions-item label="支付流水号"
+            >{{ item.outTradeNo }}
          </el-descriptions-item>
-                    &lt;!&ndash;<el-descriptions-item label="退款金额">{{
+          <!--<el-descriptions-item label="退款金额">{{
                            item.refundAmount
                        }}
-                    </el-descriptions-item>&ndash;&gt;
+                    </el-descriptions-item>-->
        </el-descriptions>
-            </template>-->
-            <el-table style="width: 100%" :data="payDetail" border>
-                <el-table-column prop="payAmount" label="支付金额" align="center"/>
-                <el-table-column prop="payModeDesc" label="支付方式" align="center"/>
-                <el-table-column prop="payTime" label="支付时间" align="center"/>
-                <el-table-column prop="outTradeNo" label="支付流水号" align="center"/>
-            </el-table>
+      </template>
      <div v-else style="text-align: center">暂无数据</div>
      <div class="marginTop"></div>
    </el-card>
@@ -210,9 +240,13 @@
    <el-card class="cardStyle">
      <div style="margin: 12px 0">
        <span>退款信息</span>
-                <el-button icon="el-icon-refresh-right" style="float: right; padding: 3px 0" type="text"
+        <el-button
+          icon="el-icon-refresh-right"
+          style="float: right; padding: 3px 0"
+          type="text"
          @click="retryRefundOrder"
-                           v-if="retryRefundFlag">
+          v-if="retryRefundFlag"
+        >
          重试退款
        </el-button>
      </div>
@@ -245,13 +279,23 @@
      <el-table style="width: 100%" :data="userInfo" border>
        <el-table-column prop="nickName" label="用户昵称" align="center">
          <template slot-scope="scope">
-                        <router-link :to="'/member/detail/index/' + scope.row.memberId" class="link-type">
+            <router-link
+              :to="'/member/detail/index/' + scope.row.memberId"
+              class="link-type"
+            >
              <span>{{ scope.row.nickName }}</span>
            </router-link>
          </template>
        </el-table-column>
        <el-table-column prop="memberId" label="会员ID" align="center" />
        <el-table-column prop="mobileNumber" label="用户手机号" align="center" />
+        <el-table-column prop="plateNumberList" label="车牌号" align="center">
+          <template slot-scope="scope">
+            <span v-for="(item, index) in scope.row.plateNumberList" :key="index">{{
+              item
+            }}</span>
+          </template>
+        </el-table-column>
        <el-table-column prop="principalBalance" label="本金金额" align="center" />
        <!--        <el-table-column prop="giftBalance" label="赠送金额" align="center"/>-->
        <el-table-column prop="totalAccountAmount" label="总金额" align="center" />
@@ -259,19 +303,20 @@
      <div class="marginTop"></div>
    </el-card>
    <!--    时间 描述-->
-        <el-card class="cardStyle"
-                 v-if="orderInfo.orderStatus === '1' || orderInfo.orderStatus === '6' && obj.realTimeMonitorDataList !== null">
+    <el-card
+      class="cardStyle"
+      v-if="
+        orderInfo.orderStatus === '1' ||
+        (orderInfo.orderStatus === '6' && obj.realTimeMonitorDataList !== null)
+      "
+    >
      <div class="marginTop"></div>
      <order-echarts :obj="obj"></order-echarts>
    </el-card>
  </div>
 </template>
 <script>
-import {
-    getOrder,
-    manualSettlementOrder,
-    retryRefundOrder,
-} from "@/api/order/order";
+import { getOrder, manualSettlementOrder, retryRefundOrder } from "@/api/order/order";
 import OrderEcharts from "@/views/order/order/orderEcharts";

 export default {
@@ -326,7 +371,7 @@ export default {
  },
  methods: {
    getSummaries(param) {
-            console.log(param, '添加调试输出');
+      console.log(param, "添加调试输出");
      const { columns, data } = param;
      // console.log(data, 'data');
      const sums = [];
@@ -372,13 +417,13 @@ export default {
      if (this.isRequesting) {
        this.$message({
          showClose: true,
-                    message: '手动结算订单已经提交，请勿重复操作',
-                    type: 'warning'
+          message: "手动结算订单已经提交，请勿重复操作",
+          type: "warning",
        });
        return; // 如果正在请求中，则不再继续发送请求
      }
      this.isRequesting = true;
-            console.log('点击了手动结算按钮');
+      console.log("点击了手动结算按钮");
      if (this.manualSettlementParam.chargingAmount == null) {
        return false;
      }
@@ -396,7 +441,7 @@ export default {
      const { data } = await getOrder(this.orderCode);
      console.log("getOrder", data);
      this.obj = data;
-            console.log('统计图是否有数据', this.obj.realTimeMonitorDataList);
+      console.log("统计图是否有数据", this.obj.realTimeMonitorDataList);
      this.orderInfo = data.orderInfo;
      this.payDetail = data.payRecordList; // 数组
      this.orderRefundInfoList = data.orderRefundInfoList; // 数组