Drag and drop элемента таблицы

Вопросы и проблемы
#1

Здравствуйте. Подскажите, пожалуйста, каким способом можно реализовать перетаскивание элементов таблицы в календарь, связанный с другим набором данных нежели исходная таблица. Созданное событие календаря должно, разумеется, быть связано с новой созданной записью базы данных.

Заранее спасибо.

#3

Добрый день,

чтобы активировать перетаскивание содержимого таблицы, нужно установить DragMode Vaadin реализации компонента таблицы:

usersTable.withUnwrapped(CubaTable.class,
        table -> table.setDragMode(com.vaadin.v7.ui.Table.TableDragMode.ROW));

В самом календаре, похоже, не работает drag and drop (завёл issue), но можно положить его в DragAndDropWrapper и при перемещении строки из таблицы в календарь показывать диалог с параметрами. Затем можно создать и добавить сущность для календаря.

@Subscribe
public void onInit(InitEvent event) {
    usersTable.withUnwrapped(CubaTable.class,
            table -> table.setDragMode(com.vaadin.v7.ui.Table.TableDragMode.ROW));

    dndWrapper.withUnwrapped(AbstractOrderedLayout.class, layout -> {
        DragAndDropWrapper wrapper = new DragAndDropWrapper(calendar.unwrap(com.vaadin.v7.ui.Calendar.class));
        wrapper.setWidth("100%");
        wrapper.setHeight("100%");
        wrapper.setDropHandler(new DropHandler() {
            @Override
            public void drop(DragAndDropEvent event) {
                Object userId = event.getTransferable().getData("itemId");
                User user = usersDc.getItem(userId);

                // show input dialog or any other screen
                notifications.create(Notifications.NotificationType.TRAY)
                        .withCaption("User: " + user.getLogin())
                        .show();
            }
            @Override
            public AcceptCriterion getAcceptCriterion() {
                return AcceptAll.get();
            }
        });
        layout.addComponent(wrapper);
    });
}

Дескриптор экрана:

<layout expand="hbox">
    <hbox id="hbox" width="100%">
        <table id="usersTable"
               width="100%"
               height="100%"
               dataContainer="usersDc">
            <columns>
                <column id="login"/>
                <column id="name"/>
            </columns>
        </table>
        <vbox id="dndWrapper"
              height="100%"
              width="100%">
            <calendar id="calendar"
                      dataContainer="calendarEventDc"
                      startDateProperty="startDate"
                      endDateProperty="endDate"
                      captionProperty="caption"
                      descriptionProperty="description"
                      width="100%"
                      height="100%"/>
        </vbox>
    </hbox>
</layout>

Демо проект: demo.zip (90.8 КБ)
Документация Vaadin по DnD: Advanced Drag and Drop

3 симпатии
#5

Роман, спасибо большое. Попробую реализовать!

#6

Отдельное спасибо за issue.