From 2b5dfebc202dce4dae2df67bdb4be6b459ea310d Mon Sep 17 00:00:00 2001 From: Jean-Christophe Gueriaud Date: Mon, 1 Nov 2021 17:08:44 +0200 Subject: [PATCH] Add selected text for multiple selection --- lookup-field-flow-demo/pom.xml | 4 +- .../lookupfield/MultipleView.java | 1 + .../filter/CustomFilterString.java | 2 + .../service/FilteredPersonService.java | 5 +- lookup-field-flow/pom.xml | 2 +- .../lookupfield/AbstractLookupField.java | 23 ++++++++- .../CustomFilterMultiSelectLookupField.java | 50 +++++++++++++++++++ .../frontend/lookup-dialog-overlay.css | 10 ++++ pom.xml | 4 +- 9 files changed, 93 insertions(+), 8 deletions(-) create mode 100644 lookup-field-flow/src/main/resources/META-INF/resources/frontend/lookup-dialog-overlay.css diff --git a/lookup-field-flow-demo/pom.xml b/lookup-field-flow-demo/pom.xml index 0f9b5e1..87c6e9c 100644 --- a/lookup-field-flow-demo/pom.xml +++ b/lookup-field-flow-demo/pom.xml @@ -6,7 +6,7 @@ com.vaadin.componentfactory lookup-field-flow-demo - 1.2.0 + 1.3.0 Lookup Field Demo war @@ -96,7 +96,7 @@ com.vaadin.componentfactory lookup-field-flow - 1.2.0 + 1.3.0 diff --git a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/MultipleView.java b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/MultipleView.java index 54c7eec..ec4f134 100644 --- a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/MultipleView.java +++ b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/MultipleView.java @@ -22,6 +22,7 @@ public MultipleView() { lookupField.getGrid().addColumn(s -> s).setHeader("item"); lookupField.setLabel("Item selector"); lookupField.addThemeVariants(EnhancedDialogVariant.SIZE_MEDIUM); + lookupField.showSelectedItems(true); add(lookupField); } diff --git a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/filter/CustomFilterString.java b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/filter/CustomFilterString.java index 27b2959..a9c6cc9 100644 --- a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/filter/CustomFilterString.java +++ b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/filter/CustomFilterString.java @@ -19,6 +19,8 @@ public class CustomFilterString implements LookupFieldFilter { private LookupFieldFilterAction fieldFilterAction; public CustomFilterString() { + layout.setSpacing(false); + layout.getThemeList().add("spacing-s"); layout.setDefaultVerticalComponentAlignment(FlexComponent.Alignment.BASELINE); filterField = new TextField("filter"); layout.addAndExpand(filterField); diff --git a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/service/FilteredPersonService.java b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/service/FilteredPersonService.java index eae9c4a..58bb073 100644 --- a/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/service/FilteredPersonService.java +++ b/lookup-field-flow-demo/src/main/java/com/vaadin/componentfactory/lookupfield/service/FilteredPersonService.java @@ -5,6 +5,7 @@ import org.apache.commons.lang3.StringUtils; import java.util.List; +import java.util.Locale; import java.util.stream.Collectors; public class FilteredPersonService { @@ -26,9 +27,9 @@ private boolean filter(Person person, PersonFilter filter) { return true; } if ((StringUtils.isEmpty(filter.getLastName()) && StringUtils.isEmpty(filter.getFirstName()))) { - return person.toString().contains(filter.getFullName()); + return person.toString().toLowerCase(Locale.ROOT).contains(filter.getFullName().toLowerCase(Locale.ROOT)); } else { - return person.getLastName().contains(filter.getLastName()) && person.getFirstName().contains(filter.getFirstName()); + return person.getLastName().toLowerCase(Locale.ROOT).contains(filter.getLastName().toLowerCase(Locale.ROOT)) && person.getFirstName().toLowerCase(Locale.ROOT).contains(filter.getFirstName().toLowerCase(Locale.ROOT)); } } diff --git a/lookup-field-flow/pom.xml b/lookup-field-flow/pom.xml index c9d2fa2..ecca8f1 100644 --- a/lookup-field-flow/pom.xml +++ b/lookup-field-flow/pom.xml @@ -6,7 +6,7 @@ com.vaadin.componentfactory lookup-field-flow - 1.2.0 + 1.3.0 jar Lookup Field diff --git a/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/AbstractLookupField.java b/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/AbstractLookupField.java index c53ebbd..67e6a90 100644 --- a/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/AbstractLookupField.java +++ b/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/AbstractLookupField.java @@ -10,6 +10,7 @@ import com.vaadin.flow.component.dependency.Uses; import com.vaadin.flow.component.dialog.Dialog; import com.vaadin.flow.component.grid.Grid; +import com.vaadin.flow.component.grid.GridMultiSelectionModel; import com.vaadin.flow.component.html.Div; import com.vaadin.flow.component.icon.Icon; import com.vaadin.flow.component.notification.Notification; @@ -36,7 +37,7 @@ @Uses(value = EnhancedDialog.class) @Tag("vcf-lookup-field") @JsModule("@vaadin-component-factory/vcf-lookup-field") -@NpmPackage(value = "@vaadin-component-factory/vcf-lookup-field", version = "1.2.0") +@NpmPackage(value = "@vaadin-component-factory/vcf-lookup-field", version = "1.3.1") public abstract class AbstractLookupField & HasValue, ComponentT extends AbstractLookupField, FilterType> extends Div implements HasFilterableDataProvider, @@ -78,6 +79,16 @@ public void setGrid(Grid grid) { } this.grid = grid; + this.grid.addItemClickListener(e -> { + if (grid.getSelectionModel() instanceof GridMultiSelectionModel) { + if (!grid.getSelectedItems().contains(e.getItem())) { + this.grid.deselectAll(); + this.grid.select(e.getItem()); + } else { + this.grid.deselectAll(); + } + } + }); grid.getElement().setAttribute(SLOT_KEY, GRID_SLOT_NAME); // It might already have a parent e.g when injected from a template @@ -576,6 +587,7 @@ public static class LookupFieldI18n implements Serializable { private String search; private String emptyselection; private String create; + private String selectedText; public String getSearch() { return search; @@ -648,5 +660,14 @@ public LookupFieldI18n setCreate(String create) { this.create = create; return this; } + + public String getSelectedText() { + return selectedText; + } + + public LookupFieldI18n setSelectedText(String selectedText) { + this.selectedText = selectedText; + return this; + } } } diff --git a/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/CustomFilterMultiSelectLookupField.java b/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/CustomFilterMultiSelectLookupField.java index 0860789..df0d1f1 100644 --- a/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/CustomFilterMultiSelectLookupField.java +++ b/lookup-field-flow/src/main/java/com/vaadin/componentfactory/lookupfield/CustomFilterMultiSelectLookupField.java @@ -24,12 +24,15 @@ import com.vaadin.flow.component.ClientCallable; import com.vaadin.flow.component.ItemLabelGenerator; import com.vaadin.flow.component.combobox.ComboBox; +import com.vaadin.flow.component.dependency.CssImport; import com.vaadin.flow.component.grid.Grid; +import com.vaadin.flow.component.html.Div; import com.vaadin.flow.data.provider.ListDataProvider; import com.vaadin.flow.function.SerializableFunction; import com.vaadin.flow.shared.Registration; import org.vaadin.gatanaso.MultiselectComboBox; +import java.text.MessageFormat; import java.util.Objects; import java.util.Set; @@ -42,8 +45,15 @@ * @param the type of the items to be inserted in the combo box */ +@CssImport(value = "./lookup-dialog-overlay.css") public class CustomFilterMultiSelectLookupField extends AbstractLookupField, MultiselectComboBox, CustomFilterMultiSelectLookupField, FilterType> { + private static final String SELECTED_SLOT_NAME = "selected"; + + private Div selected; + + private Registration selectedListener; + /** * Constructor * The converters are used to convert the backend filter to the combobox filter (String) @@ -191,8 +201,48 @@ protected void copyFieldValueFromGrid() { @Override @ClientCallable protected void copyFieldValueToGrid() { + getGrid().deselectAll(); for (T value : comboBox.getValue()) { getGrid().select(value); } } + + /** + * + * + * @param showSelectedItems + */ + public void showSelectedItems(boolean showSelectedItems) { + if (this.selected != null && this.selected.getElement().getParent() == getElement()) { + this.selected.getElement().removeFromParent(); + } + if (showSelectedItems) { + this.selected = new Div(); + this.selected.addClassName("selected-text"); + if (selectedListener != null) { + selectedListener.remove(); + } + selectedListener = getGrid().addSelectionListener(item -> { + updateMessage(item.getAllSelectedItems().size()); + }); + + updateMessage(getGrid().getSelectedItems().size()); + selected.getElement().setAttribute(SLOT_KEY, SELECTED_SLOT_NAME); + + // It might already have a parent e.g when injected from a template + if (selected.getElement().getParent() == null) { + getElement().appendChild(selected.getElement()); + } + } else { + this.selected = null; + } + } + + private void updateMessage(int nbItems) { + String message = (getI18n() != null && getI18n().getSelectedText() != null)? getI18n().getSelectedText(): "{0} item(s) selected"; + if (selected != null) { + this.selected.setText(MessageFormat.format(message, nbItems)); + } + } + } diff --git a/lookup-field-flow/src/main/resources/META-INF/resources/frontend/lookup-dialog-overlay.css b/lookup-field-flow/src/main/resources/META-INF/resources/frontend/lookup-dialog-overlay.css new file mode 100644 index 0000000..2e06bbb --- /dev/null +++ b/lookup-field-flow/src/main/resources/META-INF/resources/frontend/lookup-dialog-overlay.css @@ -0,0 +1,10 @@ +vcf-enhanced-dialog-overlay .selected-text { + align-items: center; + box-sizing: border-box; + display: flex; + height: var(--lumo-size-m); + padding: 0 var(--lumo-space-m); + width: 100%; + border: 1px solid var(--lumo-contrast-20pct); + border-top: none; +} \ No newline at end of file diff --git a/pom.xml b/pom.xml index d10469e..c0895a3 100755 --- a/pom.xml +++ b/pom.xml @@ -3,7 +3,7 @@ com.vaadin.componentfactory lookup-field-flow-root - 1.2.0 + 1.3.0 pom lookup-field-flow @@ -18,7 +18,7 @@ 1.8 UTF-8 UTF-8 - 1.2.0 + 1.3.0 2020