财务管理：退款管理，合计处理

src/views/finance/refundMr/index.vue

@@ -87,24 +87,32 @@
         </el-form>
       </div>
       <div class="app-container_table app-container-main">
-        <el-row :gutter="10" class="mb8">
+        <!-- <el-row :gutter="10" class="mb8">
           <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-        </el-row>
+        </el-row> -->
         <div class="app-container_table_main">
-          <el-table ref="tables" v-loading="loading" :data="dataList" border height="100%">
+          <el-table 
+            ref="tables" 
+            v-loading="loading" 
+            :data="dataList" 
+            :summary-method="getSummaries"
+            show-summary
+            border 
+            max-height="520px"
+          >
             <el-table-column label="序号" align="center" type="index" width="60"></el-table-column>
-            <el-table-column label="退款单号" align="center" prop="id" />
+            <el-table-column label="退款单号" align="center" prop="id" width="170" />
       <!--      <el-table-column label="原订单号" align="center" prop="orderId" />-->
-            <el-table-column label="原订单号" align="center" prop="orderId" width="160" sortable="custom" >
+            <el-table-column label="原订单号" align="center" prop="orderId" width="170" sortable="custom" >
               <template slot-scope="scope">
                 <el-button type="text" @click="openDetails(scope.row, 'order')">{{ scope.row.orderId }}</el-button>
               </template>
             </el-table-column>
-            <el-table-column label="手机号码" align="center" prop="refundMobile" />
-            <el-table-column label="票种名称" align="center" prop="goodsName" />
-            <el-table-column label="票档名称" align="center" prop="seatTypeName" />
-            <el-table-column label="支付单号" align="center" prop="transactionId" />
-            <el-table-column label="退款金额" align="center" prop="type">
+            <el-table-column label="手机号码" align="center" prop="refundMobile" width="100" />
+            <el-table-column label="票种名称" align="center" prop="goodsName" width="140" />
+            <el-table-column label="票档名称" align="center" prop="seatTypeName" width="120" />
+            <el-table-column label="支付单号" align="center" prop="transactionId" width="170" />
+            <el-table-column label="退款金额" align="center" prop="refundAmount">
               <template slot-scope="scope">
                 <span>{{ scope.row.refundAmount === 0 ? ( '￥' + scope.row.refundAmount) : ('￥-' + scope.row.refundAmount) }}</span>
               </template>
@@ -115,7 +123,7 @@
                 <span>{{ parseTime(scope.row.refundTime) }}</span>
               </template>
             </el-table-column>
-            <el-table-column label="申请状态" align="center" prop="type">
+            <el-table-column label="申请状态" align="center" width="110">
               <template slot-scope="scope">
                 <el-tag v-if="scope.row.status == 0">申请中</el-tag>
                 <el-tag v-if="scope.row.status == 1" type="success">退款成功</el-tag>
@@ -267,6 +275,31 @@ export default {
     cancel() {
       this.open = false;
     },
+    getSummaries(param) {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '合计';
+          return;
+        }
+        const values = data.map(item => Number(item[column.property]));
+        if (!values.every(value => isNaN(value)) && column.property == 'refundAmount') {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          sums[index] = Number(sums[index].toFixed(2));
+        } else {
+          sums[index] = '';
+        }
+      });
+      return sums;
+    },
     /** 搜索按钮操作 */
     handleQuery() {
       this.queryParams.pageNum = 1;