完成了用户提现申请中流水的统计及表格的展示

src/api/application.js

@@ -62,4 +62,22 @@ export function edidCommission(data){
     method:"post",
     data
   })
+}
+
+// 查询当前用户的信息
+export function getUserWater(params){
+  return request({
+    url:"/buyer_withdrawal/getDistributor",
+    method:"get",
+    params
+  })
+}
+
+// 流水记录查询
+export function getWaterRecord(params){
+  return request({
+    url:"/platformUserCommissionRecord/page",
+    method:"get",
+    params
+  })
 }

src/views/finance/application/index.vue

@@ -68,7 +68,8 @@
     </div>
     <!-- *****************弹框开始***************** -->
     <!-- 详情弹框 -->
-    <el-dialog :visible.sync="dioObj.show" :title="dioObj.title" width="40%" center :close-on-click-modal="false" @close="closeDialog">
+    <el-dialog :visible.sync="dioObj.show" :title="dioObj.title" width="40%" center :close-on-click-modal="false"
+      @close="closeDialog">
       <div class="box">
         <div class="dioBox">
           <div v-for="(item, index) in infoList" :key="index" class="inner">{{ item.name }}:{{ item.value }}</div>
@@ -76,10 +77,60 @@
         <div v-if="dioObj.type === 2" class="botTitle">*请确认您已转账成功，再点击确认</div>
       </div>
       <span slot="footer" class="dialog-footer">
-        <el-button v-if="dioObj.type === 2" type="primary" @click="agreeEn(1)">{{  confirmInfo }}</el-button>
+        <el-button v-if="dioObj.type === 2" type="primary" @click="agreeEn(1)">{{ confirmInfo }}</el-button>
         <el-button v-if="dioObj.type === 2" type="danger" @click="agreeEn(2)">拒绝打款</el-button>
         <el-button v-if="dioObj.type === 1" @click="closeDialog">关 闭</el-button>
       </span>
+      <div class="statistics">
+        <div class="statistics-item">
+          <h1>{{ watherInfo.price }}</h1>
+          <p>账户可提现金额</p>
+        </div>
+        <div class="statistics-item">
+          <h1>{{ watherInfo.totalPrice }}</h1>
+          <p>账户总金额</p>
+        </div>
+        <div class="statistics-item">
+          <h1>{{ watherInfo.pendingWithdrawal }}</h1>
+          <p>提现中</p>
+        </div>
+        <div class="statistics-item">
+          <h1>{{ watherInfo.alreadyPrice }}</h1>
+          <p>已提现</p>
+        </div>
+      </div>
+      <div class="tabbar-list">
+        <el-table :data="waterData" v-loading="watherFlag" border
+          :header-cell-style="{ background: '#EEF3FF', color: '#333333' }" style="width: 100%">
+          >
+          <el-table-column prop="price" label="支付金额"></el-table-column>
+          <el-table-column prop="paymentTime" label="支付时间" />
+          <el-table-column prop="customerName" label="支付名称" />
+          <el-table-column prop="customerPhone" label="支付电话" />
+          <el-table-column prop="transactionId" label="通联流水号" />
+          <el-table-column label="来源类型">
+            <template slot-scope="scope">
+              <span v-if="scope.row.type == 1">关系链</span>
+              <span v-if="scope.row.type == 2">商城</span>
+              <span v-if="scope.row.type == 3">本地</span>
+              <span v-if="scope.row.type == 4">服务</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态">
+            <template slot-scope="scope">
+              <span v-if="scope.row.isTo == 0">订单</span>
+              <span v-if="scope.row.isTo == 1">确认收货</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="proportion" label="佣金比例" />
+          <el-table-column prop="amount" label="分配的佣金" />
+          <el-table-column prop="totalAmount" label="佣金总金额" />
+        </el-table>
+      </div>
+      <div class="dialog-pagination" v-show="false">
+        <el-pagination layout="prev, pager, next" :total="waterData.length" :page-size="5" @current-change="waterChange">
+        </el-pagination>
+      </div>
     </el-dialog>
   </div>
 </template>
@@ -90,7 +141,9 @@ import { hidden } from '@/utils/index'
 import {
   applicationGetAll,
   applicationGetById,
-  applicationHandle
+  applicationHandle,
+  getUserWater,
+  getWaterRecord
 } from '@/api/application'
 export default {
   data() {
@@ -120,7 +173,17 @@ export default {
       //  拒绝打款理由
       rejectReason: "",
       //  控制确认信息和确认打款
-      confirmInfo:"确认信息"
+      confirmInfo: "确认信息",
+      // 流水信息表格数据
+      waterData: [],
+      watherInfo: {},
+      // 获取流水数据参数
+      watherParameter: {
+        current: 1,
+        size: 5,
+        buyerUserId: ""
+      },
+      watherFlag: true
     }
   },
   created() {
@@ -155,10 +218,17 @@ export default {
       }
       this.getAll(this.formInline)
     },
-    getTopList(o) {
+    async getTopList(o) {
       this.infoList.map((item) => {
         item.value = o[item.fields]
       })
+      //  在这里获取统计的流水
+      try {
+        let res = await getUserWater({ userId: o.buyerUserId })
+        this.watherInfo = res.data
+      } catch (error) {
+      }
+      this.getWatherTable(o.buyerUserId)
     },
     // 查看
     seeMore(row) {
@@ -190,7 +260,7 @@ export default {
         });
         this.$message.success('确认信息成功，请确认打款')
         this.confirmInfo = "确认打款";
-      }else if(index === 1 && this.confirmInfo == "确认打款"){
+      } else if (index === 1 && this.confirmInfo == "确认打款") {
         const res = await applicationHandle({
           withdrawalId: this.dioObj.arr.withdrawalId,
           state: 3
@@ -249,11 +319,31 @@ export default {
       })
       this.total = res.data.total
     },
+    //  获取流水表格数据
+    async getWatherTable(id) {
+      this.watherFlag = true
+      //  获取流水表格数据
+      this.watherParameter.buyerUserId = id
+      try {
+        let res = await getWaterRecord(this.watherParameter)
+        this.waterData = res.data.records
+        console.log(res.data.records);
+        this.watherFlag = false
+      } catch (error) {
+
+      }
+    },
+    //  表格分页
+    waterChange(e){
+      console.log(e);
+    },
     //  关闭弹窗的回调
     closeDialog() {
       this.dioObj.show = false
       this.rejectReason = "";
       this.confirmInfo = "确认信息";
+      // 清除流水表格信息 以及 load加载状态
+      this.waterData = []
       console.log(this.dioObj);
       this.infoList = this.infoList.filter(item => item.fields != 'rejectReason');
     }
@@ -286,5 +376,27 @@ export default {
     text-align: center;
   }
 }
-</style>
 
+.statistics {
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  width: 100%;
+  margin: 10px 0 15px;
+
+  .statistics-item {
+    text-align: center;
+
+    h1 {
+      color: #ffae11;
+      font-size: 20px;
+    }
+  }
+}
+.dialog-pagination{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 15px;
+}
+</style>