筛选

📊 Univer Sheet

import { LocaleType, Univer, UniverInstanceType } from '@univerjs/core'

import { UniverFormulaEnginePlugin } from '@univerjs/engine-formula'
import { UniverRenderEnginePlugin } from '@univerjs/engine-render'

import { UniverUIPlugin } from '@univerjs/ui'
import { defaultTheme } from '@univerjs/design'

import { UniverDocsPlugin } from '@univerjs/docs'
import { UniverDocsUIPlugin } from '@univerjs/docs-ui'

import { UniverSheetsPlugin } from '@univerjs/sheets'
import { UniverSheetsUIPlugin } from '@univerjs/sheets-ui'
import { UniverSheetsNumfmtPlugin } from '@univerjs/sheets-numfmt'
import { UniverSheetsFormulaPlugin } from '@univerjs/sheets-formula'

import { UniverSheetsFilterPlugin } from '@univerjs/sheets-filter'
import { UniverSheetsFilterUIPlugin } from '@univerjs/sheets-filter-ui'

import { enUS } from './locales'

import './style.css'

const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: enUS,
  },
})

univer.registerPlugin(UniverRenderEnginePlugin)
univer.registerPlugin(UniverFormulaEnginePlugin)

univer.registerPlugin(UniverUIPlugin, {
  container: 'app',
  disableAutoFocus: true,
})

univer.registerPlugin(UniverDocsPlugin)
univer.registerPlugin(UniverDocsUIPlugin)

univer.registerPlugin(UniverSheetsPlugin)
univer.registerPlugin(UniverSheetsUIPlugin)
univer.registerPlugin(UniverSheetsNumfmtPlugin)
univer.registerPlugin(UniverSheetsFormulaPlugin)

univer.registerPlugin(UniverSheetsFilterPlugin)
univer.registerPlugin(UniverSheetsFilterUIPlugin)

univer.createUnit(UniverInstanceType.UNIVER_SHEET, {
  id: 'iWQcFw',
  sheetOrder: [
    'XY59ziGImbs3cXEqDTyAd',
  ],
  name: '',
  appVersion: '0.2.7',
  locale: 'zhCN',
  styles: {
    PznCR3: {
      ff: 'Arial',
      fs: 11,
      it: 0,
      bl: 0,
      ul: {
        s: 0,
        cl: {
          rgb: 'rgb(0,0,0)',
        },
      },
      st: {
        s: 0,
        cl: {
          rgb: 'rgb(0,0,0)',
        },
      },
      ol: {
        s: 0,
        cl: {
          rgb: 'rgb(0,0,0)',
        },
      },
      tr: {
        a: 0,
      },
      td: 0,
      cl: {
        rgb: 'rgb(0,0,0)',
      },
      ht: 0,
      vt: 0,
      tb: 0,
      pd: {
        t: 0,
        b: 1,
        l: 2,
        r: 2,
      },
    },
  },
  sheets: {
    XY59ziGImbs3cXEqDTyAd: {
      id: 'XY59ziGImbs3cXEqDTyAd',
      name: 'Sheet1',
      tabColor: '',
      hidden: 0,
      rowCount: 1000,
      columnCount: 20,
      zoomRatio: 1,
      freeze: {
        xSplit: 0,
        ySplit: 0,
        startRow: -1,
        startColumn: -1,
      },
      scrollTop: 0,
      scrollLeft: 0,
      defaultColumnWidth: 88,
      defaultRowHeight: 24,
      mergeData: [],
      cellData: {
        0: {
          0: {
            v: 'Apple',
            t: 1,
            s: 'PznCR3',
          },
        },
        1: {
          0: {
            v: 'Banana',
            t: 1,
            s: 'PznCR3',
          },
        },
        2: {
          0: {
            v: 'Orange',
            t: 1,
            s: 'PznCR3',
          },
        },
        3: {
          0: {
            v: 'Strawberry',
            t: 1,
            s: 'PznCR3',
          },
        },
        4: {
          0: {
            v: 'Mango',
            t: 1,
            s: 'PznCR3',
          },
        },
        5: {
          0: {
            v: 'Pineapple',
            t: 1,
            s: 'PznCR3',
          },
        },
        6: {
          0: {},
        },
        7: {
          0: {},
        },
      },
      rowData: {
        0: {
          hd: 0,
          h: 24,
        },
        1: {
          hd: 0,
          h: 24,
        },
        2: {
          hd: 0,
          h: 24,
        },
        3: {
          hd: 0,
          h: 24,
        },
        4: {
          hd: 0,
          h: 24,
        },
        5: {
          hd: 0,
          h: 24,
        },
        6: {
          hd: 0,
          h: 20,
        },
        7: {
          hd: 0,
          h: 20,
        },
      },
      columnData: {
        0: {
          w: 88,
          hd: 0,
        },
      },
      showGridlines: 1,
      rowHeader: {
        width: 46,
        hidden: 0,
      },
      columnHeader: {
        height: 20,
        hidden: 0,
      },
      selections: [
        'A1',
      ],
      rightToLeft: 0,
    },
  },
  resources: [
    {
      name: 'SHEET_WORKSHEET_PROTECTION_PLUGIN',
      data: '{}',
    },
    {
      name: 'SHEET_WORKSHEET_PROTECTION_POINT_PLUGIN',
      data: '{}',
    },
    {
      name: 'SHEET_RANGE_PROTECTION_PLUGIN',
      data: '',
    },
    {
      name: 'SHEET_FILTER_PLUGIN',
      data: '{"XY59ziGImbs3cXEqDTyAd":{"ref":{"startRow":0,"startColumn":0,"endRow":5,"endColumn":0},"filterColumns":[{"customFilters":{"customFilters":[{"val":"*o*"}]},"colId":0}],"cachedFilteredOut":[1,2,3,5]}}',
    },
    {
      name: 'SHEET_DEFINED_NAME_PLUGIN',
      data: '',
    },
    {
      name: 'DOC_HYPER_LINK_PLUGIN',
      data: '{"links":[]}',
    },
    {
      name: 'SHEET_AuthzIoMockService_PLUGIN',
      data: '{}',
    },
  ],
})

筛选插件提供了对单元格的筛选功能。

安装

pnpm add @univerjs/sheets-filter @univerjs/sheets-filter-ui

引入

import '@univerjs/sheets-filter-ui/lib/index.css';
 
import { UniverSheetsFilterPlugin } from '@univerjs/sheets-filter';
import { UniverSheetsFilterUIPlugin } from '@univerjs/sheets-filter-ui';

国际化

import { LocaleType, Tools } from '@univerjs/core';
import SheetsFilterUIZhCN from '@univerjs/sheets-filter-ui/locale/zh-CN';
 
const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.ZH_CN,
  locales: {
    [LocaleType.ZH_CN]: Tools.deepMerge(
      SheetsFilterUIZhCN
    ),
  },
});

注册

univer.registerPlugin(UniverSheetsFilterPlugin);
univer.registerPlugin(UniverSheetsFilterUIPlugin);

筛选

安装

引入

国际化

注册

API

插件 API

Facade API