Need to display 3 grids (lists) with many to many relationships
Need some help here to design a container having 3 lists(grids) communicating with each other as below:
The requirements are:
- There are multi select allowed on each list.
- On selecting customers, associated product and services wll be filtered.
- After refresh all and selecting products will refresh(filter) associated customers and services.
- On multiple selection on any entity, associated entities should be distinguished(top-bottom or bottom-top hierarchy)( I did it by color here).
In my way, my problem is a particular scenario: When selecting 2 or more products, if they are associated with same customer, I will not identify which color I should give that customer entity.
Is there any other UI design which can accomplish the need? Just an sketch will help.
Thanks.