有多个组的sortablejs问题

Question

我有一张这样的桌子：

    ._________._________.
    |         |         |
 a  | a1 a2   |  a3     |
    |_________|  b5     |
    |         |         |
 b  | b4      |         |
    |_________|         |
    |         |         |
 c  | c7 c8 c9|         |
    |_________|_________|

您可能会猜到：

• 2列
• 第一列有多行
• 第二列横跨整个长度
• 左列由作为源的单元格组成。每个来源都是可排序的，其中包含多个<div>
• 将目标右列：仅1 <div>

我的目标是能够在任何左行到右行之间以及从右列到相应的左行之间拖放。

片段：

private _src: HTMLElement[];
private _target: HTMLElement;

constructor(el: HTMLElement) {
        this._src = $(el).find('.src').get();
        this._target = $(el).find('.target').get(0);

        this._src.map(ed => {

            Sortable.create(ed, {
                group: {
                    name: 'src' + ed.id,
                    put: 'target',
                    pull: true,
                },
            });

            Sortable.create(this._target, {
                group: {
                    name: 'target',
                    put: 'src' + ed.id,
                    pull: true,
                },
            });
        });
    }

在此配置中，可以从左向右移动项目，但是从右向项目没有限制，可以在任何左行中移动，情况并非如此。

我该如何实现？