From e2c34e58638fc6e811012ddcf198e2d60c4243a5 Mon Sep 17 00:00:00 2001
From: Dragon <13925835632@139.com>
Date: Wed, 20 Dec 2023 14:50:49 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=88=BF=E9=97=B4=E6=B5=81?=
 =?UTF-8?q?=E6=B0=B4=E7=AD=9B=E9=80=89bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/room/RoomSerialView.vue | 610 ++++++++++++++++--------------
 1 file changed, 325 insertions(+), 285 deletions(-)

diff --git a/src/views/room/RoomSerialView.vue b/src/views/room/RoomSerialView.vue
index b39fe4f..8a94642 100644
--- a/src/views/room/RoomSerialView.vue
+++ b/src/views/room/RoomSerialView.vue
@@ -1,311 +1,351 @@
 <template>
-    <section class="content-header">
-        <h1 id="itemTitle"></h1>
-    </section>
-    <!-- .content -->
-    <section class="content">
-        <div id="table"></div>
-        <div id="toolbar">
-            <div class="col-sm-12">
-                <div class="big-tips">
-                    数据量过大，不再默认加载所有的数据，请先选择时间后，再点查询按钮
-                </div>
-                <form id="searchForm" action="/admin/roomSerial/export.action" method="POST">
-                    房主平台号(多个查询以英文逗号分隔): <input type="text" name="erbanNos" id="erbanNos" class="input-sm">
-                    选择时间: <input type="text" name="startTime" id="startTime" class="input-sm">
-                    至 <input type="text" id="endTime" name="endTime" class="input-sm">
-                    房间类型:
-                    <select name="isPermit" id="isPermit" data-btn-class="btn-warning">
-                        <option value="0">全部</option>
-                        <option value="1">牌照房</option>
-                        <option value="3">新秀房</option>
-                        <!--<option value="4">个播房</option>-->
-                        <option value="4">个播房</option>
-                    </select>
-                </form>
-            </div>
-            <div class="col-sm-8">
-                <button id="room-serial-refresh" class="btn btn-default">
-                    <i class="glyphicon glyphicon-wrench"></i>查询
-                </button>
-                <button id="room-serial-export" class="btn btn-default">
-                    <i class="glyphicon glyphicon-plus"></i>导出
-                </button>
-            </div>
-        </div>
-    </section><!-- .content -->
-
-    <div class="modal fade" id="tipModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
-        <div class="modal-dialog" role="document">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <h4 class="modal-title">提示信息</h4>
-                </div>
-                <div class="modal-body" id="tipMsg"></div>
-            </div>
+  <section class="content-header">
+    <h1 id="itemTitle"></h1>
+  </section>
+  <!-- .content -->
+  <section class="content">
+    <div id="table"></div>
+    <div id="toolbar">
+      <div class="col-sm-12">
+        <div class="big-tips">
+          数据量过大，不再默认加载所有的数据，请先选择时间后，再点查询按钮
         </div>
+        <form id="searchForm" action="/admin/roomSerial/export.action" method="POST">
+          房主平台号(多个查询以英文逗号分隔):
+          <input type="text" name="erbanNos" id="erbanNos" class="input-sm"  style="margin-right: 40px;display: inline-block;"/> 选择时间:
+          <input type="text" name="startTime" id="startTime" class="input-sm" /> 至
+          <input type="text" id="endTime" name="endTime" class="input-sm" />
+          <br />
+          <div style="width: 60%">
+            房间类型:
+            <select name="isPermit" id="isPermit" class="input-sm" style="width: 30%;display: inline-block;">
+              <option value="0">全部</option>
+              <option value="1">牌照房</option>
+              <option value="3">新秀房</option>
+              <!--<option value="4">个播房</option>-->
+              <option value="4">个播房</option>
+            </select>
+          </div>
+        </form>
+      </div>
+      <div class="col-sm-8">
+        <button id="room-serial-refresh" class="btn btn-default">
+          <i class="glyphicon glyphicon-wrench"></i>查询
+        </button>
+        <button id="room-serial-export" class="btn btn-default">
+          <i class="glyphicon glyphicon-plus"></i>导出
+        </button>
+      </div>
     </div>
+  </section>
+  <!-- .content -->
 
-
-    <div class="modal fade" id="roomGiftSerialDetailModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
-        <div class="modal-dialog" role="document">
-            <div class="modal-content">
-                <div class="modal-header">
-                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
-                            aria-hidden="true">&times;</span>
-                    </button>
-                    <h4 class="modal-title" id="roomGiftSerialDetailModalTitle">房间明细</h4>
-                </div>
-                <div class="modal-body">
-                    <div class="summary col-sm-12">
-                        <div class="col-sm-6">
-                            <span>房间ID：</span>
-                            <span id="roomId"></span>
-                        </div>
-                        <div class="col-sm-6">
-                            <span>房间昵称：</span>
-                            <span id="roomTitle"></span>
-                        </div>
-                        <div class="col-sm-6">
-                            <span>收礼总钻石：</span>
-                            <span id="totalDiamonds"></span>
-                        </div>
-                        <div class="col-sm-6">
-                            <span>房间抽成钻石数：</span>
-                            <span id="cutDiamonds"></span>
-                        </div>
-                    </div>
-                    <div id="roomGiftSerialDetailTable"></div>
-                </div>
-                <div class="modal-footer">
-                    <h4 id="roundDetailModalFooter"></h4>
-                    <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
-                </div>
-
-            </div>
+  <div
+    class="modal fade"
+    id="tipModal"
+    tabindex="-1"
+    role="dialog"
+    aria-labelledby="modalLabel"
+  >
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h4 class="modal-title">提示信息</h4>
         </div>
+        <div class="modal-body" id="tipMsg"></div>
+      </div>
     </div>
+  </div>
+
+  <div
+    class="modal fade"
+    id="roomGiftSerialDetailModal"
+    tabindex="-1"
+    role="dialog"
+    aria-labelledby="modalLabel"
+  >
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+          <h4 class="modal-title" id="roomGiftSerialDetailModalTitle">房间明细</h4>
+        </div>
+        <div class="modal-body">
+          <div class="summary col-sm-12">
+            <div class="col-sm-6">
+              <span>房间ID：</span>
+              <span id="roomId"></span>
+            </div>
+            <div class="col-sm-6">
+              <span>房间昵称：</span>
+              <span id="roomTitle"></span>
+            </div>
+            <div class="col-sm-6">
+              <span>收礼总钻石：</span>
+              <span id="totalDiamonds"></span>
+            </div>
+            <div class="col-sm-6">
+              <span>房间抽成钻石数：</span>
+              <span id="cutDiamonds"></span>
+            </div>
+          </div>
+          <div id="roomGiftSerialDetailTable"></div>
+        </div>
+        <div class="modal-footer">
+          <h4 id="roundDetailModalFooter"></h4>
+          <button type="button" class="btn btn-default" data-dismiss="modal">确定</button>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
-import TableHelper from '@/utils/bootstrap-table-helper';
-import ComboboxHelper from '@/assets/plugins/bootstrap-combobox/js/bootstrap-combobox-helper';
-import { serverError } from '@/utils/maintainer';
+import TableHelper from "@/utils/bootstrap-table-helper";
+import ComboboxHelper from "@/assets/plugins/bootstrap-combobox/js/bootstrap-combobox-helper";
+import { serverError } from "@/utils/maintainer";
 
 export default {
-    name: "RoomSerialView",
-    setup() {
-        return {};
-    },
-    created() {
-        this.$nextTick(function () {
-            this.initData();
+  name: "RoomSerialView",
+  setup() {
+    return {};
+  },
+  created() {
+    this.$nextTick(function () {
+      this.initData();
+    });
+  },
+  methods: {
+    initData() {
+      // ComboboxHelper.build(null, '#isPermit');
+      $(function () {
+        $("#table").bootstrapTable("destroy");
+        $("#table").bootstrapTable({
+          columns: [
+            { field: "userNick", title: "用户名称", align: "center", width: "20%" },
+            { field: "userErbanNo", title: "房主平台号", align: "center", width: "15%" },
+            { field: "totalGold", title: "总流水", align: "center", width: "10%" },
+            {
+              field: "normalTotalGold",
+              title: "普通礼物流水",
+              align: "center",
+              width: "10%",
+            },
+            {
+              field: "backpackTotalGold",
+              title: "背包礼物流水",
+              align: "center",
+              width: "10%",
+            },
+            { field: "totalRadish", title: "萝卜流水", align: "center", width: "10%" },
+            { field: "roomTitle", title: "房间标题", align: "center", width: "10%" },
+            { field: "executionTime", title: "统计时间", align: "center", width: "15%" },
+            { field: "executionTime", title: "统计时间", align: "center", width: "15%" },
+            {
+              field: "id",
+              title: "操作",
+              align: "center",
+              width: "10%",
+              formatter: function (val, row, index) {
+                const roomUid = row.roomUid;
+                console.log("roomUid", roomUid);
+                return (
+                  '<button id="btnDetail" name="btnDetail" class="btn btn-sm btn-info opt-detail" roomUid=' +
+                  roomUid +
+                  ">" +
+                  '<i class="glyphicon glyphicon-file"></i> 查看明细</button>' +
+                  '<button id="btnExport" name="btnExport" class="btn btn-sm btn-success opt-export" roomUid=' +
+                  roomUid +
+                  '><i class="glyphicon glyphicon-export"></i>导出明细</button>'
+                );
+              },
+            },
+          ],
+          undefinedText: 0,
+          cache: false,
+          striped: true,
+          showRefresh: false,
+          pageSize: 10,
+          pagination: true,
+          pageList: [1, 10, 20, 30, 50],
+          search: false,
+          sidePagination: "server", //表示服务端请求
+          //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
+          //设置为limit可以获取limit, offset, search, sort, order
+          queryParamsType: "undefined",
+          queryParams: function queryParams(params) {
+            //设置查询参数
+            var param = {
+              pageNumber: params.pageNumber,
+              pageSize: params.pageSize,
+              searchText: params.searchText,
+              erbanNos: $("#erbanNos").val(),
+              startTime: $("#startTime").val(),
+              endTime: $("#endTime").val(),
+              isPermit: ComboboxHelper.getSelected("#isPermit"),
+            };
+            return param;
+          },
+          toolbar: "#toolbar",
+          url: "",
+          onLoadSuccess: function () {
+            //加载成功时执行
+            console.log("load success");
+            enableRefreshBtn();
+          },
+          onLoadError: function () {
+            //加载失败时执行
+            console.log("load fail");
+          },
         });
-    },
-    methods: {
-        initData() {
-            ComboboxHelper.build(null, '#isPermit');
-            $(function () {
-                $('#table').bootstrapTable('destroy');
-                $('#table').bootstrapTable({
-                    columns: [
-                        { field: 'userNick', title: '用户名称', align: 'center', width: '20%' },
-                        { field: 'userErbanNo', title: '房主平台号', align: 'center', width: '15%' },
-                        { field: 'totalGold', title: '总流水', align: 'center', width: '10%' },
-                        { field: 'normalTotalGold', title: '普通礼物流水', align: 'center', width: '10%' },
-                        { field: 'backpackTotalGold', title: '背包礼物流水', align: 'center', width: '10%' },
-                        { field: 'totalRadish', title: '萝卜流水', align: 'center', width: '10%' },
-                        { field: 'roomTitle', title: '房间标题', align: 'center', width: '10%' },
-                        { field: 'executionTime', title: '统计时间', align: 'center', width: '15%' },
-                        { field: 'executionTime', title: '统计时间', align: 'center', width: '15%' },
-                        {
-                            field: 'id',
-                            title: '操作',
-                            align: 'center',
-                            width: '10%',
-                            formatter: function (val, row, index) {
-                                const roomUid = row.roomUid;
-                                console.log("roomUid", roomUid)
-                                return '<button id="btnDetail" name="btnDetail" class="btn btn-sm btn-info opt-detail" roomUid=' + roomUid + '>' +
-                                    '<i class="glyphicon glyphicon-file"></i> 查看明细</button>' +
-                                    '<button id="btnExport" name="btnExport" class="btn btn-sm btn-success opt-export" roomUid=' + roomUid +
-                                    '><i class="glyphicon glyphicon-export"></i>导出明细</button>';
-                            }
-                        }
-                    ],
-                    undefinedText: 0,
-                    cache: false,
-                    striped: true,
-                    showRefresh: false,
-                    pageSize: 10,
-                    pagination: true,
-                    pageList: [1, 10, 20, 30, 50],
-                    search: false,
-                    sidePagination: "server", //表示服务端请求
-                    //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
-                    //设置为limit可以获取limit, offset, search, sort, order
-                    queryParamsType: "undefined",
-                    queryParams: function queryParams(params) {   //设置查询参数
-                        var param = {
-                            pageNumber: params.pageNumber,
-                            pageSize: params.pageSize,
-                            searchText: params.searchText,
-                            erbanNos: $("#erbanNos").val(),
-                            startTime: $("#startTime").val(),
-                            endTime: $("#endTime").val(),
-                            isPermit: ComboboxHelper.getSelected("#isPermit")
-                        };
-                        return param;
-                    },
-                    toolbar: '#toolbar',
-                    url: '',
-                    onLoadSuccess: function () {  //加载成功时执行
-                        console.log("load success");
-                        enableRefreshBtn();
-                    },
-                    onLoadError: function () {  //加载失败时执行
-                        console.log("load fail");
-                    }
-                });
 
-                $('#startTime').datetimepicker({
-                    todayBtn: true,
-                    format: 'yyyy-mm-dd hh:ii:00',
-                    language: 'zh-CN',
-                    autoclose: true
-                })
+        $("#startTime").datetimepicker({
+          todayBtn: true,
+          format: "yyyy-mm-dd hh:ii:00",
+          language: "zh-CN",
+          autoclose: true,
+        });
 
-                $("#endTime").datetimepicker({
-                    todayBtn: true,
-                    format: 'yyyy-mm-dd hh:ii:00',
-                    language: 'zh-CN',
-                    autoclose: true
-                });
+        $("#endTime").datetimepicker({
+          todayBtn: true,
+          format: "yyyy-mm-dd hh:ii:00",
+          language: "zh-CN",
+          autoclose: true,
+        });
 
-                $("#room-serial-refresh").click(function () {
-                    disableRefreshBtn();
-                    $("#table").bootstrapTable('refresh', { url: '/admin/roomSerial/listByPage' });
-                })
+        $("#room-serial-refresh").click(function () {
+          disableRefreshBtn();
+          $("#table").bootstrapTable("refresh", { url: "/admin/roomSerial/listByPage" });
+        });
 
-                $("#room-serial-export").click(function () {
-                    $("#searchForm").submit();
-                })
+        $("#room-serial-export").click(function () {
+          $("#searchForm").submit();
+        });
 
-                $("#erbanNos").change(function () {
-                    ComboboxHelper.setDef("#isPermit", '0');
-                    if ($(this).val() == '') {
-                        $("#isPermit").btComboBox('enable');
-                    } else {
-                        $("#isPermit").btComboBox('disable');
-                    }
-                })
+        $("#erbanNos").change(function () {
+          ComboboxHelper.setDef("#isPermit", "0");
+          if ($(this).val() == "") {
+            $("#isPermit").btComboBox("enable");
+          } else {
+            $("#isPermit").btComboBox("disable");
+          }
+        });
 
-                function disableRefreshBtn() {
-                    $('#room-serial-refresh').attr("disabled", "true");
-                }
-
-                function enableRefreshBtn() {
-                    $('#room-serial-refresh').removeAttr("disabled");
-                }
-
-                // 导出房间流水明细
-                $('#table').on('click', '.opt-export', function () {
-                    const roomUid = $(this).attr("roomUid");
-                    const start = $('#startTime').val();
-                    const end = $('#endTime').val();
-                    console.log("--------roomUid", roomUid, start, end);
-                    window.location.href = `/admin/roomSerial/exportRoomRevenueDetail?roomUid=${roomUid}&start=${start}&end=${end}`
-                });
-
-                $('#table').on('click', '.opt-detail', function () {
-                    const roomUid = $(this).attr("roomUid");
-                    const start = $('#startTime').val();
-                    const end = $('#endTime').val();
-                    $('#roomGiftSerialDetailTable').bootstrapTable('destroy');
-                    $('#roomGiftSerialDetailTable').bootstrapTable({
-                        columns: [
-                            { field: 'num', title: '序号', align: 'center', width: '5%' },
-                            { field: 'erbanNo', title: '平台号', align: 'center', width: '5%' },
-                            { field: 'nick', title: '昵称', align: 'center', width: '5%' },
-                            { field: 'amount', title: '收礼总钻石', align: 'center', width: '5%' },
-                            { field: 'cutDiamonds', title: '房间抽成钻石', align: 'center', width: '5%' },
-                            { field: 'bigAmount', title: '大光礼物价值', align: 'center', width: '5%', },
-                            { field: 'bigNum', title: '大光礼物数量', align: 'center', width: '5%', }
-                        ],
-                        undefinedText: 0,
-                        cache: false,
-                        striped: true,
-                        showRefresh: false,
-                        pageSize: 20,
-                        pagination: true,
-                        pageList: [20, 50, 100, 200],
-                        search: false,
-                        sidePagination: "server", //表示服务端请求
-                        queryParamsType: "undefined",
-                        queryParams: function queryParams(params) {   //设置查询参数
-                            var param = {
-                                page: params.pageNumber,
-                                pageSize: params.pageSize,
-                                start: start,
-                                end: end,
-                                roomUid: roomUid,
-                            };
-                            return param;
-                        },
-                        ajax: function (request) {                    //使用ajax请求
-                            $.ajax({
-                                type: "GET",
-                                url: '/admin/roomSerial/listRoomRevenueDetail.action',
-                                contentType: 'application/json;charset=utf-8',
-                                dataType: 'json',
-                                data: request.data,
-                                success: function (res) {
-                                    console.log('res-------', res)
-                                    apiResult(res);
-                                    request.success({
-                                        rows: res.data.rows,
-                                        total: res.data.total,
-                                    });
-                                    $("#roomId").html(res.data.roomId);
-                                    $("#roomTitle").html(res.data.roomTitle);
-                                    $("#totalDiamonds").html(res.data.totalDiamonds);
-                                    $("#cutDiamonds").html(res.data.cutDiamonds);
-                                    $("#roomGiftSerialDetailModal").modal('show');
-                                },
-                                error: function (req) {
-                                    serverError(req);
-                                }
-                            })
-                        },
-                        onLoadSuccess: function (res) {  //加载成功时执行
-                            console.log("load success");
-                        },
-                        onLoadError: function () {  //加载失败时执行
-                            console.log("load fail");
-                        }
-                    });
-                });
-
-                function apiResult(json) {
-                    if (json.code == 200 && json.message == 'success') {
-                        return true;
-                    }
-                    $("#tipMsg").text("请求失败，错误信息：" + json.message);
-                    $("#tipModal").modal('show');
-                    return false;
-                }
-
-            });
+        function disableRefreshBtn() {
+          $("#room-serial-refresh").attr("disabled", "true");
         }
-    },
 
+        function enableRefreshBtn() {
+          $("#room-serial-refresh").removeAttr("disabled");
+        }
+
+        // 导出房间流水明细
+        $("#table").on("click", ".opt-export", function () {
+          const roomUid = $(this).attr("roomUid");
+          const start = $("#startTime").val();
+          const end = $("#endTime").val();
+          console.log("--------roomUid", roomUid, start, end);
+          window.location.href = `/admin/roomSerial/exportRoomRevenueDetail?roomUid=${roomUid}&start=${start}&end=${end}`;
+        });
+
+        $("#table").on("click", ".opt-detail", function () {
+          const roomUid = $(this).attr("roomUid");
+          const start = $("#startTime").val();
+          const end = $("#endTime").val();
+          $("#roomGiftSerialDetailTable").bootstrapTable("destroy");
+          $("#roomGiftSerialDetailTable").bootstrapTable({
+            columns: [
+              { field: "num", title: "序号", align: "center", width: "5%" },
+              { field: "erbanNo", title: "平台号", align: "center", width: "5%" },
+              { field: "nick", title: "昵称", align: "center", width: "5%" },
+              { field: "amount", title: "收礼总钻石", align: "center", width: "5%" },
+              {
+                field: "cutDiamonds",
+                title: "房间抽成钻石",
+                align: "center",
+                width: "5%",
+              },
+              { field: "bigAmount", title: "大光礼物价值", align: "center", width: "5%" },
+              { field: "bigNum", title: "大光礼物数量", align: "center", width: "5%" },
+            ],
+            undefinedText: 0,
+            cache: false,
+            striped: true,
+            showRefresh: false,
+            pageSize: 20,
+            pagination: true,
+            pageList: [20, 50, 100, 200],
+            search: false,
+            sidePagination: "server", //表示服务端请求
+            queryParamsType: "undefined",
+            queryParams: function queryParams(params) {
+              //设置查询参数
+              var param = {
+                page: params.pageNumber,
+                pageSize: params.pageSize,
+                start: start,
+                end: end,
+                roomUid: roomUid,
+              };
+              return param;
+            },
+            ajax: function (request) {
+              //使用ajax请求
+              $.ajax({
+                type: "GET",
+                url: "/admin/roomSerial/listRoomRevenueDetail.action",
+                contentType: "application/json;charset=utf-8",
+                dataType: "json",
+                data: request.data,
+                success: function (res) {
+                  console.log("res-------", res);
+                  apiResult(res);
+                  request.success({
+                    rows: res.data.rows,
+                    total: res.data.total,
+                  });
+                  $("#roomId").html(res.data.roomId);
+                  $("#roomTitle").html(res.data.roomTitle);
+                  $("#totalDiamonds").html(res.data.totalDiamonds);
+                  $("#cutDiamonds").html(res.data.cutDiamonds);
+                  $("#roomGiftSerialDetailModal").modal("show");
+                },
+                error: function (req) {
+                  serverError(req);
+                },
+              });
+            },
+            onLoadSuccess: function (res) {
+              //加载成功时执行
+              console.log("load success");
+            },
+            onLoadError: function () {
+              //加载失败时执行
+              console.log("load fail");
+            },
+          });
+        });
+
+        function apiResult(json) {
+          if (json.code == 200 && json.message == "success") {
+            return true;
+          }
+          $("#tipMsg").text("请求失败，错误信息：" + json.message);
+          $("#tipModal").modal("show");
+          return false;
+        }
+      });
+    },
+  },
 };
 </script>
 
 <style scoped>
 .big-tips {
-    color: red;
-    font-size: larger;
-    font-weight: bold;
+  color: red;
+  font-size: larger;
+  font-weight: bold;
 }
-</style>
\ No newline at end of file
+</style>