如何在启用ajax表时更改每个crud条目的颜色?

时间:2017-11-01 05:33:40

标签: ajax laravel backpack-for-laravel

我正在使用laravel背包,最近在我的crud中启用了$this->crud->enableAjaxTable();,因为有很多数据要显示。

但是现在我无法根据expiry_date为我的crud条目着色,因为我之前通过覆盖list.blade.php这样做:

@if (!$crud->ajaxTable())
            @foreach ($entries as $k => $entry)

            <?php
            use Carbon\Carbon;
            $today_date = Carbon::now();


            $data_difference = $today_date->diffInDays(Carbon::parse($entry->expiry_date), false);
            if($data_difference <= 7 && $data_difference >= 0) {
              $color="#FF9900";  
            } elseif($data_difference < 0) {
              $color="#EA2C12";
            } elseif($data_difference > 7) {
              $color="#539E05";
            }
            ?>

            <tr data-entry-id="{{ $entry->getKey() }}" style="color: {{$color}}">

也许是因为:

@if (!$crud->ajaxTable())

我尝试使用此link自定义 AjaxTable.php 搜索查询,但我没有成功。这是我通过覆盖ajax的搜索查询在ExampleCrudController中尝试的代码:

        public function search()
{
    $this->crud->hasAccessOrFail('list');

    // create an array with the names of the searchable columns
    $columns = collect($this->crud->columns)
                ->reject(function ($column, $key) {
                    // the select_multiple, model_function and model_function_attribute columns are not searchable
                    return isset($column['type']) && ($column['type'] == 'select_multiple' || $column['type'] == 'model_function' || $column['type'] == 'model_function_attribute');
                })
                ->pluck('name')
                // add the primary key, otherwise the buttons won't work
                ->merge($this->crud->model->getKeyName())
                ->toArray();

    // structure the response in a DataTable-friendly way
    $dataTable = new \LiveControl\EloquentDataTable\DataTable($this->crud->query, $columns);

    // make the datatable use the column types instead of just echoing the text
    $dataTable->setFormatRowFunction(function ($entry) {


        $today_date = Carbon::now();

        $data_difference = $today_date->diffInDays(Carbon::parse($entry->expiry_date), false);

            if($data_difference <= 7 && $data_difference >= 0) {
              $color="#FF9900";  
            } elseif($data_difference < 0) {
              $color="#EA2C12";
            } elseif($data_difference > 7) {
              $color="#539E05";
            }

        // get the actual HTML for each row's cell
        $row_items = $this->crud->getRowViews($entry, $this->crud, $color);

        // add the buttons as the last column
        if ($this->crud->buttons->where('stack', 'line')->count()) {
            $row_items[] = \View::make('crud::inc.button_stack', ['stack' => 'line'])
                            ->with('crud', $this->crud)
                            ->with('entry', $entry)
                            ->render();
        }

        // add the details_row buttons as the first column
        if ($this->crud->details_row) {
            array_unshift($row_items, \View::make('crud::columns.details_row_button')
                            ->with('crud', $this->crud)
                            ->with('entry', $entry)
                            ->render());
        }

        return $row_items;
    });

    return $dataTable->make();
}

所以我的问题是,当在laravel背包中启用enableajaxtable时,如何根据expiry_date为我的crud条目着色?

1 个答案:

答案 0 :(得分:0)

使用AjaxDataTables时,行不再直接从DB中取出并作为HTML输出,而是从带有AJAX调用的DB中获取。所以你以前的代码不行,我很害怕。

我可以想到实现同样目标的最好方法是使用$this->crud->setListView('your-view');为此CRUD面板use a custom view。这将允许您在该文件中设置一些自定义JavaScript,以修改DataTables.js以在将行放入表中之前为行着色。

如果您使用Backpack \ CRUD 3.2+,那么更清洁的替代方案是customize the list.js file,以便拥有所有逻辑。

希望它有所帮助!