Отображение 2 массивов в компоненте блейда таблицы

#php #laravel #html-table #laravel-8

#php #laravel #html-таблица #laravel-8

Вопрос:

Этот код работает:

 <table class="rounded-t-lg m-5 w-5/6 mx-auto bg-gray-200 text-gray-800">
<thead class="text-left border-b-2 border-gray-300">
<th class="px-4 py-3">#</th>
<th class="px-4 py-3">Tipo Doc.</th>
<th class="px-4 py-3">Documento</th>
<th class="px-4 py-3">Nombre</th>
<th class="px-4 py-3">Teléfono</th>
<th class="px-4 py-3">Correo</th>
<th class="px-4 py-3">Fecha</th>
<th class="px-4 py-3">Acciones</th>
</thead>
<tbody>
@if (count($pacientes)>0)
    @foreach($pacientes as $paciente)
        <tr class="bg-gray-100 border-b border-gray-200">
            <td class="px-4 py-3">{{$paciente->id}}</td>
            <td class="px-4 py-3">{{$paciente->tipoIdentificacion}}</td>
            <td class="px-4 py-3">{{$paciente->Identificacion}}</td>
            <td class="px-4 py-3">{{$paciente->NombreCompleto}}</td>
            <td class="px-4 py-3">{{$paciente->Telefono}}</td>
            <td class="px-4 py-3">{{$paciente->Correo}}</td>
            <td class="px-4 py-3">{{$paciente->created_at}}</td>
            <td>
                <a href="{{ url('/pacientes/' . $paciente->id . '/edit') }}">
                    Editar
                </a>
                <form action="{{ url('/pacientes/' . $paciente->id) }}" method="post">
                    @csrf
                    {{ method_field('DELETE') }}
                    <input type="submit" value="Borrar">
                </form>
            </td>
        </tr>
    @endforeach
@endif
</tbody>
 

но эта таблица не может быть повторно использована. Для того, чтобы он работал как компонент, он должен работать с любым количеством заголовков и данных, в конце каждой строки есть кнопки действий (редактировать или удалять). Я сохранил заголовки (th) в массиве, и они отображаются правильно с помощью a foreach , но я не могу заполнить таблицу другими данными в ее порядке. не могли бы вы мне помочь?

Комментарии:

1. Не совсем понятно, о чем вы говорите. Что вы считаете титулами и что вы считаете ценностями? Можете ли вы привести пример входных данных? Примечание: вам не нужно @if (count($pacientes)>0) , вы можете перейти прямо к foreach . Он просто не будет запускаться, если в массиве нет элементов.

2. Заголовки: имя, идентификатор, телефон. И значения таковы: jhon, 8388, 900339393

3. Да, это значения, но какие переменные считаются названиями и какие значения? Или у вас есть ассоциативный массив?

4. они не являются ассоциативными, это 2 независимых массива, один с именами столбцов, а другой с данными

5. Используйте ключ in foreach , like foreach $data as $key => $value , а затем получите доступ к тому же ключу в другом массиве $otherArray[$key] .

Ответ №1:

Вы можете использовать компоненты Laravel.

Компоненты и слоты предоставляют аналогичные преимущества разделам, макетам и включениям; однако некоторым может показаться, что ментальная модель компонентов и слотов проще для понимания. Существует два подхода к написанию компонентов: компоненты на основе классов и анонимные компоненты.

Здесь я буду использовать компоненты, основанные на классах.

ШАГ 1

Создайте компонент на основе класса с make:component помощью команды Artisan. ниже:

 php artisan make:component TableLayout  
 

Эта команда создаст два файла вместе со связанными с ними каталогами строительных лесов. AppViewComponentsTableLayout.php и resourcesviewscomponentstable-layout.blade.php это частичное представление.

Ниже TableLayout приведен компонент.

Вы должны определить требуемые данные компонента в его конструкторе класса. Все общедоступные свойства компонента будут автоматически доступны для представления компонента. Нет необходимости передавать данные в представление из метода компонента render :

 <?php
// AppViewComponentsTableLayout.php

namespace AppViewComponents;

use IlluminateViewComponent;

class TableLayout extends Component
{
    public $dataObject;
    public $dataObjectIdLabel;
    public $routeUrl;
    public $thsTds;
    /**
     * Create a new component instance.
     *
     * @return void
     */
    public function __construct($dataObject, $dataObjectIdLabel, $routeUrl, $thsTds )
    {
        $this->dataObject = $dataObject;
        $this->dataObjectIdLabel = $dataObjectIdLabel;
        $this->routeUrl = $routeUrl;
        $this->thsTds = $thsTds;
    }

    /**
     * Get the view / contents that represent the component.
     *
     * @return IlluminateViewView|string
     */
    public function render()
    {
        return view('components.table-layout');
    }
}

 

Ниже приведен соответствующий table-layout вид.

Когда ваш компонент отображается, вы можете отобразить содержимое общедоступных переменных вашего компонента, повторив переменные по имени:

 
 <!-- resourcesviewscomponentstable-layout.blade.php -->

<table class="rounded-t-lg m-5 w-5/6 mx-auto bg-gray-200 text-gray-800">

    <thead class="text-left border-b-2 border-gray-300">
    @foreach(array_keys($thsTds) as $th)
    <th class="px-4 py-3">{{$th}}</th>
    @endforeach
    <th class="px-4 py-3">Acciones</th>
    </thead>

    <tbody>
    @if (count($dataObject)>0)
    @foreach($dataObject as $data)
        <tr class="bg-gray-100 border-b border-gray-200">
        @foreach(array_values($thsTds) as $td)
            <td class="px-4 py-3">{{$data->$td}}</td>
        @endforeach
        <td>
            <a href="{{ url($routeUrl . $data->$dataObjectIdLabel . '/edit') }}">
            Editar
            </a>
            <form action="{{ url($routeUrl . $data->$dataObjectIdLabel) }}" method="post">
            @csrf
            {{ method_field('DELETE') }}
            <input type="submit" value="Borrar">
            </form>
        </td>
        </tr>
    @endforeach
    @endif
    </tbody>

</table>

 

ШАГ 2

Затем в любом другом файле / шаблоне «блейд-вида», т.е. resourcesviewsexample.blade.php Используйте вновь созданный повторно используемый компонент.

Компоненты рендеринга

Для отображения компонента вы можете использовать тег компонента блейда в одном из ваших шаблонов блейдов. Теги компонентов Blade начинаются со строки x- , за которой следует имя класса компонента kebab case:

 <!-- resourcesviewsexample.blade.php -->

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
    </head>
    <body>

    @php ($thsTds = [
    "#"=> "id",
    "Tipo Doc."=>"tipoIdentificacion",
    "Documento"=>"Identificacion",
    "Nombre"=>"NombreCompleto",
    "Teléfono"=>"Telefono",
    "Correo"=>"Correo",
    "Fecha"=>"created_at"
    ])
    
    <x-table-layout :data-object="$paciente" data-object-id-label="id" route-url="/pacientes/" :ths-tds="$thsTds" />

    </body>
</html>
 

Примечания

Передача данных компонентам

Вы можете передавать данные компонентам блейда, используя атрибуты HTML. Жестко запрограммированные примитивные значения могут быть переданы компоненту с использованием простых строк атрибутов HTML. Выражения и переменные PHP должны передаваться компоненту через атрибуты, которые используют : символ в качестве префикса:

Корпус

Аргументы конструктора компонента должны быть указаны с помощью camelCase , в то время kebab-case как должны использоваться при ссылке на имена аргументов в ваших атрибутах HTML.