cx-chat 0.0.1

package/src/components/table-view/components/table-view-config.tsx

@@ -0,0 +1,528 @@
+/**
+ * 列表页与选人表配置工厂（React Hooks）
+ * - createListPageConfig → 建议 hook 命名为 useListPageConfig
+ * - createSelectTableConfig → 建议 hook 命名为 useSelectTablePageConfig
+ */
+import { useCallback, useEffect, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { useToast } from '@/contexts/ToastContext'
+import type { ColumnsType } from 'antd/es/table'
+
+import type {
+  ListPageConfigFactoryInput,
+  ListTableQueryParams,
+  PageConfig,
+  SelectTableConfigFactoryInput,
+} from './table-view.types'
+import {
+  TABLE_VIEW_DEFAULT_PAGE_SIZE_OPTIONS,
+  TABLE_VIEW_TREE_DEFAULTS,
+} from './table-view.types'
+
+type TableViewFactoryCustomConfig =
+  | ListPageConfigFactoryInput
+  | SelectTableConfigFactoryInput
+
+function normalizeListOrder(order: unknown): 'asc' | 'desc' {
+  const s = String(order ?? 'desc').toLowerCase()
+  return s === 'asc' ? 'asc' : 'desc'
+}
+
+function buildListTableParams(
+  searchSnap: Record<string, unknown>,
+  pagination: { page: number; pageSize: number },
+  searchFields: Array<Record<string, any>> = [],
+  listQuery: { sort: string; order: 'asc' | 'desc' },
+): ListTableQueryParams {
+  const normalizedSearch = { ...searchSnap } as Record<string, any>
+  for (const field of searchFields) {
+    if (field?.type !== 'dateRange') continue
+    const startKey = field.rangeStartProp || `${field.prop}Start`
+    const endKey = field.rangeEndProp || `${field.prop}End`
+    const format = field.format || 'YYYY-MM-DD HH:mm:ss'
+    const range = normalizedSearch[field.prop]
+    if (Array.isArray(range) && range[0] && range[1]) {
+      if (field.showTime) {
+        normalizedSearch[startKey] = range[0].format(format)
+        normalizedSearch[endKey] = range[1].format(format)
+      } else {
+        normalizedSearch[startKey] = range[0].startOf('day').format(format)
+        normalizedSearch[endKey] = range[1].endOf('day').format(format)
+      }
+    } else {
+      normalizedSearch[startKey] = undefined
+      normalizedSearch[endKey] = undefined
+    }
+    delete normalizedSearch[field.prop]
+  }
+
+  return {
+    ...normalizedSearch,
+    order: listQuery.order,
+    page: pagination.page,
+    size: pagination.pageSize,
+    sort: listQuery.sort,
+  }
+}
+
+/** 列表与选人表工厂共用默认(拉表、搜索、分页、树);根字段按字母序 */
+const FACTORY_DEFAULTS_BASE: Record<string, unknown> = {
+  initialSearchFormData: {},
+  pageInfo: {},
+  pageSizeOptions: [...TABLE_VIEW_DEFAULT_PAGE_SIZE_OPTIONS],
+  pagination: { page: 1, pageSize: 10, total: 0 },
+  searchFields: [],
+  table: {},
+  tableAPI: null,
+  tree: undefined as PageConfig['tree'],
+  treeAPI: null,
+}
+
+/** 仅 createListPageConfig 合并：删除、导出、提交等整页能力默认值 */
+const LIST_PAGE_FACTORY_EXTRA: Record<string, unknown> = {
+  afterDelete: undefined,
+  afterGetPageData: undefined,
+  afterStatusChange: undefined,
+  batchDeleteAPI: null,
+  batchDeleteConfirm: {
+    cancelText: 'common.cancel',
+    content: 'common.table_view.batch_delete_confirm_content',
+    okText: 'common.ok',
+    successMessage: 'common.table_view.batch_delete_success',
+    title: 'common.tip',
+  },
+  deleteAPI: null,
+  deleteConfirm: {
+    cancelText: 'common.cancel',
+    content: 'common.table_view.delete_confirm_content',
+    okText: 'common.ok',
+    successMessage: 'common.table_view.delete_success',
+    title: 'common.tip',
+  },
+  detailAction: undefined,
+  exportAPI: null,
+  onAdd: undefined,
+  onDetail: undefined,
+  onEdit: undefined,
+  statusToggle: {
+    dangerOnDisable: true,
+    disableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'common.table_view.disable_confirm_content',
+      okText: 'common.ok',
+      title: 'common.tip',
+    },
+    disableSuccessMessage: 'common.table_view.disable_success',
+    enableConfirm: {
+      cancelText: 'common.cancel',
+      content: 'common.table_view.enable_confirm_content',
+      okText: 'common.ok',
+      title: 'common.tip',
+    },
+    enableSuccessMessage: 'common.table_view.enable_success',
+  },
+  submitAction: undefined,
+  updateStatusAPI: null,
+}
+
+function buildMergedConfig(
+  customConfig: TableViewFactoryCustomConfig,
+  variant: 'list' | 'select',
+): Record<string, any> {
+  const config = {
+    ...FACTORY_DEFAULTS_BASE,
+    ...(variant === 'list' ? LIST_PAGE_FACTORY_EXTRA : {}),
+    ...customConfig,
+  } as Record<string, any>
+
+  config.listQuery = {
+    sort: 'createTime',
+    order: normalizeListOrder('desc'),
+    ...(typeof customConfig.listQuery === 'object' && customConfig.listQuery
+      ? (customConfig.listQuery as Record<string, unknown>)
+      : {}),
+  }
+  config.listQuery.sort = String(config.listQuery.sort ?? 'createTime')
+  config.listQuery.order = normalizeListOrder(config.listQuery.order)
+  return config
+}
+
+function createPageConfigHook(
+  customConfig: TableViewFactoryCustomConfig,
+  variant: 'list' | 'select',
+) {
+  const config = buildMergedConfig(customConfig, variant)
+
+  return function usePageConfig() {
+    const firstPage = config.pagination?.page ?? 1
+    const { t } = useTranslation()
+    const { showToast } = useToast()
+
+    const [loading, setLoading] = useState(false)
+    const [tableData, setTableData] = useState<any[]>([])
+    const [searchFormData, setSearchFormData] = useState(
+      config.initialSearchFormData || {},
+    )
+    const [paginationData, setPaginationData] = useState(config.pagination)
+    const [selectedRows, setSelectedRows] = useState<any[]>([])
+
+    const searchSnapRef = useRef(searchFormData)
+    const pagSnapRef = useRef(paginationData)
+    searchSnapRef.current = searchFormData
+    pagSnapRef.current = paginationData
+
+    const fetchTableData = useCallback(async () => {
+      if (!config.tableAPI) {
+        console.info(t('common.table_view.table_api_not_configured'))
+        return
+      }
+
+      setLoading(true)
+      try {
+        const pd = pagSnapRef.current
+        const params = buildListTableParams(
+          searchSnapRef.current,
+          {
+            page: pd.page,
+            pageSize: pd.pageSize,
+          },
+          config.searchFields,
+          config.listQuery,
+        )
+
+        const res = await config.tableAPI(params)
+        const sliceBody = (res as any)?.data ?? res
+        const sliceData = (sliceBody as any)?.data ?? sliceBody
+        const tableData = Array.isArray(sliceData?.content)
+          ? sliceData.content
+          : Array.isArray((res as any)?.content)
+            ? (res as any).content
+            : []
+        setTableData(tableData)
+        const total =
+          (sliceData?.totalElements ?? (sliceBody as any)?.totalElements ?? 0) as number
+        setPaginationData((prev: PageConfig['paginationData']) => {
+          const next = {
+            ...prev,
+            total,
+            first: sliceData?.first,
+            last: sliceData?.last,
+            pageSize: sliceData?.size ?? prev.pageSize,
+          }
+          pagSnapRef.current = next
+          return next
+        })
+        const afterGet = config.afterGetPageData
+        if (typeof afterGet === 'function') {
+          try {
+            await afterGet()
+          } catch (e) {
+            console.warn('[table-view] afterGetPageData failed', e)
+          }
+        }
+      } catch (error) {
+        console.error('获取数据失败:', error)
+        // showToast(error.message, 'error');
+      } finally {
+        setLoading(false)
+      }
+    }, [
+      config.tableAPI,
+      config.listQuery,
+      config.searchFields,
+      config.afterGetPageData,
+      showToast,
+    ])
+
+    const hasTreeForList = !!config.treeAPI
+    const fetchTableOnMount = config.tree?.fetchTableOnMount === true
+
+    useEffect(() => {
+      if (hasTreeForList && !fetchTableOnMount) return
+      fetchTableData()
+    }, [fetchTableData, hasTreeForList, fetchTableOnMount])
+
+    /** 触发搜索：强制回到第一页再拉取列表数据 */
+    const handleSearch = useCallback(() => {
+      const snap = pagSnapRef.current
+      pagSnapRef.current = { ...snap, page: firstPage }
+      setPaginationData((prev: PageConfig['paginationData']) => ({
+        ...prev,
+        page: firstPage,
+      }))
+      setTimeout(() => {
+        fetchTableData()
+      }, 0)
+    }, [fetchTableData, firstPage])
+
+    const handleReset = useCallback(() => {
+      const init = { ...(config.initialSearchFormData || {}) }
+      const treeSearchKey =
+        (config.tree?.searchField as string | undefined) ??
+        (config.treeAPI ? TABLE_VIEW_TREE_DEFAULTS.searchField : undefined)
+      let next: Record<string, unknown> = { ...init }
+      if (treeSearchKey) {
+        const cur = searchSnapRef.current as Record<string, unknown>
+        if (cur && Object.prototype.hasOwnProperty.call(cur, treeSearchKey)) {
+          next = { ...next, [treeSearchKey]: cur[treeSearchKey] }
+        }
+      }
+      searchSnapRef.current = next
+      setSearchFormData(next)
+      const snap = pagSnapRef.current
+      pagSnapRef.current = { ...snap, page: firstPage }
+      setPaginationData((prev: PageConfig['paginationData']) => ({
+        ...prev,
+        page: firstPage,
+      }))
+      setTimeout(() => {
+        fetchTableData()
+      }, 0)
+    }, [fetchTableData, firstPage])
+
+    const handleTableChange = useCallback(
+      (
+        pagination: { current: number; pageSize: number },
+        _filters?: unknown,
+        _sorter?: unknown,
+      ) => {
+        setPaginationData((prev: PageConfig['paginationData']) => {
+          const pageSizeChanged = pagination.pageSize !== prev.pageSize
+          const next = {
+            ...prev,
+            page: pageSizeChanged ? firstPage : pagination.current,
+            pageSize: pagination.pageSize,
+          }
+          pagSnapRef.current = next
+          return next
+        })
+        setTimeout(() => {
+          fetchTableData()
+        }, 0)
+      },
+      [fetchTableData, firstPage],
+    )
+
+    const patchSearchAndRefresh = useCallback(
+      (patch: Record<string, unknown>) => {
+        const nextSearch = { ...searchSnapRef.current, ...patch }
+        searchSnapRef.current = nextSearch
+        setSearchFormData(nextSearch)
+        const snap = pagSnapRef.current
+        pagSnapRef.current = { ...snap, page: firstPage }
+        setPaginationData((prev: PageConfig['paginationData']) => ({
+          ...prev,
+          page: firstPage,
+        }))
+        setTimeout(() => {
+          fetchTableData()
+        }, 0)
+      },
+      [fetchTableData, firstPage],
+    )
+
+    const replaceSearchAndRefresh = useCallback(
+      (nextSearch: Record<string, unknown>) => {
+        const next = { ...(nextSearch || {}) }
+        searchSnapRef.current = next
+        setSearchFormData(next)
+        const snap = pagSnapRef.current
+        pagSnapRef.current = { ...snap, page: firstPage }
+        setPaginationData((prev: PageConfig['paginationData']) => ({
+          ...prev,
+          page: firstPage,
+        }))
+        setTimeout(() => {
+          fetchTableData()
+        }, 0)
+      },
+      [fetchTableData, firstPage],
+    )
+
+    const handleDelete = useCallback(
+      async (row: { id?: string | number; _id?: string }) => {
+        if (!config.deleteAPI) {
+          showToast(t('common.table_view.delete_api_not_configured'), 'error')
+          return false
+        }
+
+        try {
+          const res = await config.deleteAPI(row.id || row._id)
+          if (res?.success) {
+            const dc = config.deleteConfirm ?? {}
+            const raw =
+              dc.successMessage ?? 'common.table_view.delete_success'
+            const msg =
+              typeof raw === 'string' && raw.includes('.') ? t(raw) : raw
+            showToast(msg, 'success')
+            fetchTableData()
+            return true
+          }
+        } catch (error) {
+          console.error('删除失败:', error);
+          // 全局处理提示就行，这边不需要处理
+          // showToast(error.message, 'error')
+          return false
+        }
+      },
+      [fetchTableData, config.deleteAPI, config.deleteConfirm, showToast, t],
+    )
+
+    const handleUpdateStatus = useCallback(
+      async (row: any, nextStatus: number) => {
+        if (!config.updateStatusAPI) {
+          showToast(
+            t('common.table_view.update_status_api_not_configured'),
+            'error',
+          )
+          return false
+        }
+        const id = row?.id ?? row?._id
+        if (id === undefined || id === null) {
+          showToast(t('common.table_view.record_missing_id'), 'error')
+          return false
+        }
+        const st = config.statusToggle ?? {}
+        const enabledStatus = st.enabledStatus ?? 1
+        try {
+          await config.updateStatusAPI({
+            id,
+            record: row,
+            status: nextStatus,
+          })
+          const rawMsg =
+            nextStatus === enabledStatus
+              ? st.enableSuccessMessage ?? 'common.table_view.enable_success'
+              : st.disableSuccessMessage ?? 'common.table_view.disable_success'
+          const successMessage =
+            typeof rawMsg === 'string' && rawMsg.includes('.')
+              ? t(rawMsg)
+              : rawMsg
+          showToast(successMessage, 'success')
+          fetchTableData()
+          return true
+        } catch (error) {
+          console.error('状态更新失败:', error)
+          // showToast(error.message, 'error');
+          return false
+        }
+      },
+      [fetchTableData, config.updateStatusAPI, config.statusToggle, showToast, t],
+    )
+
+    const handleBatchDelete = useCallback(async () => {
+      if (!config.batchDeleteAPI) {
+        showToast(
+          t('common.table_view.batch_delete_api_not_configured'),
+          'error',
+        )
+        return
+      }
+
+      if (selectedRows.length === 0) {
+        showToast(t('common.table_view.batch_delete_select_required'), 'warning')
+        return
+      }
+
+      try {
+        const ids = selectedRows.map(
+          (item: { id?: string | number; _id?: string }) => item.id || item._id,
+        )
+        await config.batchDeleteAPI(ids)
+        const raw =
+          config.batchDeleteConfirm?.successMessage ??
+          'common.table_view.batch_delete_success'
+        const msg =
+          typeof raw === 'string' && raw.includes('.') ? t(raw) : raw
+        showToast(msg, 'success')
+        setSelectedRows([])
+        fetchTableData()
+      } catch (error) {
+        console.error('批量删除失败:', error)
+        // showToast(error.message, 'error');
+      }
+    }, [
+      fetchTableData,
+      config.batchDeleteAPI,
+      selectedRows,
+      config.batchDeleteConfirm,
+      showToast,
+      t,
+    ])
+
+    const handleExport = useCallback(async () => {
+      if (!config.exportAPI) {
+        showToast(t('common.table_view.export_api_not_configured'), 'error')
+        return
+      }
+
+      try {
+        const params = { ...searchFormData }
+        await config.exportAPI(params)
+        showToast(t('common.table_view.export_success'), 'success')
+      } catch (error) {
+        console.error('导出失败:', error)
+        // showToast(error.message, 'error');
+      }
+    }, [searchFormData, config.exportAPI, showToast])
+
+    return {
+      afterDelete: config.afterDelete,
+      afterGetPageData: config.afterGetPageData,
+      afterStatusChange: config.afterStatusChange,
+      batchDeleteAPI: config.batchDeleteAPI,
+      deleteConfirm: config.deleteConfirm,
+      detailAction: config.detailAction,
+      exportAPI: config.exportAPI,
+      getDetailModalOpenExtra: config.getDetailModalOpenExtra,
+      fetchTableData,
+      handleBatchDelete,
+      handleDelete,
+      handleExport,
+      handleReset,
+      handleSearch,
+      handleTableChange,
+      handleUpdateStatus,
+      initialSearchFormData: config.initialSearchFormData || {},
+      listQuery: config.listQuery,
+      loading,
+      onAdd: config.onAdd,
+      onDelete: undefined,
+      onDetail: config.onDetail,
+      onEdit: config.onEdit,
+      onStatusToggle: undefined,
+      pageInfo: config.pageInfo,
+      pageSizeOptions: config.pageSizeOptions as number[],
+      paginationData,
+      patchSearchAndRefresh,
+      replaceSearchAndRefresh,
+      searchFields: config.searchFields,
+      searchFormData,
+      selectedRows,
+      setPaginationData,
+      setSearchFormData,
+      setSelectedRows,
+      statusToggle: config.statusToggle,
+      submitAction: config.submitAction,
+      table: config.table,
+      tableData,
+      tree: config.tree,
+      treeAPI: config.treeAPI,
+      updateStatusAPI: config.updateStatusAPI,
+    } as unknown as PageConfig
+  }
+}
+
+/** 整页列表（ListPageView）：含删除、批量删除、导出、submitAction 等默认与合并逻辑 */
+export function createListPageConfig(
+  customConfig: ListPageConfigFactoryInput = {},
+) {
+  return createPageConfigHook(customConfig, 'list')
+}
+
+/** 弹层选人表（SelectTableView）：在相同数据流上收敛为「仅拉表与展示」相关默认项 */
+export function createSelectTableConfig(
+  customConfig: SelectTableConfigFactoryInput = {},
+) {
+  return createPageConfigHook(customConfig, 'select')
+}