mirror of
https://codeup.aliyun.com/67c68d4e484ca2f0a13ac3c1/ydc/jsowell-charger-web.git
synced 2026-06-10 10:19:54 +08:00
update
This commit is contained in:
@@ -1,438 +1,443 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<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">
|
<div style="margin: 10px">
|
||||||
<span style="color: #bf1c1c">该笔订单为异常状态，请检查充电桩状态！</span>
|
<span style="color: #bf1c1c">该笔订单为异常状态，请检查充电桩状态！</span>
|
||||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="dialogVisible = true">手动结算
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="dialogVisible = true">手动结算
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-dialog title="提示" :visible.sync="dialogVisible" width="35%">
|
<el-dialog title="提示" :visible.sync="dialogVisible" width="35%">
|
||||||
<span>平台收到充电桩传来的最后一次实时监测数据<br /></span>
|
<span>平台收到充电桩传来的最后一次实时监测数据<br/></span>
|
||||||
|
|
||||||
<el-table style="width: 100%" :data="monitorDataList" border>
|
<el-table style="width: 100%" :data="monitorDataList" border>
|
||||||
<el-table-column prop="dateTime" label="时间" align="center" />
|
<el-table-column prop="dateTime" label="时间" align="center"/>
|
||||||
<el-table-column prop="chargingAmount" label="消费金额" align="center" />
|
<el-table-column prop="chargingAmount" label="消费金额" align="center"/>
|
||||||
<el-table-column prop="chargingDegree" label="充电度数" align="center" />
|
<el-table-column prop="chargingDegree" label="充电度数" align="center"/>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<el-divider>下面可以输入自定义消费金额和充电度数</el-divider>
|
<el-divider>下面可以输入自定义消费金额和充电度数</el-divider>
|
||||||
|
|
||||||
<div style="display: flex; justify-content: center">
|
<div style="display: flex; justify-content: center">
|
||||||
<el-form :model="manualSettlementParam">
|
<el-form :model="manualSettlementParam">
|
||||||
<el-form-item label="消费金额:" prop="chargingAmount" label-width="80px">
|
<el-form-item label="消费金额:" prop="chargingAmount" label-width="80px">
|
||||||
<el-input-number v-model.number="manualSettlementParam.chargingAmount" :precision="2" :controls="false"
|
<el-input-number v-model.number="manualSettlementParam.chargingAmount" :precision="2"
|
||||||
style="width: 50%" />
|
:controls="false"
|
||||||
</el-form-item>
|
style="width: 50%"/>
|
||||||
<el-form-item label="充电度数:" prop="chargingDegree" label-width="80px">
|
</el-form-item>
|
||||||
<el-input-number v-model.number="manualSettlementParam.chargingDegree" :precision="2" :controls="false"
|
<el-form-item label="充电度数:" prop="chargingDegree" label-width="80px">
|
||||||
style="width: 50%" />
|
<el-input-number v-model.number="manualSettlementParam.chargingDegree" :precision="2"
|
||||||
</el-form-item>
|
:controls="false"
|
||||||
</el-form>
|
style="width: 50%"/>
|
||||||
</div>
|
</el-form-item>
|
||||||
<span slot="footer" class="dialog-footer">
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||||
<el-button type="primary" @click="confirmManualSettlement">确 定</el-button>
|
<el-button type="primary" @click="confirmManualSettlement">确 定</el-button>
|
||||||
</span>
|
</span>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</el-card>
|
</el-card>
|
||||||
<!-- 进度条-->
|
<!-- 进度条-->
|
||||||
<el-card class="cardStyle">
|
<el-card class="cardStyle">
|
||||||
<div style="margin: 30px">
|
<div style="margin: 30px">
|
||||||
<div style="text-align: center; margin-bottom: 30px"
|
<div style="text-align: center; margin-bottom: 30px"
|
||||||
v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '6'">
|
v-if="orderInfo.orderStatus === '4' || orderInfo.orderStatus === '6'">
|
||||||
停止理由：
|
停止理由：
|
||||||
<span style="color: red">{{ orderInfo.stopReasonMsg }}</span>
|
<span style="color: red">{{ orderInfo.stopReasonMsg }}</span>
|
||||||
</div>
|
</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.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="orderInfo.endTime"></el-step>
|
||||||
<el-step title="完成充电" description="充电时长"></el-step>
|
<el-step title="完成充电" description="充电时长"></el-step>
|
||||||
</el-steps>
|
</el-steps>
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
<!-- 订单信息 -->
|
<!-- 订单信息 -->
|
||||||
<el-card class="cardStyle">
|
<el-card class="cardStyle">
|
||||||
<h3>订单信息</h3>
|
<h3>订单信息</h3>
|
||||||
<el-descriptions direction="vertical" :column="11" border :contentStyle="CS" :label-style="LS">
|
<el-descriptions direction="vertical" :column="11" border :contentStyle="CS" :label-style="LS">
|
||||||
<el-descriptions-item label="订单号">{{
|
<el-descriptions-item label="订单号">{{
|
||||||
orderInfo.orderCode
|
orderInfo.orderCode
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="交易流水号">{{
|
<el-descriptions-item label="交易流水号">{{
|
||||||
orderInfo.transactionCode
|
orderInfo.transactionCode
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="卡号">{{
|
<el-descriptions-item label="卡号">{{
|
||||||
orderInfo.logicCard
|
orderInfo.logicCard
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="订单状态描述">{{
|
<el-descriptions-item label="订单状态描述">{{
|
||||||
orderInfo.orderStatusDescribe
|
orderInfo.orderStatusDescribe
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="充电开始时间">{{
|
<el-descriptions-item label="充电开始时间">{{
|
||||||
orderInfo.startTime
|
orderInfo.startTime
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="充电结束时间">{{
|
<el-descriptions-item label="充电结束时间">{{
|
||||||
orderInfo.endTime
|
orderInfo.endTime
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="订单创建时间">{{
|
<el-descriptions-item label="订单创建时间">{{
|
||||||
orderInfo.createTime
|
orderInfo.createTime
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="订单结算金额">{{
|
<el-descriptions-item label="订单结算金额">{{
|
||||||
orderInfo.settleAmount
|
orderInfo.settleAmount
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="订单结算时间">{{
|
<el-descriptions-item label="订单结算时间">{{
|
||||||
orderInfo.settlementTime
|
orderInfo.settlementTime
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
|
|
||||||
<el-descriptions-item label="起始SOC">{{
|
<el-descriptions-item label="起始SOC">{{
|
||||||
orderInfo.startSOC
|
orderInfo.startSOC
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="终止SOC">{{
|
<el-descriptions-item label="终止SOC">{{
|
||||||
orderInfo.endSOC
|
orderInfo.endSOC
|
||||||
}}
|
}}
|
||||||
</el-descriptions-item>
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="订单停止原因">{{
|
|
||||||
orderInfo.stopReasonMsg
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
</el-descriptions>
|
|
||||||
<div class="marginTop"></div>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<el-card class="cardStyle">
|
|
||||||
<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="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-descriptions-item label="订单停止原因">{{
|
||||||
<el-card class="cardStyle">
|
orderInfo.stopReasonMsg
|
||||||
<h3>订单计费明细</h3>
|
}}
|
||||||
<el-descriptions direction="vertical" :column="5" border :contentStyle="CS" :label-style="LS">
|
</el-descriptions-item>
|
||||||
<el-descriptions-item label="时间">{{
|
</el-descriptions>
|
||||||
orderRealTimeInfo.time
|
<div class="marginTop"></div>
|
||||||
}}
|
</el-card>
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="消费金额">{{
|
|
||||||
orderRealTimeInfo.orderAmount === "0.0000"
|
|
||||||
? "0"
|
|
||||||
: orderRealTimeInfo.orderAmount
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="充电度数">{{
|
|
||||||
orderRealTimeInfo.chargedDegree === "0.0000"
|
|
||||||
? "0"
|
|
||||||
: orderRealTimeInfo.chargedDegree
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="充电时长">{{
|
|
||||||
orderRealTimeInfo.chargingTime
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="当前soc">{{
|
|
||||||
orderRealTimeInfo.soc
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
</el-descriptions>
|
|
||||||
<div class="marginTop"></div>
|
|
||||||
</el-card>
|
|
||||||
<!-- 支付信息 -->
|
|
||||||
<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
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="支付方式">{{
|
|
||||||
item.payModeDesc
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<!--<el-descriptions-item label="支付状态">{{
|
|
||||||
item.payStatus === "1" ? "支付完成" : "待支付"
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>-->
|
|
||||||
<el-descriptions-item label="支付时间">{{
|
|
||||||
item.payTime
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="支付流水号">{{
|
|
||||||
item.outTradeNo
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="退款金额">{{
|
|
||||||
item.refundAmount
|
|
||||||
}}
|
|
||||||
</el-descriptions-item>
|
|
||||||
</el-descriptions>
|
|
||||||
</template>
|
|
||||||
<div v-else style="text-align: center">暂无数据</div>
|
|
||||||
<div class="marginTop"></div>
|
|
||||||
</el-card>
|
|
||||||
<!-- 退款信息 -->
|
|
||||||
<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" @click="retryRefundOrder"
|
|
||||||
v-if="retryRefundFlag">
|
|
||||||
重试退款
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
<el-table style="width: 100%" :data="orderRefundInfoList" border>
|
|
||||||
<el-table-column prop="paymentId" label="支付流水号" align="center" />
|
|
||||||
<el-table-column prop="reverseId" label="退款流水号" align="center" />
|
|
||||||
<el-table-column prop="reverseAmt" label="退款金额" align="center" />
|
|
||||||
<el-table-column prop="createdTime" label="退款申请时间" align="center" />
|
|
||||||
<el-table-column prop="succeedTime" label="退款成功时间" align="center" />
|
|
||||||
</el-table>
|
|
||||||
<div class="marginTop"></div>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<!-- 设备信息 -->
|
<el-card class="cardStyle">
|
||||||
<el-card class="cardStyle">
|
<h3>收费明细</h3>
|
||||||
<h3>设备信息</h3>
|
<el-table :data="tableData" border show-summary :summary-method="getSummaries">
|
||||||
<el-table style="width: 100%" :data="pileIn" border>
|
<el-table-column prop="periodType" label="时段类型" width="180" align="center"/>
|
||||||
<el-table-column prop="merchantName" label="运营商名称" align="center" />
|
<el-table-column prop="electricityPrice" label="电费单价(元/千瓦时)" align="center"/>
|
||||||
<el-table-column prop="pileSn" label="设备编号" align="center" />
|
<el-table-column prop="servicePrice" label="服务费单价(元/千瓦时)" align="center"/>
|
||||||
<el-table-column prop="ratedCurrent" label="额定电流(A)" align="center" />
|
<el-table-column prop="usedElectricity" label="用电量(千瓦时)" align="center"/>
|
||||||
<el-table-column prop="ratedVoltage" label="额定电压(V)" align="center" />
|
<el-table-column prop="electricityAmount" label="电费金额(元)" align="center"/>
|
||||||
<el-table-column prop="ratedPower" label="额定功率(KW)" align="center" />
|
<el-table-column prop="serviceAmount" label="服务费金额(元)" align="center"/>
|
||||||
</el-table>
|
</el-table>
|
||||||
<div class="marginTop"></div>
|
<div class="marginTop"></div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
<!-- 用户信息 -->
|
<!-- 实时订单数据 -->
|
||||||
<el-card class="cardStyle">
|
<el-card class="cardStyle">
|
||||||
<h3>用户信息</h3>
|
<h3>订单计费明细</h3>
|
||||||
<el-table style="width: 100%" :data="userInfo" border>
|
<el-descriptions direction="vertical" :column="5" border :contentStyle="CS" :label-style="LS">
|
||||||
<el-table-column prop="nickName" label="用户昵称" align="center">
|
<el-descriptions-item label="时间">{{
|
||||||
<template slot-scope="scope">
|
orderRealTimeInfo.time
|
||||||
<router-link :to="'/member/detail/index/' + scope.row.memberId" class="link-type">
|
}}
|
||||||
<span>{{ scope.row.nickName }}</span>
|
</el-descriptions-item>
|
||||||
</router-link>
|
<el-descriptions-item label="消费金额">{{
|
||||||
</template>
|
orderRealTimeInfo.orderAmount === "0.0000"
|
||||||
</el-table-column>
|
? "0"
|
||||||
<el-table-column prop="memberId" label="会员ID" align="center" />
|
: orderRealTimeInfo.orderAmount
|
||||||
<el-table-column prop="mobileNumber" label="用户手机号" align="center" />
|
}}
|
||||||
<el-table-column prop="principalBalance" label="本金金额" align="center" />
|
</el-descriptions-item>
|
||||||
<!-- <el-table-column prop="giftBalance" label="赠送金额" align="center"/>-->
|
<el-descriptions-item label="充电度数">{{
|
||||||
<el-table-column prop="totalAccountAmount" label="总金额" align="center" />
|
orderRealTimeInfo.chargedDegree === "0.0000"
|
||||||
</el-table>
|
? "0"
|
||||||
<div class="marginTop"></div>
|
: orderRealTimeInfo.chargedDegree
|
||||||
</el-card>
|
}}
|
||||||
<!-- 时间 描述-->
|
</el-descriptions-item>
|
||||||
<el-card class="cardStyle"
|
<el-descriptions-item label="充电时长">{{
|
||||||
v-if="orderInfo.orderStatus === '1' || orderInfo.orderStatus === '6' && obj.realTimeMonitorDataList !== null">
|
orderRealTimeInfo.chargingTime
|
||||||
<div class="marginTop"></div>
|
}}
|
||||||
<order-echarts :obj="obj"></order-echarts>
|
</el-descriptions-item>
|
||||||
</el-card>
|
<el-descriptions-item label="当前soc">{{
|
||||||
</div>
|
orderRealTimeInfo.soc
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<div class="marginTop"></div>
|
||||||
|
</el-card>
|
||||||
|
<!-- 支付信息 -->
|
||||||
|
<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
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="支付方式">{{
|
||||||
|
item.payModeDesc
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<!--<el-descriptions-item label="支付状态">{{
|
||||||
|
item.payStatus === "1" ? "支付完成" : "待支付"
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>-->
|
||||||
|
<el-descriptions-item label="支付时间">{{
|
||||||
|
item.payTime
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="支付流水号">{{
|
||||||
|
item.outTradeNo
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="退款金额">{{
|
||||||
|
item.refundAmount
|
||||||
|
}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</template>
|
||||||
|
<div v-else style="text-align: center">暂无数据</div>
|
||||||
|
<div class="marginTop"></div>
|
||||||
|
</el-card>
|
||||||
|
<!-- 退款信息 -->
|
||||||
|
<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"
|
||||||
|
@click="retryRefundOrder"
|
||||||
|
v-if="retryRefundFlag">
|
||||||
|
重试退款
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
<el-table style="width: 100%" :data="orderRefundInfoList" border>
|
||||||
|
<el-table-column prop="paymentId" label="支付流水号" align="center"/>
|
||||||
|
<el-table-column prop="reverseId" label="退款流水号" align="center"/>
|
||||||
|
<el-table-column prop="reverseAmt" label="退款金额" align="center"/>
|
||||||
|
<el-table-column prop="createdTime" label="退款申请时间" align="center"/>
|
||||||
|
<el-table-column prop="succeedTime" label="退款成功时间" align="center"/>
|
||||||
|
</el-table>
|
||||||
|
<div class="marginTop"></div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!-- 设备信息 -->
|
||||||
|
<el-card class="cardStyle">
|
||||||
|
<h3>设备信息</h3>
|
||||||
|
<el-table style="width: 100%" :data="pileIn" border>
|
||||||
|
<el-table-column prop="merchantName" label="运营商名称" align="center"/>
|
||||||
|
<el-table-column prop="pileSn" label="设备编号" align="center"/>
|
||||||
|
<el-table-column prop="ratedCurrent" label="额定电流(A)" align="center"/>
|
||||||
|
<el-table-column prop="ratedVoltage" label="额定电压(V)" align="center"/>
|
||||||
|
<el-table-column prop="ratedPower" label="额定功率(KW)" align="center"/>
|
||||||
|
</el-table>
|
||||||
|
<div class="marginTop"></div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!-- 用户信息 -->
|
||||||
|
<el-card class="cardStyle">
|
||||||
|
<h3>用户信息</h3>
|
||||||
|
<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">
|
||||||
|
<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="principalBalance" label="本金金额" align="center"/>
|
||||||
|
<!-- <el-table-column prop="giftBalance" label="赠送金额" align="center"/>-->
|
||||||
|
<el-table-column prop="totalAccountAmount" label="总金额" align="center"/>
|
||||||
|
</el-table>
|
||||||
|
<div class="marginTop"></div>
|
||||||
|
</el-card>
|
||||||
|
<!-- 时间 描述-->
|
||||||
|
<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>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import {
|
import {
|
||||||
getOrder,
|
getOrder,
|
||||||
manualSettlementOrder,
|
manualSettlementOrder,
|
||||||
retryRefundOrder,
|
retryRefundOrder,
|
||||||
} from "@/api/order/order";
|
} from "@/api/order/order";
|
||||||
import OrderEcharts from "@/views/order/order/orderEcharts";
|
import OrderEcharts from "@/views/order/order/orderEcharts";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "",
|
name: "",
|
||||||
components: { OrderEcharts },
|
components: {OrderEcharts},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
CS: {
|
CS: {
|
||||||
"text-align": "center",
|
"text-align": "center",
|
||||||
"word-break": "break-all",
|
"word-break": "break-all",
|
||||||
},
|
},
|
||||||
LS: {
|
LS: {
|
||||||
height: "40px",
|
height: "40px",
|
||||||
color: "#515A6E",
|
color: "#515A6E",
|
||||||
"text-align": "center",
|
"text-align": "center",
|
||||||
"word-break": "break-all",
|
"word-break": "break-all",
|
||||||
"font-weight": "bolder",
|
"font-weight": "bolder",
|
||||||
},
|
},
|
||||||
orderCode: this.$route.params.orderCode,
|
orderCode: this.$route.params.orderCode,
|
||||||
orderInfo: {},
|
orderInfo: {},
|
||||||
payDetail: [],
|
payDetail: [],
|
||||||
// 订单退款列表
|
// 订单退款列表
|
||||||
orderRefundInfoList: [],
|
orderRefundInfoList: [],
|
||||||
// 重试退款按钮
|
// 重试退款按钮
|
||||||
// retryRefundFlag: false,
|
// retryRefundFlag: false,
|
||||||
userInfo: [],
|
userInfo: [],
|
||||||
obj: {},
|
obj: {},
|
||||||
orderDetail: [],
|
orderDetail: [],
|
||||||
pileIn: [],
|
pileIn: [],
|
||||||
orderRealTimeInfo: {
|
orderRealTimeInfo: {
|
||||||
orderAmount: null,
|
orderAmount: null,
|
||||||
chargedDegree: null,
|
chargedDegree: null,
|
||||||
chargingTime: null,
|
chargingTime: null,
|
||||||
soc: null,
|
soc: null,
|
||||||
},
|
},
|
||||||
// 手动结算对话框Visible
|
// 手动结算对话框Visible
|
||||||
dialogVisible: false,
|
dialogVisible: false,
|
||||||
// 最后一次实时监测数据
|
// 最后一次实时监测数据
|
||||||
lastMonitorData: {},
|
lastMonitorData: {},
|
||||||
// monitorDataList: [this.lastMonitorData],
|
// monitorDataList: [this.lastMonitorData],
|
||||||
// 手动结算参数
|
// 手动结算参数
|
||||||
manualSettlementParam: {
|
manualSettlementParam: {
|
||||||
orderCode: null,
|
orderCode: null,
|
||||||
chargingAmount: null,
|
chargingAmount: null,
|
||||||
chargingDegree: null,
|
chargingDegree: null,
|
||||||
},
|
},
|
||||||
tableData: [],
|
tableData: [],
|
||||||
isRequesting: false, // 手动结算请求状态
|
isRequesting: false, // 手动结算请求状态
|
||||||
};
|
};
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.getOrderDetail();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getSummaries(param) {
|
|
||||||
console.log(param, '添加调试输出');
|
|
||||||
const { columns, data } = param;
|
|
||||||
// console.log(data, 'data');
|
|
||||||
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)) {
|
|
||||||
let result = prev + curr;
|
|
||||||
result = Math.round(result * 100) / 100;
|
|
||||||
return result;
|
|
||||||
} else {
|
|
||||||
return prev;
|
|
||||||
}
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return sums;
|
|
||||||
},
|
},
|
||||||
clickManualSettlement() {
|
created() {
|
||||||
this.dialogVisible = true;
|
this.getOrderDetail();
|
||||||
},
|
},
|
||||||
|
methods: {
|
||||||
|
getSummaries(param) {
|
||||||
|
console.log(param, '添加调试输出');
|
||||||
|
const {columns, data} = param;
|
||||||
|
// console.log(data, 'data');
|
||||||
|
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)) {
|
||||||
|
let result = prev + curr;
|
||||||
|
result = Math.round(result * 100) / 100;
|
||||||
|
return result;
|
||||||
|
} else {
|
||||||
|
return prev;
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return sums;
|
||||||
|
},
|
||||||
|
clickManualSettlement() {
|
||||||
|
this.dialogVisible = true;
|
||||||
|
},
|
||||||
|
|
||||||
// 重试退款方法
|
// 重试退款方法
|
||||||
retryRefundOrder() {
|
retryRefundOrder() {
|
||||||
const param = {
|
const param = {
|
||||||
orderCode: this.orderCode,
|
orderCode: this.orderCode,
|
||||||
};
|
};
|
||||||
retryRefundOrder(param).then((response) => {
|
retryRefundOrder(param).then((response) => {
|
||||||
this.getOrderDetail();
|
this.getOrderDetail();
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
confirmManualSettlement() {
|
||||||
|
if (this.isRequesting) {
|
||||||
|
this.$message({
|
||||||
|
showClose: true,
|
||||||
|
message: '手动结算订单已经提交，请勿重复操作',
|
||||||
|
type: 'warning'
|
||||||
|
});
|
||||||
|
return; // 如果正在请求中，则不再继续发送请求
|
||||||
|
}
|
||||||
|
this.isRequesting = true;
|
||||||
|
console.log('点击了手动结算按钮');
|
||||||
|
if (this.manualSettlementParam.chargingAmount == null) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (this.manualSettlementParam.chargingDegree == null) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
this.manualSettlementParam.orderCode = this.orderInfo.orderCode;
|
||||||
|
console.log("确认手动结算订单param:", this.manualSettlementParam);
|
||||||
|
manualSettlementOrder(this.manualSettlementParam).then((response) => {
|
||||||
|
this.dialogVisible = false;
|
||||||
|
this.getOrderDetail();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
async getOrderDetail() {
|
||||||
|
const {data} = await getOrder(this.orderCode);
|
||||||
|
console.log("getOrder", data);
|
||||||
|
this.obj = data;
|
||||||
|
console.log('统计图是否有数据', this.obj.realTimeMonitorDataList);
|
||||||
|
this.orderInfo = data.orderInfo;
|
||||||
|
this.payDetail = data.payRecordList; // 数组
|
||||||
|
this.orderRefundInfoList = data.orderRefundInfoList; // 数组
|
||||||
|
this.userInfo = [data.memberInfo];
|
||||||
|
// console.log("this.userInfo", this.userInfo);
|
||||||
|
this.pileIn = [data.pileInfo];
|
||||||
|
// console.log("this.pileIn", this.pileIn);
|
||||||
|
if (data.orderRealTimeInfo !== null) {
|
||||||
|
this.orderRealTimeInfo = data.orderRealTimeInfo;
|
||||||
|
}
|
||||||
|
this.orderDetail = [data.billingDetails];
|
||||||
|
this.tableData = data.chargeDetails; // array
|
||||||
|
this.lastMonitorData = data.lastMonitorData;
|
||||||
|
console.log("orderInfo.orderStatus", this.orderInfo.orderStatus);
|
||||||
|
// 是否显示重试退款按钮
|
||||||
|
// if (data.orderInfo.orderStatus === '6' && data.payRecordList[0].payMode === '4' && data.orderRefundInfoList.length === 0) {
|
||||||
|
// this.retryRefundFlag = true;
|
||||||
|
// }
|
||||||
|
},
|
||||||
},
|
},
|
||||||
confirmManualSettlement() {
|
computed: {
|
||||||
if (this.isRequesting) {
|
// 一个计算属性的 getter
|
||||||
this.$message({
|
monitorDataList() {
|
||||||
showClose: true,
|
return [this.lastMonitorData];
|
||||||
message: '手动结算订单已经提交，请勿重复操作',
|
},
|
||||||
type: 'warning'
|
retryRefundFlag() {
|
||||||
});
|
// if (this.orderInfo == null || this.orderInfo.orderStatus !== "6") {
|
||||||
return; // 如果正在请求中，则不再继续发送请求
|
// return false;
|
||||||
}
|
// }
|
||||||
this.isRequesting = true;
|
// if (this.payDetail[0] == null || this.payDetail[0].payMode !== "4") {
|
||||||
console.log('点击了手动结算按钮');
|
// return false;
|
||||||
if (this.manualSettlementParam.chargingAmount == null) {
|
// }
|
||||||
return false;
|
// if (
|
||||||
}
|
// this.payDetail[0].refundAmount == null ||
|
||||||
if (this.manualSettlementParam.chargingDegree == null) {
|
// this.payDetail[0].refundAmount <= 0.0
|
||||||
return false;
|
// ) {
|
||||||
}
|
// return false;
|
||||||
this.manualSettlementParam.orderCode = this.orderInfo.orderCode;
|
// }
|
||||||
console.log("确认手动结算订单param:", this.manualSettlementParam);
|
// if (this.orderRefundInfoList.length === 0) {
|
||||||
manualSettlementOrder(this.manualSettlementParam).then((response) => {
|
// return false;
|
||||||
this.dialogVisible = false;
|
// }
|
||||||
this.getOrderDetail();
|
return true;
|
||||||
});
|
},
|
||||||
},
|
},
|
||||||
async getOrderDetail() {
|
|
||||||
const { data } = await getOrder(this.orderCode);
|
|
||||||
console.log("getOrder", data);
|
|
||||||
this.obj = data;
|
|
||||||
console.log('统计图是否有数据', this.obj.realTimeMonitorDataList);
|
|
||||||
this.orderInfo = data.orderInfo;
|
|
||||||
this.payDetail = data.payRecordList; // 数组
|
|
||||||
this.orderRefundInfoList = data.orderRefundInfoList; // 数组
|
|
||||||
this.userInfo = [data.memberInfo];
|
|
||||||
// console.log("this.userInfo", this.userInfo);
|
|
||||||
this.pileIn = [data.pileInfo];
|
|
||||||
// console.log("this.pileIn", this.pileIn);
|
|
||||||
if (data.orderRealTimeInfo !== null) {
|
|
||||||
this.orderRealTimeInfo = data.orderRealTimeInfo;
|
|
||||||
}
|
|
||||||
this.orderDetail = [data.billingDetails];
|
|
||||||
this.tableData = data.chargeDetails; // array
|
|
||||||
this.lastMonitorData = data.lastMonitorData;
|
|
||||||
console.log("orderInfo.orderStatus", this.orderInfo.orderStatus);
|
|
||||||
// 是否显示重试退款按钮
|
|
||||||
// if (data.orderInfo.orderStatus === '6' && data.payRecordList[0].payMode === '4' && data.orderRefundInfoList.length === 0) {
|
|
||||||
// this.retryRefundFlag = true;
|
|
||||||
// }
|
|
||||||
},
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
// 一个计算属性的 getter
|
|
||||||
monitorDataList() {
|
|
||||||
return [this.lastMonitorData];
|
|
||||||
},
|
|
||||||
retryRefundFlag() {
|
|
||||||
// if (this.orderInfo == null || this.orderInfo.orderStatus !== "6") {
|
|
||||||
// return false;
|
|
||||||
// }
|
|
||||||
// if (this.payDetail[0] == null || this.payDetail[0].payMode !== "4") {
|
|
||||||
// return false;
|
|
||||||
// }
|
|
||||||
// if (
|
|
||||||
// this.payDetail[0].refundAmount == null ||
|
|
||||||
// this.payDetail[0].refundAmount <= 0.0
|
|
||||||
// ) {
|
|
||||||
// return false;
|
|
||||||
// }
|
|
||||||
// if (this.orderRefundInfoList.length === 0) {
|
|
||||||
// return false;
|
|
||||||
// }
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.cardStyle {
|
.cardStyle {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.marginTop {
|
.marginTop {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user