diff --git a/src/qqq/components/misc/FieldAutoComplete.tsx b/src/qqq/components/misc/FieldAutoComplete.tsx index 7effd72..2cd297b 100644 --- a/src/qqq/components/misc/FieldAutoComplete.tsx +++ b/src/qqq/components/misc/FieldAutoComplete.tsx @@ -45,6 +45,7 @@ interface FieldAutoCompleteProps textFieldSX?: any; autocompleteSlotProps?: any; hasError?: boolean; + noOptionsText?: string; } FieldAutoComplete.defaultProps = @@ -59,6 +60,7 @@ FieldAutoComplete.defaultProps = textFieldSX: null, autocompleteSlotProps: null, hasError: false, + noOptionsText: "No options", }; function makeFieldOptionsForTable(tableMetaData: QTableMetaData, fieldOptions: any[], isJoinTable: boolean, hiddenFieldNames: string[], availableFieldNames: string[], selectedFieldName: string) @@ -86,7 +88,7 @@ function makeFieldOptionsForTable(tableMetaData: QTableMetaData, fieldOptions: a /******************************************************************************* ** Component for rendering a list of field names from a table as an auto-complete. *******************************************************************************/ -export default function FieldAutoComplete({id, metaData, tableMetaData, handleFieldChange, defaultValue, autoFocus, forceOpen, hiddenFieldNames, availableFieldNames, variant, label, textFieldSX, autocompleteSlotProps, hasError}: FieldAutoCompleteProps): JSX.Element +export default function FieldAutoComplete({id, metaData, tableMetaData, handleFieldChange, defaultValue, autoFocus, forceOpen, hiddenFieldNames, availableFieldNames, variant, label, textFieldSX, autocompleteSlotProps, hasError, noOptionsText}: FieldAutoCompleteProps): JSX.Element { const [selectedFieldName, setSelectedFieldName] = useState(defaultValue ? defaultValue.fieldName : null); @@ -196,6 +198,7 @@ export default function FieldAutoComplete({id, metaData, tableMetaData, handleFi autoSelect={true} autoHighlight={true} slotProps={autocompleteSlotProps ?? {}} + noOptionsText={noOptionsText} {...alsoOpen} /> diff --git a/src/qqq/components/widgets/misc/PivotTableGroupByElement.tsx b/src/qqq/components/widgets/misc/PivotTableGroupByElement.tsx index 9e961e2..ea0c7c6 100644 --- a/src/qqq/components/widgets/misc/PivotTableGroupByElement.tsx +++ b/src/qqq/components/widgets/misc/PivotTableGroupByElement.tsx @@ -199,6 +199,7 @@ export const PivotTableGroupByElement: FC = ({id, availableFieldNames={availableFieldNames} defaultValue={getSelectedFieldForAutoComplete(tableMetaData, groupBy.fieldName)} hasError={showError} + noOptionsText="There are no fields available." /> diff --git a/src/qqq/components/widgets/misc/PivotTableSetupWidget.tsx b/src/qqq/components/widgets/misc/PivotTableSetupWidget.tsx index 60370ea..7b243e4 100644 --- a/src/qqq/components/widgets/misc/PivotTableSetupWidget.tsx +++ b/src/qqq/components/widgets/misc/PivotTableSetupWidget.tsx @@ -145,6 +145,7 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor const [modalPivotTableDefinition, setModalPivotTableDefinition] = useState(null as PivotTableDefinition); const [usedGroupByFieldNames, setUsedGroupByFieldNames] = useState([] as string[]); + const [usedValueFieldNames, setUsedValueByFieldNames] = useState([] as string[]); const [availableFieldNames, setAvailableFieldNames] = useState([] as string[]); const {helpHelpActive} = useContext(QContext); @@ -192,6 +193,7 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor setPivotTableDefinition(originalPivotTableDefinition); updateUsedGroupByFieldNames(originalPivotTableDefinition); + updateUsedValueFieldNames(modalPivotTableDefinition); } if (recordValues["columnsJson"]) @@ -286,9 +288,10 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor /******************************************************************************* ** *******************************************************************************/ - function groupByChangedCallback() + function childElementChangedCallback() { updateUsedGroupByFieldNames(modalPivotTableDefinition); + updateUsedValueFieldNames(modalPivotTableDefinition); validateForm() forceUpdate(); } @@ -342,6 +345,22 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor } + /******************************************************************************* + ** + *******************************************************************************/ + function updateUsedValueFieldNames(ptd: PivotTableDefinition = pivotTableDefinition) + { + const usedFieldNames: string[] = []; + + for (let i = 0; i < ptd?.values?.length; i++) + { + usedFieldNames.push(ptd?.values[i].fieldName); + } + + setUsedValueByFieldNames(usedFieldNames); + } + + /******************************************************************************* ** *******************************************************************************/ @@ -502,12 +521,12 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor metaData={metaData} tableMetaData={tableMetaData} pivotTableDefinition={forModal ? modalPivotTableDefinition : pivotTableDefinition} - usedGroupByFieldNames={usedGroupByFieldNames} + usedGroupByFieldNames={[...usedGroupByFieldNames, ...usedValueFieldNames]} availableFieldNames={availableFieldNames} isEditable={isEditable && forModal} groupBy={groupBy} rowsOrColumns={rowsOrColumns} - callback={groupByChangedCallback} + callback={childElementChangedCallback} attemptedSubmit={attemptedSubmit} /> ); @@ -531,9 +550,10 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor tableMetaData={tableMetaData} pivotTableDefinition={forModal ? modalPivotTableDefinition : pivotTableDefinition} availableFieldNames={availableFieldNames} + usedGroupByFieldNames={usedGroupByFieldNames} isEditable={isEditable && forModal} value={value} - callback={groupByChangedCallback} + callback={childElementChangedCallback} attemptedSubmit={attemptedSubmit} /> ); @@ -715,6 +735,7 @@ export default function PivotTableSetupWidget({isEditable, widgetMetaData, recor setPivotTableDefinition(Object.assign({}, modalPivotTableDefinition)); updateUsedGroupByFieldNames(modalPivotTableDefinition); + updateUsedValueFieldNames(modalPivotTableDefinition); onSaveCallback({pivotTableJson: JSON.stringify(modalPivotTableDefinition)}); diff --git a/src/qqq/components/widgets/misc/PivotTableValueElement.tsx b/src/qqq/components/widgets/misc/PivotTableValueElement.tsx index e99fe49..a293285 100644 --- a/src/qqq/components/widgets/misc/PivotTableValueElement.tsx +++ b/src/qqq/components/widgets/misc/PivotTableValueElement.tsx @@ -50,6 +50,7 @@ export interface PivotTableValueElementProps tableMetaData: QTableMetaData; pivotTableDefinition: PivotTableDefinition; availableFieldNames: string[]; + usedGroupByFieldNames: string[]; isEditable: boolean; value: PivotTableValue; callback: () => void; @@ -71,7 +72,7 @@ interface DragItem /******************************************************************************* ** Element to render 1 pivot-table value. *******************************************************************************/ -export const PivotTableValueElement: FC = ({id, index, dragCallback, metaData, tableMetaData, pivotTableDefinition, availableFieldNames, value, isEditable, callback, attemptedSubmit}) => +export const PivotTableValueElement: FC = ({id, index, dragCallback, metaData, tableMetaData, pivotTableDefinition, availableFieldNames, usedGroupByFieldNames, value, isEditable, callback, attemptedSubmit}) => { const [defaultFunctionValue, setDefaultFunctionValue] = useState(null); const [, forceUpdate] = useReducer((x) => x + 1, 0); @@ -278,8 +279,10 @@ export const PivotTableValueElement: FC = ({id, ind tableMetaData={tableMetaData} handleFieldChange={handleFieldChange} availableFieldNames={availableFieldNames} + hiddenFieldNames={usedGroupByFieldNames} defaultValue={selectedField} hasError={showValueError} + noOptionsText="There are no fields available." />