feat: 库位信息增加分组查询

cypress/e2e/stock.cy.ts

@@ -42,14 +42,20 @@ describe('库存明细', function () {
 
   beforeEach(function () {
     intercept('/queryList/storageLocation', function ({search, reply}) {
-      generateNetworkResult({search, reply, basicData, title: 'code'});
+      generateNetworkResult({
+        search,
+        reply,
+        basicData,
+        title: 'code',
+        skipCondition: name => name === 'groupBy',
+      });
     });
 
-    exportIntercept('queryList/exportStorageLocation');
+    exportIntercept('/queryList/exportStorageLocation');
   });
 
   it('库存明细', function () {
-    selectAllFilters('stock_filter', 10);
+    selectAllFilters('stock_filter', 11);
     validateTableList('stock_table');
     validateTableSearch(
       'stock_table',

packages/app/src/components/filter-field/Select.tsx

@@ -6,12 +6,13 @@ import {useSelectFilterOptions} from '@hooks';
 
 type Props = {
   label: string;
-  value: string;
+  value: string | string[];
   name: string;
   onChange?: (value: string) => void;
   placeholder?: string;
   options: {label: string; value: string}[];
   loading?: boolean;
+  multiple?: boolean;
 };
 
 const Select: FC<Props> = function ({
@@ -22,6 +23,7 @@ const Select: FC<Props> = function ({
   name,
   options,
   loading,
+  multiple,
 }) {
   const [filterOptions, {onSelectSearch}] = useSelectFilterOptions(options);
 
@@ -42,7 +44,7 @@ const Select: FC<Props> = function ({
           id={`filter_${name}`}
           data-testid={`filter_${name}`}
           placeholder={placeholder ?? '请选择'}
-          value={value?.length ? value : void 0}
+          value={value?.length ? (value as any) : void 0}
           options={filterOptions}
           onChange={onChange}
           loading={loading}
@@ -50,6 +52,8 @@ const Select: FC<Props> = function ({
             node.parentNode as HTMLElement
           }
           onSearch={onSelectSearch}
+          mode={multiple ? 'multiple' : void 0}
+          maxTagCount='responsive'
         />
       </div>
     </div>

packages/app/src/components/filter-field/Tool.tsx

@@ -15,7 +15,7 @@ import {differenceBy} from 'lodash-es';
 import {useLatest} from 'ahooks';
 import {Card} from 'antd';
 
-export type MapValue<S extends Record<string, string>> =
+export type MapValue<S extends Record<string, string | string[]>> =
   | {label: string; type: 'field' | 'date'; value: keyof S}
   | {
       label: string;
@@ -29,18 +29,19 @@ export type MapValue<S extends Record<string, string>> =
       value: keyof S;
       options: {label: string; value: string}[];
       excludeAll?: boolean;
+      multiple?: boolean;
     };
 
-export type FilterGroupMap<S extends Record<string, string>> = Map<
+export type FilterGroupMap<S extends Record<string, string | string[]>> = Map<
   string,
   MapValue<S>
 >;
 
-type Props<S extends Record<string, string>> = {
+type Props<S extends Record<string, string | string[]>> = {
   filterData: string;
   sourceMap: FilterGroupMap<S>;
   fixedMap: MapValue<S>[];
-  fields: Record<string, string>;
+  fields: Record<string, string | string[]>;
   isSearching: boolean;
   dates?: RangeValue<Dayjs>;
   onReset: () => void;
@@ -51,7 +52,7 @@ type Props<S extends Record<string, string>> = {
   testId?: string;
 };
 
-function FilterTool<S extends Record<string, string>>({
+function FilterTool<S extends Record<string, string | string[]>>({
   onChange,
   fields,
   dates,
@@ -140,7 +141,7 @@ function FilterTool<S extends Record<string, string>>({
                   key={state.label}
                   name={state.value as string}
                   label={state.label}
-                  value={fields[state.value as string]}
+                  value={fields[state.value as string] as string}
                   onChange={onChange?.(state.value)}
                 />
               );
@@ -163,7 +164,7 @@ function FilterTool<S extends Record<string, string>>({
                   selectKey={state.selectKey}
                   name={state.value as string}
                   label={state.label}
-                  value={fields[state.value as string]}
+                  value={fields[state.value as string] as string}
                   onChange={onChange?.(state.value as string)}
                 />
               );
@@ -179,6 +180,7 @@ function FilterTool<S extends Record<string, string>>({
                   value={fields[state.value as string]}
                   onChange={onChange?.(state.value)}
                   options={options}
+                  multiple={state.multiple}
                 />
               );
             }

packages/app/src/hooks/use-filter-field/index.tsx

@@ -1,6 +1,6 @@
 import {useCallback, useRef, useState} from 'react';
 
-type FieldType = string | number | boolean;
+type FieldType = string | number | boolean | string[];
 
 export function useFilterField<T extends Record<string, FieldType>>(
   init: T,

packages/app/src/models/request/queryList.ts

@@ -46,6 +46,8 @@ export type GetStockListParams = {
   partType: string;
   /** 计量单位 */
   unitOfMeasurement: string;
+  /** 增加分组 */
+  groupBy: string;
 } & ListParams;
 
 export type GSInterfaceType =

packages/app/src/pages/stock/context.ts

@@ -8,7 +8,10 @@ import {GetStockListParams, OriginalListParams} from '@models';
 export const pageContext = createPageContext();
 export const searchContext = createSearchContext();
 
-export const contextState: OriginalListParams<GetStockListParams> = {
+export const contextState: Omit<
+  OriginalListParams<GetStockListParams>,
+  'groupBy'
+> & {groupBy: string[]} = {
   wllbCode: '',
   materialName: '',
   storageLocationName: '',
@@ -19,5 +22,40 @@ export const contextState: OriginalListParams<GetStockListParams> = {
   wllbClass: '',
   partType: '',
   unitOfMeasurement: '',
+  groupBy: [],
 };
 export const context = createTableSearchContext(contextState);
+export function transformState(
+  state: typeof contextState,
+): OriginalListParams<GetStockListParams> {
+  const {
+    wllbCode,
+    materialName,
+    storageLocationName,
+    wbs,
+    companyCode,
+    supplierId,
+    warehouseId,
+    wllbClass,
+    partType,
+    unitOfMeasurement,
+    groupBy,
+  } = state;
+
+  return {
+    wllbCode,
+    materialName,
+    storageLocationName,
+    wbs,
+    companyCode,
+    supplierId,
+    warehouseId,
+    wllbClass,
+    partType,
+    unitOfMeasurement,
+    groupBy:
+      groupBy.length > 0
+        ? groupBy.join(',')
+        : 'a.storage_location_code,a.material_id,a.wbs,a.account_sleeve',
+  };
+}

packages/app/src/pages/stock/filter/state.ts

@@ -5,6 +5,18 @@ export const fixedMap: MapValue<typeof contextState>[] = [
   {label: '物料编号', type: 'field', value: 'wllbCode'},
   {label: '物料名称', type: 'field', value: 'materialName'},
   {label: '库位名称', type: 'field', value: 'storageLocationName'},
+  {
+    label: '分组',
+    type: 'select',
+    value: 'groupBy',
+    multiple: true,
+    options: [
+      {label: '物料编号', value: 'a.material_id'},
+      {label: '库位名称', value: 'a.storage_location_code'},
+      {label: 'WBS编号', value: 'a.wbs'},
+      {label: '所属公司', value: 'a.account_sleeve'},
+    ],
+  },
 ];
 
 export const sourceMap: FilterGroupMap<typeof contextState> = new Map([

packages/app/src/pages/stock/table/index.tsx

@@ -3,7 +3,7 @@ import {FC} from 'react';
 import {ColumnsType} from 'antd/es/table';
 import {StockListData} from '@models';
 import {Table, TableTools} from '@components';
-import {context, pageContext, searchContext} from '../context';
+import {context, pageContext, searchContext, transformState} from '../context';
 import {
   HUGE_TABLE_WIDTH,
   LARGE_TABLE_WIDTH,
@@ -49,7 +49,9 @@ const columns: ColumnsType<StockListData> = [
 ];
 
 const TableList: FC = function () {
-  const params = useContextSection(context, state => state[0]);
+  const params = useContextSection(context, function ([state]) {
+    return transformState(state);
+  });
 
   const [{data, count, isFetching}, {refetch}] = useQueryTableList({
     queryFn: getStockList,
@@ -62,6 +64,7 @@ const TableList: FC = function () {
     pageContext,
     context,
     fn: exportStockList,
+    parseParams: transformState,
   });
 
   return (