README

基于 sortablejs 的 Yi2 可排序小部件

该小部件是 sortablejs 的包装器，允许您在 HTML 页面上拖放任何元素。
此外，该小部件还包括两个服务（SortableServicePostgres 和 SortableService）用于与数据库交互。也就是说，在页面上拖放元素后，数据库中的排序顺序也会改变。

服务差异

1. SortableServicePostgres 仅与 Postgres 数据库一起工作，SortableService 与 Yii2 支持的任何数据库一起工作
2. SortableServicePostgres 的排序步长始终为 10，而在 SortableService 中可以配置步长

安装小部件: composer require ale10257/yii2-sortable-widget

使用方法

在视图文件中

<?php
use ale10257\sortable\SortableWidget;
use yii\helpers\Url;
use yii\grid\GridView;

// the data-id attribute is required
// elements with the data-excluded attribute will not be dragged
// data-url of the parent element - the address to save the sort order after dragging

SortableWidget::widget([
//    'cssSelector' => '#my-id', // default .sortable
//     Details for pluginOptions at https://github.com/SortableJS/Sortable
//    'pluginOptions' => [
//        'delay' => 150, 
//        'onSort' => '(e) => {}',
//        'onMove' => '(e) => {
//            if (e.dragged.dataset.excluded !== undefined) {
//               return false;
//            }
//        }'  
//        ...
//    ]
]);
?>

<div class="sortable>
    <p>First</p>
    <p>Two</p>
    <p>Three</p>
</div>

<ul data-url="<?= Url::to(['sort']) ?>" class="sortable">
    <li data-id="1"></li>
    <li data-id="2"></li>
</ul>

<table data-url="<?= Url::to(['sort']) ?>" class="sortable">
    <tbody>
        <tr data-id="1"><td></td></tr>
        <tr data-id="2" data-excluded="1"><td></td></tr>
    </tbody>
</table>

<?= GridView::widget([
...
    'tableOptions' => ['class' => '... sortable', 'data-url' => Url::to(['sort'])],
    'rowOptions' => function (\yii\db\ActiveRecord $model) {
        return ['data-id' => $model->id];
    },
...
]);
?>

在控制器类中

    public function actions(): array
    {
        return [
            'sort' => [
                'class' => \ale10257\sortable\SortAction::class,
                'modelClass' => MyActiveRecordModel::class
            ]
        ];
    }

在 ActiveRecord 模型中，您需要实现 ISortableModel 接口，并附加 SortableBehavior 行为

class MyModel extends \yii\db\ActiveRecord implements \ale10257\sortable\ISortableModel 
{

    public function behaviors(): array
    {
        return [
        ...
            [
                'class' => \ale10257\sortable\SortableBehavior::class,
                'serviceClass' => \ale10257\sortable\SortableServicePostgres::class // default SortableService,
                'sortField' => 'my_field', // sorting field, default sort
                'step' => 1, // default 10
                'addToBeginning' => true // default false, new entries are added to the end of the list
            ]
        ...    
        ];
    }
    
    /**
    * @return array|string|null condition WHERE for sort, example ['parent_id' => $this->parent_id]
    */
    public function sortableCondition() 
    {
        return null;
    }
}

SortabeBehavior 行为处理 afterDelete 和 afterInsert 事件

    public function events(): array
    {
        return [
            BaseActiveRecord::EVENT_AFTER_DELETE => 'afterDelete',
            BaseActiveRecord::EVENT_AFTER_INSERT => 'afterInsert',
        ];
    }

如果在您的模型中也处理这些事件，那么在创建或删除记录后更改排序顺序的逻辑必须由您自行实现，例如

    public fuction afterDelete
    {
        ...
        $service = ale10257\sortable\ServiceFactory::getServiceFromModel($this);
        $service->delete();
    }

单元测试（在部件文件夹的根目录中运行命令）

docker-compose up -d && docker-compose run --rm php composer install && docker-compose run --rm php bash -c './vendor/bin/codecept run unit' && docker-compose down