Pivot : filter dimensions

demo/data.js

@@ -3817,6 +3817,7 @@ export const demoData = {
           },
         },
       ],
+      filters: [],
       name: "My pivot",
       dataSet: {
         sheetId: "pivot",

packages/o-spreadsheet-engine/src/helpers/pivot/pivot_registry.ts

@@ -33,6 +33,7 @@ export interface PivotRegistryItem {
   dateGranularities: string[];
   datetimeGranularities: string[];
   isMeasureCandidate: (field: PivotField) => boolean;
+  isFilterCandidate: (field: PivotField) => boolean;
   isGroupable: (field: PivotField) => boolean;
   canHaveCustomGroup: (field: PivotField) => boolean;
   isPivotUnused: (getters: Getters, pivotId: UID) => boolean;
@@ -57,6 +58,7 @@ pivotRegistry.add("SPREADSHEET", {
   dateGranularities: [...dateGranularities],
   datetimeGranularities: [...dateGranularities, "hour_number", "minute_number", "second_number"],
   isMeasureCandidate: (field: PivotField) => field.type !== "boolean",
+  isFilterCandidate: () => true,
   isGroupable: () => true,
   canHaveCustomGroup: (field: PivotField) => field.type === "char" && !field.isCustomField,
   isPivotUnused: () => true,

packages/o-spreadsheet-engine/src/helpers/pivot/pivot_runtime_definition.ts

@@ -4,10 +4,12 @@ import {
   CommonPivotCoreDefinition,
   PivotCollapsedDomains,
   PivotCoreDimension,
+  PivotCoreFilter,
   PivotCoreMeasure,
   PivotCustomGroupedField,
   PivotDimension,
   PivotFields,
+  PivotFilter,
   PivotMeasure,
   PivotSortedColumn,
 } from "../../types/pivot";
@@ -22,6 +24,7 @@ export class PivotRuntimeDefinition {
   readonly measures: PivotMeasure[];
   readonly columns: PivotDimension[];
   readonly rows: PivotDimension[];
+  readonly filters: PivotFilter[];
   readonly sortedColumn?: PivotSortedColumn;
   readonly collapsedDomains?: PivotCollapsedDomains;
   readonly customFields?: Record<string, PivotCustomGroupedField>;
@@ -32,6 +35,7 @@ export class PivotRuntimeDefinition {
     );
     this.rows = definition.rows.map((dimension) => this.createPivotDimension(fields, dimension));
     this.measures = definition.measures.map((measure) => this.createMeasure(fields, measure));
+    this.filters = definition.filters.map((filter) => this.createPivotFilter(fields, filter));
     this.sortedColumn = definition.sortedColumn;
     this.collapsedDomains = definition.collapsedDomains;
     this.customFields = definition.customFields;
@@ -154,4 +158,14 @@ export class PivotRuntimeDefinition {
       parentField: field?.parentField,
     };
   }
+
+  private createPivotFilter(fields: PivotFields, filter: PivotCoreFilter): PivotFilter {
+    const field = fields[filter.fieldName];
+    return {
+      displayName: field?.name ?? filter.fieldName,
+      fieldName: filter.fieldName,
+      type: field?.type ?? "integer",
+      isValid: !!field,
+    };
+  }
 }

packages/o-spreadsheet-engine/src/plugins/ui_feature/insert_pivot.ts

@@ -64,6 +64,7 @@ export class InsertPivotPlugin extends UIPlugin {
         columns: [],
         rows: [],
         measures: [],
+        filters: [],
         name: _t("New pivot"),
         type: "SPREADSHEET",
       },

packages/o-spreadsheet-engine/src/types/pivot.ts

@@ -51,10 +51,15 @@ export interface PivotCoreMeasure {
   display?: PivotMeasureDisplay;
 }
 
+export interface PivotCoreFilter {
+  fieldName: string;
+}
+
 export interface CommonPivotCoreDefinition {
   columns: PivotCoreDimension[];
   rows: PivotCoreDimension[];
   measures: PivotCoreMeasure[];
+  filters: PivotCoreFilter[];
   name: string;
   deferUpdates?: boolean;
   sortedColumn?: PivotSortedColumn;
@@ -128,6 +133,12 @@ export interface PivotDimension extends PivotCoreDimension {
   isValid: boolean;
 }
 
+export interface PivotFilter extends PivotCoreFilter {
+  displayName: string;
+  type: string;
+  isValid: boolean;
+}
+
 export interface PivotTableColumn {
   fields: string[];
   values: CellValue[];

src/components/filters/filter_menu/filter_menu.xml

@@ -42,7 +42,7 @@
         </SidePanelCollapsible>
 
         <div class="o-filter-menu-buttons d-flex justify-content-end">
-          <button class="o-button o-filter-menu-cancel me-2" t-on-click="cancel">Cancel</button>
+          <button class="o-button o-filter-menu-cancel me-2" t-on-click="cancel">Discard</button>
           <button class="o-button primary o-filter-menu-confirm" t-on-click="confirm">
             Confirm
           </button>

src/components/side_panel/pivot/pivot_layout_configurator/pivot_dimension/pivot_dimension.ts

@@ -1,14 +1,17 @@
 import { SpreadsheetChildEnv } from "@odoo/o-spreadsheet-engine/types/spreadsheet_env";
 import { Component } from "@odoo/owl";
-import { PivotCoreDimension, PivotCoreMeasure } from "../../../../..";
+import { PivotCoreDimension, PivotCoreFilter, PivotCoreMeasure } from "../../../../..";
 import { TextInput } from "../../../../text_input/text_input";
 import { CogWheelMenu } from "../../../components/cog_wheel_menu/cog_wheel_menu";
 
 interface Props {
-  dimension: PivotCoreDimension | PivotCoreMeasure;
-  onRemoved: (dimension: PivotCoreDimension | PivotCoreMeasure) => void;
-  onNameUpdated?: (dimension: PivotCoreDimension | PivotCoreMeasure, name?: string) => void;
-  type: "row" | "col" | "measure";
+  dimension: PivotCoreDimension | PivotCoreMeasure | PivotCoreFilter;
+  onRemoved: (dimension: PivotCoreDimension | PivotCoreMeasure | PivotCoreFilter) => void;
+  onNameUpdated?: (
+    dimension: PivotCoreDimension | PivotCoreMeasure | PivotCoreFilter,
+    name?: string
+  ) => void;
+  type: "row" | "col" | "measure" | "filter";
 }
 
 export class PivotDimension extends Component<Props, SpreadsheetChildEnv> {

src/components/side_panel/pivot/pivot_layout_configurator/pivot_layout_configurator.ts

@@ -11,9 +11,11 @@ import {
   Granularity,
   PivotCoreDefinition,
   PivotCoreDimension,
+  PivotCoreFilter,
   PivotCoreMeasure,
   PivotDimension as PivotDimensionType,
   PivotField,
+  PivotFilter as PivotFilterType,
   PivotMeasure,
 } from "@odoo/o-spreadsheet-engine/types/pivot";
 import { SpreadsheetChildEnv } from "@odoo/o-spreadsheet-engine/types/spreadsheet_env";
@@ -22,7 +24,10 @@ import { isDefined } from "../../../../helpers";
 import { Store, useStore } from "../../../../store_engine";
 import { SortDirection, UID } from "../../../../types";
 import { ComposerFocusStore } from "../../../composer/composer_focus_store";
+import { FilterMenuCriterion } from "../../../filters/filter_menu_criterion/filter_menu_criterion";
+import { FilterMenuValueList } from "../../../filters/filter_menu_value_list/filter_menu_value_list";
 import { useDragAndDropListItems } from "../../../helpers/drag_and_drop_dom_items_hook";
+import { SidePanelCollapsible } from "../../components/collapsible/side_panel_collapsible";
 import { PivotCustomGroupsCollapsible } from "../pivot_custom_groups_collapsible/pivot_custom_groups_collapsible";
 import { AddDimensionButton } from "./add_dimension_button/add_dimension_button";
 import { PivotDimension } from "./pivot_dimension/pivot_dimension";
@@ -34,8 +39,10 @@ import { PivotSortSection } from "./pivot_sort_section/pivot_sort_section";
 interface Props {
   definition: PivotRuntimeDefinition;
   onDimensionsUpdated: (definition: Partial<PivotCoreDefinition>) => void;
+  onFiltersUpdated: (definition: Partial<PivotCoreDefinition>) => void;
   unusedGroupableFields: PivotField[];
   measureFields: PivotField[];
+  unusedFilterFields: PivotField[];
   unusedGranularities: Record<string, Set<string>>;
   dateGranularities: string[];
   datetimeGranularities: string[];
@@ -53,12 +60,17 @@ export class PivotLayoutConfigurator extends Component<Props, SpreadsheetChildEn
     PivotMeasureEditor,
     PivotSortSection,
     PivotCustomGroupsCollapsible,
+    SidePanelCollapsible,
+    FilterMenuValueList,
+    FilterMenuCriterion,
   };
   static props = {
     definition: Object,
     onDimensionsUpdated: Function,
+    onFiltersUpdated: Function,
     unusedGroupableFields: Array,
     measureFields: Array,
+    unusedFilterFields: Array,
     unusedGranularities: Object,
     dateGranularities: Array,
     datetimeGranularities: Array,
@@ -210,6 +222,13 @@ export class PivotLayoutConfigurator extends Component<Props, SpreadsheetChildEn
     });
   }
 
+  removeFilter(filter: PivotFilterType) {
+    const { filters } = this.props.definition;
+    this.props.onFiltersUpdated({
+      filters: filters.filter((f) => f.fieldName !== filter.fieldName),
+    });
+  }
+
   addColumnDimension(fieldName: string) {
     const { columns }: { columns: PivotCoreDimension[] } = this.props.definition;
     this.props.onDimensionsUpdated({
@@ -234,6 +253,13 @@ export class PivotLayoutConfigurator extends Component<Props, SpreadsheetChildEn
     });
   }
 
+  addFilter(fieldName: string) {
+    const { filters }: { filters: PivotCoreFilter[] } = this.props.definition;
+    this.props.onFiltersUpdated({
+      filters: filters.concat([{ fieldName: fieldName }]),
+    });
+  }
+
   updateMeasure(measure: PivotMeasure, newMeasure: PivotMeasure) {
     const { measures }: { measures: PivotCoreMeasure[] } = this.props.definition;
 

src/components/side_panel/pivot/pivot_layout_configurator/pivot_layout_configurator.xml

@@ -113,6 +113,40 @@
           />
         </div>
       </t>
+      <div
+        class="o-fw-bold pt-4 pb-1 d-flex flex-row justify-content-between align-items-center o-section-title"
+        t-att-style="dragAndDrop.itemsStyle['__rows_title__']">
+        Filters
+        <AddDimensionButton onFieldPicked.bind="addFilter" fields="props.unusedFilterFields"/>
+      </div>
+
+      <t t-foreach="props.definition.filters" t-as="filter" t-key="filter_index">
+        <div
+          t-on-pointerdown="(ev) => this.startDragAndDrop(filter, ev)"
+          t-att-style="dragAndDrop.itemsStyle[filter.nameWithGranularity]"
+          class="pt-1">
+          <PivotDimension dimension="filter" onRemoved.bind="removeFilter">
+            <SidePanelCollapsible isInitiallyCollapsed="true" title.translate="Filter by criterion">
+              <t t-set-slot="content">
+                <!-- <FilterMenuValueList
+              filterPosition="props.filterPosition"
+              onUpdateHiddenValues.bind="onUpdateHiddenValues"
+            /> -->
+                coucou
+              </t>
+            </SidePanelCollapsible>
+            <SidePanelCollapsible isInitiallyCollapsed="true" title.translate="Filter by values">
+              <t t-set-slot="content">
+                <!-- <FilterMenuValueList
+              filterPosition="props.filterPosition"
+              onUpdateHiddenValues.bind="onUpdateHiddenValues"
+            /> -->
+                coucou
+              </t>
+            </SidePanelCollapsible>
+          </PivotDimension>
+        </div>
+      </t>
     </div>
     <PivotSortSection definition="props.definition" pivotId="props.pivotId"/>
   </t>

src/components/side_panel/pivot/pivot_side_panel/pivot_side_panel_store.ts

@@ -119,6 +119,25 @@ export class PivotSidePanelStore extends SpreadsheetStore {
         }
         return !currentlyUsed.includes(field.name);
       })
+      .sort((a, b) => a.string.localeCompare(b.string)); //met les champs dans l'ordre alphabétique
+  }
+
+  get unusedFilterFields() {
+    const filterFields: PivotField[] = [];
+    const fields = this.fields;
+    for (const fieldName in fields) {
+      const field = fields[fieldName];
+      if (!field) {
+        continue;
+      }
+      if (pivotRegistry.get(this.pivot.type).isFilterCandidate(field)) {
+        filterFields.push(field);
+      }
+    }
+    const { filters } = this.definition;
+    const currentlyUsed = filters.map((field) => field.fieldName);
+    return filterFields
+      .filter((field) => !currentlyUsed.includes(field.name))
       .sort((a, b) => a.string.localeCompare(b.string));
   }
 

src/components/side_panel/pivot/pivot_side_panel/pivot_spreadsheet_side_panel/pivot_spreadsheet_side_panel.ts

@@ -108,4 +108,8 @@ export class PivotSpreadsheetSidePanel extends Component<Props, SpreadsheetChild
   onDimensionsUpdated(definition: Partial<SpreadsheetPivotCoreDefinition>) {
     this.store.update(definition);
   }
+
+  onFiltersUpdated(definition: Partial<SpreadsheetPivotCoreDefinition>) {
+    this.store.update(definition);
+  }
 }

src/components/side_panel/pivot/pivot_side_panel/pivot_spreadsheet_side_panel/pivot_spreadsheet_side_panel.xml

@@ -27,11 +27,13 @@
             t-if="!pivot.isInvalidRange"
             unusedGroupableFields="store.unusedGroupableFields"
             measureFields="store.measureFields"
+            unusedFilterFields="store.unusedFilterFields"
             unusedGranularities="store.unusedGranularities"
             dateGranularities="store.dateGranularities"
             datetimeGranularities="store.datetimeGranularities"
             definition="definition"
             onDimensionsUpdated.bind="onDimensionsUpdated"
+            onFiltersUpdated.bind="onFiltersUpdated"
             getScrollableContainerEl.bind="getScrollableContainerEl"
             pivotId="props.pivotId"
           />

tests/test_helpers/pivot_helpers.ts

@@ -22,6 +22,7 @@ function defaultPivotDefinition(sheetId: UID): SpreadsheetPivotCoreDefinition {
     },
     rows: [],
     columns: [],
+    filters: [],
     measures: [],
   };
 }