Merge branch 'feat/v20241227-联盟卡消费记录导出' into dev

src/api/business.js

@@ -348,4 +348,24 @@ export function updateShopParticipationRecordApi(data) {
     data,
     method: 'POST'
   })
+}
+
+// 导出联盟卡购买用户记录
+export function exportBuyerPurchasesByByIdApi(params) {
+  return request({
+    url: '/alliance-card/exportBuyerPurchasesByById',
+    params,
+    method: 'GET',
+    responseType: 'blob'
+  })
+}
+
+// 导出联盟卡购买用户记录
+export function exportConsumptionRecordByUserIdAndAllianceCardIdApi(params) {
+  return request({
+    url: '/alliance-card/exportConsumptionRecordByUserIdAndAllianceCardId',
+    params,
+    method: 'GET',
+    responseType: 'blob'
+  })
 }

src/views/business/alliance/components/Buyers.vue

@@ -1,5 +1,9 @@
 <template>
   <div class="join-shop-list-container">
+    {{ cardName }}
+    <div style="display: flex; justify-content: flex-end; margin-bottom: 20px">
+      <el-button @click="handleExport" :loading="isExportLoading" size="mini" type="primary">导出excel</el-button>
+    </div>
     <!-- 查询结果 -->
     <el-table v-loading="listLoading" element-loading-text="正在查询中..." :data="list" v-bind="{ stripe: true, size: 'small', border: true, highlightCurrentRow: true }">
       <el-table-column prop="allianceCardId" label="联盟卡ID" width="90" align="center" />
@@ -18,10 +22,15 @@
           <el-tag v-if="scope.row.state === 2" size="mini" type="success">已支付</el-tag>
         </template>
       </el-table-column>
+      <el-table-column width="120" align="center" prop="cardDeduction" label="联盟卡余额">
+        <template slot-scope="{ row }">
+          <el-tag size="mini" type="success">￥{{ row.cardDeduction }}</el-tag>
+        </template>
+      </el-table-column>
       <el-table-column prop="createTime" label="购买时间" align="center" />
       <el-table-column align="center" label="操作" width="120" fixed="right" class-name="small-padding fixed-width">
         <template slot-scope="{ row }">
-          <el-button size="mini" @click="$refs.consumptionDialogRef && $refs.consumptionDialogRef.handleOpen(row.allianceCardId, row.buyerUserId)">查看消费记录</el-button>
+          <el-button size="mini" @click="$refs.consumptionDialogRef && $refs.consumptionDialogRef.handleOpen(row.allianceCardId, row.buyerUserId, row.buyerUserName)">查看消费记录</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -44,17 +53,20 @@
 </template>
 
 <script>
-import { getBuyerPurchaseByByIdApi } from '@/api/business'
+import { getBuyerPurchaseByByIdApi, exportBuyerPurchasesByByIdApi } from '@/api/business'
 import ConsumptionDialog from './ConsumptionDialog.vue'
+import { exportExcel } from '../utils'
 
 export default {
   components: { ConsumptionDialog },
   props: {
-    cardId: { type: [Number, String], required: true }
+    cardId: { type: [Number, String], required: true },
+    cardName: { type: String, default: '' }
   },
 
   data() {
     return {
+      isExportLoading: false,
       list: [],
       total: 0,
       listLoading: false,
@@ -88,6 +100,17 @@ export default {
       } catch (error) {
         this.listLoading = false
       }
+    },
+
+    handleExport() {
+      exportExcel(
+        this,
+        exportBuyerPurchasesByByIdApi,
+        {
+          allianceCardId: this.listQuery.allianceCardId
+        },
+        `${this.cardName} - 联盟卡购买用户记录`
+      )
     }
   }
 }

src/views/business/alliance/components/ConsumptionDialog.vue

@@ -1,10 +1,13 @@
 <template>
   <el-dialog :close-on-click-modal="false" title="消费记录" :visible.sync="consumptionDialogVisible" width="60%" append-to-body>
     <div class="join-shop-list-container">
+      <div style="display: flex; justify-content: flex-end; margin-bottom: 20px">
+        <el-button @click="handleExport" :loading="isExportLoading" size="mini" type="primary">导出excel</el-button>
+      </div>
       <!-- 查询结果 -->
       <el-table v-loading="listLoading" element-loading-text="正在查询中..." :data="list" v-bind="{ stripe: true, size: 'small', border: true, highlightCurrentRow: true }">
         <el-table-column prop="allianceCardId" label="联盟卡ID" align="center" />
-        <el-table-column prop="buyerUserId" label="购买者会员ID" align="center" />
+        <el-table-column prop="buyerUserId" label="购买者会员ID" align="center" width="120" />
         <el-table-column prop="shopId" label="商家ID" align="center" />
         <el-table-column prop="shopName" label="商家名称" align="center" />
         <el-table-column prop="amount" label="消费金额" align="center">
@@ -12,7 +15,19 @@
             <el-tag size="mini" type="danger">￥{{ scope.row.amount }}</el-tag>
           </template>
         </el-table-column>
-        <el-table-column prop="createTime" label="消费时间" align="center" />
+        <el-table-column prop="amount" label="到账比例" align="center">
+          <template slot-scope="scope">
+            <el-tag size="mini" type="success">{{ ((scope.row.settlementRatio || 0) * 100).toFixed(2) + '%' }}</el-tag>
+          </template>
+        </el-table-column>
+
+        <el-table-column width="160" prop="amount" label="商家实际到账金额" align="center">
+          <template slot-scope="scope">
+            <el-tag size="mini" type="success">￥{{ scope.row.actualAmountReceived || 0 }}</el-tag>
+          </template>
+        </el-table-column>
+
+        <el-table-column width="160" prop="createTime" label="消费时间" align="center" />
       </el-table>
 
       <div style="margin-top: 10px">
@@ -31,7 +46,8 @@
 </template>
 
 <script>
-import { getConsumptionRecordByUserIdAndAllianceCardIdApi } from '@/api/business'
+import { getConsumptionRecordByUserIdAndAllianceCardIdApi, exportConsumptionRecordByUserIdAndAllianceCardIdApi } from '@/api/business'
+import {exportExcel} from '../utils'
 
 export default {
   data() {
@@ -45,19 +61,22 @@ export default {
         page: 1,
         pageSize: 20
       },
-      consumptionDialogVisible: false
+      consumptionDialogVisible: false,
+      isExportLoading: false,
+      memberName: ""
     }
   },
 
   methods: {
     // 打开
-    handleOpen(allianceCardId, buyerUserId) {
+    handleOpen(allianceCardId, buyerUserId, memberName) {
       if (!allianceCardId || !buyerUserId) {
         return this.$message.error('数据错误')
       }
       this.listQuery.allianceCardId = allianceCardId
       this.listQuery.buyerUserId = buyerUserId
       this.consumptionDialogVisible = true
+      this.memberName = memberName
       this.getList()
     },
 
@@ -72,6 +91,18 @@ export default {
       } catch (error) {
         this.listLoading = false
       }
+    },
+
+    handleExport() {
+      exportExcel(
+        this,
+        exportConsumptionRecordByUserIdAndAllianceCardIdApi,
+        {
+          allianceCardId: this.listQuery.allianceCardId,
+          buyerUserId: this.listQuery.buyerUserId
+        },
+        `${this.memberName} - 联盟卡用户消费记录`
+      )
     }
   }
 }

src/views/business/alliance/components/DetailDialog.vue

@@ -8,7 +8,7 @@
         <JoinShop :card-id="baseInfo.id"></JoinShop>
       </el-tab-pane>
       <el-tab-pane label="购买用户" name="third">
-        <Buyers :card-id="baseInfo.id"></Buyers>
+        <Buyers :card-id="baseInfo.id"  :cardName="baseInfo.name"></Buyers>
       </el-tab-pane>
     </el-tabs>
   </el-dialog>

src/views/business/alliance/utils.js

@@ -0,0 +1,36 @@
+import { parseTime } from '@/utils'
+/**
+ * @description 导出excel
+ * @param {*} ctx
+ * @param {*} api
+ */
+export const exportExcel = async (ctx, api, data = {}, fileName = 'excel数据') => {
+  try {
+    ctx.isExportLoading = true
+    const res = await api(data)
+
+    if (!res) {
+      return ctx.$message.error('没有导出数据')
+    }
+
+    fileName += ' - ' + parseTime(new Date().getTime(), '{y}-{m}-{d}') + '.xlsx'
+    const blob = new Blob([res])
+    if ('download' in document.createElement('a')) {
+      // 非IE下载
+      const elink = document.createElement('a')
+      elink.download = fileName
+      elink.style.display = 'none'
+      elink.href = URL.createObjectURL(blob)
+      document.body.appendChild(elink)
+      elink.click()
+      URL.revokeObjectURL(elink.href) // 释放URL 对象
+      document.body.removeChild(elink)
+    } else {
+      // IE10+下载
+      navigator.msSaveBlob(blob, fileName)
+    }
+  } catch (error) {
+  } finally {
+    ctx.isExportLoading = false
+  }
+}