Vaadin Grid - 来自多个对象的数据
Vaadin Grid - data from multiple objects
我想在一个网格中显示来自两个不同对象的数据。我有“文件夹”和“项目”,我希望在一个网格中看到它们。顶部的文件夹和文件夹下方的项目。类似于文件管理器应用程序中的列表视图。但我不知道如何将数据放在一起。我可能会为 Item 和 Folder classes 使用 getter 方法创建一个抽象父 class,我在网格中使用。有没有更好的解决方案?
预期结果:
@Route(value = "")
@PageTitle("Items | Test")
public class ListView extends VerticalLayout {
Grid<Item> grid = new Grid<>(Item.class);
ItemService service;
Folder currentFolder;
public ListView(ItemService service) {
this.service = service;
this.currentFolder = service.getAllFolders().get(0);
addClassName("list-view");
add(getGrid());
updateList();
}
private HorizontalLayout getGrid() {
HorizontalLayout layout = new HorizontalLayout(grid);
layout.setSizeFull();
grid.addClassNames("grid");
grid.setColumns("name");
grid.addColumn(testCase -> testCase.getStatus().getValue()).setHeader("Status").setSortable(true);
grid.addColumn(new ComponentRenderer<>(
testCase -> {
Checkbox checkbox = new Checkbox();
checkbox.setValue(testCase.getBooleanValue());
checkbox.setReadOnly(true);
return checkbox;
}
)
).setHeader("Boolean");
grid.getColumns().forEach(col -> col.setAutoWidth(true));
return layout;
}
private void updateList() {
grid.setItems(service.getItemsFromFolder(currentFolder));
}
}
服务:
@Service
public class ItemService {
private final ItemRepository itemRepository;
private final FolderRepository folderRepository;
public ItemService(ItemRepository itemRepository, FolderRepository folderRepository) {
this.itemRepository = itemRepository;
this.folderRepository = folderRepository;
}
public List<Folder> getAllFolders() {
return folderRepository.findAll();
}
public List<Item> getItemsFromFolder(Folder folder) {
return itemRepository.getItemsFromFolder(folder.getId());
}
}
物品仓库:
public interface ItemRepository extends JpaRepository<Item, Long> {
@Query("Select i from Item i where i.folder.id = :folderId")
List<Item> getItemsFromFolder(@Param("folderId") Long folderId);
}
文件夹存储库:
public interface FolderRepository extends JpaRepository<Folder, Long> {
}
项目实体:
@Entity
@Getter
@Setter
public class Item {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
@NotEmpty
private String name = "";
@Enumerated
@Column(columnDefinition = "smallint")
private Status status;
@NotNull
private Boolean booleanValue;
@ManyToOne
@JoinColumn(name = "folder_id")
@NotNull
private Folder folder;
}
文件夹实体:
@Entity
@Getter
@Setter
public class Folder {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String name;
private Long parentFolderId;
}
状态枚举:
@AllArgsConstructor
public enum Status {
DRAFT("Draft"),
READY("Ready"),
OBSOLETE("Obsolete");
@Getter
private final String value;
}
Grid
只能有一种类型的 bean,因此抽象父 class 或接口是可行的方法。但是鉴于您对“文件夹”和“项目”的用例的描述,您是否考虑过使用 TreeGrid 来代替?
我想在一个网格中显示来自两个不同对象的数据。我有“文件夹”和“项目”,我希望在一个网格中看到它们。顶部的文件夹和文件夹下方的项目。类似于文件管理器应用程序中的列表视图。但我不知道如何将数据放在一起。我可能会为 Item 和 Folder classes 使用 getter 方法创建一个抽象父 class,我在网格中使用。有没有更好的解决方案?
预期结果:
@Route(value = "")
@PageTitle("Items | Test")
public class ListView extends VerticalLayout {
Grid<Item> grid = new Grid<>(Item.class);
ItemService service;
Folder currentFolder;
public ListView(ItemService service) {
this.service = service;
this.currentFolder = service.getAllFolders().get(0);
addClassName("list-view");
add(getGrid());
updateList();
}
private HorizontalLayout getGrid() {
HorizontalLayout layout = new HorizontalLayout(grid);
layout.setSizeFull();
grid.addClassNames("grid");
grid.setColumns("name");
grid.addColumn(testCase -> testCase.getStatus().getValue()).setHeader("Status").setSortable(true);
grid.addColumn(new ComponentRenderer<>(
testCase -> {
Checkbox checkbox = new Checkbox();
checkbox.setValue(testCase.getBooleanValue());
checkbox.setReadOnly(true);
return checkbox;
}
)
).setHeader("Boolean");
grid.getColumns().forEach(col -> col.setAutoWidth(true));
return layout;
}
private void updateList() {
grid.setItems(service.getItemsFromFolder(currentFolder));
}
}
服务:
@Service
public class ItemService {
private final ItemRepository itemRepository;
private final FolderRepository folderRepository;
public ItemService(ItemRepository itemRepository, FolderRepository folderRepository) {
this.itemRepository = itemRepository;
this.folderRepository = folderRepository;
}
public List<Folder> getAllFolders() {
return folderRepository.findAll();
}
public List<Item> getItemsFromFolder(Folder folder) {
return itemRepository.getItemsFromFolder(folder.getId());
}
}
物品仓库:
public interface ItemRepository extends JpaRepository<Item, Long> {
@Query("Select i from Item i where i.folder.id = :folderId")
List<Item> getItemsFromFolder(@Param("folderId") Long folderId);
}
文件夹存储库:
public interface FolderRepository extends JpaRepository<Folder, Long> {
}
项目实体:
@Entity
@Getter
@Setter
public class Item {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
@NotEmpty
private String name = "";
@Enumerated
@Column(columnDefinition = "smallint")
private Status status;
@NotNull
private Boolean booleanValue;
@ManyToOne
@JoinColumn(name = "folder_id")
@NotNull
private Folder folder;
}
文件夹实体:
@Entity
@Getter
@Setter
public class Folder {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String name;
private Long parentFolderId;
}
状态枚举:
@AllArgsConstructor
public enum Status {
DRAFT("Draft"),
READY("Ready"),
OBSOLETE("Obsolete");
@Getter
private final String value;
}
Grid
只能有一种类型的 bean,因此抽象父 class 或接口是可行的方法。但是鉴于您对“文件夹”和“项目”的用例的描述,您是否考虑过使用 TreeGrid 来代替?