refactor(CustomTable、GameManageView): 更新表格props配置;更新表格数据请求逻辑;

进一步区分表格props各个配置，严格区分请求方式

src/components/dataAnalysis/TemporalTrend.vue

@@ -388,12 +388,9 @@ onMounted(() => {
             v-if="props.needTable"
             :loading-state="loadDataState.loading"
             :data-list="tableDataList"
-            :need-rowindex="true"
-            :need-average="false"
-            :need-right-tools="false"
             :pagination-config="paginationConfig"
             :table-fields-info="tableFieldsInfo"
-            :need-left-tools="false"
+            :open-remote-req-data="false"
             :open-filter-query="false"
             :open-remote-query="false"
             :open-page-query="true"
@@ -436,6 +433,7 @@ onMounted(() => {
   color: #1c2438;
   font-weight: 600;
 }
+
 .chartsBox {
   width: 100%;
   position: relative;

src/components/table/CustomTable.vue

@@ -15,7 +15,7 @@ import { fuzzySearch, generateRandomFileName, throttleFunc } from '@/utils/commo
 
 import { useTable } from '@/hooks/useTable.ts'
 import { useRequest } from '@/hooks/useRequest.ts'
-import { computed, onMounted, reactive, ref, toRaw, watch } from 'vue'
+import { computed, type ComputedRef, onMounted, reactive, ref, toRaw, watch } from 'vue'
 import { downLoadData } from '@/utils/table/table'
 
 import TableFilterForm from '@/components/table/TableFilterForm/TableFilterForm.vue'
@@ -36,10 +36,11 @@ const throttleTime = 500
 const props = withDefaults(defineProps<PropsParams>(), {
   needRowindex: true,
   needAverage: false,
-  openFilterQuery: false,
+  openFilterQuery: true,
   openPageQuery: true,
-  openRemoteQuery: true,
-  loadingState: false
+  loadingState: false,
+  openRemoteReqData: true,
+  openRemoteQuery: true
 })
 
 const emits = defineEmits(['addNewItem', 'upload', 'downLoad'])
@@ -71,23 +72,27 @@ const reqConfig = reactive<ReqConfig>({
 })
 
 // 一些公用方法
-const { getTableData } = useTable(tableData, paginationConfig)
+const { getTableData, setTableData } = useTable(tableData, paginationConfig)
 
 /**
- * 计算表格数据，如果开启了分页查询，那么就返回一个空数组，否则返回当前页码的数据
+ * 本地使用的数据，只有在使用外部数据的情况下使用
  */
-const tableDataNoPaging = computed<any[]>(() => {
-  // 开启分页查询则需要去远程查询，不使用此处的动态计算的数据
-  if (props.openRemoteQuery) return []
-  let curPage = paginationConfig.currentPage
-  let limit = paginationConfig.limit
-  let begin = curPage * limit - limit
-  //这里不减一是因为，slice方法裁切是左闭右开数组
-  let end = curPage * limit
-  return tableData.slice(begin, end)
-})
+let localTableData: ComputedRef | [] = []
+if (!props.openRemoteReqData && props.dataList) {
+  localTableData = computed<Array<any>>(() => {
+    let curPage = paginationConfig.currentPage
+    let limit = paginationConfig.limit
+    let begin = curPage * limit - limit
+    let end = curPage * limit
+    console.log(tableData)
+    return tableData.slice(begin, end)
+  })
+}
 
-// 计算行号
+/**
+ * 开启行号功能后，计算行号
+ * @param index 当前行索引
+ */
 const computedRowIndex = (index: number) => {
   return (paginationConfig.currentPage - 1) * paginationConfig.limit + index + 1
 }
@@ -111,41 +116,88 @@ const handleSizeChange = (val: number) => {
 /**
  * @description 加载表格数据
  */
-const loadTableData = async (): Promise<boolean> => {
-  loading.value = true
+// const loadTableData = async (): Promise<boolean> => {
+//   try {
+//     // if (!props.openRemoteReqData) {
+//     //   if (props.dataList) {
+//     //     tableData.splice(0, tableData.length, ...props.dataList)
+//     //     if (props.paginationConfig) {
+//     //       paginationConfig.total = props.paginationConfig.total
+//     //     }
+//     //     return true
+//     //   } else {
+//     //     console.error('请传入dataList，没有数据源！')
+//     //     return false
+//     //   }
+//     // }
+//
+//     // 如果是直接传入的数据
+//     if (props.dataList) {
+//       tableData.splice(0, tableData.length, ...props.dataList)
+//       if (props.paginationConfig) {
+//         paginationConfig.total = props.paginationConfig.total
+//       }
+//       return true
+//     }
+//
+//     // 如果需要表格自己请求数据的
+//     if (props.requestConfig) {
+//       if (props.openRemoteQuery) {
+//         reqConfig.otherOptions.offset = (paginationConfig.currentPage - 1) * paginationConfig.limit
+//         reqConfig.otherOptions.limit = paginationConfig.limit
+//       }
+//
+//       await getTableData(reqConfig.url, reqConfig.otherOptions, props.openRemoteQuery)
+//       backupTableData.splice(0, backupTableData.length, ...tableData)
+//       return true
+//     }
+//
+//     // 如果 dataList 和 requestConfig 都没有传入，返回 false
+//     console.warn('Both dataList and requestConfig are undefined. Returning early.')
+//     return false
+//   } catch (err) {
+//     console.error('Error while loading table data:', err)
+//     return false // 确保返回 false 表示失败
+//   }
+// }
 
+const loadTableData = async (): Promise<boolean> => {
   try {
-    console.log('执行')
-    // 如果是直接传入的数据
-    if (props.dataList) {
-      console.log('执行')
-      tableData.splice(0, tableData.length, ...props.dataList)
-      if (props.paginationConfig) {
-        paginationConfig.total = props.paginationConfig.total
+    // 使用传入数据源
+    // 如果使用前端查询，则需要传入dataList作为数据源
+    if (!props.openRemoteReqData) {
+      if (props.dataList) {
+        const backList = JSON.parse(JSON.stringify(props.dataList))
+        tableData.splice(0, tableData.length, ...backList)
+        backupTableData.splice(0, tableData.length, ...backList)
+        console.log('执行1')
+        if (props.paginationConfig) {
+          paginationConfig.total = backList.length
+        }
+        return true
+      } else {
+        console.error('请传入dataList，没有数据源！')
+        return false
       }
-      return true
     }
 
     // 如果需要表格自己请求数据的
+    // 必须要传入requestConfig
     if (props.requestConfig) {
-      if (props.openRemoteQuery) {
-        reqConfig.otherOptions.offset = (paginationConfig.currentPage - 1) * paginationConfig.limit
-        reqConfig.otherOptions.limit = paginationConfig.limit
-      }
-
-      await getTableData(reqConfig.url, reqConfig.otherOptions, props.openRemoteQuery)
+      // 当使用远程请求数据源的时候，默认使用远程查询
+      reqConfig.otherOptions.offset = (paginationConfig.currentPage - 1) * paginationConfig.limit
+      reqConfig.otherOptions.limit = paginationConfig.limit
+      const [tableData, total] = await getTableData(reqConfig.url, reqConfig.otherOptions)
+      setTableData(tableData, total, props.openPageQuery)
       backupTableData.splice(0, backupTableData.length, ...tableData)
       return true
+    } else {
+      console.error('缺少请求配置')
+      return false
     }
-
-    // 如果 dataList 和 requestConfig 都没有传入，返回 false
-    console.warn('Both dataList and requestConfig are undefined. Returning early.')
-    return false
   } catch (err) {
     console.error('Error while loading table data:', err)
     return false // 确保返回 false 表示失败
-  } finally {
-    loading.value = false // 确保 loading 状态被正确重置
   }
 }
 
@@ -154,8 +206,13 @@ const loadTableData = async (): Promise<boolean> => {
  */
 const getData = async () => {
   try {
+    loading.value = true
     // 等待数据加载完成
-    await loadTableData()
+    const loadResult = await loadTableData()
+    if (!loadResult) {
+      ElMessage.error('获取表格数据失败')
+      return false
+    }
     // 如果需要平均值字段，则需要在表格头部插入一行计算平均值
     if (props.needAverage) {
       let rowData: any = {}
@@ -181,6 +238,8 @@ const getData = async () => {
   } catch (err) {
     console.log(err)
     return false
+  } finally {
+    loading.value = false // 确保 loading 状态被正确重置
   }
 }
 
@@ -198,7 +257,7 @@ const resetTableData = () => {
  * @description 按条件查询，如果开启了分页查询，那么会直接重新查询数据，否则，会根据现有数据进行查询
  */
 const queryTableData = () => {
-  if (props.openRemoteQuery && props.requestConfig) {
+  if (props.openRemoteQuery && props.openRemoteReqData && props.requestConfig) {
     reqConfig.otherOptions = { ...props.requestConfig.otherOptions, ...queryFormData }
     // 需要在查询前清除掉目前的数据，不然会导致之前缓存的数据混入
     //  比如第一页已经缓存了，在第二页重新查询，在切回第一页，还是显示查询前的数据，因为缓存没被清除
@@ -209,6 +268,9 @@ const queryTableData = () => {
     // 过滤出来所有符合formData数据的条件
     filteredTable = backupTableData.filter((item) => {
       let state = true
+      console.log('aa')
+      console.log(queryFormData)
+      console.log('bb')
       for (let [k, v] of Object.entries(queryFormData)) {
         // 模糊查询，看值是否跟表格中的数据匹配
         if (!fuzzySearch(v, item[k])) {
@@ -218,8 +280,11 @@ const queryTableData = () => {
       }
       return state
     })
+
     paginationConfig.total = filteredTable.length
+
     tableData.splice(0, tableData.length, ...filteredTable)
+    // console.log(JSON.parse(JSON.stringify(tableData)))
   }
 }
 
@@ -232,7 +297,7 @@ const throttleQueryTableData = throttleFunc(queryTableData, throttleTime)
  * @param  rowData 插入的数据
  */
 const insertRow = (start: number, rowData: any) => {
-  if (props.openRemoteQuery) {
+  if (props.openRemoteReqData) {
     tableData[start].splice(0, 0, rowData)
   } else {
     tableData.splice(start, 0, rowData)
@@ -301,7 +366,7 @@ const watchCurPage = watch(
 )
 
 // 如果没有开启分页查询，直接关闭这两个监听
-if (!props.openRemoteQuery) {
+if (!props.openPageQuery) {
   watchLimit()
   watchCurPage()
 }
@@ -368,13 +433,13 @@ const createRowKey = () => {
 // 没有pf取消掉
 if (!props.requestConfig?.otherOptions.pf) watchPf()
 
-//如果没有日期就取消掉
+// 如果没有日期就取消掉
 if (!props.requestConfig?.otherOptions.startTime && !props.requestConfig?.otherOptions.endTime) {
   watchDateChange()
 }
 
-// 没传入datalist则取消该监听
-if (!props.dataList) {
+// 如果是使用远程数据源，则取消监听
+if (props.openRemoteReqData) {
   changeDataList()
 }
 
@@ -403,7 +468,7 @@ const tableSortChange = (data: { column: any; prop: string; order: any }) => {
   else if (order === 'descending') order = 'desc'
   else order = ''
   reqConfig.otherOptions.order = order
-  getData()
+  throttleQueryTableData()
 }
 
 /**
@@ -438,6 +503,42 @@ const outGetTableData = () => {
   return toRaw(tableData).flat()
 }
 
+/**
+ * 对传入的props进行检查，对错误配置进行提示
+ */
+const checkPropsConfig = () => {
+  const {
+    openFilterQuery,
+    queryInfo,
+    openPageQuery,
+    paginationConfig,
+    openRemoteReqData,
+    requestConfig,
+    openRemoteQuery,
+    dataList
+  } = props
+  if (openFilterQuery && !queryInfo) {
+    console.error('请输入查询的配置信息')
+  }
+  if (openPageQuery && !paginationConfig) {
+    console.error('请输入分页配置信息')
+  }
+  if (openRemoteReqData || openRemoteQuery) {
+    if (!requestConfig) {
+      console.error('请输入请求配置信息')
+    }
+  }
+
+  if (!openRemoteReqData) {
+    if (!dataList) {
+      console.error('请至少确保一个数据源')
+    }
+    if (openRemoteQuery) {
+      console.error('远程查询无效，请开启数据远程请求')
+    }
+  }
+}
+
 // 定义暴露出去的方法
 defineExpose({
   getData,
@@ -450,7 +551,7 @@ defineExpose({
 onMounted(() => {
   initPageConfig()
   initReqConfig()
-  loading.value = props.loadingState
+  checkPropsConfig()
 })
 </script>
 
@@ -483,11 +584,15 @@ onMounted(() => {
     <div class="tableBox">
       <!-- 没有分页的时候需要重新计算一下data -->
       <el-table
-        :data="openRemoteQuery ? tableData[paginationConfig.currentPage] : tableDataNoPaging"
+        :data="
+          openRemoteReqData && openRemoteQuery
+            ? tableData[paginationConfig.currentPage]
+            : localTableData
+        "
         style="width: 100%"
         class="tableBody"
         :cell-style="tableCellStyle"
-        v-loading="loading"
+        v-loading="openRemoteReqData ? loading : props.loadingState"
         :row-key="createRowKey()"
         @sort-change="tableSortChange"
         @query="throttleGetData"

src/components/table/TableFilterForm/FilterSelect.vue

@@ -36,8 +36,7 @@ const isMultipleSelect = (): boolean => {
   const options = item.otherOption
   let result = true
   if (item.type !== FilterType.MULTI_SELECT) {
-    result = false
-    console.error('非多选类型')
+    return result
   }
   if (!(options && Array.isArray(options))) {
     result = false

src/hooks/useTable.ts

@@ -43,45 +43,94 @@ export function useTable(tableData: Array<any>, paginationSetting: TablePaginati
   }
 
   /**
-   * @description: 获取表格数据
-   * @param {string} url 请求地址
-   * @param {any} option 请求参数
-   * @param {boolean} isPagination 是否开启分页
+   * 将请求的数据写入tableData
+   *
+   * 对开启分页的数据做单独的处理
+   *
+   * @param dataList 数据列表
+   * @param total 数据总量
+   * @param openPagination 是否开启了分页查询
+   * @return 成功返回true，反之false
    */
-  const getTableData = async (
-    url: string,
-    option: Record<string, any>,
-    isPagination: boolean = false
-  ): Promise<boolean> => {
+  const setTableData = (dataList: Array<any>, total: number, openPagination: boolean): boolean => {
     try {
-      const result = await axiosInstance.post<any, ResponseInfo>(url, option)
-      let data = result.data
-
-      // 没有数据则直接置为空
-      if (!data) {
+      if (!dataList || dataList.length === 0) {
         tableData.length = 0
         paginationSetting.total = 0
       } else {
-        paginationSetting.total = result.count ?? data.length
-        data = setDefaultHead(data)
+        paginationSetting.total = total
+        dataList = setDefaultHead(dataList)
 
         // 如果开启了分页，设置 tableData 为二维数组，否则为一维数组
         const pageIndex = paginationSetting.currentPage ?? 0
-        if (isPagination) {
-          tableData[pageIndex] = data
+        if (openPagination) {
+          tableData[pageIndex] = dataList
         } else {
-          tableData.splice(0, tableData.length, ...data)
+          tableData.splice(0, tableData.length, ...dataList)
         }
       }
+      return true
+    } catch (err) {
+      console.error('数据处理错误:', err)
+      return false
+    }
+  }
 
-      return true // 返回操作成功
+  /**
+   * @description 获取表格数据
+   * @param url 请求地址
+   * @param option 请求参数
+   * @return [表格数据，总数]
+   */
+  const getTableData = async (
+    url: string,
+    option: Record<string, any>
+  ): Promise<[Array<any>, number]> => {
+    try {
+      const result = await axiosInstance.post<any, ResponseInfo>(url, option)
+      console.log(result)
+      return [result.data ?? [], result.count ?? 0]
     } catch (err) {
-      console.error('网络请求错误:', err)
-      throw err // 抛出错误让调用者处理
+      console.error('请求数据错误:', err)
+      return [[], 0]
     }
   }
 
+  // const getTableData = async (
+  //   url: string,
+  //   option: Record<string, any>,
+  //   isPagination: boolean = false
+  // ): Promise<boolean> => {
+  //   try {
+  //     const result = await axiosInstance.post<any, ResponseInfo>(url, option)
+  //     let data = result.data
+  //
+  //     // 没有数据则直接置为空
+  //     if (!data) {
+  //       tableData.length = 0
+  //       paginationSetting.total = 0
+  //     } else {
+  //       paginationSetting.total = result.count ?? data.length
+  //       data = setDefaultHead(data)
+  //
+  //       // 如果开启了分页，设置 tableData 为二维数组，否则为一维数组
+  //       const pageIndex = paginationSetting.currentPage ?? 0
+  //       if (isPagination) {
+  //         tableData[pageIndex] = data
+  //       } else {
+  //         tableData.splice(0, tableData.length, ...data)
+  //       }
+  //     }
+  //
+  //     return true // 返回操作成功
+  //   } catch (err) {
+  //     console.error('网络请求错误:', err)
+  //     throw err // 抛出错误让调用者处理
+  //   }
+  // }
+
   return {
-    getTableData
+    getTableData,
+    setTableData
   }
 }

src/main.ts

@@ -23,13 +23,13 @@ app.use(router)
  * @param  instance 触发该错误的组件实例
  * @param  info 错误来源类型信息
  */
-app.config.errorHandler = (err, instance, info) => {
-  console.log('-----------------')
-  console.log('未被捕获的异常')
-  console.log(err)
-  console.log(instance)
-  console.log(info)
-  console.log('-----------------')
-}
+// app.config.errorHandler = (err, instance, info) => {
+//   console.log('-----------------')
+//   console.log('未被捕获的异常')
+//   console.log(err)
+//   console.log(instance)
+//   console.log(info)
+//   console.log('-----------------')
+// }
 
 app.mount('#app')

src/types/table.ts

@@ -83,24 +83,47 @@ export interface TableToolsConfig {
  * 表格组件的属性
  */
 export interface PropsParams {
-  loadingState?: boolean // loading动画，这个配置是当数据直接由外部控制时触发
+  loadingState?: boolean // 外部控制表格加载状态
   needRowindex?: boolean // 是否需要行号
   needAverage?: boolean // 是否需要均值功能
-  openFilterQuery?: boolean // 是否开启上方查询功能
-  openPageQuery?: boolean // 是否开启分页功能
-  openRemoteQuery?: boolean // 是否开启远程分页查询
 
-  dataList?: Array<any> // 表格数据，可以直接传入，也可以给请求地址来请求
+  openFilterQuery?: boolean // 是否开启上方查询功能,关闭后queryInfo无效
   queryInfo?: Array<QueryInfo> // 上方查询功能所需要的信息
+
+  openPageQuery?: boolean // 是否开启分页功能，也就是下方的分页组件。关闭后，paginationConfig无效
   paginationConfig?: TablePaginationSetting // 表格分页的信息
-  tableFieldsInfo: Array<TableFieldInfo> // 表格字段信息
-  requestConfig?: ReqConfig // 请求配置
 
-  watchReqProps?: Array<string> // 需要被监听的属性
+  requestConfig?: ReqConfig // 请求配置，开启请求远程数据则该配置必填
+  /**
+   * 是否开启远程查询
+   *
+   * 启用此配置，则需要同时传入requestConfig，否则无效
+   * 关闭配置则使用前端查询
+   *
+   */
+  openRemoteQuery?: boolean
 
   /**
+   * 是否开启远程数据源，开启后，会使用requestConfig中的url进行请求，并且忽略dataList的数据
+   * 如果关闭该配置且不传入dataList，则表格将不会显示任何数据
+   *
+   * 开启此配置，将默认使用远程查询
+   *
+   */
+  openRemoteReqData?: boolean
+
+  /**
+   * 直接传入的表格的数据源
+   *
+   * 当传入此配置，且没有开启openRemoteReqData，则会使用传入的数据源
+   * 同时进行查询时，也会使用前端查询
+   */
+  dataList?: Array<any>
+
+  tableFieldsInfo: Array<TableFieldInfo> // 表格字段信息
+  /**
    *  工具栏配置
-   * 如果需要筛选字段，请把tableFieldsInfo设置为响应式对象
+   *  如果需要控制字段的展示与否，请把tableFieldsInfo设置为响应式对象
    */
   tools?: TableToolsConfig
 }

src/views/AppManage/EventMangeTable.vue

@@ -309,7 +309,6 @@ defineExpose({
   <div>
     <Table
       ref="eventTable"
-      :need-rowindex="false"
       :request-config="requestConfig"
       :open-page-query="true"
       :pagination-config="pagingConfig"

src/views/Home/Analysis/EventAnalysisTable.vue

@@ -178,10 +178,9 @@ watchPageChange(() => [props.startTime, props.endTime], backupDate, updateDate)
     <div class="content">
       <Table
         ref="eventTable"
-        :need-rowindex="false"
         :request-config="requestConfig"
         :open-page-query="true"
-        :open-remote-query="false"
+        :open-remote-query="true"
         :open-filter-query="true"
         :query-info="eventTableFilterInfo"
         :pagination-config="pagingConfig"

src/views/Home/Analysis/KeepView.vue

@@ -147,6 +147,7 @@ const headerCardInfo: HeaderCardProps = {
  * 获取detail表格的数据
  */
 const getTableData = () => {
+  loading.value = true
   axiosInstance
     .post(keepDataTableInfo.requestConfig.url, {
       ...keepDataTableInfo.requestConfig.otherOptions
@@ -207,6 +208,7 @@ watchPageChange(() => [keepDataTableInfo.requestConfig], backupReq, getTableData
         :need-average="true"
         :pagination-config="keepDataTableInfo.paginationConfig"
         :table-fields-info="keepDataTableInfo.tableFieldsInfo"
+        :open-remote-req-data="false"
         :data-list="keepTableData"
         :open-remote-query="false"
       ></Table>

src/views/Home/Analysis/UserTrendView.vue

@@ -375,7 +375,7 @@ watchPageChange(() => [detailDataTableInfo.requestConfig], backupReq, getDetailD
           :table-fields-info="detailDataTableInfo.tableFieldsInfo"
           :data-list="detailDataTableData"
           :open-remote-query="false"
-          :open-page-query="true"
+          :open-remote-req-data="false"
         ></Table>
       </div>
     </div>

src/views/Home/InfoManage/GameManageView.vue

@@ -22,6 +22,8 @@ import { useCommonStore } from '@/stores/useCommon'
 import Dialog from '@/components/common/CustomDialog.vue'
 import Table from '@/components/table/CustomTable.vue'
 import { FieldSpecialEffectType } from '@/types/tableText.ts'
+import axiosInstance from '@/utils/axios/axiosInstance.ts'
+import type { ResponseInfo } from '@/types/res.ts'
 
 const { allGameInfo } = useCommonStore()
 const { AllApi } = useRequest()
@@ -38,6 +40,9 @@ const requestConfig = reactive({
   }
 })
 
+// 表格数据
+const tableData = reactive<Array<any>>([])
+
 // 配置分页数据
 const paginationConfig: TablePaginationSetting = {
   limit: 15, // 每页展示个数
@@ -313,23 +318,32 @@ const formSub = (formData: any, type: number) => {
   gameTableRef.value?.getData()
 }
 
+const getTableData = async () => {
+  const res = (await axiosInstance.post(
+    requestConfig.url,
+    requestConfig.otherOptions
+  )) as ResponseInfo
+  const dataList = res.data as Array<any>
+  tableData.splice(0, tableData.length, ...dataList)
+}
+
 onMounted(() => {
-  gameTableRef.value?.getData()
+  // gameTableRef.value?.getData()
+  getTableData()
 })
 </script>
 <template>
   <div class="gameMangeBox">
     <Table
       ref="gameTableRef"
-      :need-rowindex="true"
-      :need-average="false"
       :tools="tableToolsConfig"
       :open-filter-query="true"
       :open-page-query="true"
+      :open-remote-req-data="false"
       :open-remote-query="false"
       :query-info="queryInfo"
+      :data-list="tableData"
       :table-fields-info="fieldsInfo"
-      :request-config="requestConfig"
       :pagination-config="paginationConfig"
       @addNewItem="addNewItem"
     >

src/views/Home/InfoManage/PlayerManageView.vue

@@ -31,6 +31,7 @@ import { usePage } from '@/hooks/usePage'
 import Dialog from '@/components/common/CustomDialog.vue'
 import Table from '@/components/table/CustomTable.vue'
 import axiosInstance from '@/utils/axios/axiosInstance'
+
 const { watchPageChange } = usePage()
 const { updateReqConfig } = useAnalysis()
 
@@ -276,16 +277,11 @@ watchPageChange(() => [selectInfo.gid], backupSelect, updateSelect)
   <div class="gameMangeBox">
     <Table
       ref="playerTableRef"
-      :need-rowindex="true"
-      :need-average="false"
       :tools="tableToolsConfig"
-      :open-page-query="true"
-      :open-filter-query="true"
       :table-fields-info="fieldsInfo"
       :query-info="queryInfo"
       :request-config="requestConfig"
       :pagination-config="paginationConfig"
-      :open-remote-query="true"
     >
       <template #tableOperation>
         <el-table-column label="操作" align="center">