fix(filter): set options not reset

Co-Authored-By: kyusho <[email protected]>
Kanaries · Jun 7, 2023 · 5b5b7f2 · 5b5b7f2
1 parent 68867ee
commit 5b5b7f2
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/packages/rath-client/src/components/fieldFilter/index.tsx b/packages/rath-client/src/components/fieldFilter/index.tsx
@@ -22,6 +22,7 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
  const { dataSourceStore } = useGlobalStore();
 
  const meta = dataSourceStore.fieldMetas.find(fm => fm.fid === fid);
+ const filterInUse = dataSourceStore.filters.find(f => f.fid === fid);
 
  const { rawDataStorage, rawDataMetaInfo } = dataSourceStore;
 
@@ -48,7 +49,7 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
 
  const [fieldRange, setFieldRange] = useState<[number, number]>([0, 0])
  const filterType = filter.type;
- useEffect(() => {
+ const resetRange = useCallback(() => {
  if (rawDataMetaInfo.versionCode === -1) {
  setFieldRange([0, 0]);
  } else if (filterType !== 'range') {
@@ -59,6 +60,7 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
  })
  }
  }, [fid, filterType, rawDataStorage, rawDataMetaInfo.versionCode])
+ useEffect(resetRange, [resetRange])
 
 
  const selection = useMemo(() => {
@@ -85,6 +87,11 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
  setShowFilterConfig(false);
  }, [filter, meta?.distribution, dataSourceStore, selection])
 
+ const resetFilter = useCallback(() => {
+ resetRange();
+ dataSourceStore.removeFilter(fid);
+ }, [fid, dataSourceStore, resetRange])
+
  const toggleShowFilter = useCallback(() => {
  setShowFilterConfig(v => !v);
  }, [])
@@ -158,7 +165,7 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
  />
  </div>
  {
- filter.type === 'set' && meta && <SetSelection
+ filter.type === 'set' && meta && !filterInUse && <SetSelection
  dist={toJS(meta.distribution)}
  selection={selection}
  />
@@ -171,13 +178,19 @@ const FieldFilter: React.FC<FieldFilterProps> = props => {
  onValueChange={onRangeValueChange}
  />
  }
- <Stack horizontal>
+ <Stack horizontal tokens={{ childrenGap: '1em' }}>
+ {
+ filterInUse && <DefaultButton
+ onClick={resetFilter}
+ text={intl.get('dataSource.filter.reset') || 'Reset'}
+ />
+ }
  <PrimaryButton
  text={intl.get('dataSource.filter.submit')}
+ disabled={filter.type === 'set' && Boolean(filterInUse)}
  onClick={submitFilter}
  />
  <DefaultButton
- style={{ marginLeft: '1em' }}
  text={intl.get('dataSource.filter.cancel')}
  onClick={toggleShowFilter}
  />

diff --git a/packages/rath-client/src/store/dataSourceStore.ts b/packages/rath-client/src/store/dataSourceStore.ts
@@ -444,6 +444,13 @@ export class DataSourceStore {
  }
  this.filters = [...this.filters]
  }
+ public removeFilter (fid: string) {
+ const filterIndex = this.filters.findIndex(f => f.fid === fid);
+ if (filterIndex > -1) {
+ this.filters.splice(filterIndex, 1);
+ }
+ this.filters = [...this.filters]
+ }
  public async createBatchFilterByQts (fieldIdList: string[], qts: [number, number][]) {
  const { rawDataStorage } = this;
  const data = await rawDataStorage.getAll();