perf: 大厅管理优化

base-manager-ui/admin/src/components/YTable.vue

@@ -37,6 +37,7 @@
 </template>
 
 <script>
+import { pageSizeOptions } from "@/config/pageConfig.js";
 export default {
   props: {
     columns: {
@@ -90,7 +91,7 @@ export default {
     },
     pageSizeOptions: {
       type: Array,
-      default: () => ["10", "30", "50", "100", "200"],
+      default: () => pageSizeOptions,
     },
   },
   data() {

base-manager-ui/admin/src/pages/basicset/hall/hallmanage/HallManage.vue

@@ -18,56 +18,39 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
+      <y-table
+        :columns="columns"
+        :data="dataList"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
+        :loading="loading"
+        :scroll="{ y: 580 }"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :loading="loading"
-        bordered
-        :scroll="{ y: 580 }"
-        :columns="columns"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="dataList"
-        :rowKey="(record) => record.id"
+        @changePagination="getHallList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{
-          (current - 1) * size + index + 1
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
         }}</span>
-
         <!-- 创建时间 -->
-        <template slot="createTime" slot-scope="text">
-          {{ text.createTime | dateFormat }}
+        <template slot="createTime" slot-scope="{ record }">
+          {{ record.createTime | dateFormat }}
         </template>
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span
-              href="javascript:;"
-              class="primary pointer"
-              @click="handleEdit(text)"
+            <span class="primary pointer" @click="handleEdit(record)"
               >编辑</span
             >
-            <span
-              href="javascript:;"
-              class="delete pointer"
-              @click="handleDel(text.id)"
+            <span class="delete pointer" @click="handleDel(record.id)"
               >删除</span
             >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增、修改大厅 -->
     <AddHall
@@ -81,21 +64,22 @@
 
 <script>
 import { getHallList, delHall } from "@/services/hall";
-import { pageSizeOptions } from "@/config/pageConfig.js";
 import loacl from "@/utils/local";
 import AddHall from "./modal/AddHall.vue";
+import YTable from "@/components/YTable.vue";
 export default {
   components: {
     AddHall,
+    YTable,
   },
   data() {
     const columns = [
       {
         title: "序号",
-        dataIndex: "num",
+        dataIndex: "index",
         width: "65px",
         scopedSlots: {
-          customRender: "num",
+          customRender: "index",
         },
       },
       {
@@ -144,11 +128,10 @@ export default {
       title: "新增大厅",
       visible: false,
       selectedRowKeys: [],
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
       siteId: loacl.getLocal("siteId"),
-      pageSizeOptions,
       searchValue: "", // 搜索
       dataList: [],
     };
@@ -161,15 +144,15 @@ export default {
     async getHallList() {
       this.loading = true;
       let res = await getHallList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         hallName: `%${this.searchValue}%`,
         siteId: this.siteId,
       });
       if (res.data.code == 1) {
         let { data, total } = res.data.data;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getHallList();
         }
         this.total = total;
@@ -185,7 +168,7 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
+      this.page = 1;
       this.selectedRowKeys = [];
       this.getHallList();
     },
@@ -233,20 +216,8 @@ export default {
         },
       });
     },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getHallList();
-    },
-    // 改变每页显示数量
-    showSizeChange(cur, size) {
-      this.current = cur;
-      this.size = size;
-      this.getHallList();
-    },
   },
 };
 </script>
 
-<style lang="less" scoped>
-</style>
+<style lang="less" scoped></style>
\ No newline at end of file