Grid强化

Author: SmallRuralDog

public/app.js

@@ -6,7 +6,7 @@
       :attrs="attrs.top"
     />
 
-    <el-card shadow="never" :body-style="{ padding: 0 }">
+    <el-card shadow="never" :body-style="{ padding: 0 }" v-if='attrs.toolbars.show'>
       <div class="grid-top-container">
         <div class="grid-top-container-left">
           <BatchActions
@@ -121,6 +121,7 @@
 
       <div>
         <el-table
+          :ref="attrs.ref || 'table'"
           :data="tableData"
           :row-key="attrs.attributes.rowKey"
           :default-sort="default_sort_get"
@@ -227,13 +228,15 @@
 </template>
 
 <script>
+import { BaseComponent } from "@/mixins.js";
 import { mapState } from "vuex";
 import ColumnDisplay from "./ColumnDisplay";
 import Actions from "./Actions/Index";
 import BatchActions from "./BatchActions/Index";
 import ItemDiaplsy from "../form/ItemDiaplsy";
 import DialogForm from "./DialogForm";
 export default {
+  mixins: [BaseComponent],
   components: {
     ColumnDisplay,
     Actions,
@@ -246,19 +249,19 @@ export default {
   },
   data() {
     return {
-      loading: false,
-      sort: {},
-      tableData: [],
+      loading: false,//是否加载
+      sort: {},//排序对象
+      tableData: [],//表格数据
       pageData: {
         pageSize: this.attrs.perPage,
         total: 0,
         currentPage: 1,
         lastPage: 1,
       },
-      page: 1,
-      quickSearch: null,
-      selectionRows: [],
-      filterFormData: null,
+      page: 1,//当前页
+      quickSearch: null,//快捷搜索内容
+      selectionRows: [],//已选择的row
+      filterFormData: null,//表单搜索数据
       tabsSelectdata: {},
       tabsActiveName: "all",
     };

resources/js/components/grid/Table.vue

@@ -7,6 +7,8 @@
       v-if="attrs.message"
     >
       <el-button
+        :style="attrs.style"
+        :class="attrs.className"
         slot="reference"
         :type="attrs.type"
         :size="attrs.size"
@@ -28,6 +30,8 @@
       v-else-if="attrs.tooltip"
     >
       <el-button
+        :style="attrs.style"
+        :class="attrs.className"
         :type="attrs.type"
         :size="attrs.size"
         :plain="attrs.plain"
@@ -44,6 +48,8 @@
     </el-tooltip>
     <el-button
       v-else
+      :style="attrs.style"
+      :class="attrs.className"
       :type="attrs.type"
       :size="attrs.size"
       :plain="attrs.plain"
@@ -59,6 +65,7 @@
     </el-button>
     <el-dialog
       v-if="attrs.dialog"
+      :ref="attrs.dialog.ref || 'dialog'"
       :title="attrs.dialog.title"
       :visible.sync="dialogTableVisible"
       :width="attrs.dialog.width"
@@ -111,7 +118,10 @@ export default {
       }
 
       if (this.attrs.refData) {
-        this.$bus.emit(this.attrs.refData.ref, this.attrs.refData.data);
+        this.$bus.emit(this.attrs.refData.ref, {
+          data: this.attrs.refData.data,
+          self: this,
+        });
         return;
       }
 

resources/js/components/widgets/Base/Button.vue

@@ -37,10 +37,9 @@ const BaseComponent = {
     mounted() {
 
         if (this.attrs && this.attrs.ref) {
-            this.$bus.on(this.attrs.ref, (evalData) => {
-                
+            this.$bus.on(this.attrs.ref, ({data,self}) => {
                 let _this = this;
-                new Function('ref',evalData)(_this)
+                new Function('ref','self',data)(_this,self)
             })
         }
     },

resources/js/mixins.js

@@ -62,6 +62,9 @@ class Grid extends Component implements \JsonSerializable
      * @var string
      */
     protected $dataUrl;
+
+    protected $customData;
+
     protected $isGetData = false;
     private $actions;
     private $batchActions;
@@ -81,13 +84,17 @@ class Grid extends Component implements \JsonSerializable
     protected $dialogTitle = ['添加', '修改'];
 
 
-    public function __construct(Eloquent $model)
+    public function __construct(Eloquent $model = null)
     {
         $this->attributes = new Attributes();
         $this->dataUrl = request()->getUri();
         $this->model = new Model($model, $this);
-        $this->keyName = $model->getKeyName();
-        $this->defaultSort($model->getKeyName(), "asc");
+        if ($model) {
+            $this->keyName = $model->getKeyName();
+            $this->defaultSort($model->getKeyName(), "asc");
+        }
+
+
         $this->isGetData = request('get_data') == "true";
         $this->toolbars = new Toolbars($this);
         $this->batchActions = new BatchActions();
@@ -122,6 +129,15 @@ public function dataUrl(string $dataUrl)
         return $this;
     }
 
+    /**
+     * @return bool
+     */
+    public function isGetData(): bool
+    {
+        return $this->isGetData;
+    }
+
+
     /**
      * 设置树形表格
      * @param bool $tree
@@ -174,17 +190,16 @@ protected function addColumn($name = '', $label = '', $columnKey = null)
      */
     protected function addRelationColumn($name, $label = '')
     {
-        list($relation, $column) = explode('.', $name);
+        if ($this->model) {
+            list($relation, $column) = explode('.', $name);
+            $model = $this->model()->eloquent();
+            if (!method_exists($model, $relation) || !$model->{$relation}() instanceof Relations\Relation) {
+            } else {
+                $this->model()->with($relation);
+            }
 
-        $model = $this->model()->eloquent();
-
-
-        if (!method_exists($model, $relation) || !$model->{$relation}() instanceof Relations\Relation) {
-        } else {
-            $this->model()->with($relation);
         }
 
-
     }
 
     /**
@@ -295,12 +310,42 @@ public function bottom($closure)
         return $this;
     }
 
+
+    /**
+     * 自定义数据
+     * @param $data
+     * @param $current_page
+     * @param $per_page
+     * @param $last_page
+     * @param $total
+     * @return $this
+     */
+    public function customData($data, $current_page, $per_page, $last_page, $total)
+    {
+        $this->customData = [
+            'current_page' => (int)$current_page,
+            'per_page' => (int)$per_page,
+            'last_page' => (int)$last_page,
+            'total' => (int)$total,
+            'data' => $data,
+        ];
+        return $this;
+    }
+
+
     /**
      * data
      * @return array
      */
     protected function data()
     {
+        if ($this->customData) {
+            $this->customData['data'] = $this->model()->displayData($this->customData['data']);
+            return [
+                'code' => 200,
+                'data' => $this->customData
+            ];
+        }
 
         $this->applyQuery();
 
@@ -345,6 +390,7 @@ public function jsonSerialize()
             $viewData['dialogForm'] = $this->dialogForm;
             $viewData['dialogFormWidth'] = $this->dialogFormWidth;
             $viewData['dialogTitle'] = $this->dialogTitle;
+            $viewData['ref'] = $this->getRef();
             return $viewData;
         }
     }

src/Grid.php

@@ -51,25 +51,25 @@ class Filter
 
     protected static $supports = [
         'equal' => Filter\Equal::class,
-        'notEqual'   => Filter\NotEqual::class,
-        'ilike'      => Filter\Ilike::class,
+        'notEqual' => Filter\NotEqual::class,
+        'ilike' => Filter\Ilike::class,
         'like' => Filter\Like::class,
-        'gt'         => Filter\Gt::class,
-        'lt'         => Filter\Lt::class,
-        'between'    => Filter\Between::class,
-        'where'      => Filter\Where::class,
-        'in'         => Filter\In::class,
-        'notIn'      => Filter\NotIn::class,
-        'date'       => Filter\Date::class,
-        'day'        => Filter\Day::class,
-        'month'      => Filter\Month::class,
-        'year'       => Filter\Year::class,
-        'contains'   => Filter\Like::class,
+        'gt' => Filter\Gt::class,
+        'lt' => Filter\Lt::class,
+        'between' => Filter\Between::class,
+        'where' => Filter\Where::class,
+        'in' => Filter\In::class,
+        'notIn' => Filter\NotIn::class,
+        'date' => Filter\Date::class,
+        'day' => Filter\Day::class,
+        'month' => Filter\Month::class,
+        'year' => Filter\Year::class,
+        'contains' => Filter\Like::class,
         'startsWith' => Filter\StartsWith::class,
-        'endsWith'   => Filter\EndsWith::class,
+        'endsWith' => Filter\EndsWith::class,
     ];
 
-    public function __construct(Model $model)
+    public function __construct($model)
     {
         $this->model = $model;
 
@@ -149,7 +149,6 @@ public function execute($toArray = true)
         );
 
 
-
         return $this->model->addConditions($conditions)->buildData($toArray);
     }
 

src/Grid/Filter.php

@@ -103,7 +103,7 @@ class Model
     protected $eagerLoads = [];
 
 
-    public function __construct(EloquentModel $model, Grid $grid = null)
+    public function __construct(EloquentModel $model=null, Grid $grid = null)
     {
         $this->model = $model;
         $this->sModel = $model;
@@ -386,7 +386,7 @@ public function buildData($toArray = false)
         return $this->data;
     }
 
-    protected function displayData($data)
+    public function displayData($data)
     {
         $columns = $this->grid->getColumns();
         $items = collect();
@@ -399,7 +399,7 @@ protected function displayData($data)
                 if (Str::contains($column->getName(), '.')) {
                     list($relationName, $relationColumn) = explode('.', $column->getName());
                     //如果是集合
-                    if (data_get($row, $relationName) instanceof Collection) {
+                    if (data_get($row, $relationName) instanceof Collection || is_array(data_get($row, $relationName))) {
                         $value = collect(data_get($row, $relationName))->pluck($relationColumn);
                         $c_value = $column->customValueUsing($row, $value);
                         data_set($item, $column->getName(), $c_value);

src/Grid/Model.php

@@ -21,6 +21,8 @@ class Toolbars extends AdminJsonBuilder
 
     protected $grid;
 
+    protected $show = true;
+
     public function __construct(Grid $grid)
     {
 
@@ -39,6 +41,17 @@ public function createButton(): CreateButton
         return $this->createButton;
     }
 
+    /**
+     * 隐藏工具栏
+     * @return Toolbars
+     */
+    public function hide()
+    {
+        $this->show = false;
+        return $this;
+    }
+
+
 
     /**
      * @param mixed $hideCreateButton
@@ -85,6 +98,7 @@ public function builderData()
         }
 
         return [
+            "show"=>$this->show,
             "left" => $left,
             "right" => $right
         ];