Преглед изворни кода

增加表格行选择器RowSelector默认选中以及禁止选中功能

jqh пре 4 година
родитељ
комит
0e3739099f

+ 9 - 1
resources/assets/dcat/js/extensions/RowSelector.js

@@ -26,7 +26,15 @@ export default class RowSelector {
             selectAll = options.selectAllSelector;
 
         $(selectAll).on('change', function() {
-            $(this).parents(options.container).find(checkboxSelector).prop('checked', this.checked).trigger('change');
+            let checked = this.checked;
+
+            $.each($(this).parents(options.container).find(checkboxSelector), function (_, checkbox) {
+                let $this = $(checkbox);
+
+                if (! $this.attr('disabled')) {
+                    $this.prop('checked', checked).trigger('change');
+                }
+            });
         });
         if (options.clickRow) {
             $document.off('click', checkboxSelector).on('click', checkboxSelector, function (e) {

+ 5 - 0
resources/assets/dcat/sass/components/_grid.scss

@@ -137,3 +137,8 @@ body:not(.dark-mode) .simple-grid {
   }
 
 }
+
+.vs-checkbox-con.checkbox-grid-column input:disabled + .vs-checkbox {
+  cursor: not-allowed;
+  opacity: 0.33;
+}

+ 48 - 1
src/Grid/Tools/RowSelector.php

@@ -20,6 +20,10 @@ class RowSelector
 
     protected $titleColumn;
 
+    protected $checked = [];
+
+    protected $disabled = [];
+
     public function __construct(Grid $grid)
     {
         $this->grid = $grid;
@@ -46,6 +50,20 @@ class RowSelector
         return $this;
     }
 
+    public function check($data)
+    {
+        $this->checked = $data;
+
+        return $this;
+    }
+
+    public function disable($data)
+    {
+        $this->disabled = $data;
+
+        return $this;
+    }
+
     public function idColumn(string $value)
     {
         $this->idColumn = $value;
@@ -76,10 +94,12 @@ HTML;
         $title = $this->getTitle($row, $id);
         $title = e(is_array($title) ? json_encode($title) : $title);
         $id = $this->idColumn ? Arr::get($row->toArray(), $this->idColumn) : $id;
+        $checked = $this->shouldChecked($row) ? 'checked="true"' : '';
+        $disabled = $this->shouldDisable($row) ? 'disabled' : '';
 
         return <<<EOT
 <div class="vs-checkbox-con vs-checkbox-{$this->style} checkbox-grid checkbox-grid-column">
-    <input type="checkbox" class="{$this->grid->getRowName()}-checkbox" data-id="{$id}" data-label="{$title}">
+    <input type="checkbox" class="{$this->grid->getRowName()}-checkbox" data-id="{$id}" {$checked} {$disabled} data-label="{$title}">
     <span class="vs-checkbox"><span class="vs-checkbox--check"><i class="vs-icon feather icon-check"></i></span></span>
 </div>        
 EOT;
@@ -103,6 +123,33 @@ JS
         );
     }
 
+    protected function shouldChecked($row)
+    {
+        return $this->isSelectedRow($row, $this->checked);
+    }
+
+    protected function shouldDisable($row)
+    {
+        return $this->isSelectedRow($row, $this->disabled);
+    }
+
+    protected function isSelectedRow($row, $value)
+    {
+        if ($value instanceof \Closure) {
+            return $value->call($row, $row);
+        }
+
+        if (is_array($value)) {
+            foreach ($value as $v) {
+                if (((int) $v) === $row->_index) {
+                    return true;
+                }
+            }
+        }
+
+        return false;
+    }
+
     protected function getTitle($row, $id)
     {
         if ($key = $this->titleColumn) {