幸运24-记录-个人明细

src/api/luckGift/luckGift.js

@@ -68,3 +68,17 @@ export const updateUserMulti = query => {
         params: query
     });
 };
+// 获取明细
+export const pageRecord = query => {
+    return request({
+        url: '/admin/lucky24/record/page',
+        method: 'get',
+        params: query
+    });
+};
+
+// 导出明细
+export const exportRecord = query => {
+    window.location.href = `/admin/lucky24/record/export?${genQueryParam(query)}`;
+    return;
+};

src/views/luckGift/luckGiftData.vue

@@ -52,6 +52,55 @@
       >
     </div>
 
+    <!-- 编辑弹窗 -->
+    <el-dialog v-model="recordDialog.show"
+               v-model:title="recordDialog.title"
+               @close="closeRecordDialog"
+               label-width="auto"
+               width="82%" center>
+      <!-- 表格 -->
+      <el-table
+          v-loading="pageRecord.loading"
+          :data="pageRecord.data"
+          border
+          style="width: 100%; margin-top: 25px"
+      >
+        <el-table-column prop="createTime" align="center" label="时间" />
+        <el-table-column prop="partitionDesc" align="center" label="分区" />
+        <el-table-column prop="erbanNo" align="center" label="平台id" />
+        <el-table-column prop="nick" align="center" label="昵称" />
+        <el-table-column prop="receiverErbanNo" align="center" label="收礼者平台id" />
+        <el-table-column prop="receiverNick" align="center" label="收礼者昵称" />
+        <el-table-column prop="roomErbanNo" align="center" label="房间id" />
+        <el-table-column prop="giftId" align="center" label="礼物id" />
+        <el-table-column prop="giftName" align="center" label="礼物名称" />
+        <el-table-column prop="giftGoldPrice" align="center" label="礼物价格" />
+        <el-table-column prop="giftNum" align="center" label="数量" />
+        <el-table-column prop="input" align="center" label="进入" />
+
+        <el-table-column prop="poolId" align="center" label="poolId" />
+        <el-table-column prop="expect" align="center" label="期望值" />
+
+        <el-table-column prop="isSupplement" align="center" label="本次是否后台赠送" />
+        <el-table-column prop="drawMultiple" align="center" label="数组倍数" />
+        <el-table-column prop="afterMultiple" align="center" label="最终倍数" />
+        <el-table-column prop="winGoldNum" align="center" label="退出" />
+      </el-table>
+
+      <!-- 分页 -->
+      <el-pagination
+          style="margin-top: 10px"
+          class="paginationClass"
+          v-model:current-page="pageRecord.pageNo"
+          v-model:page-size="pageRecord.pageSize"
+          :page-sizes="[50, 100, 200, 500]"
+          layout="sizes, prev, pager, next"
+          :total="pageRecord.total"
+          @size-change="handleRecordPageChange"
+          @current-change="handleRecordPageChange"
+      />
+    </el-dialog>
+
     <!-- 表格 -->
     <el-table
       v-loading="loading"
@@ -74,6 +123,12 @@
       <el-table-column prop="num" align="center" label="总次数" />
       <el-table-column prop="winNum" align="center" label="得到次数" />
       <el-table-column prop="winRate" align="center" label="得到率" />
+      <el-table-column align="center" label="操作" width="180">
+        <template v-slot="scope">
+          <el-button class="primary" type="primary"  @click="openRecordDialog(scope.row)">明细</el-button>
+          <el-button v-loading="exportLoading" @click="exportRecord(scope.row)">导出</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <!-- 分页 -->
@@ -127,13 +182,14 @@
   </div>
 </template>
 <script>
-import { personal, updateUserMulti } from "@/api/luckGift/luckGift";
+import { personal, updateUserMulti, pageRecord, exportRecord } from "@/api/luckGift/luckGift";
 // @ts-ignore
 import { dateFormat } from "@/utils/system-helper";
 // @ts-ignore
 import { ElMessage } from "element-plus";
 import moment from "moment-timezone";
 import PartitionSelect from "@/views/common/partitionSelect.vue";
+import {genQueryParam} from "@/utils/maintainer";
 export default {
   name: "luckGiftData",
   components: {
@@ -160,7 +216,24 @@ export default {
       editDialog: false,
       editDialogTitle: "",
       value: "",
-      butClick:false
+      butClick:false,
+
+      recordDialog: {
+        show: false,
+        title: "",
+      },
+
+      pageRecord: {
+        uid: undefined,
+        date: undefined,
+        loading: false,
+        data: [],
+        total: 0,
+        pageNo: 1,
+        pageSize: 50,
+      },
+
+      exportLoading: false,
     };
   },
   methods: {
@@ -224,6 +297,59 @@ export default {
     handleCurrentChange() {
       this.getData();
     },
+    openRecordDialog(row) {
+      this.recordDialog.show = true;
+      this.recordDialog.title = '[' + row.erbanNo + ']' + row.date + '明细';
+      this.pageRecord.uid = row.uid;
+      this.pageRecord.date = row.date;
+      this.pageRecordData();
+    },
+    closeRecordDialog() {
+      this.recordDialog.show = false;
+      this.recordDialog.title = undefined;
+      this.pageRecord.uid = undefined;
+      this.pageRecord.date = undefined;
+    },
+    // 分页导航
+    handleRecordPageChange() {
+      this.pageRecord();
+    },
+    pageRecordData() {
+      if (!this.pageRecord.uid && !this.pageRecord.date) {
+        ElMessage({
+          showClose: true,
+          message: "时间和ID至少填一项",
+          type: "error",
+        });
+        return;
+      }
+      this.pageRecord.loading = true;
+      pageRecord({
+        uid: this.pageRecord.uid,
+        date: this.pageRecord.date,
+        pageNo: this.pageRecord.pageNo,
+        pageSize: this.pageRecord.pageSize,
+      }).then((res) => {
+        if (res.code !== 200){
+          throw new Error(res.msg);
+        }
+        this.pageRecord.total = res.data.total;
+        this.pageRecord.data = res.data.rows;
+      }).catch((error) => {
+        ElMessage({
+          showClose: true,
+          message: error.message,
+          type: "error",
+        });
+      }).finally(() => {
+        this.pageRecord.loading = false;
+      });
+    },
+    exportRecord(row){
+      this.exportLoading = true;
+      exportRecord({uid:row.uid, date:row.date})
+      this.exportLoading = false;
+    },
   },
 };
 </script>