配置

src/views/cai/rechargeOrder/index.vue

@@ -53,6 +53,8 @@
     <el-table v-loading="loading" :data="rechargeOrderList" @selection-change="handleSelectionChange">
 <!--      <el-table-column type="selection" width="55" align="center" />-->
       <el-table-column label="订单号" align="center" prop="orderNo" show-overflow-tooltip/>
+      <el-table-column label="标识" align="center" prop="appId" />
+      <el-table-column label="设备" align="center" prop="deviceType" />
       <el-table-column :label="systemName+'号'" align="center" prop="usercode" />
       <el-table-column label="昵称" align="center" prop="nickname" />
       <el-table-column label="手机" align="center" prop="mobile" />
@@ -86,7 +88,7 @@
         </template>
       </el-table-column>
       <el-table-column label="链路号" align="center" prop="traceId" show-overflow-tooltip/>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="140">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="210">
         <template v-slot="scope">
           <el-button
               size="mini"
@@ -96,6 +98,12 @@
               @click="handleConsumerLog(scope.row)"
           >分销记录
           </el-button>
+          <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-info"
+              @click="handleOrderLogs(scope.row)"
+          >操作记录</el-button>
           <el-button
               size="mini"
               type="text"
@@ -115,6 +123,7 @@
     />
     <consume-log-info v-if="consumeLogInfoVisible" ref="consumeLogInfo" />
     <recharge-order-info v-if="rechargeOrderInfoVisible" ref="rechargeOrderInfo" />
+    <order-logs v-if="orderLogsVisible" ref="orderLogs" />
   </div>
 </template>
 
@@ -131,11 +140,12 @@ import {
 } from '@/constant/statusMap'
 import RechargeOrderInfo from "@/views/cai/rechargeOrder/recharge-order-info";
 import ConsumeLogInfo from "@/views/cai/consumeLog/consume-log-info";
+import OrderLogs from "@/views/cai/rechargeOrder/order-logs.vue";
 
 export default {
   name: "RechargeOrder",
   components:{
-    RechargeOrderInfo,ConsumeLogInfo
+    RechargeOrderInfo,ConsumeLogInfo,OrderLogs
   },
   data() {
     return {
@@ -144,6 +154,7 @@ export default {
       payStatusList,
       rechargeOrderInfoVisible: false,
       consumeLogInfoVisible: false,
+      orderLogsVisible: false,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -205,6 +216,12 @@ export default {
         this.$refs.consumeLogInfo.traceIdInit(row.traceId)
       })
     },
+    handleOrderLogs(row){
+      this.orderLogsVisible = true
+      this.$nextTick(() => {
+        this.$refs.orderLogs.init(row.orderNo)
+      })
+    },
     handleInfo(row) {
       this.rechargeOrderInfoVisible = true
       this.$nextTick(() => {

src/views/cai/rechargeOrder/order-logs.vue

@@ -0,0 +1,48 @@
+<template>
+  <el-dialog title="订单操作记录" :close-on-click-modal="false" :visible.sync="open" width="1200px" append-to-body>
+    <el-table v-loading="loading" :data="orderLogsList">
+      <el-table-column label="订单号" align="center" prop="orderNo" show-overflow-tooltip/>
+      <el-table-column label="操作" align="center" prop="stepName" />
+      <el-table-column label="状态" align="center" prop="success" />
+      <el-table-column label="标识名称" align="center" prop="flagName" />
+      <el-table-column label="说明" align="center" prop="remark" />
+      <el-table-column label="入参" align="center" prop="inParams" show-overflow-tooltip />
+      <el-table-column label="出参" align="center" prop="outParams" show-overflow-tooltip />
+      <el-table-column label="操作时间" align="center" prop="createTime" width="160"/>
+    </el-table>
+  </el-dialog>
+</template>
+
+<script>
+import {listOrderLogsByOrderNo} from '@/api/cai/rechargeOrder'
+
+export default {
+  name: "OrderLogs",
+  data() {
+    return {
+      orderLogsList:[],
+      queryParams:{
+        orderNo: undefined,
+      },
+      open: false,
+      // 遮罩层
+      loading: true,
+      // 总条数
+      total: 0,
+    };
+  },
+  created() {
+
+  },
+  methods: {
+    init(orderNo){
+      this.open = true;
+      this.queryParams.orderNo = orderNo
+      listOrderLogsByOrderNo(this.queryParams).then(response => {
+        this.orderLogsList = response.data;
+        this.loading = false;
+      });
+    },
+  }
+};
+</script>