xdesign-vue-next/es/table/hooks/useFilter.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useFilter.mjs","sources":["../../../src/table/hooks/useFilter.tsx"],"sourcesContent":["import { toRefs, ref, watch, computed, SetupContext } from 'vue';\nimport useClassName from './useClassName';\nimport TButton from '../../button';\nimport { TdPrimaryTableProps, PrimaryTableCol, TableRowData, FilterValue } from '../type';\nimport useDefaultValue from '../../hooks/useDefaultValue';\nimport { useTNodeDefault } from '../../hooks/tnode';\nimport TableFilterController from '../filter-controller';\nimport { useConfig } from '../../hooks/useConfig';\n\nfunction isFilterValueExist(value: any) {\n  const isArrayTrue = value instanceof Array && value.length;\n  const isObject = typeof value === 'object' && !(value instanceof Array);\n  const isObjectTrue = isObject && Object.keys(value).length;\n  return isArrayTrue || isObjectTrue || !['null', '', 'undefined'].includes(String(value));\n}\n\n// 筛选条件不为空，才需要显示筛选结果行\nfunction filterEmptyData(data: FilterValue) {\n  const newFilterValue: FilterValue = {};\n  Object.keys(data).forEach((key) => {\n    const item = data[key];\n    if (isFilterValueExist(item)) {\n      newFilterValue[key] = item;\n    }\n  });\n  return newFilterValue;\n}\n\nexport default function useFilter(props: TdPrimaryTableProps, context: SetupContext) {\n  const primaryTableRef = ref(null);\n  const { t, globalConfig } = useConfig('table');\n  const renderTNode = useTNodeDefault();\n  const { filterValue } = toRefs(props);\n  const { tableFilterClasses, isFocusClass } = useClassName();\n  const isTableOverflowHidden = ref<boolean>();\n\n  // unControl and control\n  const [tFilterValue, setTFilterValue] = useDefaultValue(\n    filterValue,\n    props.defaultFilterValue,\n    props.onFilterChange,\n    'filterValue',\n  );\n\n  // 过滤内部值\n  const innerFilterValue = ref<FilterValue>(tFilterValue.value);\n\n  const hasEmptyCondition = computed(() => {\n    const filterEmpty = filterEmptyData(tFilterValue.value || {});\n    return !tFilterValue.value || !Object.keys(filterEmpty).length;\n  });\n\n  watch([tFilterValue], ([val]) => {\n    innerFilterValue.value = val;\n  });\n\n  function renderFirstFilterRow() {\n    if (hasEmptyCondition.value) return null;\n    const defaultNode = (\n      <div class={tableFilterClasses.result}>\n        <span>\n          {/* 搜索 “{getFilterResultContent()}”， */}\n          {/* 找到 {props.pagination?.total || props.data?.length} 条结果 */}\n          {t(globalConfig.value.searchResultText, {\n            result: getFilterResultContent(),\n            count: props.pagination?.total || props.data?.length,\n          })}\n        </span>\n        <TButton theme=\"primary\" variant=\"text\" onClick={onResetAll}>\n          {globalConfig.value.clearFilterResultButtonText}\n        </TButton>\n      </div>\n    );\n    const filterContent = renderTNode('filterRow');\n    if ((props.filterRow && !filterContent) || props.filterRow === null) return null;\n    return <div class={tableFilterClasses.inner}>{filterContent || defaultNode}</div>;\n  }\n\n  // 获取搜索条件内容，存在 options 需要获取其 label 显示\n  function getFilterResultContent(): string {\n    const arr: string[] = [];\n    const columns: Array<PrimaryTableCol> = [];\n    getAllColumns(props.columns, columns);\n    columns\n      .filter((col) => col.filter)\n      .forEach((col) => {\n        let value = tFilterValue.value[col.colKey];\n        if (col.filter.list && !['null'].includes(String(value))) {\n          const formattedValue = value instanceof Array ? value : [value];\n          const label: string[] = [];\n          col.filter.list.forEach((option) => {\n            if (formattedValue.includes(option.value)) {\n              label.push(option.label);\n            }\n          });\n          value = label.join();\n        }\n        if (isFilterValueExist(value)) {\n          arr.push(`${col.title}：${value}`);\n        }\n      });\n    return arr.join('；');\n  }\n  //递归拿到所有的 column\n  function getAllColumns(col: Array<PrimaryTableCol>, columns: Array<PrimaryTableCol>) {\n    col.forEach((column) => {\n      if (column.children) {\n        getAllColumns(column.children, columns);\n      }\n      columns.push(column);\n    });\n  }\n\n  function onInnerFilterChange(val: any, column: PrimaryTableCol) {\n    const filterValue = {\n      ...innerFilterValue.value,\n      [column.colKey]: val,\n    };\n    innerFilterValue.value = filterValue;\n    if (!column.filter.showConfirmAndReset) {\n      emitFilterChange(filterValue, column);\n    }\n  }\n\n  function emitFilterChange(filterValue: FilterValue, column?: PrimaryTableCol) {\n    setTFilterValue(filterValue, { col: column });\n    props.onChange?.({ filter: filterValue }, { trigger: 'filter' });\n  }\n\n  function onReset(column: PrimaryTableCol) {\n    const filterValue: FilterValue = {\n      ...tFilterValue.value,\n      [column.colKey]:\n        column.filter.resetValue ??\n        {\n          single: '',\n          multiple: [],\n          input: '',\n        }[column.filter.type] ??\n        '',\n    };\n    emitFilterChange(filterValue, column);\n  }\n\n  function onResetAll() {\n    emitFilterChange({}, undefined);\n  }\n\n  function onConfirm(column: PrimaryTableCol) {\n    emitFilterChange(innerFilterValue.value, column);\n  }\n\n  // 图标：内置图标，组件自定义图标，全局配置图标\n  function renderFilterIcon({ col, colIndex }: { col: PrimaryTableCol<TableRowData>; colIndex: number }) {\n    return (\n      <TableFilterController\n        v-slots={{ filterIcon: context.slots.filterIcon }}\n        column={col}\n        colIndex={colIndex}\n        filterIcon={props.filterIcon}\n        tFilterValue={tFilterValue.value}\n        innerFilterValue={innerFilterValue.value}\n        tableFilterClasses={tableFilterClasses}\n        isFocusClass={isFocusClass}\n        popupProps={col.filter.popupProps}\n        attach={props.attach}\n        onReset={onReset}\n        onConfirm={onConfirm}\n        onInnerFilterChange={onInnerFilterChange}\n        primaryTableElement={primaryTableRef.value?.$el}\n        onVisibleChange={onPopupVisibleChange}\n      ></TableFilterController>\n    );\n  }\n\n  function setFilterPrimaryTableRef(primaryTableElement: any) {\n    primaryTableRef.value = primaryTableElement;\n  }\n\n  function onPopupVisibleChange(visible: boolean) {\n    if (visible && !isTableOverflowHidden.value) {\n      isTableOverflowHidden.value = !visible;\n    }\n  }\n\n  return {\n    hasEmptyCondition,\n    isTableOverflowHidden,\n    renderFilterIcon,\n    renderFirstFilterRow,\n    setFilterPrimaryTableRef,\n  };\n}\n"],"names":["newFilterValue","tFilterValue","setTFilterValue","watch","val","_createVNode","TButton","getAllColumns","columns","label","value","arr","col","emitFilterChange","filter","trigger","single","multiple","input","filterIcon","isTableOverflowHidden","hasEmptyCondition","renderFilterIcon","renderFirstFilterRow","setFilterPrimaryTableRef"],"mappings":"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"}