JSFiddle - React, Tailwind, and code Playground

by diessses

HTML

@extends('products.layout')
 
@section('content')
<div class="row">
    <div class="col-xs-12 col-sm-12">  
        </div>
 </div>


<div class="row">

    <div class="col-xs-12 col-sm-12">

   
    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif
     </div>

 </div>     
   
<div class="row">

    <div class="col-xs-12 col-sm-12">


    <table class="table table-bordered">
        <tr>
  
            <th>ID</th>
            <th></th>
            <th></th>
            <th>Lot</th>
            <th></th>
            <th>color</th>
            <th>product</th>
            <th>partner</th>

            <th width="250px"><a class="btn btn-success" href="{{ route('products.create') }}">save data</a></th>
        </tr>
        @foreach ($products as $product)
        <tr>
            <td>{{ ++$i }}</td>
            <td>{{ $product->done }}</td>
            <td>{{ $product->created_at->format('m/d H:i') }}</td>
            <td>{{ $product->lot }}</td>
            <td>{{ $product->kansu }}</td>
            <td>{{ $product->color }}</td>
            <td>{{ $product->w_m }}</td>
            <td>{{ $product->partner }}</td> 
            <td>
                <form action="{{ route('products.destroy',$product->id) }}" method="POST">
   
                    <a class="btn btn-info" href="{{ route('products.show',$product->id) }}">detail</a>
    
                    <a class="btn btn-primary" href="{{ route('products.edit',$product->id) }}">edit</a>

                    <a class="btn btn-info" href="{{ route('products.each_print',$product->id) }}">Print</a>                    
   
                    @csrf
                    @method('DELETE')

                    
      <i class="fas fa-trash-alt"></i>
                    <button type="submit" class="btn btn-danger">×</button>

                </form>
            </td>

        </tr>
        @endforeach
    </table>
  
    {!!...